Something went wrong. Try again.
Monorepo for Tangled tangled.org
Something went wrong. Try again.
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263import type { Component } from "svelte";import type { SvelteHTMLElements } from "svelte/elements";import { tv, type VariantProps } from "tailwind-variants";import type { TagVariants } from "#lib/components/ui/Tag.svelte";
export interface InputTag { value: string; label?: string; field?: string; color?: TagVariants["color"]; icon?: Component<SvelteHTMLElements["svg"]>;}
export type TagRejection = "duplicate" | "limit" | "invalid";
export type TagCommitKey = "enter" | "space" | "comma";
/** the character each key stands for. Typing one commits, and a pasted one splits — which is why * `enter` maps to a newline: you can't type one into a single-line input, but you can paste one. */export const TAG_COMMIT_CHARS: Record<TagCommitKey, string> = { enter: "\n", space: " ", comma: ","};
export const inputField = tv({ base: "flex items-center rounded-md bg-background-default edge-ring-inset transition-colors", variants: { size: { mini: "min-h-6 gap-2xs rounded-sm typography-paragraph-mini", small: "min-h-7 gap-1.5 rounded-sm typography-paragraph-small", regular: "min-h-8 gap-xs typography-paragraph-regular", large: "min-h-9 gap-2.5 typography-paragraph-large" }, error: { false: "focus-within:ring-1 focus-within:ring-border-strong focus-within:inset-ring-border-strong", true: "bg-background-danger-subtle text-foreground-danger inset-ring-border-danger focus-within:ring-1 focus-within:ring-border-focus-danger focus-within:inset-ring-border-focus-danger" }, disabled: { false: "", true: "cursor-not-allowed bg-background-inset text-foreground-disabled" }, rich: { true: "items-center p-1", false: "" } }, compoundVariants: [ { rich: false, size: "mini", class: "px-2xs py-3xs" }, { rich: false, size: "small", class: "px-1.5 py-2xs" }, { rich: false, size: "regular", class: "px-xs py-2xs" }, { rich: false, size: "large", class: "px-sm py-2xs" } ], defaultVariants: { size: "regular", error: false, disabled: false, rich: false }});
export type InputFieldVariants = VariantProps<typeof inputField>;