4c:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/2rwy6tq861e-y.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/2hlz_ivp-qrnh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2zoahorp76dll.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1d0aij627lbx2.js","/_next/static/immutable/chunks/1ud4fi_ghnsx-.js"],"RegistryDependencies"] 4d:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/2rwy6tq861e-y.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/2hlz_ivp-qrnh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2zoahorp76dll.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1d0aij627lbx2.js","/_next/static/immutable/chunks/1ud4fi_ghnsx-.js"],"FilesView"] 4e:T1a0b,"use client" import * as React from "react" import { cva, type VariantProps } from "class-variance-authority" import { XIcon } from "lucide-react" import { cn } from "@/lib/utils" import { UI_I18N, type UILocale } from "@/lib/ui-i18n" import { Badge } from "@/components/ui/ds-badge" import { Skeleton } from "@/components/ui/skeleton" // ── Types ── export interface TagInputProps extends Omit, "onChange">, VariantProps { value: string[] onChange: (tags: string[]) => void maxTags?: number allowDuplicates?: boolean separator?: string | RegExp | (string | RegExp)[] placeholder?: string loading?: boolean disabled?: boolean invalid?: boolean locale?: UILocale } // ── Variants ── export const tagInputContainerVariants = cva( "flex w-full flex-wrap items-center gap-1.5 rounded-md border border-input bg-background px-2.5 py-1.5 text-sm ring-offset-background transition-colors focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2 focus-within:outline-none", { variants: { size: { sm: "min-h-8 gap-1 px-2 py-1", md: "min-h-9 gap-1.5 px-3 py-1.5", lg: "min-h-10 gap-2 px-3 py-2", }, disabled: { true: "cursor-not-allowed opacity-50", }, invalid: { true: "border-destructive focus-within:ring-destructive", }, }, defaultVariants: { size: "md", disabled: false, invalid: false, }, } ) export const tagInputBadgeVariants = cva( "flex items-center gap-1 rounded-sm bg-secondary text-secondary-foreground hover:bg-secondary/80", { variants: { size: { sm: "px-1.5 py-0.5 text-xs", md: "px-2 py-0.5 text-sm", lg: "px-2.5 py-1 text-base", }, }, defaultVariants: { size: "md", }, } ) export const tagInputInputVariants = cva( "flex-1 bg-transparent outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed", { variants: { size: { sm: "text-xs", md: "text-sm", lg: "text-base", }, }, defaultVariants: { size: "md", }, } ) // ── Internal Helpers ── const skeletonDims = { sm: "h-8 w-full", md: "h-9 w-full", lg: "h-10 w-full", } // ── Component ── export const TagInput = React.forwardRef( ( { value, onChange, maxTags, allowDuplicates = false, separator = [",", "Enter"], placeholder, size = "md", loading = false, disabled = false, invalid = false, locale = "pt-BR", className, ...props }, ref ) => { const inputRef = React.useRef(null) const [inputValue, setInputValue] = React.useState("") const i18n = UI_I18N[locale].tagInput const handleContainerClick = () => { if (!disabled) { inputRef.current?.focus() } } const addTag = React.useCallback( (tagText: string) => { const newTag = tagText.trim() if (!newTag) return if (maxTags !== undefined && value.length >= maxTags) { return } if (!allowDuplicates && value.includes(newTag)) { return } onChange([...value, newTag]) setInputValue("") }, [value, onChange, maxTags, allowDuplicates] ) const removeTag = React.useCallback( (indexToRemove: number) => { onChange(value.filter((_, i) => i !== indexToRemove)) }, [value, onChange] ) const handleKeyDown = React.useCallback( (e: React.KeyboardEvent) => { const separators = Array.isArray(separator) ? separator : [separator] const isSeparator = separators.some((sep) => { if (sep instanceof RegExp) { return sep.test(e.key) || sep.test(inputValue) // simplified } return sep === e.key }) if (isSeparator) { e.preventDefault() addTag(inputValue) return } if (e.key === "Backspace" && inputValue === "" && value.length > 0) { e.preventDefault() removeTag(value.length - 1) } }, [inputValue, value, separator, addTag, removeTag] ) const handleBlur = React.useCallback(() => { addTag(inputValue) }, [inputValue, addTag]) if (loading) { return ( ) } const iconSize = size === "sm" ? "size-3" : size === "lg" ? "size-4" : "size-3.5" return (

{value.map((tag, index) => ( {tag} ))} setInputValue(e.target.value)} onKeyDown={handleKeyDown} onBlur={handleBlur} disabled={ disabled || (maxTags !== undefined && value.length >= maxTags) } placeholder={ maxTags !== undefined && value.length >= maxTags ? i18n.maxReached : value.length === 0 ? placeholder : "" } aria-invalid={invalid} aria-label={props["aria-label"] || "Tag input"} />

) } ) TagInput.displayName = "TagInput" 4b:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[["$","ul",null,{"className":"flex min-w-0 flex-wrap gap-2","aria-label":"Package dependencies","children":[["$","li","class-variance-authority",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/class-variance-authority","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"class-variance-authority"}]]}]}],["$","li","lucide-react",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/lucide-react","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"lucide-react"}]]}]}]]}],["$","$L4c",null,{"namespace":"@lema-ds","registryDependencies":["badge","skeleton","ui-i18n"]}]]}],null]}],["$","$L4d",null,{"files":[{"path":"components/ds/tag-input.tsx","content":"$4e","type":"registry:ui","target":"components/ui/ds-tag-input.tsx"}],"className":"h-[70svh] min-h-80"}]]}]