@deckai/deck-ui 0.0.18 → 0.0.20
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/AboutCard.cjs +5 -5
- package/dist/components/AboutCard.cjs.map +1 -1
- package/dist/components/AboutCard.js +5 -5
- package/dist/components/AboutCard.js.map +1 -1
- package/dist/components/Accordion.cjs +6 -6
- package/dist/components/Accordion.cjs.map +1 -1
- package/dist/components/Accordion.js +6 -6
- package/dist/components/Accordion.js.map +1 -1
- package/dist/components/AddWorkCard.cjs +6 -6
- package/dist/components/AddWorkCard.cjs.map +1 -1
- package/dist/components/AddWorkCard.d.cts +2 -2
- package/dist/components/AddWorkCard.d.ts +2 -2
- package/dist/components/AddWorkCard.js +6 -6
- package/dist/components/AddWorkCard.js.map +1 -1
- package/dist/components/AutocompleteInput.cjs +5 -5
- package/dist/components/AutocompleteInput.cjs.map +1 -1
- package/dist/components/AutocompleteInput.d.cts +15 -16
- package/dist/components/AutocompleteInput.d.ts +15 -16
- package/dist/components/AutocompleteInput.js +5 -5
- package/dist/components/AutocompleteInput.js.map +1 -1
- package/dist/components/Avatar.cjs +1 -1
- package/dist/components/Avatar.cjs.map +1 -1
- package/dist/components/Avatar.d.cts +1 -2
- package/dist/components/Avatar.d.ts +1 -2
- package/dist/components/Avatar.js +1 -1
- package/dist/components/Avatar.js.map +1 -1
- package/dist/components/Badge.cjs +5 -5
- package/dist/components/Badge.cjs.map +1 -1
- package/dist/components/Badge.d.cts +1 -1
- package/dist/components/Badge.d.ts +1 -1
- package/dist/components/Badge.js +5 -5
- package/dist/components/Badge.js.map +1 -1
- package/dist/components/Breadcrumbs.cjs +6 -6
- package/dist/components/Breadcrumbs.cjs.map +1 -1
- package/dist/components/Breadcrumbs.js +6 -6
- package/dist/components/Breadcrumbs.js.map +1 -1
- package/dist/components/Button.cjs +6 -6
- package/dist/components/Button.cjs.map +1 -1
- package/dist/components/Button.js +6 -6
- package/dist/components/Button.js.map +1 -1
- package/dist/components/Carousel.cjs +1 -1
- package/dist/components/Carousel.cjs.map +1 -1
- package/dist/components/Carousel.js +1 -1
- package/dist/components/Carousel.js.map +1 -1
- package/dist/components/Collapsible.cjs +7 -7
- package/dist/components/Collapsible.cjs.map +1 -1
- package/dist/components/Collapsible.js +7 -7
- package/dist/components/Collapsible.js.map +1 -1
- package/dist/components/Combobox.cjs +5 -5
- package/dist/components/Combobox.cjs.map +1 -1
- package/dist/components/Combobox.js +5 -5
- package/dist/components/Combobox.js.map +1 -1
- package/dist/components/ContactItem.cjs +6 -6
- package/dist/components/ContactItem.cjs.map +1 -1
- package/dist/components/ContactItem.js +6 -6
- package/dist/components/ContactItem.js.map +1 -1
- package/dist/components/Dropdown.cjs +5 -5
- package/dist/components/Dropdown.cjs.map +1 -1
- package/dist/components/Dropdown.js +5 -5
- package/dist/components/Dropdown.js.map +1 -1
- package/dist/components/EditButton.cjs +7 -7
- package/dist/components/EditButton.cjs.map +1 -1
- package/dist/components/EditButton.js +7 -7
- package/dist/components/EditButton.js.map +1 -1
- package/dist/components/Icon.cjs +1 -1
- package/dist/components/Icon.cjs.map +1 -1
- package/dist/components/Icon.d.cts +2 -3
- package/dist/components/Icon.d.ts +2 -3
- package/dist/components/Icon.js +1 -1
- package/dist/components/Icon.js.map +1 -1
- package/dist/components/IconRenderer.cjs +1 -1
- package/dist/components/IconRenderer.cjs.map +1 -1
- package/dist/components/IconRenderer.d.cts +2 -1
- package/dist/components/IconRenderer.d.ts +2 -1
- package/dist/components/IconRenderer.js +1 -1
- package/dist/components/IconRenderer.js.map +1 -1
- package/dist/components/Input.cjs +6 -6
- package/dist/components/Input.cjs.map +1 -1
- package/dist/components/Input.d.cts +1 -0
- package/dist/components/Input.d.ts +1 -0
- package/dist/components/Input.js +6 -6
- package/dist/components/Input.js.map +1 -1
- package/dist/components/Link.cjs +4 -4
- package/dist/components/Link.cjs.map +1 -1
- package/dist/components/Link.d.cts +1 -0
- package/dist/components/Link.d.ts +1 -0
- package/dist/components/Link.js +4 -4
- package/dist/components/Link.js.map +1 -1
- package/dist/components/Modal.cjs +2 -0
- package/dist/components/Modal.cjs.map +1 -0
- package/dist/components/Modal.d.cts +31 -0
- package/dist/components/Modal.d.ts +31 -0
- package/dist/components/Modal.js +2 -0
- package/dist/components/Modal.js.map +1 -0
- package/dist/components/MultiSelectCombobox.cjs +5 -5
- package/dist/components/MultiSelectCombobox.cjs.map +1 -1
- package/dist/components/MultiSelectCombobox.js +5 -5
- package/dist/components/MultiSelectCombobox.js.map +1 -1
- package/dist/components/Navbar.cjs +6 -6
- package/dist/components/Navbar.cjs.map +1 -1
- package/dist/components/Navbar.d.cts +2 -1
- package/dist/components/Navbar.d.ts +2 -1
- package/dist/components/Navbar.js +6 -6
- package/dist/components/Navbar.js.map +1 -1
- package/dist/components/NavbarItem.cjs +7 -1
- package/dist/components/NavbarItem.cjs.map +1 -1
- package/dist/components/NavbarItem.d.cts +6 -2
- package/dist/components/NavbarItem.d.ts +6 -2
- package/dist/components/NavbarItem.js +7 -1
- package/dist/components/NavbarItem.js.map +1 -1
- package/dist/components/Option.cjs +6 -6
- package/dist/components/Option.cjs.map +1 -1
- package/dist/components/Option.d.cts +4 -0
- package/dist/components/Option.d.ts +4 -0
- package/dist/components/Option.js +6 -6
- package/dist/components/Option.js.map +1 -1
- package/dist/components/Pressable.cjs +1 -1
- package/dist/components/Pressable.cjs.map +1 -1
- package/dist/components/Pressable.js +1 -1
- package/dist/components/Pressable.js.map +1 -1
- package/dist/components/ProfileCard.cjs +6 -6
- package/dist/components/ProfileCard.cjs.map +1 -1
- package/dist/components/ProfileCard.js +6 -6
- package/dist/components/ProfileCard.js.map +1 -1
- package/dist/components/ProgressBar.cjs +1 -1
- package/dist/components/ProgressBar.cjs.map +1 -1
- package/dist/components/ProgressBar.js +1 -1
- package/dist/components/ProgressBar.js.map +1 -1
- package/dist/components/RadioGroup.cjs +5 -5
- package/dist/components/RadioGroup.cjs.map +1 -1
- package/dist/components/RadioGroup.js +5 -5
- package/dist/components/RadioGroup.js.map +1 -1
- package/dist/components/SegmentedTabs.cjs +5 -5
- package/dist/components/SegmentedTabs.cjs.map +1 -1
- package/dist/components/SegmentedTabs.js +5 -5
- package/dist/components/SegmentedTabs.js.map +1 -1
- package/dist/components/Sidebar.cjs +1 -1
- package/dist/components/Sidebar.cjs.map +1 -1
- package/dist/components/Sidebar.js +1 -1
- package/dist/components/Sidebar.js.map +1 -1
- package/dist/components/SlideButton.cjs +1 -1
- package/dist/components/SlideButton.cjs.map +1 -1
- package/dist/components/SlideButton.js +1 -1
- package/dist/components/SlideButton.js.map +1 -1
- package/dist/components/Slider.cjs +2 -0
- package/dist/components/Slider.cjs.map +1 -0
- package/dist/components/Slider.d.cts +7 -0
- package/dist/components/Slider.d.ts +7 -0
- package/dist/components/Slider.js +2 -0
- package/dist/components/Slider.js.map +1 -0
- package/dist/components/SocialCard.cjs +5 -5
- package/dist/components/SocialCard.cjs.map +1 -1
- package/dist/components/SocialCard.d.cts +2 -2
- package/dist/components/SocialCard.d.ts +2 -2
- package/dist/components/SocialCard.js +5 -5
- package/dist/components/SocialCard.js.map +1 -1
- package/dist/components/Spinner.cjs +1 -1
- package/dist/components/Spinner.cjs.map +1 -1
- package/dist/components/Spinner.js +1 -1
- package/dist/components/Spinner.js.map +1 -1
- package/dist/components/Switch.cjs +1 -1
- package/dist/components/Switch.cjs.map +1 -1
- package/dist/components/Switch.d.cts +1 -1
- package/dist/components/Switch.d.ts +1 -1
- package/dist/components/Switch.js +1 -1
- package/dist/components/Switch.js.map +1 -1
- package/dist/components/Tabs.cjs +3 -3
- package/dist/components/Tabs.cjs.map +1 -1
- package/dist/components/Tabs.js +3 -3
- package/dist/components/Tabs.js.map +1 -1
- package/dist/components/Tag.cjs +6 -6
- package/dist/components/Tag.cjs.map +1 -1
- package/dist/components/Tag.js +6 -6
- package/dist/components/Tag.js.map +1 -1
- package/dist/components/Text.cjs +2 -2
- package/dist/components/Text.cjs.map +1 -1
- package/dist/components/Text.d.cts +1 -1
- package/dist/components/Text.d.ts +1 -1
- package/dist/components/Text.js +2 -2
- package/dist/components/Text.js.map +1 -1
- package/dist/components/TextArea.cjs +4 -4
- package/dist/components/TextArea.cjs.map +1 -1
- package/dist/components/TextArea.js +4 -4
- package/dist/components/TextArea.js.map +1 -1
- package/dist/components/Toast.cjs +6 -6
- package/dist/components/Toast.cjs.map +1 -1
- package/dist/components/Toast.js +6 -6
- package/dist/components/Toast.js.map +1 -1
- package/dist/components/Tooltip.cjs +7 -1
- package/dist/components/Tooltip.cjs.map +1 -1
- package/dist/components/Tooltip.js +7 -1
- package/dist/components/Tooltip.js.map +1 -1
- package/dist/components/VideoPlayer.cjs +8 -0
- package/dist/components/VideoPlayer.cjs.map +1 -0
- package/dist/components/VideoPlayer.d.cts +36 -0
- package/dist/components/VideoPlayer.d.ts +36 -0
- package/dist/components/VideoPlayer.js +8 -0
- package/dist/components/VideoPlayer.js.map +1 -0
- package/dist/components/WorkCard.cjs +6 -6
- package/dist/components/WorkCard.cjs.map +1 -1
- package/dist/components/WorkCard.d.cts +2 -1
- package/dist/components/WorkCard.d.ts +2 -1
- package/dist/components/WorkCard.js +6 -6
- package/dist/components/WorkCard.js.map +1 -1
- package/dist/index.cjs +7 -7
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +14 -0
- package/dist/index.d.ts +14 -0
- package/dist/index.js +7 -7
- package/dist/index.js.map +1 -1
- package/dist/responsive-CjR1yA5N.d.cts +4 -0
- package/dist/responsive-CjR1yA5N.d.ts +4 -0
- package/dist/styles/styles.css +2 -2
- package/package.json +2 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/utils/index.ts","../../src/components/Text.tsx","../../src/components/AutocompleteInput.tsx"],"names":["cn","inputs","twMerge","clsx","HEADING_ELEMENT_MAP","getElementFromVariant","variant","category","size","fontWeight","processVariants","variants","breakpoint","typographyClass","Text","React","color","as","className","children","weight","props","ref","typographyClasses","colorClasses","suggestedElement","baseVariant","AutocompleteInput","forwardRef","value","suggestion","placeholder","onChange","onKeyDown","label","labelClassName","id","disabled","end","forceShowFocusRing","error","errorMessage","helperText","ariaControls","ariaActiveDescendant","ariaAutocomplete","e"],"mappings":"iNAGO,SAASA,KAAMC,CAAsB,CAAA,CAC1C,OAAOC,qBAAQC,CAAAA,SAAAA,CAAKF,CAAM,CAAC,CAC7B,CCkEA,IAAMG,CAAmD,CAAA,CACvD,GAAI,IACJ,CAAA,EAAA,CAAI,IACJ,CAAA,EAAA,CAAI,IACJ,CAAA,EAAA,CAAI,KACJ,EAAI,CAAA,IACN,EAEMC,CAAyBC,CAAAA,CAAAA,EAAwC,CACrE,GAAM,CAACC,CAAUC,CAAAA,CAAI,CAAIF,CAAAA,CAAAA,CAAQ,MAAM,GAAG,CAAA,CAE1C,OAAIC,CAAa,GAAA,SAAA,CACRH,EAAoBI,CAAI,CAAA,EAAK,GAGlCD,CAAAA,CAAAA,GAAa,OACR,CAAA,OAAA,CAGF,GACT,CAIME,CAAAA,CAAAA,CAAqC,CACzC,KAAO,CAAA,YAAA,CACP,QAAS,cACT,CAAA,QAAA,CAAU,eACV,CAAA,IAAA,CAAM,WACR,CAAA,CA0BMC,EACJC,CAEKA,EAAAA,CAAAA,CAAAA,CAEgB,MAAM,OAAQA,CAAAA,CAAQ,EAAIA,CAAW,CAAA,CAACA,CAAQ,CAAA,EAGhE,GAAKL,CAAAA,CAAAA,EAAY,CAChB,GAAIA,CAAAA,CAAQ,SAAS,GAAG,CAAA,CAAG,CACzB,GAAM,CAACM,CAAYC,CAAAA,CAAe,CAAIP,CAAAA,CAAAA,CAAQ,MAAM,GAAG,CAAA,CACvD,OAAO,CAAGM,EAAAA,CAAU,SAASC,CAAe,CAAA,CAC9C,CACA,OAAO,CAAQP,KAAAA,EAAAA,CAAO,EACxB,CAAC,CAAA,CACA,KAAK,GAAG,CAAA,CAZW,oBAeXQ,CAAOC,CAAAA,kBAAAA,CAAM,UACxB,CAAA,CACE,CACE,OAAA,CAAAT,EAAU,cACV,CAAA,KAAA,CAAAU,EAAQ,SACR,CAAA,EAAA,CAAAC,EACA,SAAAC,CAAAA,CAAAA,CACA,QAAAC,CAAAA,CAAAA,CACA,MAAAC,CAAAA,CAAAA,CACA,GAAGC,CACL,CAAA,CACAC,IACG,CAEH,IAAMC,EAAoBb,CAAgBJ,CAAAA,CAAO,CAG3CkB,CAAAA,CAAAA,CAAeR,CAAU,GAAA,SAAA,CAAY,eAAiB,CAAQA,KAAAA,EAAAA,CAAK,GAEnES,CAAmBV,CAAAA,kBAAAA,CAAM,QAAQ,IAAM,CAC3C,IAAMW,CAAAA,CACJ,OAAOpB,CAAAA,EAAY,SACfA,CAAQ,CAAA,KAAA,CAAM,GAAG,CAAE,CAAA,GAAA,GACnB,KAAM,CAAA,OAAA,CAAQA,CAAO,CAAA,CACnBA,CAAQ,CAAA,CAAC,EAAE,KAAM,CAAA,GAAG,EAAE,GAAI,EAAA,CAC1B,eACR,OAAOD,CAAAA,CAAsBqB,CAA4B,CAC3D,CAAG,CAAA,CAACpB,CAAO,CAAC,CAAA,CAIZ,OAEES,kBAAA,CAAA,aAAA,CAJiBE,GAAMQ,CAItB,CAAA,CACC,GAAKH,CAAAA,CAAAA,CACL,SAAW,CAAA;AAAA;AAAA,UAAA,EAEPC,CAAiB;AAAA,UAAA,EACjBC,CAAY;AAAA,UAAA,EACZJ,CAAU,EAAA,CAAA,CAAA,EAAIX,CAAWW,CAAAA,CAAM,CAAC,CAAE,CAAA;AAAA,UAAA,EAClCF,CAAS;AAAA,QAEZ,CAAA,CAAA,GAAGG,GAEHF,CACH,CAEJ,CACF,CAEAL,CAAAA,CAAAA,CAAK,YAAc,MCtKZ,CAAA,IAAMa,EAAoBC,YAI/B,CAAA,CACE,CACE,KAAAC,CAAAA,CAAAA,CACA,WAAAC,CACA,CAAA,WAAA,CAAAC,EACA,QAAAC,CAAAA,CAAAA,CACA,UAAAC,CACA,CAAA,KAAA,CAAAC,EACA,cAAAC,CAAAA,CAAAA,CACA,GAAAC,CACA,CAAA,QAAA,CAAAC,EACA,GAAAC,CAAAA,CAAAA,CACA,UAAApB,CACA,CAAA,kBAAA,CAAAqB,EACA,KAAAC,CAAAA,CAAAA,CACA,aAAAC,CACA,CAAA,UAAA,CAAAC,CACA,CAAA,eAAA,CAAiBC,CACjB,CAAA,uBAAA,CAAyBC,EACzB,mBAAqBC,CAAAA,CACvB,EACAvB,CAGEP,GAAAA,kBAAAA,CAAA,cAAC,KAAI,CAAA,CAAA,SAAA,CAAU,uBACZmB,CACCnB,EAAAA,kBAAAA,CAAA,cAACD,CAAA,CAAA,CACC,QAAQ,eACR,CAAA,OAAA,CAASsB,EACT,EAAG,CAAA,OAAA,CACH,MAAOI,CAAQ,CAAA,QAAA,CAAW,UAC1B,SAAWxC,CAAAA,CAAAA,CAAGmC,CAAc,CAE3BD,CAAAA,CAAAA,CACH,EAEFnB,kBAAA,CAAA,aAAA,CAAC,OACC,SAAWf,CAAAA,CAAAA,CACT,oJACA,CACE,qBAAA,CAAuB,CAACwC,CACxB,CAAA,oBAAA,CAAsBA,EACtB,sBAAwBD,CAAAA,CAAAA,CACxB,gDACE,CAAA,CAACA,CACL,CAAA,CACArB,CACF,CAEAH,CAAAA,CAAAA,kBAAAA,CAAA,cAAC,KAAI,CAAA,CAAA,SAAA,CAAU,iBACbA,kBAAA,CAAA,aAAA,CAAC,OAAI,SAAU,CAAA,iBAAA,CAAA,CACbA,mBAAA,aAAC,CAAA,OAAA,CAAA,CACC,IAAKO,CACL,CAAA,EAAA,CAAIc,EACJ,KAAOP,CAAAA,CAAAA,CACP,SAAWiB,CAAMd,EAAAA,CAAAA,CAASc,EAAE,MAAO,CAAA,KAAK,EACxC,SAAWb,CAAAA,CAAAA,CACX,SAAUI,CACV,CAAA,WAAA,CAAaN,EACb,SAAW/B,CAAAA,CAAAA,CACT,sMACAsC,CAAO,EAAA,OACT,EACA,cAAcE,CAAAA,CAAAA,CACd,gBAAeG,CACf,CAAA,uBAAA,CAAuBC,CACvB,CAAA,mBAAA,CAAmBC,CACrB,CAAA,CAAA,CACCf,GACCf,kBAAA,CAAA,aAAA,CAAC,OAAI,SAAU,CAAA,wEAAA,CAAA,CACZc,EACAC,CAAW,CAAA,KAAA,CAAMD,EAAM,MAAM,CAChC,CAEJ,CACCS,CAAAA,CAAAA,EACCvB,mBAAA,aAAC,CAAA,KAAA,CAAA,CAAI,UAAU,8CACZuB,CAAAA,CAAAA,CACH,CAEJ,CACF,CAAA,CACEE,GAASC,CAAiBC,EAAAA,CAAAA,CAC1B3B,mBAAA,aAACD,CAAAA,CAAAA,CAAA,CACC,OAAQ,CAAA,UAAA,CACR,MAAO0B,CAAQ,CAAA,QAAA,CAAW,YAC1B,SAAU,CAAA,MAAA,CAAA,CAETA,EAAQC,CAAeC,CAAAA,CAC1B,EACE,IACN,CAGN,EAEAf,CAAAA,CAAkB,WAAc,CAAA,mBAAA","file":"AutocompleteInput.cjs","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\nexport const noopFn = () => {};\n","import React from \"react\";\nimport { Typography } from \"../types/tailwind\";\n\ntype TextElement =\n | \"p\"\n | \"span\"\n | \"h1\"\n | \"h2\"\n | \"h3\"\n | \"h4\"\n | \"h5\"\n | \"h6\"\n | \"strong\"\n | \"em\"\n | \"blockquote\"\n | \"pre\"\n | \"code\"\n | \"small\"\n | \"label\"\n | \"a\";\n\n// HTML element mapping type\ntype HTMLElementByTag = {\n p: HTMLParagraphElement;\n span: HTMLSpanElement;\n h1: HTMLHeadingElement;\n h2: HTMLHeadingElement;\n h3: HTMLHeadingElement;\n h4: HTMLHeadingElement;\n h5: HTMLHeadingElement;\n h6: HTMLHeadingElement;\n strong: HTMLElement;\n em: HTMLElement;\n blockquote: HTMLQuoteElement;\n pre: HTMLPreElement;\n code: HTMLElement;\n small: HTMLElement;\n label: HTMLLabelElement;\n a: HTMLAnchorElement;\n};\n\n// HTML props mapping type\ntype HTMLPropsMap = {\n p: React.HTMLAttributes<HTMLParagraphElement>;\n span: React.HTMLAttributes<HTMLSpanElement>;\n h1: React.HTMLAttributes<HTMLHeadingElement>;\n h2: React.HTMLAttributes<HTMLHeadingElement>;\n h3: React.HTMLAttributes<HTMLHeadingElement>;\n h4: React.HTMLAttributes<HTMLHeadingElement>;\n h5: React.HTMLAttributes<HTMLHeadingElement>;\n h6: React.HTMLAttributes<HTMLHeadingElement>;\n strong: React.HTMLAttributes<HTMLElement>;\n em: React.HTMLAttributes<HTMLElement>;\n blockquote: React.HTMLAttributes<HTMLQuoteElement>;\n pre: React.HTMLAttributes<HTMLPreElement>;\n code: React.HTMLAttributes<HTMLElement>;\n small: React.HTMLAttributes<HTMLElement>;\n label: React.LabelHTMLAttributes<HTMLLabelElement>;\n a: Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, \"color\">;\n};\n\ntype TextColor =\n | \"primary\"\n | \"secondary\"\n | \"white\"\n | \"primary-blue\"\n | \"disabled\"\n | \"danger\"\n | \"inherit\"\n | \"primary-100\";\n\nconst HEADING_ELEMENT_MAP: Record<string, TextElement> = {\n xl: \"h1\",\n lg: \"h1\",\n md: \"h2\",\n sm: \"h3\",\n xs: \"h4\"\n};\n\nconst getElementFromVariant = (variant: TypographyKey): TextElement => {\n const [category, size] = variant.split(\"-\");\n\n if (category === \"heading\") {\n return HEADING_ELEMENT_MAP[size] || \"p\";\n }\n\n if (category === \"label\") {\n return \"label\";\n }\n\n return \"p\";\n};\n\ntype Weight = \"light\" | \"regular\" | \"semibold\" | \"bold\";\n\nconst fontWeight: Record<Weight, string> = {\n light: \"font-light\",\n regular: \"font-regular\",\n semibold: \"font-semibold\",\n bold: \"font-bold\"\n};\n\n// Add breakpoint types\ntype Breakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\ntype ResponsiveVariant = TypographyKey | `${Breakpoint}:${TypographyKey}`;\n\ntype TypographyCategory = keyof Typography;\ntype TypographyValue<T extends TypographyCategory> = Extract<\n keyof Typography[T],\n string | number | bigint | boolean | null | undefined\n>;\ntype TypographyKey = {\n [T in TypographyCategory]: `${T}-${TypographyValue<T>}`;\n}[TypographyCategory];\n\n// Update TextProps to use ResponsiveVariant\nexport type TextProps<T extends TextElement = \"p\"> = {\n variant?: ResponsiveVariant | ResponsiveVariant[];\n color?: TextColor;\n as?: T;\n className?: string;\n children: React.ReactNode;\n weight?: Weight;\n} & HTMLPropsMap[T];\n\n// Add helper function to process variants\nconst processVariants = (\n variants: ResponsiveVariant | ResponsiveVariant[] | undefined\n): string => {\n if (!variants) return \"text-body-default\";\n\n const variantArray = Array.isArray(variants) ? variants : [variants];\n\n return variantArray\n .map((variant) => {\n if (variant.includes(\":\")) {\n const [breakpoint, typographyClass] = variant.split(\":\");\n return `${breakpoint}:text-${typographyClass}`;\n }\n return `text-${variant}`;\n })\n .join(\" \");\n};\n\nexport const Text = React.forwardRef(\n <T extends TextElement = \"p\">(\n {\n variant = \"body-default\",\n color = \"primary\",\n as,\n className,\n children,\n weight,\n ...props\n }: TextProps<T>,\n ref: React.ForwardedRef<HTMLElementByTag[T]>\n ) => {\n // Process typography classes with breakpoints\n const typographyClasses = processVariants(variant);\n\n // Get color styles\n const colorClasses = color === \"inherit\" ? \"text-inherit\" : `text-${color}`;\n\n const suggestedElement = React.useMemo(() => {\n const baseVariant =\n typeof variant === \"string\"\n ? variant.split(\":\").pop()!\n : Array.isArray(variant)\n ? variant[0].split(\":\").pop()!\n : \"body-default\";\n return getElementFromVariant(baseVariant as TypographyKey);\n }, [variant]);\n\n const Component = (as || suggestedElement) as T;\n\n return (\n // @ts-expect-error TODO: figure this out\n <Component\n ref={ref}\n className={`\n font-sans antialiased\n ${typographyClasses}\n ${colorClasses}\n ${weight && `!${fontWeight[weight]}`}\n ${className}\n `}\n {...props}\n >\n {children}\n </Component>\n );\n }\n);\n\nText.displayName = \"Text\";\n","import React, { forwardRef, KeyboardEvent } from \"react\";\nimport { cn } from \"../utils\";\nimport { Text } from \"./Text\";\n\nexport type AutocompleteInputProps = {\n value: string;\n suggestion: string;\n placeholder?: string;\n onChange: (value: string) => void;\n onKeyDown?: (event: KeyboardEvent<HTMLInputElement>) => void;\n label?: string;\n labelClassName?: string;\n id?: string;\n disabled?: boolean;\n end?: React.ReactNode;\n className?: string;\n forceShowFocusRing?: boolean;\n /** Error state for the input */\n error?: boolean;\n /** Error message to display below the input */\n errorMessage?: string;\n /** Helper text displayed below the input */\n helperText?: string;\n \"aria-controls\"?: string;\n \"aria-activedescendant\"?: string;\n \"aria-autocomplete\"?: \"none\" | \"inline\" | \"list\" | \"both\";\n};\n\nexport const AutocompleteInput = forwardRef<\n HTMLInputElement,\n AutocompleteInputProps\n>(\n (\n {\n value,\n suggestion,\n placeholder,\n onChange,\n onKeyDown,\n label,\n labelClassName,\n id,\n disabled,\n end,\n className,\n forceShowFocusRing,\n error,\n errorMessage,\n helperText,\n \"aria-controls\": ariaControls,\n \"aria-activedescendant\": ariaActiveDescendant,\n \"aria-autocomplete\": ariaAutocomplete\n },\n ref\n ) => {\n return (\n <div className=\"gap-1 flex flex-col\">\n {label && (\n <Text\n variant=\"label-default\"\n htmlFor={id}\n as=\"label\"\n color={error ? \"danger\" : \"primary\"}\n className={cn(labelClassName)}\n >\n {label}\n </Text>\n )}\n <div\n className={cn(\n \"relative flex flex-col gap-2 w-full rounded-lg border bg-background-0 px-3 md:py-3 py-2 text-secondary ring-offset-background disabled:opacity-50\",\n {\n \"border-secondary-50\": !error,\n \"border-tertiary-10\": error,\n \"ring-2 ring-offset-2\": forceShowFocusRing,\n \"focus-within:ring-2 focus-within:ring-offset-2\":\n !forceShowFocusRing\n },\n className\n )}\n >\n <div className=\"flex relative\">\n <div className=\"relative w-full\">\n <input\n ref={ref}\n id={id}\n value={value}\n onChange={(e) => onChange(e.target.value)}\n onKeyDown={onKeyDown}\n disabled={disabled}\n placeholder={placeholder}\n className={cn(\n \"font-sans text-sm flex w-full file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-secondary text-primary disabled:cursor-not-allowed focus:outline-none bg-transparent\",\n end && \"pr-10\"\n )}\n aria-invalid={error}\n aria-controls={ariaControls}\n aria-activedescendant={ariaActiveDescendant}\n aria-autocomplete={ariaAutocomplete}\n />\n {suggestion && (\n <div className=\"absolute inset-0 text-secondary opacity-40 pointer-events-none text-sm\">\n {value}\n {suggestion.slice(value.length)}\n </div>\n )}\n </div>\n {end && (\n <div className=\"absolute inset-y-0 right-0 flex items-center\">\n {end}\n </div>\n )}\n </div>\n </div>\n {(error && errorMessage) || helperText ? (\n <Text\n variant=\"body-xxs\"\n color={error ? \"danger\" : \"secondary\"}\n className=\"mt-1\"\n >\n {error ? errorMessage : helperText}\n </Text>\n ) : null}\n </div>\n );\n }\n);\n\nAutocompleteInput.displayName = \"AutocompleteInput\";\n"]}
|
|
1
|
+
{"version":3,"sources":["../../src/utils/index.ts","../../src/utils/tailwind.ts","../../src/components/Icon.tsx","../../src/utils/responsive.ts","../../src/components/Text.tsx","../../src/components/Input.tsx","../../src/components/AutocompleteInput.tsx"],"names":["cn","inputs","twMerge","clsx","focusRingStylesCoerced","BASE_SIZES","RESPONSIVE_SIZES","getSizeKey","size","getResponsiveSize","baseSize","classes","styles","key","baseKey","responsiveClasses","breakpoint","valueStr","value","valueKey","COLOR_MAP","Icon","React","name","color","title","className","style","props","ref","IconComponent","IconMap","responsiveSizeClasses","responsiveSizeStyles","HEADING_ELEMENT_MAP","getElementFromVariant","variant","category","fontWeight","processVariants","variants","typographyClass","Text","as","children","weight","typographyClasses","colorClasses","suggestedElement","baseVariant","Input","r","end","iconName","label","labelClassName","id","forceShowFocusRing","error","errorMessage","helperText","showCharacterCount","maxLength","defaultValue","onChange","disabled","currentValue","setCurrentValue","handleChange","e","newValue","characterCount","showCount","AutocompleteInput","forwardRef","suggestion","onKeyDown","ariaControls","ariaActiveDescendant","ariaAutocomplete"],"mappings":"seAGO,SAASA,KAAMC,CAAsB,CAAA,CAC1C,OAAOC,qBAAQC,CAAAA,SAAAA,CAAKF,CAAM,CAAC,CAC7B,CCyEO,IAAMG,EAAyB,yBC9EtC,CCkBA,IAAMC,CAAAA,CAAsC,CAC1C,EAAM,CAAA,mBAAA,CACN,EAAM,CAAA,mBAAA,CACN,GAAM,mBACN,CAAA,EAAA,CAAM,oBACN,EAAM,CAAA,mBAAA,CACN,GAAM,mBACN,CAAA,EAAA,CAAM,mBACN,CAAA,EAAA,CAAM,oBACN,EAAM,CAAA,mBAAA,CACN,GAAM,mBACN,CAAA,EAAA,CAAM,oBACN,EAAM,CAAA,mBACR,CAEMC,CAAAA,CAAAA,CAAgE,CACpE,EAAI,CAAA,CACF,GAAM,yBACN,CAAA,EAAA,CAAM,0BACN,EAAM,CAAA,yBAAA,CACN,EAAM,CAAA,yBAAA,CACN,GAAM,yBACN,CAAA,EAAA,CAAM,0BACN,EAAM,CAAA,yBAAA,CACN,GAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,0BACN,EAAM,CAAA,yBAAA,CACN,EAAM,CAAA,yBACR,EACA,EAAI,CAAA,CACF,EAAM,CAAA,yBAAA,CACN,GAAM,yBACN,CAAA,EAAA,CAAM,0BACN,EAAM,CAAA,yBAAA,CACN,GAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,0BACN,EAAM,CAAA,yBAAA,CACN,GAAM,yBACN,CAAA,EAAA,CAAM,0BACN,EAAM,CAAA,yBAAA,CACN,EAAM,CAAA,yBACR,EACA,EAAI,CAAA,CACF,GAAM,yBACN,CAAA,EAAA,CAAM,0BACN,EAAM,CAAA,yBAAA,CACN,EAAM,CAAA,yBAAA,CACN,GAAM,yBACN,CAAA,EAAA,CAAM,0BACN,EAAM,CAAA,yBAAA,CACN,GAAM,yBACN,CAAA,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,0BACN,EAAM,CAAA,yBAAA,CACN,GAAM,yBACR,CAAA,CACA,GAAI,CACF,EAAA,CAAM,yBACN,CAAA,EAAA,CAAM,0BACN,EAAM,CAAA,yBAAA,CACN,GAAM,yBACN,CAAA,EAAA,CAAM,0BACN,EAAM,CAAA,yBAAA,CACN,EAAM,CAAA,yBAAA,CACN,GAAM,yBACN,CAAA,EAAA,CAAM,0BACN,EAAM,CAAA,yBAAA,CACN,GAAM,yBACN,CAAA,EAAA,CAAM,yBACR,CAAA,CACA,MAAO,CACL,EAAA,CAAM,2BACN,CAAA,EAAA,CAAM,4BACN,EAAM,CAAA,2BAAA,CACN,EAAM,CAAA,2BAAA,CACN,GAAM,2BACN,CAAA,EAAA,CAAM,4BACN,EAAM,CAAA,2BAAA,CACN,GAAM,2BACN,CAAA,EAAA,CAAM,2BACN,CAAA,EAAA,CAAM,4BACN,EAAM,CAAA,2BAAA,CACN,GAAM,2BACR,CACF,EAEMC,CAAcC,CAAAA,CAAAA,EACX,MAAOA,CAAAA,CAAI,EAGPC,CAAoB,CAAA,CAC/BD,EACAE,CAAmB,CAAA,EAAA,GAIhB,CACH,IAAMC,CAAAA,CAAoB,EAAC,CACrBC,EAAiC,EAAC,CAGxC,GAAIJ,CAAS,GAAA,SAAA,CAAW,CACtB,IAAMK,CAAAA,CAAMN,CAAWG,CAAAA,CAAQ,EAC3BG,CACFF,CAAAA,CAAAA,CAAQ,KAAKN,CAAWQ,CAAAA,CAAG,CAAC,CAE5BD,EAAAA,CAAAA,CAAO,MAAS,CAAA,CAAA,EAAGF,CAAQ,CAC3BE,EAAAA,CAAAA,CAAAA,CAAAA,CAAO,MAAQ,CAAGF,EAAAA,CAAQ,MAE9B,CAGA,GAAI,OAAOF,CAAAA,EAAS,SAAU,CAC5B,IAAMK,EAAMN,CAAWC,CAAAA,CAAI,EACvBK,CACFF,CAAAA,CAAAA,CAAQ,IAAKN,CAAAA,CAAAA,CAAWQ,CAAG,CAAC,CAAA,EAE5BD,CAAO,CAAA,MAAA,CAAS,GAAGJ,CAAI,CAAA,EAAA,CAAA,CACvBI,CAAO,CAAA,KAAA,CAAQ,GAAGJ,CAAI,CAAA,EAAA,CAAA,EAE1B,CAGA,GAAI,KAAA,CAAM,QAAQA,CAAI,CAAA,CAAG,CACvB,IAAMM,EAAUP,CAAWG,CAAAA,CAAQ,EAC7BK,CAAoB,CAAA,CACvBD,GAAWT,CAAWS,CAAAA,CAAO,CAAM,EAAA,CAAA,GAAA,EAAMJ,CAAQ,CAAUA,OAAAA,EAAAA,CAAQ,KACtE,CAEAF,CAAAA,CAAAA,CAAK,QAAS,CAAM,EAAA,CAClB,GAAI,OAAO,GAAM,QAAU,CAAA,CACzB,GAAM,CAACQ,CAAAA,CAAYC,CAAQ,CAAI,CAAA,CAAA,CAAE,KAAM,CAAA,GAAG,EACpCC,CAAQ,CAAA,QAAA,CAASD,EAAU,EAAE,CAAA,CAC7BJ,EAAMN,CAAWW,CAAAA,CAAK,CAC5BP,CAAAA,CAAAA,CAAQ,KACLE,CAAOP,EAAAA,CAAAA,CAAiBU,CAAU,CAAIH,GAAAA,CAAG,GACxC,CAAGG,EAAAA,CAAU,CAAOE,IAAAA,EAAAA,CAAK,OAAOF,CAAU,CAAA,IAAA,EAAOE,CAAK,CAC1D,GAAA,CAAA,EACF,CACF,CAAC,CAAA,CAEDP,CAAQ,CAAA,IAAA,CAAK,GAAGI,CAAiB,EACnC,CAEA,GAAI,OAAOP,CAAS,EAAA,QAAA,CAAU,CAC5B,GAAM,CAACQ,CAAYC,CAAAA,CAAQ,EAAIT,CAAK,CAAA,KAAA,CAAM,GAAG,CACvCU,CAAAA,CAAAA,CAAQ,QAASD,CAAAA,CAAAA,CAAU,EAAE,CAC7BE,CAAAA,CAAAA,CAAWZ,EAAWW,CAAK,CAAA,CACjCP,EAAQ,IACLQ,CAAAA,CAAAA,EAAYb,CAAiBU,CAAAA,CAAU,IAAIG,CAAQ,CAAA,EAClD,GAAGH,CAAU,CAAA,IAAA,EAAOE,CAAK,CAAOF,IAAAA,EAAAA,CAAU,CAAOE,IAAAA,EAAAA,CAAK,KAC1D,EACF,CAEA,OAAO,CACL,qBAAA,CAAuBP,EAAQ,IAAK,CAAA,GAAG,CACvC,CAAA,oBAAA,CAAsBC,CACxB,CACF,CAAA,CDjKA,IAAMQ,CAAwC,CAAA,CAC5C,QAAS,SACT,CAAA,SAAA,CAAW,SACX,CAAA,KAAA,CAAO,UACP,WAAa,CAAA,SAAA,CACb,SAAU,SACV,CAAA,MAAA,CAAQ,SACV,CAEaC,CAAAA,CAAAA,CAAOC,oBAAM,CAAA,UAAA,CACxB,CACE,CACE,IAAA,CAAAC,EACA,IAAAf,CAAAA,CAAAA,CAAO,GACP,KAAAgB,CAAAA,CAAAA,CAAQ,SACR,CAAA,KAAA,CAAAC,EACA,SAAAC,CAAAA,CAAAA,CACA,KAAAC,CAAAA,CAAAA,CAAQ,EACR,CAAA,GAAGC,CACL,CAAA,CACAC,IACG,CACH,IAAMC,EAAgBC,aAAQR,CAAAA,CAAI,EAC5B,CAAE,qBAAA,CAAAS,CAAuB,CAAA,oBAAA,CAAAC,CAAqB,CAAIxB,CAAAA,CAAAA,CACtDD,EACA,EACF,CAAA,CAEA,OACEc,oBAAA,CAAA,aAAA,CAAC,KACC,CAAA,CAAA,SAAA,CAAWtB,EACT,kCACAgC,CAAAA,CAAAA,CACAN,CACF,CACA,CAAA,KAAA,CAAO,CACJ,eAA4BN,CAAAA,CAAAA,CAAUI,CAAK,CAAA,CAC5C,GAAGS,CACH,CAAA,GAAGN,CACL,CAEAL,CAAAA,CAAAA,oBAAAA,CAAA,cAACQ,CAAA,CAAA,CACC,GAAKD,CAAAA,CAAAA,CACL,cAAa,CAACJ,CAAAA,CACd,aAAYA,CACZ,CAAA,MAAA,CAAQF,EAAK,QAAS,CAAA,QAAQ,CAAI,CAAA,SAAA,CAAYH,EAAUI,CAAK,CAAA,CAC5D,GAAGI,CACN,CAAA,CACF,CAEJ,CACF,CAAA,CAEAP,CAAK,CAAA,WAAA,CAAc,OEEnB,IAAMa,CAAAA,CAAmD,CACvD,EAAI,CAAA,IAAA,CACJ,EAAI,CAAA,IAAA,CACJ,GAAI,IACJ,CAAA,EAAA,CAAI,IACJ,CAAA,EAAA,CAAI,IACN,CAEMC,CAAAA,CAAAA,CAAyBC,CAAwC,EAAA,CACrE,GAAM,CAACC,CAAAA,CAAU7B,CAAI,CAAI4B,CAAAA,CAAAA,CAAQ,MAAM,GAAG,CAAA,CAE1C,OAAIC,CAAAA,GAAa,UACRH,CAAoB1B,CAAAA,CAAI,GAAK,GAGlC6B,CAAAA,CAAAA,GAAa,QACR,OAGF,CAAA,GACT,CAIMC,CAAAA,CAAAA,CAAqC,CACzC,KAAO,CAAA,YAAA,CACP,QAAS,cACT,CAAA,QAAA,CAAU,gBACV,IAAM,CAAA,WACR,CAwBMC,CAAAA,CAAAA,CACJC,GAEKA,CAEgB,CAAA,CAAA,KAAA,CAAM,QAAQA,CAAQ,CAAA,CAAIA,EAAW,CAACA,CAAQ,CAGhE,EAAA,GAAA,CAAKJ,GAAY,CAChB,GAAIA,EAAQ,QAAS,CAAA,GAAG,EAAG,CACzB,GAAM,CAACpB,CAAAA,CAAYyB,CAAe,CAAIL,CAAAA,CAAAA,CAAQ,MAAM,GAAG,CAAA,CACvD,OAAO,CAAGpB,EAAAA,CAAU,CAASyB,MAAAA,EAAAA,CAAe,EAC9C,CACA,OAAO,QAAQL,CAAO,CAAA,CACxB,CAAC,CACA,CAAA,IAAA,CAAK,GAAG,CAAA,CAZW,oBAeXM,CAAOpB,CAAAA,oBAAAA,CAAM,UACxB,CAAA,CACE,CACE,OAAAc,CAAAA,CAAAA,CAAU,cACV,CAAA,KAAA,CAAAZ,EAAQ,SACR,CAAA,EAAA,CAAAmB,EACA,SAAAjB,CAAAA,CAAAA,CACA,SAAAkB,CACA,CAAA,MAAA,CAAAC,CACA,CAAA,GAAGjB,CACL,CACAC,CAAAA,CAAAA,GACG,CAEH,IAAMiB,CAAAA,CAAoBP,EAAgBH,CAAO,CAAA,CAG3CW,CAAevB,CAAAA,CAAAA,GAAU,UAAY,cAAiB,CAAA,CAAA,KAAA,EAAQA,CAAK,CAEnEwB,CAAAA,CAAAA,CAAAA,CAAmB1B,qBAAM,OAAQ,CAAA,IAAM,CAC3C,IAAM2B,EACJ,OAAOb,CAAAA,EAAY,SACfA,CAAQ,CAAA,KAAA,CAAM,GAAG,CAAE,CAAA,GAAA,EACnB,CAAA,KAAA,CAAM,QAAQA,CAAO,CAAA,CACnBA,EAAQ,CAAC,CAAA,CAAE,MAAM,GAAG,CAAA,CAAE,GAAI,EAAA,CAC1B,eACR,OAAOD,CAAAA,CAAsBc,CAA4B,CAC3D,CAAA,CAAG,CAACb,CAAO,CAAC,CAIZ,CAAA,OAEEd,qBAAA,aAJiBqB,CAAAA,CAAAA,EAAMK,EAItB,CACC,GAAA,CAAKnB,EACL,SAAW,CAAA;AAAA;AAAA,UAAA,EAEPiB,CAAiB;AAAA,UAAA,EACjBC,CAAY;AAAA,UAAA,EACZF,CAAU,EAAA,CAAA,CAAA,EAAIP,CAAWO,CAAAA,CAAM,CAAC,CAAE,CAAA;AAAA,UAAA,EAClCnB,CAAS;AAAA,QAAA,CAAA,CAEZ,GAAGE,CAEHgB,CAAAA,CAAAA,CACH,CAEJ,CACF,CAAA,CAEAF,EAAK,WAAc,CAAA,MAAA,CClKZ,IAAMQ,CAAAA,CAAcC,wBACzB,CACE,CACE,UAAAzB,CACA,CAAA,GAAA,CAAA0B,EACA,QAAAC,CAAAA,CAAAA,CACA,KAAA7B,CAAAA,CAAAA,CACA,KAAAhB,CACA,CAAA,KAAA,CAAAiB,EACA,KAAA6B,CAAAA,CAAAA,CACA,eAAAC,CACA,CAAA,EAAA,CAAAC,CACA,CAAA,QAAA,CAAAZ,EACA,kBAAAa,CAAAA,CAAAA,CACA,MAAAC,CACA,CAAA,YAAA,CAAAC,EACA,UAAAC,CAAAA,CAAAA,CACA,kBAAAC,CAAAA,CAAAA,CACA,UAAAC,CACA,CAAA,KAAA,CAAA5C,EACA,YAAA6C,CAAAA,CAAAA,CACA,SAAAC,CACA,CAAA,QAAA,CAAAC,CACA,CAAA,GAAGrC,CACL,CACAC,CAAAA,CAAAA,GACG,CACH,GAAM,CAACqC,EAAcC,CAAe,CAAA,CAAUhB,YAC5CjC,CAAAA,QAAAA,CAAAA,CAAAA,EAAO,UAAc6C,EAAAA,CAAAA,EAAc,UAAc,EAAA,EACnD,EAGMZ,YAAU,CAAA,SAAA,CAAA,IAAM,CAChBjC,CAAAA,GAAU,WACZiD,CAAgBjD,CAAAA,CAAAA,CAAM,UAAU,EAEpC,EAAG,CAACA,CAAK,CAAC,CAAA,CAEV,IAAMkD,CAAqB,CAAAjB,YAAA,CAAA,WAAA,CACxBkB,GAA2C,CAC1C,IAAMC,EAAWD,CAAE,CAAA,MAAA,CAAO,KAC1BF,CAAAA,CAAAA,CAAgBG,CAAQ,CACxBN,CAAAA,CAAAA,GAAWK,CAAC,EACd,CAAA,CACA,CAACL,CAAQ,CACX,CAEMO,CAAAA,CAAAA,CAAiBL,EAAa,MAC9BM,CAAAA,CAAAA,CAAYX,GAAsB,CAAC,CAACC,EAE1C,OACEX,YAAA,CAAA,aAAA,CAAC,KAAI,CAAA,CAAA,SAAA,CAAU,uBACZG,CACC,EAAAH,YAAA,CAAA,aAAA,CAACT,EAAA,CACC,OAAA,CAAQ,gBACR,OAASc,CAAAA,CAAAA,CACT,EAAG,CAAA,OAAA,CACH,MAAOE,CAAQ,CAAA,QAAA,CAAW,UAC1B,SAAW1D,CAAAA,CAAAA,CAAGuD,CAAc,CAE3BD,CAAAA,CAAAA,CACH,CAEF,CAAAH,YAAA,CAAA,aAAA,CAAC,OACC,SAAWnD,CAAAA,CAAAA,CACT,wIACA,CAAC0D,CAAAA,EAAS,CAACD,CAAsB,EAAA,qBAAA,CACjCC,CAAS,EAAA,oBAAA,CACTO,GAAY,+BACZ,CAAA,mDAAA,CACAR,GAAsBrD,CACxB,CAAA,CAAA,CAEA+C,2BAAC,KAAI,CAAA,CAAA,SAAA,CAAU,iBACbA,YAAC,CAAA,aAAA,CAAA,OAAA,CAAA,CACC,IAAKtB,CACL,CAAA,EAAA,CAAI2B,EACJ,SAAWxD,CAAAA,CAAAA,CACT,uNACAoD,CAAO,EAAA,OAAA,CACP1B,CACF,CAAA,CACA,MAAOwC,CACP,CAAA,SAAA,CAAWJ,EACX,QAAUM,CAAAA,CAAAA,CACV,eAAcV,CACd,CAAA,QAAA,CAAUO,CACT,CAAA,GAAGrC,EACN,CACEwB,CAAAA,CAAAA,CAAAA,EAAOC,IACPF,YAAC,CAAA,aAAA,CAAA,KAAA,CAAA,CAAI,UAAU,8CACZE,CAAAA,CAAAA,CAAAA,CACCF,YAAC9B,CAAAA,aAAAA,CAAAA,CAAAA,CAAA,CACC,IAAMgC,CAAAA,CAAAA,CACN,MAAOK,CAAQ,CAAA,QAAA,CAAW,YAC1B,IAAMlD,CAAAA,CAAAA,CACN,KAAOiB,CAAAA,CAAAA,CACT,EAEA2B,CAEJ,CAEJ,EACCR,CACH,CAAA,CACAO,2BAAC,KAAI,CAAA,CAAA,SAAA,CAAU,4BACXO,CAAAA,CAAAA,CAAAA,EAASC,GAAiBC,CAC1B,CAAAT,YAAA,CAAA,aAAA,CAACT,EAAA,CACC,OAAA,CAAQ,WACR,KAAOgB,CAAAA,CAAAA,CAAQ,QAAW,CAAA,WAAA,CAC1B,UAAU,MAETA,CAAAA,CAAAA,CAAAA,CAAQC,EAAeC,CAC1B,CAAA,CACE,KACHY,CACC,EAAArB,YAAA,CAAA,aAAA,CAACT,CAAA,CAAA,CACC,QAAQ,UACR,CAAA,KAAA,CAAOgB,EAAQ,QAAW,CAAA,WAAA,CAC1B,UAAU,iBAEV,CAAA,CAAAP,YAAA,CAAA,aAAA,CAACT,EAAA,CACC,OAAA,CAAQ,WACR,EAAG,CAAA,MAAA,CACH,MAAM,aACN,CAAA,SAAA,CAAU,aAET6B,CACH,CAAA,CACCT,CAAa,EAAA,CAAA,CAAA,EAAIA,CAAS,CAAG,CAAA,CAAA,aAChC,CAEJ,CACF,CAEJ,CACF,CCzJO,CAAA,IAAMW,CAAoBC,CAAAA,YAAAA,CAI/B,CACE,CACE,KAAA,CAAAxD,EACA,UAAAyD,CAAAA,CAAAA,CACA,SAAAX,CACA,CAAA,SAAA,CAAAY,CACA,CAAA,SAAA,CAAAlD,EACA,eAAiBmD,CAAAA,CAAAA,CACjB,wBAAyBC,CACzB,CAAA,mBAAA,CAAqBC,EACrB,GAAGnD,CACL,CACAC,CAAAA,CAAAA,GAGEP,qBAAA,aAAC,CAAA,KAAA,CAAA,CAAI,UAAU,iBACbA,CAAAA,CAAAA,oBAAAA,CAAA,cAAC4B,CAAA,CAAA,CACC,GAAKrB,CAAAA,CAAAA,CACL,MAAOX,CACP,CAAA,QAAA,CAAWmD,GAAML,CAASK,CAAAA,CAAAA,CAAE,OAAO,KAAK,CAAA,CACxC,SAAWO,CAAAA,CAAAA,CACX,UAAW5E,CAAG,CAAA,gBAAA,CAAkB0B,CAAS,CACzC,CAAA,eAAA,CAAemD,EACf,uBAAuBC,CAAAA,CAAAA,CACvB,mBAAmBC,CAAAA,CAAAA,CAClB,GAAGnD,CACN,CAAA,CAAA,CACC+C,GACCrD,oBAAA,CAAA,aAAA,CAAC,OAAI,SAAU,CAAA,kHAAA,CAAA,CACZJ,EACAyD,CAAW,CAAA,KAAA,CAAMzD,EAAM,MAAM,CAChC,CAEJ,CAGN,EAEAuD,EAAkB,WAAc,CAAA,mBAAA","file":"AutocompleteInput.cjs","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\nexport const noopFn = () => {};\n","import { Colors, Typography } from \"../types/tailwind\";\n\n// Generate safelist patterns for all color utilities so you can use any theme color variable in your code\nexport const generateSafelist = (colors: Colors, typography: Typography) => {\n const colorNames = Object.keys(colors) as (keyof Colors)[];\n const utilities = [\"bg\", \"text\", \"border\", \"ring\", \"divide\", \"outline\"];\n const variants = [\"hover:\", \"focus:\", \"active:\", \"disabled:\"];\n const breakpoints = [\"sm\", \"md\", \"lg\", \"xl\", \"2xl\"];\n const sizes = [\"24\", \"42\", \"48\", \"64\", \"72\"]; // Add all the sizes you need\n\n const safelist: (string | { pattern: RegExp; variants: string[] })[] = [];\n\n colorNames.forEach((colorName) => {\n if (typeof colors[colorName] === \"object\") {\n // Handle nested color objects (with number keys)\n Object.keys(colors[colorName]).forEach((shade) => {\n utilities.forEach((utility) => {\n // Base utility\n safelist.push(`${utility}-${colorName}-${shade}`);\n\n // Variant utilities\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}-${shade}`);\n });\n });\n });\n } else {\n // Handle direct color values\n utilities.forEach((utility) => {\n safelist.push(`${utility}-${colorName}`);\n\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}`);\n });\n });\n }\n });\n\n // Generate typography classes\n Object.entries(typography).forEach(([family, sizes]) => {\n Object.keys(sizes).forEach((size) => {\n // Base typography classes\n safelist.push(`text-${family}-${size}`);\n\n // Add variants\n variants.forEach((variant) => {\n safelist.push(`${variant}text-${family}-${size}`);\n });\n });\n });\n\n const typographyClasses = Object.entries(typography).flatMap(\n ([category, sizes]) =>\n Object.keys(sizes).map((size) => `text-${category}-${size}`)\n );\n\n // Generate responsive variants\n const responsiveTypographyClasses = typographyClasses.flatMap((className) =>\n breakpoints.map((breakpoint) => `${breakpoint}:${className}`)\n );\n\n // Generate size classes with responsive variants\n const sizeClasses = sizes.flatMap((size) => [\n `h-[${size}px]`,\n `w-[${size}px]`,\n ...breakpoints.flatMap((bp) => [\n `${bp}:h-[${size}px]`,\n `${bp}:w-[${size}px]`\n ])\n ]);\n\n return [...typographyClasses, ...responsiveTypographyClasses, ...sizeClasses];\n};\n\nexport const focusRingStyles =\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-100\";\nexport const focusRingWithinStyles =\n \"focus-within:outline-none focus-within:ring-2 focus-within:ring-primary-100\";\nexport const focusRingStylesCoerced = \"ring-2 ring-primary-100\";\n","import { IconMap, IconName } from \"@deckai/icons\";\nimport React, { SVGProps } from \"react\";\nimport { IconColors } from \"../types/tailwind\";\nimport { cn } from \"../utils\";\nimport { ResponsiveSize, getResponsiveSize } from \"../utils/responsive\";\n\nexport type IconProps = {\n name: IconName;\n /** @default 24 */\n size?: ResponsiveSize | ResponsiveSize[];\n /** @default primary */\n color?: IconColors;\n title?: string;\n className?: string;\n style?: React.CSSProperties;\n} & Omit<SVGProps<SVGSVGElement>, \"aria-hidden\" | \"aria-label\">;\n\nconst COLOR_MAP: Record<IconColors, string> = {\n primary: \"#080808\",\n secondary: \"#666666\",\n white: \"#ffffff\",\n primaryBlue: \"#089CCB\",\n disabled: \"#888888\",\n danger: \"#FF0000\"\n};\n\nexport const Icon = React.forwardRef<SVGSVGElement, IconProps>(\n (\n {\n name,\n size = 24,\n color = \"primary\",\n title,\n className,\n style = {},\n ...props\n },\n ref\n ) => {\n const IconComponent = IconMap[name];\n const { responsiveSizeClasses, responsiveSizeStyles } = getResponsiveSize(\n size,\n 24\n );\n\n return (\n <div\n className={cn(\n \"flex justify-center items-center\",\n responsiveSizeClasses,\n className\n )}\n style={{\n [\"--icon-stroke\" as string]: COLOR_MAP[color],\n ...responsiveSizeStyles,\n ...style\n }}\n >\n <IconComponent\n ref={ref}\n aria-hidden={!title}\n aria-label={title}\n stroke={name.includes(\"filled\") ? undefined : COLOR_MAP[color]}\n {...props}\n />\n </div>\n );\n }\n);\n\nIcon.displayName = \"Icon\";\n","export type Breakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\nexport type ResponsiveSize = number | `${Breakpoint}:${number}`;\n\ntype SizeKey =\n | \"12\"\n | \"16\"\n | \"18\"\n | \"20\"\n | \"24\"\n | \"32\"\n | \"36\"\n | \"40\"\n | \"42\"\n | \"48\"\n | \"64\"\n | \"72\";\n\n// These constants help Tailwind identify the classes during compilation\nconst BASE_SIZES: Record<SizeKey, string> = {\n \"12\": \"h-[12px] w-[12px]\",\n \"16\": \"h-[16px] w-[16px]\",\n \"18\": \"h-[18px] w-[18px]\",\n \"20\": \"h-[20px] w-[20px]\",\n \"24\": \"h-[24px] w-[24px]\",\n \"32\": \"h-[32px] w-[32px]\",\n \"36\": \"h-[36px] w-[36px]\",\n \"40\": \"h-[40px] w-[40px]\",\n \"42\": \"h-[42px] w-[42px]\",\n \"48\": \"h-[48px] w-[48px]\",\n \"64\": \"h-[64px] w-[64px]\",\n \"72\": \"h-[72px] w-[72px]\"\n};\n\nconst RESPONSIVE_SIZES: Record<Breakpoint, Record<SizeKey, string>> = {\n sm: {\n \"12\": \"sm:h-[12px] sm:w-[12px]\",\n \"16\": \"sm:h-[16px] sm:w-[16px]\",\n \"18\": \"sm:h-[18px] sm:w-[18px]\",\n \"20\": \"sm:h-[20px] sm:w-[20px]\",\n \"24\": \"sm:h-[24px] sm:w-[24px]\",\n \"32\": \"sm:h-[32px] sm:w-[32px]\",\n \"36\": \"sm:h-[36px] sm:w-[36px]\",\n \"40\": \"sm:h-[40px] sm:w-[40px]\",\n \"42\": \"sm:h-[42px] sm:w-[42px]\",\n \"48\": \"sm:h-[48px] sm:w-[48px]\",\n \"64\": \"sm:h-[64px] sm:w-[64px]\",\n \"72\": \"sm:h-[72px] sm:w-[72px]\"\n },\n md: {\n \"12\": \"md:h-[12px] md:w-[12px]\",\n \"16\": \"md:h-[16px] md:w-[16px]\",\n \"18\": \"md:h-[18px] md:w-[18px]\",\n \"20\": \"md:h-[20px] md:w-[20px]\",\n \"24\": \"md:h-[24px] md:w-[24px]\",\n \"32\": \"md:h-[32px] md:w-[32px]\",\n \"36\": \"md:h-[36px] md:w-[36px]\",\n \"40\": \"md:h-[40px] md:w-[40px]\",\n \"42\": \"md:h-[42px] md:w-[42px]\",\n \"48\": \"md:h-[48px] md:w-[48px]\",\n \"64\": \"md:h-[64px] md:w-[64px]\",\n \"72\": \"md:h-[72px] md:w-[72px]\"\n },\n lg: {\n \"12\": \"lg:h-[12px] lg:w-[12px]\",\n \"16\": \"lg:h-[16px] lg:w-[16px]\",\n \"18\": \"lg:h-[18px] lg:w-[18px]\",\n \"20\": \"lg:h-[20px] lg:w-[20px]\",\n \"24\": \"lg:h-[24px] lg:w-[24px]\",\n \"32\": \"lg:h-[32px] lg:w-[32px]\",\n \"36\": \"lg:h-[36px] lg:w-[36px]\",\n \"40\": \"lg:h-[40px] lg:w-[40px]\",\n \"42\": \"lg:h-[42px] lg:w-[42px]\",\n \"48\": \"lg:h-[48px] lg:w-[48px]\",\n \"64\": \"lg:h-[64px] lg:w-[64px]\",\n \"72\": \"lg:h-[72px] lg:w-[72px]\"\n },\n xl: {\n \"12\": \"xl:h-[12px] xl:w-[12px]\",\n \"16\": \"xl:h-[16px] xl:w-[16px]\",\n \"18\": \"xl:h-[18px] xl:w-[18px]\",\n \"20\": \"xl:h-[20px] xl:w-[20px]\",\n \"24\": \"xl:h-[24px] xl:w-[24px]\",\n \"32\": \"xl:h-[32px] xl:w-[32px]\",\n \"36\": \"xl:h-[36px] xl:w-[36px]\",\n \"40\": \"xl:h-[40px] xl:w-[40px]\",\n \"42\": \"xl:h-[42px] xl:w-[42px]\",\n \"48\": \"xl:h-[48px] xl:w-[48px]\",\n \"64\": \"xl:h-[64px] xl:w-[64px]\",\n \"72\": \"xl:h-[72px] xl:w-[72px]\"\n },\n \"2xl\": {\n \"12\": \"2xl:h-[12px] 2xl:w-[12px]\",\n \"16\": \"2xl:h-[16px] 2xl:w-[16px]\",\n \"18\": \"2xl:h-[18px] 2xl:w-[18px]\",\n \"20\": \"2xl:h-[20px] 2xl:w-[20px]\",\n \"24\": \"2xl:h-[24px] 2xl:w-[24px]\",\n \"32\": \"2xl:h-[32px] 2xl:w-[32px]\",\n \"36\": \"2xl:h-[36px] 2xl:w-[36px]\",\n \"40\": \"2xl:h-[40px] 2xl:w-[40px]\",\n \"42\": \"2xl:h-[42px] 2xl:w-[42px]\",\n \"48\": \"2xl:h-[48px] 2xl:w-[48px]\",\n \"64\": \"2xl:h-[64px] 2xl:w-[64px]\",\n \"72\": \"2xl:h-[72px] 2xl:w-[72px]\"\n }\n};\n\nconst getSizeKey = (size: number): SizeKey | undefined => {\n return String(size) as SizeKey;\n};\n\nexport const getResponsiveSize = (\n size: ResponsiveSize | ResponsiveSize[] | undefined,\n baseSize: number = 24\n): {\n responsiveSizeClasses: string;\n responsiveSizeStyles: Record<string, string>;\n} => {\n const classes: string[] = [];\n const styles: Record<string, string> = {};\n\n // If no size provided, use baseSize\n if (size === undefined) {\n const key = getSizeKey(baseSize);\n if (key) {\n classes.push(BASE_SIZES[key]);\n } else {\n styles.height = `${baseSize}px`;\n styles.width = `${baseSize}px`;\n }\n }\n\n // If size is a number, use that directly\n if (typeof size === \"number\") {\n const key = getSizeKey(size);\n if (key) {\n classes.push(BASE_SIZES[key]);\n } else {\n styles.height = `${size}px`;\n styles.width = `${size}px`;\n }\n }\n\n // If array of responsive sizes, generate responsive classes\n if (Array.isArray(size)) {\n const baseKey = getSizeKey(baseSize);\n const responsiveClasses = [\n (baseKey && BASE_SIZES[baseKey]) || `h-[${baseSize}px] w-[${baseSize}px]`\n ];\n\n size.forEach((s) => {\n if (typeof s === \"string\") {\n const [breakpoint, valueStr] = s.split(\":\") as [Breakpoint, string];\n const value = parseInt(valueStr, 10);\n const key = getSizeKey(value);\n classes.push(\n (key && RESPONSIVE_SIZES[breakpoint]?.[key]) ||\n `${breakpoint}:h-[${value}px] ${breakpoint}:w-[${value}px]`\n );\n }\n });\n\n classes.push(...responsiveClasses);\n }\n\n if (typeof size === \"string\") {\n const [breakpoint, valueStr] = size.split(\":\") as [Breakpoint, string];\n const value = parseInt(valueStr, 10);\n const valueKey = getSizeKey(value);\n classes.push(\n (valueKey && RESPONSIVE_SIZES[breakpoint]?.[valueKey]) ||\n `${breakpoint}:h-[${value}px] ${breakpoint}:w-[${value}px]`\n );\n }\n\n return {\n responsiveSizeClasses: classes.join(\" \"),\n responsiveSizeStyles: styles\n };\n};\n","import React from \"react\";\nimport { Typography } from \"../types/tailwind\";\nimport { Breakpoint } from \"../utils/responsive\";\n\ntype TextElement =\n | \"p\"\n | \"span\"\n | \"h1\"\n | \"h2\"\n | \"h3\"\n | \"h4\"\n | \"h5\"\n | \"h6\"\n | \"strong\"\n | \"em\"\n | \"blockquote\"\n | \"pre\"\n | \"code\"\n | \"small\"\n | \"label\"\n | \"a\";\n\n// HTML element mapping type\ntype HTMLElementByTag = {\n p: HTMLParagraphElement;\n span: HTMLSpanElement;\n h1: HTMLHeadingElement;\n h2: HTMLHeadingElement;\n h3: HTMLHeadingElement;\n h4: HTMLHeadingElement;\n h5: HTMLHeadingElement;\n h6: HTMLHeadingElement;\n strong: HTMLElement;\n em: HTMLElement;\n blockquote: HTMLQuoteElement;\n pre: HTMLPreElement;\n code: HTMLElement;\n small: HTMLElement;\n label: HTMLLabelElement;\n a: HTMLAnchorElement;\n};\n\n// HTML props mapping type\ntype HTMLPropsMap = {\n p: React.HTMLAttributes<HTMLParagraphElement>;\n span: React.HTMLAttributes<HTMLSpanElement>;\n h1: React.HTMLAttributes<HTMLHeadingElement>;\n h2: React.HTMLAttributes<HTMLHeadingElement>;\n h3: React.HTMLAttributes<HTMLHeadingElement>;\n h4: React.HTMLAttributes<HTMLHeadingElement>;\n h5: React.HTMLAttributes<HTMLHeadingElement>;\n h6: React.HTMLAttributes<HTMLHeadingElement>;\n strong: React.HTMLAttributes<HTMLElement>;\n em: React.HTMLAttributes<HTMLElement>;\n blockquote: React.HTMLAttributes<HTMLQuoteElement>;\n pre: React.HTMLAttributes<HTMLPreElement>;\n code: React.HTMLAttributes<HTMLElement>;\n small: React.HTMLAttributes<HTMLElement>;\n label: React.LabelHTMLAttributes<HTMLLabelElement>;\n a: Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, \"color\">;\n};\n\ntype TextColor =\n | \"primary\"\n | \"secondary\"\n | \"white\"\n | \"primary-blue\"\n | \"disabled\"\n | \"danger\"\n | \"inherit\"\n | \"primary-100\";\n\nconst HEADING_ELEMENT_MAP: Record<string, TextElement> = {\n xl: \"h1\",\n lg: \"h1\",\n md: \"h2\",\n sm: \"h3\",\n xs: \"h4\"\n};\n\nconst getElementFromVariant = (variant: TypographyKey): TextElement => {\n const [category, size] = variant.split(\"-\");\n\n if (category === \"heading\") {\n return HEADING_ELEMENT_MAP[size] || \"p\";\n }\n\n if (category === \"label\") {\n return \"label\";\n }\n\n return \"p\";\n};\n\ntype Weight = \"light\" | \"regular\" | \"semibold\" | \"bold\";\n\nconst fontWeight: Record<Weight, string> = {\n light: \"font-light\",\n regular: \"font-regular\",\n semibold: \"font-semibold\",\n bold: \"font-bold\"\n};\n\ntype ResponsiveVariant = TypographyKey | `${Breakpoint}:${TypographyKey}`;\n\ntype TypographyCategory = keyof Typography;\ntype TypographyValue<T extends TypographyCategory> = Extract<\n keyof Typography[T],\n string | number | bigint | boolean | null | undefined\n>;\ntype TypographyKey = {\n [T in TypographyCategory]: `${T}-${TypographyValue<T>}`;\n}[TypographyCategory];\n\n// Update TextProps to use ResponsiveVariant\nexport type TextProps<T extends TextElement = \"p\"> = {\n variant?: ResponsiveVariant | ResponsiveVariant[];\n color?: TextColor;\n as?: T;\n className?: string;\n children: React.ReactNode;\n weight?: Weight;\n} & HTMLPropsMap[T];\n\n// Add helper function to process variants\nconst processVariants = (\n variants: ResponsiveVariant | ResponsiveVariant[] | undefined\n): string => {\n if (!variants) return \"text-body-default\";\n\n const variantArray = Array.isArray(variants) ? variants : [variants];\n\n return variantArray\n .map((variant) => {\n if (variant.includes(\":\")) {\n const [breakpoint, typographyClass] = variant.split(\":\");\n return `${breakpoint}:text-${typographyClass}`;\n }\n return `text-${variant}`;\n })\n .join(\" \");\n};\n\nexport const Text = React.forwardRef(\n <T extends TextElement = \"p\">(\n {\n variant = \"body-default\",\n color = \"primary\",\n as,\n className,\n children,\n weight,\n ...props\n }: TextProps<T>,\n ref: React.ForwardedRef<HTMLElementByTag[T]>\n ) => {\n // Process typography classes with breakpoints\n const typographyClasses = processVariants(variant);\n\n // Get color styles\n const colorClasses = color === \"inherit\" ? \"text-inherit\" : `text-${color}`;\n\n const suggestedElement = React.useMemo(() => {\n const baseVariant =\n typeof variant === \"string\"\n ? variant.split(\":\").pop()!\n : Array.isArray(variant)\n ? variant[0].split(\":\").pop()!\n : \"body-default\";\n return getElementFromVariant(baseVariant as TypographyKey);\n }, [variant]);\n\n const Component = (as || suggestedElement) as T;\n\n return (\n // @ts-expect-error TODO: figure this out\n <Component\n ref={ref}\n className={`\n font-sans antialiased\n ${typographyClasses}\n ${colorClasses}\n ${weight && `!${fontWeight[weight]}`}\n ${className}\n `}\n {...props}\n >\n {children}\n </Component>\n );\n }\n);\n\nText.displayName = \"Text\";\n","import * as React from \"react\";\nimport { cn } from \"../utils\";\nimport { focusRingStyles, focusRingStylesCoerced } from \"../utils/tailwind\";\nimport { IconName } from \"@deckai/icons\";\nimport { Icon, IconProps } from \"./Icon\";\nimport { Text } from \"./Text\";\n\nexport type InputProps = {\n className?: string;\n end?: React.ReactNode;\n /** renders an icon in the end slot */\n iconName?: IconName;\n /** Label text for the input */\n label?: string;\n /** Additional classes for the label */\n labelClassName?: string;\n /** Forces the focus ring to show regardless of focus state */\n forceShowFocusRing?: boolean;\n /** Error state for the input */\n error?: boolean;\n /** Error message to display below the input */\n errorMessage?: string;\n /** Helper text displayed below the input */\n helperText?: string;\n /** Character count display */\n showCharacterCount?: boolean;\n /** Maximum number of characters */\n maxLength?: number;\n} & React.InputHTMLAttributes<HTMLInputElement> &\n Pick<IconProps, \"color\" | \"size\" | \"title\">;\n\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n (\n {\n className,\n end,\n iconName,\n color,\n size,\n title,\n label,\n labelClassName,\n id,\n children,\n forceShowFocusRing,\n error,\n errorMessage,\n helperText,\n showCharacterCount,\n maxLength,\n value,\n defaultValue,\n onChange,\n disabled,\n ...props\n },\n ref\n ) => {\n const [currentValue, setCurrentValue] = React.useState(\n value?.toString() || defaultValue?.toString() || \"\"\n );\n\n // Update internal value when prop changes\n React.useEffect(() => {\n if (value !== undefined) {\n setCurrentValue(value.toString());\n }\n }, [value]);\n\n const handleChange = React.useCallback(\n (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n setCurrentValue(newValue);\n onChange?.(e);\n },\n [onChange]\n );\n\n const characterCount = currentValue.length;\n const showCount = showCharacterCount || !!maxLength;\n\n return (\n <div className=\"gap-1 flex flex-col\">\n {label && (\n <Text\n variant=\"label-default\"\n htmlFor={id}\n as=\"label\"\n color={error ? \"danger\" : \"primary\"}\n className={cn(labelClassName)}\n >\n {label}\n </Text>\n )}\n <div\n className={cn(\n \"relative flex flex-col gap-2 w-full rounded-lg border bg-background-0 px-3 md:py-3 py-2 text-secondary transition-colors duration-150\",\n !error && !forceShowFocusRing && \"border-secondary-50\",\n error && \"border-tertiary-10\",\n disabled && \"cursor-not-allowed opacity-50\",\n \"focus-within:ring-2 focus-within:ring-primary-100\",\n forceShowFocusRing && focusRingStylesCoerced\n )}\n >\n <div className=\"flex relative\">\n <input\n ref={ref}\n id={id}\n className={cn(\n \"font-sans text-sm flex w-full file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-secondary text-primary disabled:cursor-not-allowed focus:outline-none rounded-lg\",\n end && \"pr-10\",\n className\n )}\n value={currentValue}\n maxLength={maxLength}\n onChange={handleChange}\n aria-invalid={error}\n disabled={disabled}\n {...props}\n />\n {(end || iconName) && (\n <div className=\"absolute inset-y-0 right-0 flex items-center\">\n {iconName ? (\n <Icon\n name={iconName}\n color={error ? \"danger\" : \"secondary\"}\n size={size}\n title={title}\n />\n ) : (\n end\n )}\n </div>\n )}\n </div>\n {children}\n </div>\n <div className=\"flex justify-between gap-2\">\n {(error && errorMessage) || helperText ? (\n <Text\n variant=\"body-xxs\"\n color={error ? \"danger\" : \"secondary\"}\n className=\"mt-1\"\n >\n {error ? errorMessage : helperText}\n </Text>\n ) : null}\n {showCount && (\n <Text\n variant=\"body-xxs\"\n color={error ? \"danger\" : \"secondary\"}\n className=\"text-right mt-1\"\n >\n <Text\n variant=\"body-xxs\"\n as=\"span\"\n color=\"primary-100\"\n className=\"font-bold\"\n >\n {characterCount}\n </Text>\n {maxLength && `/${maxLength}`} characters\n </Text>\n )}\n </div>\n </div>\n );\n }\n);\n","import React, { forwardRef, KeyboardEvent } from \"react\";\nimport { cn } from \"../utils\";\nimport { Input } from \"./Input\";\nimport type { InputProps } from \"./Input\";\n\nexport type AutocompleteInputProps = {\n value: string;\n suggestion: string;\n onChange: (value: string) => void;\n onKeyDown?: (event: KeyboardEvent<HTMLInputElement>) => void;\n \"aria-controls\"?: string;\n \"aria-activedescendant\"?: string;\n \"aria-autocomplete\"?: \"none\" | \"inline\" | \"list\" | \"both\";\n} & Omit<InputProps, \"value\" | \"onChange\" | \"onKeyDown\">;\n\nexport const AutocompleteInput = forwardRef<\n HTMLInputElement,\n AutocompleteInputProps\n>(\n (\n {\n value,\n suggestion,\n onChange,\n onKeyDown,\n className,\n \"aria-controls\": ariaControls,\n \"aria-activedescendant\": ariaActiveDescendant,\n \"aria-autocomplete\": ariaAutocomplete,\n ...props\n },\n ref\n ) => {\n return (\n <div className=\"relative w-full\">\n <Input\n ref={ref}\n value={value}\n onChange={(e) => onChange(e.target.value)}\n onKeyDown={onKeyDown}\n className={cn(\"bg-transparent\", className)}\n aria-controls={ariaControls}\n aria-activedescendant={ariaActiveDescendant}\n aria-autocomplete={ariaAutocomplete}\n {...props}\n />\n {suggestion && (\n <div className=\"absolute inset-0 top-6 flex items-center px-3 md:py-3 py-2 text-secondary opacity-40 pointer-events-none text-sm\">\n {value}\n {suggestion.slice(value.length)}\n </div>\n )}\n </div>\n );\n }\n);\n\nAutocompleteInput.displayName = \"AutocompleteInput\";\n"]}
|
|
@@ -1,28 +1,27 @@
|
|
|
1
1
|
import React__default, { KeyboardEvent } from 'react';
|
|
2
|
+
import { InputProps } from './Input.cjs';
|
|
3
|
+
import '@deckai/icons';
|
|
4
|
+
import './Icon.cjs';
|
|
5
|
+
import '../tailwind-Cl3vNM6S.cjs';
|
|
6
|
+
import '../responsive-CjR1yA5N.cjs';
|
|
2
7
|
|
|
3
8
|
type AutocompleteInputProps = {
|
|
4
9
|
value: string;
|
|
5
10
|
suggestion: string;
|
|
6
|
-
placeholder?: string;
|
|
7
11
|
onChange: (value: string) => void;
|
|
8
12
|
onKeyDown?: (event: KeyboardEvent<HTMLInputElement>) => void;
|
|
9
|
-
label?: string;
|
|
10
|
-
labelClassName?: string;
|
|
11
|
-
id?: string;
|
|
12
|
-
disabled?: boolean;
|
|
13
|
-
end?: React__default.ReactNode;
|
|
14
|
-
className?: string;
|
|
15
|
-
forceShowFocusRing?: boolean;
|
|
16
|
-
/** Error state for the input */
|
|
17
|
-
error?: boolean;
|
|
18
|
-
/** Error message to display below the input */
|
|
19
|
-
errorMessage?: string;
|
|
20
|
-
/** Helper text displayed below the input */
|
|
21
|
-
helperText?: string;
|
|
22
13
|
"aria-controls"?: string;
|
|
23
14
|
"aria-activedescendant"?: string;
|
|
24
15
|
"aria-autocomplete"?: "none" | "inline" | "list" | "both";
|
|
25
|
-
}
|
|
26
|
-
declare const AutocompleteInput: React__default.ForwardRefExoticComponent<
|
|
16
|
+
} & Omit<InputProps, "value" | "onChange" | "onKeyDown">;
|
|
17
|
+
declare const AutocompleteInput: React__default.ForwardRefExoticComponent<{
|
|
18
|
+
value: string;
|
|
19
|
+
suggestion: string;
|
|
20
|
+
onChange: (value: string) => void;
|
|
21
|
+
onKeyDown?: (event: KeyboardEvent<HTMLInputElement>) => void;
|
|
22
|
+
"aria-controls"?: string;
|
|
23
|
+
"aria-activedescendant"?: string;
|
|
24
|
+
"aria-autocomplete"?: "none" | "inline" | "list" | "both";
|
|
25
|
+
} & Omit<InputProps, "onChange" | "onKeyDown" | "value"> & React__default.RefAttributes<HTMLInputElement>>;
|
|
27
26
|
|
|
28
27
|
export { AutocompleteInput, type AutocompleteInputProps };
|
|
@@ -1,28 +1,27 @@
|
|
|
1
1
|
import React__default, { KeyboardEvent } from 'react';
|
|
2
|
+
import { InputProps } from './Input.js';
|
|
3
|
+
import '@deckai/icons';
|
|
4
|
+
import './Icon.js';
|
|
5
|
+
import '../tailwind-Cl3vNM6S.js';
|
|
6
|
+
import '../responsive-CjR1yA5N.js';
|
|
2
7
|
|
|
3
8
|
type AutocompleteInputProps = {
|
|
4
9
|
value: string;
|
|
5
10
|
suggestion: string;
|
|
6
|
-
placeholder?: string;
|
|
7
11
|
onChange: (value: string) => void;
|
|
8
12
|
onKeyDown?: (event: KeyboardEvent<HTMLInputElement>) => void;
|
|
9
|
-
label?: string;
|
|
10
|
-
labelClassName?: string;
|
|
11
|
-
id?: string;
|
|
12
|
-
disabled?: boolean;
|
|
13
|
-
end?: React__default.ReactNode;
|
|
14
|
-
className?: string;
|
|
15
|
-
forceShowFocusRing?: boolean;
|
|
16
|
-
/** Error state for the input */
|
|
17
|
-
error?: boolean;
|
|
18
|
-
/** Error message to display below the input */
|
|
19
|
-
errorMessage?: string;
|
|
20
|
-
/** Helper text displayed below the input */
|
|
21
|
-
helperText?: string;
|
|
22
13
|
"aria-controls"?: string;
|
|
23
14
|
"aria-activedescendant"?: string;
|
|
24
15
|
"aria-autocomplete"?: "none" | "inline" | "list" | "both";
|
|
25
|
-
}
|
|
26
|
-
declare const AutocompleteInput: React__default.ForwardRefExoticComponent<
|
|
16
|
+
} & Omit<InputProps, "value" | "onChange" | "onKeyDown">;
|
|
17
|
+
declare const AutocompleteInput: React__default.ForwardRefExoticComponent<{
|
|
18
|
+
value: string;
|
|
19
|
+
suggestion: string;
|
|
20
|
+
onChange: (value: string) => void;
|
|
21
|
+
onKeyDown?: (event: KeyboardEvent<HTMLInputElement>) => void;
|
|
22
|
+
"aria-controls"?: string;
|
|
23
|
+
"aria-activedescendant"?: string;
|
|
24
|
+
"aria-autocomplete"?: "none" | "inline" | "list" | "both";
|
|
25
|
+
} & Omit<InputProps, "onChange" | "onKeyDown" | "value"> & React__default.RefAttributes<HTMLInputElement>>;
|
|
27
26
|
|
|
28
27
|
export { AutocompleteInput, type AutocompleteInputProps };
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import r,{forwardRef}from'react';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';function
|
|
1
|
+
import*as r from'react';import r__default,{forwardRef}from'react';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';import {IconMap}from'@deckai/icons';function h(...e){return twMerge(clsx(e))}var C="ring-2 ring-primary-100";var T={12:"h-[12px] w-[12px]",16:"h-[16px] w-[16px]",18:"h-[18px] w-[18px]",20:"h-[20px] w-[20px]",24:"h-[24px] w-[24px]",32:"h-[32px] w-[32px]",36:"h-[36px] w-[36px]",40:"h-[40px] w-[40px]",42:"h-[42px] w-[42px]",48:"h-[48px] w-[48px]",64:"h-[64px] w-[64px]",72:"h-[72px] w-[72px]"},I={sm:{12:"sm:h-[12px] sm:w-[12px]",16:"sm:h-[16px] sm:w-[16px]",18:"sm:h-[18px] sm:w-[18px]",20:"sm:h-[20px] sm:w-[20px]",24:"sm:h-[24px] sm:w-[24px]",32:"sm:h-[32px] sm:w-[32px]",36:"sm:h-[36px] sm:w-[36px]",40:"sm:h-[40px] sm:w-[40px]",42:"sm:h-[42px] sm:w-[42px]",48:"sm:h-[48px] sm:w-[48px]",64:"sm:h-[64px] sm:w-[64px]",72:"sm:h-[72px] sm:w-[72px]"},md:{12:"md:h-[12px] md:w-[12px]",16:"md:h-[16px] md:w-[16px]",18:"md:h-[18px] md:w-[18px]",20:"md:h-[20px] md:w-[20px]",24:"md:h-[24px] md:w-[24px]",32:"md:h-[32px] md:w-[32px]",36:"md:h-[36px] md:w-[36px]",40:"md:h-[40px] md:w-[40px]",42:"md:h-[42px] md:w-[42px]",48:"md:h-[48px] md:w-[48px]",64:"md:h-[64px] md:w-[64px]",72:"md:h-[72px] md:w-[72px]"},lg:{12:"lg:h-[12px] lg:w-[12px]",16:"lg:h-[16px] lg:w-[16px]",18:"lg:h-[18px] lg:w-[18px]",20:"lg:h-[20px] lg:w-[20px]",24:"lg:h-[24px] lg:w-[24px]",32:"lg:h-[32px] lg:w-[32px]",36:"lg:h-[36px] lg:w-[36px]",40:"lg:h-[40px] lg:w-[40px]",42:"lg:h-[42px] lg:w-[42px]",48:"lg:h-[48px] lg:w-[48px]",64:"lg:h-[64px] lg:w-[64px]",72:"lg:h-[72px] lg:w-[72px]"},xl:{12:"xl:h-[12px] xl:w-[12px]",16:"xl:h-[16px] xl:w-[16px]",18:"xl:h-[18px] xl:w-[18px]",20:"xl:h-[20px] xl:w-[20px]",24:"xl:h-[24px] xl:w-[24px]",32:"xl:h-[32px] xl:w-[32px]",36:"xl:h-[36px] xl:w-[36px]",40:"xl:h-[40px] xl:w-[40px]",42:"xl:h-[42px] xl:w-[42px]",48:"xl:h-[48px] xl:w-[48px]",64:"xl:h-[64px] xl:w-[64px]",72:"xl:h-[72px] xl:w-[72px]"},"2xl":{12:"2xl:h-[12px] 2xl:w-[12px]",16:"2xl:h-[16px] 2xl:w-[16px]",18:"2xl:h-[18px] 2xl:w-[18px]",20:"2xl:h-[20px] 2xl:w-[20px]",24:"2xl:h-[24px] 2xl:w-[24px]",32:"2xl:h-[32px] 2xl:w-[32px]",36:"2xl:h-[36px] 2xl:w-[36px]",40:"2xl:h-[40px] 2xl:w-[40px]",42:"2xl:h-[42px] 2xl:w-[42px]",48:"2xl:h-[48px] 2xl:w-[48px]",64:"2xl:h-[64px] 2xl:w-[64px]",72:"2xl:h-[72px] 2xl:w-[72px]"}},g=e=>String(e),A=(e,n=24)=>{let t=[],p={};if(e===undefined){let o=g(n);o?t.push(T[o]):(p.height=`${n}px`,p.width=`${n}px`);}if(typeof e=="number"){let o=g(e);o?t.push(T[o]):(p.height=`${e}px`,p.width=`${e}px`);}if(Array.isArray(e)){let o=g(n),l=[o&&T[o]||`h-[${n}px] w-[${n}px]`];e.forEach(s=>{if(typeof s=="string"){let[a,c]=s.split(":"),i=parseInt(c,10),x=g(i);t.push(x&&I[a]?.[x]||`${a}:h-[${i}px] ${a}:w-[${i}px]`);}}),t.push(...l);}if(typeof e=="string"){let[o,l]=e.split(":"),s=parseInt(l,10),a=g(s);t.push(a&&I[o]?.[a]||`${o}:h-[${s}px] ${o}:w-[${s}px]`);}return {responsiveSizeClasses:t.join(" "),responsiveSizeStyles:p}};var k={primary:"#080808",secondary:"#666666",white:"#ffffff",primaryBlue:"#089CCB",disabled:"#888888",danger:"#FF0000"},b=r__default.forwardRef(({name:e,size:n=24,color:t="primary",title:p,className:o,style:l={},...s},a)=>{let c=IconMap[e],{responsiveSizeClasses:i,responsiveSizeStyles:x}=A(n,24);return r__default.createElement("div",{className:h("flex justify-center items-center",i,o),style:{"--icon-stroke":k[t],...x,...l}},r__default.createElement(c,{ref:a,"aria-hidden":!p,"aria-label":p,stroke:e.includes("filled")?undefined:k[t],...s}))});b.displayName="Icon";var D={xl:"h1",lg:"h1",md:"h2",sm:"h3",xs:"h4"},q=e=>{let[n,t]=e.split("-");return n==="heading"?D[t]||"p":n==="label"?"label":"p"},Q={light:"font-light",regular:"font-regular",semibold:"font-semibold",bold:"font-bold"},Z=e=>e?(Array.isArray(e)?e:[e]).map(t=>{if(t.includes(":")){let[p,o]=t.split(":");return `${p}:text-${o}`}return `text-${t}`}).join(" "):"text-body-default",d=r__default.forwardRef(({variant:e="body-default",color:n="primary",as:t,className:p,children:o,weight:l,...s},a)=>{let c=Z(e),i=n==="inherit"?"text-inherit":`text-${n}`,x=r__default.useMemo(()=>{let u=typeof e=="string"?e.split(":").pop():Array.isArray(e)?e[0].split(":").pop():"body-default";return q(u)},[e]);return r__default.createElement(t||x,{ref:a,className:`
|
|
2
2
|
font-sans antialiased
|
|
3
|
-
${
|
|
3
|
+
${c}
|
|
4
4
|
${i}
|
|
5
|
-
${
|
|
6
|
-
${
|
|
7
|
-
`,...
|
|
5
|
+
${l&&`!${Q[l]}`}
|
|
6
|
+
${p}
|
|
7
|
+
`,...s},o)});d.displayName="Text";var N=r.forwardRef(({className:e,end:n,iconName:t,color:p,size:o,title:l,label:s,labelClassName:a,id:c,children:i,forceShowFocusRing:x,error:m,errorMessage:u,helperText:M,showCharacterCount:P,maxLength:y,value:f,defaultValue:V,onChange:v,disabled:L,...K},B)=>{let[R,$]=r.useState(f?.toString()||V?.toString()||"");r.useEffect(()=>{f!==undefined&&$(f.toString());},[f]);let O=r.useCallback(S=>{let G=S.target.value;$(G),v?.(S);},[v]),j=R.length,z=P||!!y;return r.createElement("div",{className:"gap-1 flex flex-col"},s&&r.createElement(d,{variant:"label-default",htmlFor:c,as:"label",color:m?"danger":"primary",className:h(a)},s),r.createElement("div",{className:h("relative flex flex-col gap-2 w-full rounded-lg border bg-background-0 px-3 md:py-3 py-2 text-secondary transition-colors duration-150",!m&&!x&&"border-secondary-50",m&&"border-tertiary-10",L&&"cursor-not-allowed opacity-50","focus-within:ring-2 focus-within:ring-primary-100",x&&C)},r.createElement("div",{className:"flex relative"},r.createElement("input",{ref:B,id:c,className:h("font-sans text-sm flex w-full file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-secondary text-primary disabled:cursor-not-allowed focus:outline-none rounded-lg",n&&"pr-10",e),value:R,maxLength:y,onChange:O,"aria-invalid":m,disabled:L,...K}),(n||t)&&r.createElement("div",{className:"absolute inset-y-0 right-0 flex items-center"},t?r.createElement(b,{name:t,color:m?"danger":"secondary",size:o,title:l}):n)),i),r.createElement("div",{className:"flex justify-between gap-2"},m&&u||M?r.createElement(d,{variant:"body-xxs",color:m?"danger":"secondary",className:"mt-1"},m?u:M):null,z&&r.createElement(d,{variant:"body-xxs",color:m?"danger":"secondary",className:"text-right mt-1"},r.createElement(d,{variant:"body-xxs",as:"span",color:"primary-100",className:"font-bold"},j),y&&`/${y}`," characters")))});var U=forwardRef(({value:e,suggestion:n,onChange:t,onKeyDown:p,className:o,"aria-controls":l,"aria-activedescendant":s,"aria-autocomplete":a,...c},i)=>r__default.createElement("div",{className:"relative w-full"},r__default.createElement(N,{ref:i,value:e,onChange:x=>t(x.target.value),onKeyDown:p,className:h("bg-transparent",o),"aria-controls":l,"aria-activedescendant":s,"aria-autocomplete":a,...c}),n&&r__default.createElement("div",{className:"absolute inset-0 top-6 flex items-center px-3 md:py-3 py-2 text-secondary opacity-40 pointer-events-none text-sm"},e,n.slice(e.length))));U.displayName="AutocompleteInput";export{U as AutocompleteInput};//# sourceMappingURL=AutocompleteInput.js.map
|
|
8
8
|
//# sourceMappingURL=AutocompleteInput.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/utils/index.ts","../../src/components/Text.tsx","../../src/components/AutocompleteInput.tsx"],"names":["cn","inputs","twMerge","clsx","HEADING_ELEMENT_MAP","getElementFromVariant","variant","category","size","fontWeight","processVariants","variants","breakpoint","typographyClass","Text","React","color","as","className","children","weight","props","ref","typographyClasses","colorClasses","suggestedElement","baseVariant","AutocompleteInput","forwardRef","value","suggestion","placeholder","onChange","onKeyDown","label","labelClassName","id","disabled","end","forceShowFocusRing","error","errorMessage","helperText","ariaControls","ariaActiveDescendant","ariaAutocomplete","e"],"mappings":"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","file":"AutocompleteInput.js","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\nexport const noopFn = () => {};\n","import React from \"react\";\nimport { Typography } from \"../types/tailwind\";\n\ntype TextElement =\n | \"p\"\n | \"span\"\n | \"h1\"\n | \"h2\"\n | \"h3\"\n | \"h4\"\n | \"h5\"\n | \"h6\"\n | \"strong\"\n | \"em\"\n | \"blockquote\"\n | \"pre\"\n | \"code\"\n | \"small\"\n | \"label\"\n | \"a\";\n\n// HTML element mapping type\ntype HTMLElementByTag = {\n p: HTMLParagraphElement;\n span: HTMLSpanElement;\n h1: HTMLHeadingElement;\n h2: HTMLHeadingElement;\n h3: HTMLHeadingElement;\n h4: HTMLHeadingElement;\n h5: HTMLHeadingElement;\n h6: HTMLHeadingElement;\n strong: HTMLElement;\n em: HTMLElement;\n blockquote: HTMLQuoteElement;\n pre: HTMLPreElement;\n code: HTMLElement;\n small: HTMLElement;\n label: HTMLLabelElement;\n a: HTMLAnchorElement;\n};\n\n// HTML props mapping type\ntype HTMLPropsMap = {\n p: React.HTMLAttributes<HTMLParagraphElement>;\n span: React.HTMLAttributes<HTMLSpanElement>;\n h1: React.HTMLAttributes<HTMLHeadingElement>;\n h2: React.HTMLAttributes<HTMLHeadingElement>;\n h3: React.HTMLAttributes<HTMLHeadingElement>;\n h4: React.HTMLAttributes<HTMLHeadingElement>;\n h5: React.HTMLAttributes<HTMLHeadingElement>;\n h6: React.HTMLAttributes<HTMLHeadingElement>;\n strong: React.HTMLAttributes<HTMLElement>;\n em: React.HTMLAttributes<HTMLElement>;\n blockquote: React.HTMLAttributes<HTMLQuoteElement>;\n pre: React.HTMLAttributes<HTMLPreElement>;\n code: React.HTMLAttributes<HTMLElement>;\n small: React.HTMLAttributes<HTMLElement>;\n label: React.LabelHTMLAttributes<HTMLLabelElement>;\n a: Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, \"color\">;\n};\n\ntype TextColor =\n | \"primary\"\n | \"secondary\"\n | \"white\"\n | \"primary-blue\"\n | \"disabled\"\n | \"danger\"\n | \"inherit\"\n | \"primary-100\";\n\nconst HEADING_ELEMENT_MAP: Record<string, TextElement> = {\n xl: \"h1\",\n lg: \"h1\",\n md: \"h2\",\n sm: \"h3\",\n xs: \"h4\"\n};\n\nconst getElementFromVariant = (variant: TypographyKey): TextElement => {\n const [category, size] = variant.split(\"-\");\n\n if (category === \"heading\") {\n return HEADING_ELEMENT_MAP[size] || \"p\";\n }\n\n if (category === \"label\") {\n return \"label\";\n }\n\n return \"p\";\n};\n\ntype Weight = \"light\" | \"regular\" | \"semibold\" | \"bold\";\n\nconst fontWeight: Record<Weight, string> = {\n light: \"font-light\",\n regular: \"font-regular\",\n semibold: \"font-semibold\",\n bold: \"font-bold\"\n};\n\n// Add breakpoint types\ntype Breakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\ntype ResponsiveVariant = TypographyKey | `${Breakpoint}:${TypographyKey}`;\n\ntype TypographyCategory = keyof Typography;\ntype TypographyValue<T extends TypographyCategory> = Extract<\n keyof Typography[T],\n string | number | bigint | boolean | null | undefined\n>;\ntype TypographyKey = {\n [T in TypographyCategory]: `${T}-${TypographyValue<T>}`;\n}[TypographyCategory];\n\n// Update TextProps to use ResponsiveVariant\nexport type TextProps<T extends TextElement = \"p\"> = {\n variant?: ResponsiveVariant | ResponsiveVariant[];\n color?: TextColor;\n as?: T;\n className?: string;\n children: React.ReactNode;\n weight?: Weight;\n} & HTMLPropsMap[T];\n\n// Add helper function to process variants\nconst processVariants = (\n variants: ResponsiveVariant | ResponsiveVariant[] | undefined\n): string => {\n if (!variants) return \"text-body-default\";\n\n const variantArray = Array.isArray(variants) ? variants : [variants];\n\n return variantArray\n .map((variant) => {\n if (variant.includes(\":\")) {\n const [breakpoint, typographyClass] = variant.split(\":\");\n return `${breakpoint}:text-${typographyClass}`;\n }\n return `text-${variant}`;\n })\n .join(\" \");\n};\n\nexport const Text = React.forwardRef(\n <T extends TextElement = \"p\">(\n {\n variant = \"body-default\",\n color = \"primary\",\n as,\n className,\n children,\n weight,\n ...props\n }: TextProps<T>,\n ref: React.ForwardedRef<HTMLElementByTag[T]>\n ) => {\n // Process typography classes with breakpoints\n const typographyClasses = processVariants(variant);\n\n // Get color styles\n const colorClasses = color === \"inherit\" ? \"text-inherit\" : `text-${color}`;\n\n const suggestedElement = React.useMemo(() => {\n const baseVariant =\n typeof variant === \"string\"\n ? variant.split(\":\").pop()!\n : Array.isArray(variant)\n ? variant[0].split(\":\").pop()!\n : \"body-default\";\n return getElementFromVariant(baseVariant as TypographyKey);\n }, [variant]);\n\n const Component = (as || suggestedElement) as T;\n\n return (\n // @ts-expect-error TODO: figure this out\n <Component\n ref={ref}\n className={`\n font-sans antialiased\n ${typographyClasses}\n ${colorClasses}\n ${weight && `!${fontWeight[weight]}`}\n ${className}\n `}\n {...props}\n >\n {children}\n </Component>\n );\n }\n);\n\nText.displayName = \"Text\";\n","import React, { forwardRef, KeyboardEvent } from \"react\";\nimport { cn } from \"../utils\";\nimport { Text } from \"./Text\";\n\nexport type AutocompleteInputProps = {\n value: string;\n suggestion: string;\n placeholder?: string;\n onChange: (value: string) => void;\n onKeyDown?: (event: KeyboardEvent<HTMLInputElement>) => void;\n label?: string;\n labelClassName?: string;\n id?: string;\n disabled?: boolean;\n end?: React.ReactNode;\n className?: string;\n forceShowFocusRing?: boolean;\n /** Error state for the input */\n error?: boolean;\n /** Error message to display below the input */\n errorMessage?: string;\n /** Helper text displayed below the input */\n helperText?: string;\n \"aria-controls\"?: string;\n \"aria-activedescendant\"?: string;\n \"aria-autocomplete\"?: \"none\" | \"inline\" | \"list\" | \"both\";\n};\n\nexport const AutocompleteInput = forwardRef<\n HTMLInputElement,\n AutocompleteInputProps\n>(\n (\n {\n value,\n suggestion,\n placeholder,\n onChange,\n onKeyDown,\n label,\n labelClassName,\n id,\n disabled,\n end,\n className,\n forceShowFocusRing,\n error,\n errorMessage,\n helperText,\n \"aria-controls\": ariaControls,\n \"aria-activedescendant\": ariaActiveDescendant,\n \"aria-autocomplete\": ariaAutocomplete\n },\n ref\n ) => {\n return (\n <div className=\"gap-1 flex flex-col\">\n {label && (\n <Text\n variant=\"label-default\"\n htmlFor={id}\n as=\"label\"\n color={error ? \"danger\" : \"primary\"}\n className={cn(labelClassName)}\n >\n {label}\n </Text>\n )}\n <div\n className={cn(\n \"relative flex flex-col gap-2 w-full rounded-lg border bg-background-0 px-3 md:py-3 py-2 text-secondary ring-offset-background disabled:opacity-50\",\n {\n \"border-secondary-50\": !error,\n \"border-tertiary-10\": error,\n \"ring-2 ring-offset-2\": forceShowFocusRing,\n \"focus-within:ring-2 focus-within:ring-offset-2\":\n !forceShowFocusRing\n },\n className\n )}\n >\n <div className=\"flex relative\">\n <div className=\"relative w-full\">\n <input\n ref={ref}\n id={id}\n value={value}\n onChange={(e) => onChange(e.target.value)}\n onKeyDown={onKeyDown}\n disabled={disabled}\n placeholder={placeholder}\n className={cn(\n \"font-sans text-sm flex w-full file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-secondary text-primary disabled:cursor-not-allowed focus:outline-none bg-transparent\",\n end && \"pr-10\"\n )}\n aria-invalid={error}\n aria-controls={ariaControls}\n aria-activedescendant={ariaActiveDescendant}\n aria-autocomplete={ariaAutocomplete}\n />\n {suggestion && (\n <div className=\"absolute inset-0 text-secondary opacity-40 pointer-events-none text-sm\">\n {value}\n {suggestion.slice(value.length)}\n </div>\n )}\n </div>\n {end && (\n <div className=\"absolute inset-y-0 right-0 flex items-center\">\n {end}\n </div>\n )}\n </div>\n </div>\n {(error && errorMessage) || helperText ? (\n <Text\n variant=\"body-xxs\"\n color={error ? \"danger\" : \"secondary\"}\n className=\"mt-1\"\n >\n {error ? errorMessage : helperText}\n </Text>\n ) : null}\n </div>\n );\n }\n);\n\nAutocompleteInput.displayName = \"AutocompleteInput\";\n"]}
|
|
1
|
+
{"version":3,"sources":["../../src/utils/index.ts","../../src/utils/tailwind.ts","../../src/components/Icon.tsx","../../src/utils/responsive.ts","../../src/components/Text.tsx","../../src/components/Input.tsx","../../src/components/AutocompleteInput.tsx"],"names":["cn","inputs","twMerge","clsx","focusRingStylesCoerced","BASE_SIZES","RESPONSIVE_SIZES","getSizeKey","size","getResponsiveSize","baseSize","classes","styles","key","baseKey","responsiveClasses","breakpoint","valueStr","value","valueKey","COLOR_MAP","Icon","React","name","color","title","className","style","props","ref","IconComponent","IconMap","responsiveSizeClasses","responsiveSizeStyles","HEADING_ELEMENT_MAP","getElementFromVariant","variant","category","fontWeight","processVariants","variants","typographyClass","Text","as","children","weight","typographyClasses","colorClasses","suggestedElement","baseVariant","Input","end","iconName","label","labelClassName","id","forceShowFocusRing","error","errorMessage","helperText","showCharacterCount","maxLength","defaultValue","onChange","disabled","currentValue","setCurrentValue","handleChange","e","newValue","characterCount","showCount","AutocompleteInput","forwardRef","suggestion","onKeyDown","ariaControls","ariaActiveDescendant","ariaAutocomplete"],"mappings":"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","file":"AutocompleteInput.js","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\nexport const noopFn = () => {};\n","import { Colors, Typography } from \"../types/tailwind\";\n\n// Generate safelist patterns for all color utilities so you can use any theme color variable in your code\nexport const generateSafelist = (colors: Colors, typography: Typography) => {\n const colorNames = Object.keys(colors) as (keyof Colors)[];\n const utilities = [\"bg\", \"text\", \"border\", \"ring\", \"divide\", \"outline\"];\n const variants = [\"hover:\", \"focus:\", \"active:\", \"disabled:\"];\n const breakpoints = [\"sm\", \"md\", \"lg\", \"xl\", \"2xl\"];\n const sizes = [\"24\", \"42\", \"48\", \"64\", \"72\"]; // Add all the sizes you need\n\n const safelist: (string | { pattern: RegExp; variants: string[] })[] = [];\n\n colorNames.forEach((colorName) => {\n if (typeof colors[colorName] === \"object\") {\n // Handle nested color objects (with number keys)\n Object.keys(colors[colorName]).forEach((shade) => {\n utilities.forEach((utility) => {\n // Base utility\n safelist.push(`${utility}-${colorName}-${shade}`);\n\n // Variant utilities\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}-${shade}`);\n });\n });\n });\n } else {\n // Handle direct color values\n utilities.forEach((utility) => {\n safelist.push(`${utility}-${colorName}`);\n\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}`);\n });\n });\n }\n });\n\n // Generate typography classes\n Object.entries(typography).forEach(([family, sizes]) => {\n Object.keys(sizes).forEach((size) => {\n // Base typography classes\n safelist.push(`text-${family}-${size}`);\n\n // Add variants\n variants.forEach((variant) => {\n safelist.push(`${variant}text-${family}-${size}`);\n });\n });\n });\n\n const typographyClasses = Object.entries(typography).flatMap(\n ([category, sizes]) =>\n Object.keys(sizes).map((size) => `text-${category}-${size}`)\n );\n\n // Generate responsive variants\n const responsiveTypographyClasses = typographyClasses.flatMap((className) =>\n breakpoints.map((breakpoint) => `${breakpoint}:${className}`)\n );\n\n // Generate size classes with responsive variants\n const sizeClasses = sizes.flatMap((size) => [\n `h-[${size}px]`,\n `w-[${size}px]`,\n ...breakpoints.flatMap((bp) => [\n `${bp}:h-[${size}px]`,\n `${bp}:w-[${size}px]`\n ])\n ]);\n\n return [...typographyClasses, ...responsiveTypographyClasses, ...sizeClasses];\n};\n\nexport const focusRingStyles =\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-100\";\nexport const focusRingWithinStyles =\n \"focus-within:outline-none focus-within:ring-2 focus-within:ring-primary-100\";\nexport const focusRingStylesCoerced = \"ring-2 ring-primary-100\";\n","import { IconMap, IconName } from \"@deckai/icons\";\nimport React, { SVGProps } from \"react\";\nimport { IconColors } from \"../types/tailwind\";\nimport { cn } from \"../utils\";\nimport { ResponsiveSize, getResponsiveSize } from \"../utils/responsive\";\n\nexport type IconProps = {\n name: IconName;\n /** @default 24 */\n size?: ResponsiveSize | ResponsiveSize[];\n /** @default primary */\n color?: IconColors;\n title?: string;\n className?: string;\n style?: React.CSSProperties;\n} & Omit<SVGProps<SVGSVGElement>, \"aria-hidden\" | \"aria-label\">;\n\nconst COLOR_MAP: Record<IconColors, string> = {\n primary: \"#080808\",\n secondary: \"#666666\",\n white: \"#ffffff\",\n primaryBlue: \"#089CCB\",\n disabled: \"#888888\",\n danger: \"#FF0000\"\n};\n\nexport const Icon = React.forwardRef<SVGSVGElement, IconProps>(\n (\n {\n name,\n size = 24,\n color = \"primary\",\n title,\n className,\n style = {},\n ...props\n },\n ref\n ) => {\n const IconComponent = IconMap[name];\n const { responsiveSizeClasses, responsiveSizeStyles } = getResponsiveSize(\n size,\n 24\n );\n\n return (\n <div\n className={cn(\n \"flex justify-center items-center\",\n responsiveSizeClasses,\n className\n )}\n style={{\n [\"--icon-stroke\" as string]: COLOR_MAP[color],\n ...responsiveSizeStyles,\n ...style\n }}\n >\n <IconComponent\n ref={ref}\n aria-hidden={!title}\n aria-label={title}\n stroke={name.includes(\"filled\") ? undefined : COLOR_MAP[color]}\n {...props}\n />\n </div>\n );\n }\n);\n\nIcon.displayName = \"Icon\";\n","export type Breakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\nexport type ResponsiveSize = number | `${Breakpoint}:${number}`;\n\ntype SizeKey =\n | \"12\"\n | \"16\"\n | \"18\"\n | \"20\"\n | \"24\"\n | \"32\"\n | \"36\"\n | \"40\"\n | \"42\"\n | \"48\"\n | \"64\"\n | \"72\";\n\n// These constants help Tailwind identify the classes during compilation\nconst BASE_SIZES: Record<SizeKey, string> = {\n \"12\": \"h-[12px] w-[12px]\",\n \"16\": \"h-[16px] w-[16px]\",\n \"18\": \"h-[18px] w-[18px]\",\n \"20\": \"h-[20px] w-[20px]\",\n \"24\": \"h-[24px] w-[24px]\",\n \"32\": \"h-[32px] w-[32px]\",\n \"36\": \"h-[36px] w-[36px]\",\n \"40\": \"h-[40px] w-[40px]\",\n \"42\": \"h-[42px] w-[42px]\",\n \"48\": \"h-[48px] w-[48px]\",\n \"64\": \"h-[64px] w-[64px]\",\n \"72\": \"h-[72px] w-[72px]\"\n};\n\nconst RESPONSIVE_SIZES: Record<Breakpoint, Record<SizeKey, string>> = {\n sm: {\n \"12\": \"sm:h-[12px] sm:w-[12px]\",\n \"16\": \"sm:h-[16px] sm:w-[16px]\",\n \"18\": \"sm:h-[18px] sm:w-[18px]\",\n \"20\": \"sm:h-[20px] sm:w-[20px]\",\n \"24\": \"sm:h-[24px] sm:w-[24px]\",\n \"32\": \"sm:h-[32px] sm:w-[32px]\",\n \"36\": \"sm:h-[36px] sm:w-[36px]\",\n \"40\": \"sm:h-[40px] sm:w-[40px]\",\n \"42\": \"sm:h-[42px] sm:w-[42px]\",\n \"48\": \"sm:h-[48px] sm:w-[48px]\",\n \"64\": \"sm:h-[64px] sm:w-[64px]\",\n \"72\": \"sm:h-[72px] sm:w-[72px]\"\n },\n md: {\n \"12\": \"md:h-[12px] md:w-[12px]\",\n \"16\": \"md:h-[16px] md:w-[16px]\",\n \"18\": \"md:h-[18px] md:w-[18px]\",\n \"20\": \"md:h-[20px] md:w-[20px]\",\n \"24\": \"md:h-[24px] md:w-[24px]\",\n \"32\": \"md:h-[32px] md:w-[32px]\",\n \"36\": \"md:h-[36px] md:w-[36px]\",\n \"40\": \"md:h-[40px] md:w-[40px]\",\n \"42\": \"md:h-[42px] md:w-[42px]\",\n \"48\": \"md:h-[48px] md:w-[48px]\",\n \"64\": \"md:h-[64px] md:w-[64px]\",\n \"72\": \"md:h-[72px] md:w-[72px]\"\n },\n lg: {\n \"12\": \"lg:h-[12px] lg:w-[12px]\",\n \"16\": \"lg:h-[16px] lg:w-[16px]\",\n \"18\": \"lg:h-[18px] lg:w-[18px]\",\n \"20\": \"lg:h-[20px] lg:w-[20px]\",\n \"24\": \"lg:h-[24px] lg:w-[24px]\",\n \"32\": \"lg:h-[32px] lg:w-[32px]\",\n \"36\": \"lg:h-[36px] lg:w-[36px]\",\n \"40\": \"lg:h-[40px] lg:w-[40px]\",\n \"42\": \"lg:h-[42px] lg:w-[42px]\",\n \"48\": \"lg:h-[48px] lg:w-[48px]\",\n \"64\": \"lg:h-[64px] lg:w-[64px]\",\n \"72\": \"lg:h-[72px] lg:w-[72px]\"\n },\n xl: {\n \"12\": \"xl:h-[12px] xl:w-[12px]\",\n \"16\": \"xl:h-[16px] xl:w-[16px]\",\n \"18\": \"xl:h-[18px] xl:w-[18px]\",\n \"20\": \"xl:h-[20px] xl:w-[20px]\",\n \"24\": \"xl:h-[24px] xl:w-[24px]\",\n \"32\": \"xl:h-[32px] xl:w-[32px]\",\n \"36\": \"xl:h-[36px] xl:w-[36px]\",\n \"40\": \"xl:h-[40px] xl:w-[40px]\",\n \"42\": \"xl:h-[42px] xl:w-[42px]\",\n \"48\": \"xl:h-[48px] xl:w-[48px]\",\n \"64\": \"xl:h-[64px] xl:w-[64px]\",\n \"72\": \"xl:h-[72px] xl:w-[72px]\"\n },\n \"2xl\": {\n \"12\": \"2xl:h-[12px] 2xl:w-[12px]\",\n \"16\": \"2xl:h-[16px] 2xl:w-[16px]\",\n \"18\": \"2xl:h-[18px] 2xl:w-[18px]\",\n \"20\": \"2xl:h-[20px] 2xl:w-[20px]\",\n \"24\": \"2xl:h-[24px] 2xl:w-[24px]\",\n \"32\": \"2xl:h-[32px] 2xl:w-[32px]\",\n \"36\": \"2xl:h-[36px] 2xl:w-[36px]\",\n \"40\": \"2xl:h-[40px] 2xl:w-[40px]\",\n \"42\": \"2xl:h-[42px] 2xl:w-[42px]\",\n \"48\": \"2xl:h-[48px] 2xl:w-[48px]\",\n \"64\": \"2xl:h-[64px] 2xl:w-[64px]\",\n \"72\": \"2xl:h-[72px] 2xl:w-[72px]\"\n }\n};\n\nconst getSizeKey = (size: number): SizeKey | undefined => {\n return String(size) as SizeKey;\n};\n\nexport const getResponsiveSize = (\n size: ResponsiveSize | ResponsiveSize[] | undefined,\n baseSize: number = 24\n): {\n responsiveSizeClasses: string;\n responsiveSizeStyles: Record<string, string>;\n} => {\n const classes: string[] = [];\n const styles: Record<string, string> = {};\n\n // If no size provided, use baseSize\n if (size === undefined) {\n const key = getSizeKey(baseSize);\n if (key) {\n classes.push(BASE_SIZES[key]);\n } else {\n styles.height = `${baseSize}px`;\n styles.width = `${baseSize}px`;\n }\n }\n\n // If size is a number, use that directly\n if (typeof size === \"number\") {\n const key = getSizeKey(size);\n if (key) {\n classes.push(BASE_SIZES[key]);\n } else {\n styles.height = `${size}px`;\n styles.width = `${size}px`;\n }\n }\n\n // If array of responsive sizes, generate responsive classes\n if (Array.isArray(size)) {\n const baseKey = getSizeKey(baseSize);\n const responsiveClasses = [\n (baseKey && BASE_SIZES[baseKey]) || `h-[${baseSize}px] w-[${baseSize}px]`\n ];\n\n size.forEach((s) => {\n if (typeof s === \"string\") {\n const [breakpoint, valueStr] = s.split(\":\") as [Breakpoint, string];\n const value = parseInt(valueStr, 10);\n const key = getSizeKey(value);\n classes.push(\n (key && RESPONSIVE_SIZES[breakpoint]?.[key]) ||\n `${breakpoint}:h-[${value}px] ${breakpoint}:w-[${value}px]`\n );\n }\n });\n\n classes.push(...responsiveClasses);\n }\n\n if (typeof size === \"string\") {\n const [breakpoint, valueStr] = size.split(\":\") as [Breakpoint, string];\n const value = parseInt(valueStr, 10);\n const valueKey = getSizeKey(value);\n classes.push(\n (valueKey && RESPONSIVE_SIZES[breakpoint]?.[valueKey]) ||\n `${breakpoint}:h-[${value}px] ${breakpoint}:w-[${value}px]`\n );\n }\n\n return {\n responsiveSizeClasses: classes.join(\" \"),\n responsiveSizeStyles: styles\n };\n};\n","import React from \"react\";\nimport { Typography } from \"../types/tailwind\";\nimport { Breakpoint } from \"../utils/responsive\";\n\ntype TextElement =\n | \"p\"\n | \"span\"\n | \"h1\"\n | \"h2\"\n | \"h3\"\n | \"h4\"\n | \"h5\"\n | \"h6\"\n | \"strong\"\n | \"em\"\n | \"blockquote\"\n | \"pre\"\n | \"code\"\n | \"small\"\n | \"label\"\n | \"a\";\n\n// HTML element mapping type\ntype HTMLElementByTag = {\n p: HTMLParagraphElement;\n span: HTMLSpanElement;\n h1: HTMLHeadingElement;\n h2: HTMLHeadingElement;\n h3: HTMLHeadingElement;\n h4: HTMLHeadingElement;\n h5: HTMLHeadingElement;\n h6: HTMLHeadingElement;\n strong: HTMLElement;\n em: HTMLElement;\n blockquote: HTMLQuoteElement;\n pre: HTMLPreElement;\n code: HTMLElement;\n small: HTMLElement;\n label: HTMLLabelElement;\n a: HTMLAnchorElement;\n};\n\n// HTML props mapping type\ntype HTMLPropsMap = {\n p: React.HTMLAttributes<HTMLParagraphElement>;\n span: React.HTMLAttributes<HTMLSpanElement>;\n h1: React.HTMLAttributes<HTMLHeadingElement>;\n h2: React.HTMLAttributes<HTMLHeadingElement>;\n h3: React.HTMLAttributes<HTMLHeadingElement>;\n h4: React.HTMLAttributes<HTMLHeadingElement>;\n h5: React.HTMLAttributes<HTMLHeadingElement>;\n h6: React.HTMLAttributes<HTMLHeadingElement>;\n strong: React.HTMLAttributes<HTMLElement>;\n em: React.HTMLAttributes<HTMLElement>;\n blockquote: React.HTMLAttributes<HTMLQuoteElement>;\n pre: React.HTMLAttributes<HTMLPreElement>;\n code: React.HTMLAttributes<HTMLElement>;\n small: React.HTMLAttributes<HTMLElement>;\n label: React.LabelHTMLAttributes<HTMLLabelElement>;\n a: Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, \"color\">;\n};\n\ntype TextColor =\n | \"primary\"\n | \"secondary\"\n | \"white\"\n | \"primary-blue\"\n | \"disabled\"\n | \"danger\"\n | \"inherit\"\n | \"primary-100\";\n\nconst HEADING_ELEMENT_MAP: Record<string, TextElement> = {\n xl: \"h1\",\n lg: \"h1\",\n md: \"h2\",\n sm: \"h3\",\n xs: \"h4\"\n};\n\nconst getElementFromVariant = (variant: TypographyKey): TextElement => {\n const [category, size] = variant.split(\"-\");\n\n if (category === \"heading\") {\n return HEADING_ELEMENT_MAP[size] || \"p\";\n }\n\n if (category === \"label\") {\n return \"label\";\n }\n\n return \"p\";\n};\n\ntype Weight = \"light\" | \"regular\" | \"semibold\" | \"bold\";\n\nconst fontWeight: Record<Weight, string> = {\n light: \"font-light\",\n regular: \"font-regular\",\n semibold: \"font-semibold\",\n bold: \"font-bold\"\n};\n\ntype ResponsiveVariant = TypographyKey | `${Breakpoint}:${TypographyKey}`;\n\ntype TypographyCategory = keyof Typography;\ntype TypographyValue<T extends TypographyCategory> = Extract<\n keyof Typography[T],\n string | number | bigint | boolean | null | undefined\n>;\ntype TypographyKey = {\n [T in TypographyCategory]: `${T}-${TypographyValue<T>}`;\n}[TypographyCategory];\n\n// Update TextProps to use ResponsiveVariant\nexport type TextProps<T extends TextElement = \"p\"> = {\n variant?: ResponsiveVariant | ResponsiveVariant[];\n color?: TextColor;\n as?: T;\n className?: string;\n children: React.ReactNode;\n weight?: Weight;\n} & HTMLPropsMap[T];\n\n// Add helper function to process variants\nconst processVariants = (\n variants: ResponsiveVariant | ResponsiveVariant[] | undefined\n): string => {\n if (!variants) return \"text-body-default\";\n\n const variantArray = Array.isArray(variants) ? variants : [variants];\n\n return variantArray\n .map((variant) => {\n if (variant.includes(\":\")) {\n const [breakpoint, typographyClass] = variant.split(\":\");\n return `${breakpoint}:text-${typographyClass}`;\n }\n return `text-${variant}`;\n })\n .join(\" \");\n};\n\nexport const Text = React.forwardRef(\n <T extends TextElement = \"p\">(\n {\n variant = \"body-default\",\n color = \"primary\",\n as,\n className,\n children,\n weight,\n ...props\n }: TextProps<T>,\n ref: React.ForwardedRef<HTMLElementByTag[T]>\n ) => {\n // Process typography classes with breakpoints\n const typographyClasses = processVariants(variant);\n\n // Get color styles\n const colorClasses = color === \"inherit\" ? \"text-inherit\" : `text-${color}`;\n\n const suggestedElement = React.useMemo(() => {\n const baseVariant =\n typeof variant === \"string\"\n ? variant.split(\":\").pop()!\n : Array.isArray(variant)\n ? variant[0].split(\":\").pop()!\n : \"body-default\";\n return getElementFromVariant(baseVariant as TypographyKey);\n }, [variant]);\n\n const Component = (as || suggestedElement) as T;\n\n return (\n // @ts-expect-error TODO: figure this out\n <Component\n ref={ref}\n className={`\n font-sans antialiased\n ${typographyClasses}\n ${colorClasses}\n ${weight && `!${fontWeight[weight]}`}\n ${className}\n `}\n {...props}\n >\n {children}\n </Component>\n );\n }\n);\n\nText.displayName = \"Text\";\n","import * as React from \"react\";\nimport { cn } from \"../utils\";\nimport { focusRingStyles, focusRingStylesCoerced } from \"../utils/tailwind\";\nimport { IconName } from \"@deckai/icons\";\nimport { Icon, IconProps } from \"./Icon\";\nimport { Text } from \"./Text\";\n\nexport type InputProps = {\n className?: string;\n end?: React.ReactNode;\n /** renders an icon in the end slot */\n iconName?: IconName;\n /** Label text for the input */\n label?: string;\n /** Additional classes for the label */\n labelClassName?: string;\n /** Forces the focus ring to show regardless of focus state */\n forceShowFocusRing?: boolean;\n /** Error state for the input */\n error?: boolean;\n /** Error message to display below the input */\n errorMessage?: string;\n /** Helper text displayed below the input */\n helperText?: string;\n /** Character count display */\n showCharacterCount?: boolean;\n /** Maximum number of characters */\n maxLength?: number;\n} & React.InputHTMLAttributes<HTMLInputElement> &\n Pick<IconProps, \"color\" | \"size\" | \"title\">;\n\nexport const Input = React.forwardRef<HTMLInputElement, InputProps>(\n (\n {\n className,\n end,\n iconName,\n color,\n size,\n title,\n label,\n labelClassName,\n id,\n children,\n forceShowFocusRing,\n error,\n errorMessage,\n helperText,\n showCharacterCount,\n maxLength,\n value,\n defaultValue,\n onChange,\n disabled,\n ...props\n },\n ref\n ) => {\n const [currentValue, setCurrentValue] = React.useState(\n value?.toString() || defaultValue?.toString() || \"\"\n );\n\n // Update internal value when prop changes\n React.useEffect(() => {\n if (value !== undefined) {\n setCurrentValue(value.toString());\n }\n }, [value]);\n\n const handleChange = React.useCallback(\n (e: React.ChangeEvent<HTMLInputElement>) => {\n const newValue = e.target.value;\n setCurrentValue(newValue);\n onChange?.(e);\n },\n [onChange]\n );\n\n const characterCount = currentValue.length;\n const showCount = showCharacterCount || !!maxLength;\n\n return (\n <div className=\"gap-1 flex flex-col\">\n {label && (\n <Text\n variant=\"label-default\"\n htmlFor={id}\n as=\"label\"\n color={error ? \"danger\" : \"primary\"}\n className={cn(labelClassName)}\n >\n {label}\n </Text>\n )}\n <div\n className={cn(\n \"relative flex flex-col gap-2 w-full rounded-lg border bg-background-0 px-3 md:py-3 py-2 text-secondary transition-colors duration-150\",\n !error && !forceShowFocusRing && \"border-secondary-50\",\n error && \"border-tertiary-10\",\n disabled && \"cursor-not-allowed opacity-50\",\n \"focus-within:ring-2 focus-within:ring-primary-100\",\n forceShowFocusRing && focusRingStylesCoerced\n )}\n >\n <div className=\"flex relative\">\n <input\n ref={ref}\n id={id}\n className={cn(\n \"font-sans text-sm flex w-full file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-secondary text-primary disabled:cursor-not-allowed focus:outline-none rounded-lg\",\n end && \"pr-10\",\n className\n )}\n value={currentValue}\n maxLength={maxLength}\n onChange={handleChange}\n aria-invalid={error}\n disabled={disabled}\n {...props}\n />\n {(end || iconName) && (\n <div className=\"absolute inset-y-0 right-0 flex items-center\">\n {iconName ? (\n <Icon\n name={iconName}\n color={error ? \"danger\" : \"secondary\"}\n size={size}\n title={title}\n />\n ) : (\n end\n )}\n </div>\n )}\n </div>\n {children}\n </div>\n <div className=\"flex justify-between gap-2\">\n {(error && errorMessage) || helperText ? (\n <Text\n variant=\"body-xxs\"\n color={error ? \"danger\" : \"secondary\"}\n className=\"mt-1\"\n >\n {error ? errorMessage : helperText}\n </Text>\n ) : null}\n {showCount && (\n <Text\n variant=\"body-xxs\"\n color={error ? \"danger\" : \"secondary\"}\n className=\"text-right mt-1\"\n >\n <Text\n variant=\"body-xxs\"\n as=\"span\"\n color=\"primary-100\"\n className=\"font-bold\"\n >\n {characterCount}\n </Text>\n {maxLength && `/${maxLength}`} characters\n </Text>\n )}\n </div>\n </div>\n );\n }\n);\n","import React, { forwardRef, KeyboardEvent } from \"react\";\nimport { cn } from \"../utils\";\nimport { Input } from \"./Input\";\nimport type { InputProps } from \"./Input\";\n\nexport type AutocompleteInputProps = {\n value: string;\n suggestion: string;\n onChange: (value: string) => void;\n onKeyDown?: (event: KeyboardEvent<HTMLInputElement>) => void;\n \"aria-controls\"?: string;\n \"aria-activedescendant\"?: string;\n \"aria-autocomplete\"?: \"none\" | \"inline\" | \"list\" | \"both\";\n} & Omit<InputProps, \"value\" | \"onChange\" | \"onKeyDown\">;\n\nexport const AutocompleteInput = forwardRef<\n HTMLInputElement,\n AutocompleteInputProps\n>(\n (\n {\n value,\n suggestion,\n onChange,\n onKeyDown,\n className,\n \"aria-controls\": ariaControls,\n \"aria-activedescendant\": ariaActiveDescendant,\n \"aria-autocomplete\": ariaAutocomplete,\n ...props\n },\n ref\n ) => {\n return (\n <div className=\"relative w-full\">\n <Input\n ref={ref}\n value={value}\n onChange={(e) => onChange(e.target.value)}\n onKeyDown={onKeyDown}\n className={cn(\"bg-transparent\", className)}\n aria-controls={ariaControls}\n aria-activedescendant={ariaActiveDescendant}\n aria-autocomplete={ariaAutocomplete}\n {...props}\n />\n {suggestion && (\n <div className=\"absolute inset-0 top-6 flex items-center px-3 md:py-3 py-2 text-secondary opacity-40 pointer-events-none text-sm\">\n {value}\n {suggestion.slice(value.length)}\n </div>\n )}\n </div>\n );\n }\n);\n\nAutocompleteInput.displayName = \"AutocompleteInput\";\n"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
'use strict';var
|
|
1
|
+
'use strict';var c=require('react'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge');function _interopDefault(e){return e&&e.__esModule?e:{default:e}}var c__default=/*#__PURE__*/_interopDefault(c);function l(...p){return tailwindMerge.twMerge(clsx.clsx(p))}var m={12:"h-[12px] w-[12px]",16:"h-[16px] w-[16px]",18:"h-[18px] w-[18px]",20:"h-[20px] w-[20px]",24:"h-[24px] w-[24px]",32:"h-[32px] w-[32px]",36:"h-[36px] w-[36px]",40:"h-[40px] w-[40px]",42:"h-[42px] w-[42px]",48:"h-[48px] w-[48px]",64:"h-[64px] w-[64px]",72:"h-[72px] w-[72px]"},f={sm:{12:"sm:h-[12px] sm:w-[12px]",16:"sm:h-[16px] sm:w-[16px]",18:"sm:h-[18px] sm:w-[18px]",20:"sm:h-[20px] sm:w-[20px]",24:"sm:h-[24px] sm:w-[24px]",32:"sm:h-[32px] sm:w-[32px]",36:"sm:h-[36px] sm:w-[36px]",40:"sm:h-[40px] sm:w-[40px]",42:"sm:h-[42px] sm:w-[42px]",48:"sm:h-[48px] sm:w-[48px]",64:"sm:h-[64px] sm:w-[64px]",72:"sm:h-[72px] sm:w-[72px]"},md:{12:"md:h-[12px] md:w-[12px]",16:"md:h-[16px] md:w-[16px]",18:"md:h-[18px] md:w-[18px]",20:"md:h-[20px] md:w-[20px]",24:"md:h-[24px] md:w-[24px]",32:"md:h-[32px] md:w-[32px]",36:"md:h-[36px] md:w-[36px]",40:"md:h-[40px] md:w-[40px]",42:"md:h-[42px] md:w-[42px]",48:"md:h-[48px] md:w-[48px]",64:"md:h-[64px] md:w-[64px]",72:"md:h-[72px] md:w-[72px]"},lg:{12:"lg:h-[12px] lg:w-[12px]",16:"lg:h-[16px] lg:w-[16px]",18:"lg:h-[18px] lg:w-[18px]",20:"lg:h-[20px] lg:w-[20px]",24:"lg:h-[24px] lg:w-[24px]",32:"lg:h-[32px] lg:w-[32px]",36:"lg:h-[36px] lg:w-[36px]",40:"lg:h-[40px] lg:w-[40px]",42:"lg:h-[42px] lg:w-[42px]",48:"lg:h-[48px] lg:w-[48px]",64:"lg:h-[64px] lg:w-[64px]",72:"lg:h-[72px] lg:w-[72px]"},xl:{12:"xl:h-[12px] xl:w-[12px]",16:"xl:h-[16px] xl:w-[16px]",18:"xl:h-[18px] xl:w-[18px]",20:"xl:h-[20px] xl:w-[20px]",24:"xl:h-[24px] xl:w-[24px]",32:"xl:h-[32px] xl:w-[32px]",36:"xl:h-[36px] xl:w-[36px]",40:"xl:h-[40px] xl:w-[40px]",42:"xl:h-[42px] xl:w-[42px]",48:"xl:h-[48px] xl:w-[48px]",64:"xl:h-[64px] xl:w-[64px]",72:"xl:h-[72px] xl:w-[72px]"},"2xl":{12:"2xl:h-[12px] 2xl:w-[12px]",16:"2xl:h-[16px] 2xl:w-[16px]",18:"2xl:h-[18px] 2xl:w-[18px]",20:"2xl:h-[20px] 2xl:w-[20px]",24:"2xl:h-[24px] 2xl:w-[24px]",32:"2xl:h-[32px] 2xl:w-[32px]",36:"2xl:h-[36px] 2xl:w-[36px]",40:"2xl:h-[40px] 2xl:w-[40px]",42:"2xl:h-[42px] 2xl:w-[42px]",48:"2xl:h-[48px] 2xl:w-[48px]",64:"2xl:h-[64px] 2xl:w-[64px]",72:"2xl:h-[72px] 2xl:w-[72px]"}},i=p=>String(p),u=(p,e=24)=>{let s=[],t={};if(p===undefined){let x=i(e);x?s.push(m[x]):(t.height=`${e}px`,t.width=`${e}px`);}if(typeof p=="number"){let x=i(p);x?s.push(m[x]):(t.height=`${p}px`,t.width=`${p}px`);}if(Array.isArray(p)){let x=i(e),n=[x&&m[x]||`h-[${e}px] w-[${e}px]`];p.forEach(o=>{if(typeof o=="string"){let[r,h]=o.split(":"),a=parseInt(h,10),g=i(a);s.push(g&&f[r]?.[g]||`${r}:h-[${a}px] ${r}:w-[${a}px]`);}}),s.push(...n);}if(typeof p=="string"){let[x,n]=p.split(":"),o=parseInt(n,10),r=i(o);s.push(r&&f[x]?.[r]||`${x}:h-[${o}px] ${x}:w-[${o}px]`);}return {responsiveSizeClasses:s.join(" "),responsiveSizeStyles:t}};var d="focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-100";var w=c__default.default.forwardRef(({children:p,type:e="button",className:s,disabled:t,...x},n)=>c__default.default.createElement("button",{ref:n,type:e,disabled:t,className:l("appearance-none hover:opacity-80 transition-all active:scale-95",d,t&&"opacity-50 cursor-not-allowed",s),...x},p));w.displayName="Pressable";var I=({src:p,size:e=48,onClick:s,alt:t="avatar",className:x,...n})=>{let{responsiveSizeClasses:o,responsiveSizeStyles:r}=u(e,48),h=p?c__default.default.createElement("img",{src:p,alt:t,className:l("rounded-full object-cover",o,x),style:r,...n}):c__default.default.createElement("div",{className:l("rounded-full bg-gray-200",o,x),style:r});return s?c__default.default.createElement(w,{onClick:s,...n},h):h};exports.Avatar=I;//# sourceMappingURL=Avatar.cjs.map
|
|
2
2
|
//# sourceMappingURL=Avatar.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/utils/tailwind.ts","../../src/utils/index.ts","../../src/components/Pressable.tsx","../../src/components/Avatar.tsx"],"names":["focusRingStyles","cn","inputs","twMerge","clsx","Pressable","React","children","type","className","disabled","props","ref","BREAKPOINT_MAP","processSizes","sizes","sizeArray","mediaQueries","baseSize","size","breakpoint","valueStr","value","acc","query","Avatar","src","onClick","alt","sizeStyles","content"],"mappings":"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","file":"Avatar.cjs","sourcesContent":["import { Colors, Typography } from \"../types/tailwind\";\n\n// Generate safelist patterns for all color utilities so you can use any theme color variable in your code\nexport const generateSafelist = (colors: Colors, typography: Typography) => {\n const colorNames = Object.keys(colors) as (keyof Colors)[];\n const utilities = [\"bg\", \"text\", \"border\", \"ring\", \"divide\", \"outline\"];\n const variants = [\"hover:\", \"focus:\", \"active:\", \"disabled:\"];\n\n const safelist: string[] = [];\n\n colorNames.forEach((colorName) => {\n if (typeof colors[colorName] === \"object\") {\n // Handle nested color objects (with number keys)\n Object.keys(colors[colorName]).forEach((shade) => {\n utilities.forEach((utility) => {\n // Base utility\n safelist.push(`${utility}-${colorName}-${shade}`);\n\n // Variant utilities\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}-${shade}`);\n });\n });\n });\n } else {\n // Handle direct color values\n utilities.forEach((utility) => {\n safelist.push(`${utility}-${colorName}`);\n\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}`);\n });\n });\n }\n });\n\n // Generate typography classes\n Object.entries(typography).forEach(([family, sizes]) => {\n Object.keys(sizes).forEach((size) => {\n // Base typography classes\n safelist.push(`text-${family}-${size}`);\n\n // Add variants\n variants.forEach((variant) => {\n safelist.push(`${variant}text-${family}-${size}`);\n });\n });\n });\n\n const breakpoints = [\"sm\", \"md\", \"lg\", \"xl\", \"2xl\"];\n const typographyClasses = Object.entries(typography).flatMap(\n ([category, sizes]) =>\n Object.keys(sizes).map((size) => `text-${category}-${size}`)\n );\n\n // Generate responsive variants\n const responsiveTypographyClasses = typographyClasses.flatMap((className) =>\n breakpoints.map((breakpoint) => `${breakpoint}:${className}`)\n );\n\n return [\n ...typographyClasses,\n ...responsiveTypographyClasses\n // ... rest of your safelist\n ];\n};\n\nexport const focusRingStyles =\n \"focus-visible:outline-none focus-visible:border-2 focus-visible:border-primary-100\";\n\nexport const focusRingStylesCoerced = \"border-2 border-primary-100\";\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\nexport const noopFn = () => {};\n","import React, { ButtonHTMLAttributes } from \"react\";\nimport { focusRingStyles } from \"../utils/tailwind\";\nimport { cn } from \"../utils\";\n\nexport type PressableProps = ButtonHTMLAttributes<HTMLButtonElement>;\n\nexport const Pressable = React.forwardRef<HTMLButtonElement, PressableProps>(\n ({ children, type = \"button\", className, disabled, ...props }, ref) => (\n <button\n ref={ref}\n type={type}\n disabled={disabled}\n className={cn(\n \"appearance-none hover:opacity-80 transition-all active:scale-95\",\n focusRingStyles,\n disabled && \"opacity-50 cursor-not-allowed\",\n className\n )}\n {...props}\n >\n {children}\n </button>\n )\n);\n\nPressable.displayName = \"Pressable\";\n","import React from \"react\";\nimport { Pressable } from \"./Pressable\";\nimport { cn } from \"../utils\";\n\ntype Breakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\ntype ResponsiveSize = number | `${Breakpoint}:${number}`;\n\nconst BREAKPOINT_MAP: Record<Breakpoint, string> = {\n sm: \"640px\",\n md: \"768px\",\n lg: \"1024px\",\n xl: \"1280px\",\n \"2xl\": \"1536px\"\n};\n\nexport type AvatarProps = {\n src?: string;\n size?: ResponsiveSize | ResponsiveSize[];\n alt?: string;\n className?: string;\n} & Pick<React.ComponentProps<typeof Pressable>, \"onClick\">;\n\nconst processSizes = (\n sizes: ResponsiveSize | ResponsiveSize[] | undefined\n): React.CSSProperties => {\n if (!sizes) return { width: \"48px\", height: \"48px\" };\n\n const sizeArray = Array.isArray(sizes) ? sizes : [sizes];\n const mediaQueries: Record<string, string> = {};\n let baseSize: string | undefined;\n\n // Process each size\n sizeArray.forEach((size) => {\n if (typeof size === \"number\") {\n baseSize = `${size}px`;\n } else {\n const [breakpoint, valueStr] = size.split(\":\") as [Breakpoint, string];\n const value = parseInt(valueStr, 10);\n mediaQueries[`@media (minWidth: ${BREAKPOINT_MAP[breakpoint]})`] =\n `${value}px`;\n }\n });\n\n // Create the style object with the correct structure\n return {\n width: baseSize || \"48px\",\n height: baseSize || \"48px\",\n ...Object.entries(mediaQueries).reduce(\n (acc, [query, size]) => ({\n ...acc,\n [query]: {\n width: size,\n height: size\n }\n }),\n {}\n )\n };\n};\n\nexport const Avatar = ({\n src,\n size = 48,\n onClick,\n alt = \"avatar\",\n className,\n ...props\n}: AvatarProps) => {\n const sizeStyles = processSizes(size);\n\n const content = src ? (\n <img\n src={src}\n alt={alt}\n className={cn(\"rounded-full object-cover\", className)}\n style={sizeStyles}\n {...props}\n />\n ) : (\n <div\n style={sizeStyles}\n className={cn(\"rounded-full bg-gray-200\", className)}\n />\n );\n\n return onClick ? (\n <Pressable onClick={onClick} {...props}>\n {content}\n </Pressable>\n ) : (\n content\n );\n};\n"]}
|
|
1
|
+
{"version":3,"sources":["../../src/utils/index.ts","../../src/utils/responsive.ts","../../src/components/Pressable.tsx","../../src/utils/tailwind.ts","../../src/components/Avatar.tsx"],"names":["cn","inputs","twMerge","clsx","BASE_SIZES","RESPONSIVE_SIZES","getSizeKey","size","getResponsiveSize","baseSize","classes","styles","key","baseKey","responsiveClasses","s","breakpoint","valueStr","value","valueKey","focusRingStyles","Pressable","React","children","type","className","disabled","props","ref","Avatar","src","onClick","alt","responsiveSizeClasses","responsiveSizeStyles","content"],"mappings":"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","file":"Avatar.cjs","sourcesContent":["import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs));\n}\n\nexport const noopFn = () => {};\n","export type Breakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\nexport type ResponsiveSize = number | `${Breakpoint}:${number}`;\n\ntype SizeKey =\n | \"12\"\n | \"16\"\n | \"18\"\n | \"20\"\n | \"24\"\n | \"32\"\n | \"36\"\n | \"40\"\n | \"42\"\n | \"48\"\n | \"64\"\n | \"72\";\n\n// These constants help Tailwind identify the classes during compilation\nconst BASE_SIZES: Record<SizeKey, string> = {\n \"12\": \"h-[12px] w-[12px]\",\n \"16\": \"h-[16px] w-[16px]\",\n \"18\": \"h-[18px] w-[18px]\",\n \"20\": \"h-[20px] w-[20px]\",\n \"24\": \"h-[24px] w-[24px]\",\n \"32\": \"h-[32px] w-[32px]\",\n \"36\": \"h-[36px] w-[36px]\",\n \"40\": \"h-[40px] w-[40px]\",\n \"42\": \"h-[42px] w-[42px]\",\n \"48\": \"h-[48px] w-[48px]\",\n \"64\": \"h-[64px] w-[64px]\",\n \"72\": \"h-[72px] w-[72px]\"\n};\n\nconst RESPONSIVE_SIZES: Record<Breakpoint, Record<SizeKey, string>> = {\n sm: {\n \"12\": \"sm:h-[12px] sm:w-[12px]\",\n \"16\": \"sm:h-[16px] sm:w-[16px]\",\n \"18\": \"sm:h-[18px] sm:w-[18px]\",\n \"20\": \"sm:h-[20px] sm:w-[20px]\",\n \"24\": \"sm:h-[24px] sm:w-[24px]\",\n \"32\": \"sm:h-[32px] sm:w-[32px]\",\n \"36\": \"sm:h-[36px] sm:w-[36px]\",\n \"40\": \"sm:h-[40px] sm:w-[40px]\",\n \"42\": \"sm:h-[42px] sm:w-[42px]\",\n \"48\": \"sm:h-[48px] sm:w-[48px]\",\n \"64\": \"sm:h-[64px] sm:w-[64px]\",\n \"72\": \"sm:h-[72px] sm:w-[72px]\"\n },\n md: {\n \"12\": \"md:h-[12px] md:w-[12px]\",\n \"16\": \"md:h-[16px] md:w-[16px]\",\n \"18\": \"md:h-[18px] md:w-[18px]\",\n \"20\": \"md:h-[20px] md:w-[20px]\",\n \"24\": \"md:h-[24px] md:w-[24px]\",\n \"32\": \"md:h-[32px] md:w-[32px]\",\n \"36\": \"md:h-[36px] md:w-[36px]\",\n \"40\": \"md:h-[40px] md:w-[40px]\",\n \"42\": \"md:h-[42px] md:w-[42px]\",\n \"48\": \"md:h-[48px] md:w-[48px]\",\n \"64\": \"md:h-[64px] md:w-[64px]\",\n \"72\": \"md:h-[72px] md:w-[72px]\"\n },\n lg: {\n \"12\": \"lg:h-[12px] lg:w-[12px]\",\n \"16\": \"lg:h-[16px] lg:w-[16px]\",\n \"18\": \"lg:h-[18px] lg:w-[18px]\",\n \"20\": \"lg:h-[20px] lg:w-[20px]\",\n \"24\": \"lg:h-[24px] lg:w-[24px]\",\n \"32\": \"lg:h-[32px] lg:w-[32px]\",\n \"36\": \"lg:h-[36px] lg:w-[36px]\",\n \"40\": \"lg:h-[40px] lg:w-[40px]\",\n \"42\": \"lg:h-[42px] lg:w-[42px]\",\n \"48\": \"lg:h-[48px] lg:w-[48px]\",\n \"64\": \"lg:h-[64px] lg:w-[64px]\",\n \"72\": \"lg:h-[72px] lg:w-[72px]\"\n },\n xl: {\n \"12\": \"xl:h-[12px] xl:w-[12px]\",\n \"16\": \"xl:h-[16px] xl:w-[16px]\",\n \"18\": \"xl:h-[18px] xl:w-[18px]\",\n \"20\": \"xl:h-[20px] xl:w-[20px]\",\n \"24\": \"xl:h-[24px] xl:w-[24px]\",\n \"32\": \"xl:h-[32px] xl:w-[32px]\",\n \"36\": \"xl:h-[36px] xl:w-[36px]\",\n \"40\": \"xl:h-[40px] xl:w-[40px]\",\n \"42\": \"xl:h-[42px] xl:w-[42px]\",\n \"48\": \"xl:h-[48px] xl:w-[48px]\",\n \"64\": \"xl:h-[64px] xl:w-[64px]\",\n \"72\": \"xl:h-[72px] xl:w-[72px]\"\n },\n \"2xl\": {\n \"12\": \"2xl:h-[12px] 2xl:w-[12px]\",\n \"16\": \"2xl:h-[16px] 2xl:w-[16px]\",\n \"18\": \"2xl:h-[18px] 2xl:w-[18px]\",\n \"20\": \"2xl:h-[20px] 2xl:w-[20px]\",\n \"24\": \"2xl:h-[24px] 2xl:w-[24px]\",\n \"32\": \"2xl:h-[32px] 2xl:w-[32px]\",\n \"36\": \"2xl:h-[36px] 2xl:w-[36px]\",\n \"40\": \"2xl:h-[40px] 2xl:w-[40px]\",\n \"42\": \"2xl:h-[42px] 2xl:w-[42px]\",\n \"48\": \"2xl:h-[48px] 2xl:w-[48px]\",\n \"64\": \"2xl:h-[64px] 2xl:w-[64px]\",\n \"72\": \"2xl:h-[72px] 2xl:w-[72px]\"\n }\n};\n\nconst getSizeKey = (size: number): SizeKey | undefined => {\n return String(size) as SizeKey;\n};\n\nexport const getResponsiveSize = (\n size: ResponsiveSize | ResponsiveSize[] | undefined,\n baseSize: number = 24\n): {\n responsiveSizeClasses: string;\n responsiveSizeStyles: Record<string, string>;\n} => {\n const classes: string[] = [];\n const styles: Record<string, string> = {};\n\n // If no size provided, use baseSize\n if (size === undefined) {\n const key = getSizeKey(baseSize);\n if (key) {\n classes.push(BASE_SIZES[key]);\n } else {\n styles.height = `${baseSize}px`;\n styles.width = `${baseSize}px`;\n }\n }\n\n // If size is a number, use that directly\n if (typeof size === \"number\") {\n const key = getSizeKey(size);\n if (key) {\n classes.push(BASE_SIZES[key]);\n } else {\n styles.height = `${size}px`;\n styles.width = `${size}px`;\n }\n }\n\n // If array of responsive sizes, generate responsive classes\n if (Array.isArray(size)) {\n const baseKey = getSizeKey(baseSize);\n const responsiveClasses = [\n (baseKey && BASE_SIZES[baseKey]) || `h-[${baseSize}px] w-[${baseSize}px]`\n ];\n\n size.forEach((s) => {\n if (typeof s === \"string\") {\n const [breakpoint, valueStr] = s.split(\":\") as [Breakpoint, string];\n const value = parseInt(valueStr, 10);\n const key = getSizeKey(value);\n classes.push(\n (key && RESPONSIVE_SIZES[breakpoint]?.[key]) ||\n `${breakpoint}:h-[${value}px] ${breakpoint}:w-[${value}px]`\n );\n }\n });\n\n classes.push(...responsiveClasses);\n }\n\n if (typeof size === \"string\") {\n const [breakpoint, valueStr] = size.split(\":\") as [Breakpoint, string];\n const value = parseInt(valueStr, 10);\n const valueKey = getSizeKey(value);\n classes.push(\n (valueKey && RESPONSIVE_SIZES[breakpoint]?.[valueKey]) ||\n `${breakpoint}:h-[${value}px] ${breakpoint}:w-[${value}px]`\n );\n }\n\n return {\n responsiveSizeClasses: classes.join(\" \"),\n responsiveSizeStyles: styles\n };\n};\n","import React, { ButtonHTMLAttributes } from \"react\";\nimport { focusRingStyles } from \"../utils/tailwind\";\nimport { cn } from \"../utils\";\n\nexport type PressableProps = ButtonHTMLAttributes<HTMLButtonElement>;\n\nexport const Pressable = React.forwardRef<HTMLButtonElement, PressableProps>(\n ({ children, type = \"button\", className, disabled, ...props }, ref) => (\n <button\n ref={ref}\n type={type}\n disabled={disabled}\n className={cn(\n \"appearance-none hover:opacity-80 transition-all active:scale-95\",\n focusRingStyles,\n disabled && \"opacity-50 cursor-not-allowed\",\n className\n )}\n {...props}\n >\n {children}\n </button>\n )\n);\n\nPressable.displayName = \"Pressable\";\n","import { Colors, Typography } from \"../types/tailwind\";\n\n// Generate safelist patterns for all color utilities so you can use any theme color variable in your code\nexport const generateSafelist = (colors: Colors, typography: Typography) => {\n const colorNames = Object.keys(colors) as (keyof Colors)[];\n const utilities = [\"bg\", \"text\", \"border\", \"ring\", \"divide\", \"outline\"];\n const variants = [\"hover:\", \"focus:\", \"active:\", \"disabled:\"];\n const breakpoints = [\"sm\", \"md\", \"lg\", \"xl\", \"2xl\"];\n const sizes = [\"24\", \"42\", \"48\", \"64\", \"72\"]; // Add all the sizes you need\n\n const safelist: (string | { pattern: RegExp; variants: string[] })[] = [];\n\n colorNames.forEach((colorName) => {\n if (typeof colors[colorName] === \"object\") {\n // Handle nested color objects (with number keys)\n Object.keys(colors[colorName]).forEach((shade) => {\n utilities.forEach((utility) => {\n // Base utility\n safelist.push(`${utility}-${colorName}-${shade}`);\n\n // Variant utilities\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}-${shade}`);\n });\n });\n });\n } else {\n // Handle direct color values\n utilities.forEach((utility) => {\n safelist.push(`${utility}-${colorName}`);\n\n variants.forEach((variant) => {\n safelist.push(`${variant}${utility}-${colorName}`);\n });\n });\n }\n });\n\n // Generate typography classes\n Object.entries(typography).forEach(([family, sizes]) => {\n Object.keys(sizes).forEach((size) => {\n // Base typography classes\n safelist.push(`text-${family}-${size}`);\n\n // Add variants\n variants.forEach((variant) => {\n safelist.push(`${variant}text-${family}-${size}`);\n });\n });\n });\n\n const typographyClasses = Object.entries(typography).flatMap(\n ([category, sizes]) =>\n Object.keys(sizes).map((size) => `text-${category}-${size}`)\n );\n\n // Generate responsive variants\n const responsiveTypographyClasses = typographyClasses.flatMap((className) =>\n breakpoints.map((breakpoint) => `${breakpoint}:${className}`)\n );\n\n // Generate size classes with responsive variants\n const sizeClasses = sizes.flatMap((size) => [\n `h-[${size}px]`,\n `w-[${size}px]`,\n ...breakpoints.flatMap((bp) => [\n `${bp}:h-[${size}px]`,\n `${bp}:w-[${size}px]`\n ])\n ]);\n\n return [...typographyClasses, ...responsiveTypographyClasses, ...sizeClasses];\n};\n\nexport const focusRingStyles =\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-100\";\nexport const focusRingWithinStyles =\n \"focus-within:outline-none focus-within:ring-2 focus-within:ring-primary-100\";\nexport const focusRingStylesCoerced = \"ring-2 ring-primary-100\";\n","import React from \"react\";\nimport { cn } from \"../utils\";\nimport { getResponsiveSize, ResponsiveSize } from \"../utils/responsive\";\nimport { Pressable } from \"./Pressable\";\n\nexport type AvatarProps = {\n src?: string;\n size?: ResponsiveSize | ResponsiveSize[];\n alt?: string;\n className?: string;\n} & Pick<React.ComponentProps<typeof Pressable>, \"onClick\">;\n\nexport const Avatar = ({\n src,\n size = 48,\n onClick,\n alt = \"avatar\",\n className,\n ...props\n}: AvatarProps) => {\n const { responsiveSizeClasses, responsiveSizeStyles } = getResponsiveSize(\n size,\n 48\n );\n\n const content = src ? (\n <img\n src={src}\n alt={alt}\n className={cn(\n \"rounded-full object-cover\",\n responsiveSizeClasses,\n className\n )}\n style={responsiveSizeStyles}\n {...props}\n />\n ) : (\n <div\n className={cn(\n \"rounded-full bg-gray-200\",\n responsiveSizeClasses,\n className\n )}\n style={responsiveSizeStyles}\n />\n );\n\n return onClick ? (\n <Pressable onClick={onClick} {...props}>\n {content}\n </Pressable>\n ) : (\n content\n );\n};\n"]}
|
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
import React__default from 'react';
|
|
2
|
+
import { R as ResponsiveSize } from '../responsive-CjR1yA5N.cjs';
|
|
2
3
|
import { Pressable } from './Pressable.cjs';
|
|
3
4
|
|
|
4
|
-
type Breakpoint = "sm" | "md" | "lg" | "xl" | "2xl";
|
|
5
|
-
type ResponsiveSize = number | `${Breakpoint}:${number}`;
|
|
6
5
|
type AvatarProps = {
|
|
7
6
|
src?: string;
|
|
8
7
|
size?: ResponsiveSize | ResponsiveSize[];
|
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
import React__default from 'react';
|
|
2
|
+
import { R as ResponsiveSize } from '../responsive-CjR1yA5N.js';
|
|
2
3
|
import { Pressable } from './Pressable.js';
|
|
3
4
|
|
|
4
|
-
type Breakpoint = "sm" | "md" | "lg" | "xl" | "2xl";
|
|
5
|
-
type ResponsiveSize = number | `${Breakpoint}:${number}`;
|
|
6
5
|
type AvatarProps = {
|
|
7
6
|
src?: string;
|
|
8
7
|
size?: ResponsiveSize | ResponsiveSize[];
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import
|
|
1
|
+
import c from'react';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';function l(...p){return twMerge(clsx(p))}var m={12:"h-[12px] w-[12px]",16:"h-[16px] w-[16px]",18:"h-[18px] w-[18px]",20:"h-[20px] w-[20px]",24:"h-[24px] w-[24px]",32:"h-[32px] w-[32px]",36:"h-[36px] w-[36px]",40:"h-[40px] w-[40px]",42:"h-[42px] w-[42px]",48:"h-[48px] w-[48px]",64:"h-[64px] w-[64px]",72:"h-[72px] w-[72px]"},f={sm:{12:"sm:h-[12px] sm:w-[12px]",16:"sm:h-[16px] sm:w-[16px]",18:"sm:h-[18px] sm:w-[18px]",20:"sm:h-[20px] sm:w-[20px]",24:"sm:h-[24px] sm:w-[24px]",32:"sm:h-[32px] sm:w-[32px]",36:"sm:h-[36px] sm:w-[36px]",40:"sm:h-[40px] sm:w-[40px]",42:"sm:h-[42px] sm:w-[42px]",48:"sm:h-[48px] sm:w-[48px]",64:"sm:h-[64px] sm:w-[64px]",72:"sm:h-[72px] sm:w-[72px]"},md:{12:"md:h-[12px] md:w-[12px]",16:"md:h-[16px] md:w-[16px]",18:"md:h-[18px] md:w-[18px]",20:"md:h-[20px] md:w-[20px]",24:"md:h-[24px] md:w-[24px]",32:"md:h-[32px] md:w-[32px]",36:"md:h-[36px] md:w-[36px]",40:"md:h-[40px] md:w-[40px]",42:"md:h-[42px] md:w-[42px]",48:"md:h-[48px] md:w-[48px]",64:"md:h-[64px] md:w-[64px]",72:"md:h-[72px] md:w-[72px]"},lg:{12:"lg:h-[12px] lg:w-[12px]",16:"lg:h-[16px] lg:w-[16px]",18:"lg:h-[18px] lg:w-[18px]",20:"lg:h-[20px] lg:w-[20px]",24:"lg:h-[24px] lg:w-[24px]",32:"lg:h-[32px] lg:w-[32px]",36:"lg:h-[36px] lg:w-[36px]",40:"lg:h-[40px] lg:w-[40px]",42:"lg:h-[42px] lg:w-[42px]",48:"lg:h-[48px] lg:w-[48px]",64:"lg:h-[64px] lg:w-[64px]",72:"lg:h-[72px] lg:w-[72px]"},xl:{12:"xl:h-[12px] xl:w-[12px]",16:"xl:h-[16px] xl:w-[16px]",18:"xl:h-[18px] xl:w-[18px]",20:"xl:h-[20px] xl:w-[20px]",24:"xl:h-[24px] xl:w-[24px]",32:"xl:h-[32px] xl:w-[32px]",36:"xl:h-[36px] xl:w-[36px]",40:"xl:h-[40px] xl:w-[40px]",42:"xl:h-[42px] xl:w-[42px]",48:"xl:h-[48px] xl:w-[48px]",64:"xl:h-[64px] xl:w-[64px]",72:"xl:h-[72px] xl:w-[72px]"},"2xl":{12:"2xl:h-[12px] 2xl:w-[12px]",16:"2xl:h-[16px] 2xl:w-[16px]",18:"2xl:h-[18px] 2xl:w-[18px]",20:"2xl:h-[20px] 2xl:w-[20px]",24:"2xl:h-[24px] 2xl:w-[24px]",32:"2xl:h-[32px] 2xl:w-[32px]",36:"2xl:h-[36px] 2xl:w-[36px]",40:"2xl:h-[40px] 2xl:w-[40px]",42:"2xl:h-[42px] 2xl:w-[42px]",48:"2xl:h-[48px] 2xl:w-[48px]",64:"2xl:h-[64px] 2xl:w-[64px]",72:"2xl:h-[72px] 2xl:w-[72px]"}},i=p=>String(p),u=(p,e=24)=>{let s=[],t={};if(p===undefined){let x=i(e);x?s.push(m[x]):(t.height=`${e}px`,t.width=`${e}px`);}if(typeof p=="number"){let x=i(p);x?s.push(m[x]):(t.height=`${p}px`,t.width=`${p}px`);}if(Array.isArray(p)){let x=i(e),n=[x&&m[x]||`h-[${e}px] w-[${e}px]`];p.forEach(o=>{if(typeof o=="string"){let[r,h]=o.split(":"),a=parseInt(h,10),g=i(a);s.push(g&&f[r]?.[g]||`${r}:h-[${a}px] ${r}:w-[${a}px]`);}}),s.push(...n);}if(typeof p=="string"){let[x,n]=p.split(":"),o=parseInt(n,10),r=i(o);s.push(r&&f[x]?.[r]||`${x}:h-[${o}px] ${x}:w-[${o}px]`);}return {responsiveSizeClasses:s.join(" "),responsiveSizeStyles:t}};var d="focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-100";var w=c.forwardRef(({children:p,type:e="button",className:s,disabled:t,...x},n)=>c.createElement("button",{ref:n,type:e,disabled:t,className:l("appearance-none hover:opacity-80 transition-all active:scale-95",d,t&&"opacity-50 cursor-not-allowed",s),...x},p));w.displayName="Pressable";var I=({src:p,size:e=48,onClick:s,alt:t="avatar",className:x,...n})=>{let{responsiveSizeClasses:o,responsiveSizeStyles:r}=u(e,48),h=p?c.createElement("img",{src:p,alt:t,className:l("rounded-full object-cover",o,x),style:r,...n}):c.createElement("div",{className:l("rounded-full bg-gray-200",o,x),style:r});return s?c.createElement(w,{onClick:s,...n},h):h};export{I as Avatar};//# sourceMappingURL=Avatar.js.map
|
|
2
2
|
//# sourceMappingURL=Avatar.js.map
|