@arkyn/components 3.0.3 → 3.0.4
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/README.md +24 -24
- package/dist/components/alert/alertContainer/index.d.ts +7 -7
- package/dist/components/alert/alertContent/index.d.ts +1 -1
- package/dist/components/alert/alertDescription/index.d.ts +1 -1
- package/dist/components/alert/alertIcon/index.d.ts +1 -1
- package/dist/components/alert/alertTitle/index.d.ts +1 -1
- package/dist/components/audioPlayer/index.d.ts +1 -1
- package/dist/components/audioUpload/index.d.ts +2 -2
- package/dist/components/badge/index.d.ts +1 -1
- package/dist/components/button/index.d.ts +1 -1
- package/dist/components/cardTab/cardTabButton/index.d.ts +1 -1
- package/dist/components/cardTab/cardTabContainer/index.d.ts +1 -1
- package/dist/components/checkbox/index.d.ts +3 -3
- package/dist/components/checkbox/index.d.ts.map +1 -1
- package/dist/components/clientOnly.d.ts +2 -2
- package/dist/components/clientOnly.d.ts.map +1 -1
- package/dist/components/currencyInput/index.d.ts +2 -2
- package/dist/components/datePicker/index.d.ts +1 -1
- package/dist/components/divider/index.d.ts +1 -1
- package/dist/components/drawer/drawerContainer/index.d.ts +1 -1
- package/dist/components/drawer/drawerHeader/index.d.ts +1 -1
- package/dist/components/facebookPixel/index.d.ts +1 -1
- package/dist/components/fieldError/index.d.ts +1 -1
- package/dist/components/fieldLabel/index.d.ts +1 -1
- package/dist/components/fieldWrapper/index.d.ts +1 -1
- package/dist/components/fileUpload/index.d.ts +2 -2
- package/dist/components/googleAnalytics/index.d.ts +1 -1
- package/dist/components/googleTagManager/index.d.ts +1 -1
- package/dist/components/iconButton/index.d.ts +1 -1
- package/dist/components/imageUpload/index.d.ts +2 -2
- package/dist/components/input/index.d.ts +1 -1
- package/dist/components/mapView/index.d.ts +2 -2
- package/dist/components/mapView/index.d.ts.map +1 -1
- package/dist/components/maskedInput/index.d.ts +3 -3
- package/dist/components/modal/modalContainer/index.d.ts +1 -1
- package/dist/components/modal/modalFooter/index.d.ts +1 -1
- package/dist/components/modal/modalHeader/index.d.ts +1 -1
- package/dist/components/multiSelect/index.d.ts +1 -1
- package/dist/components/pagination/index.d.ts +1 -1
- package/dist/components/phoneInput/index.d.ts +2 -2
- package/dist/components/phoneInput/index.d.ts.map +1 -1
- package/dist/components/popover/index.d.ts +2 -2
- package/dist/components/popover/index.d.ts.map +1 -1
- package/dist/components/radio/radioBox/index.d.ts +4 -4
- package/dist/components/radio/radioGroup/index.d.ts +3 -3
- package/dist/components/richText/index.d.ts +3 -3
- package/dist/components/searchPlaces.d.ts +3 -3
- package/dist/components/select/index.d.ts +1 -1
- package/dist/components/slider/index.d.ts +1 -1
- package/dist/components/switch/index.d.ts +3 -3
- package/dist/components/switch/index.d.ts.map +1 -1
- package/dist/components/tab/tabButton/index.d.ts +1 -1
- package/dist/components/tab/tabContainer/index.d.ts +1 -1
- package/dist/components/table/tableBody/index.d.ts +1 -1
- package/dist/components/table/tableCaption/index.d.ts +2 -2
- package/dist/components/table/tableContainer/index.d.ts +1 -1
- package/dist/components/table/tableFooter/index.d.ts +1 -1
- package/dist/components/table/tableHeader/index.d.ts +2 -2
- package/dist/components/textarea/index.d.ts +1 -1
- package/dist/components/tooltip/index.d.ts +1 -1
- package/dist/hooks/useAutomation.d.ts +1 -1
- package/dist/hooks/useDrawer.d.ts +5 -5
- package/dist/hooks/useForm.d.ts +2 -2
- package/dist/hooks/useHydrated.d.ts +1 -1
- package/dist/hooks/useModal.d.ts +5 -5
- package/dist/hooks/useScopedParams.d.ts +5 -5
- package/dist/hooks/useScrollLock.d.ts +2 -2
- package/dist/hooks/useSearchAutomation.d.ts +6 -6
- package/dist/hooks/useSlider.d.ts +2 -2
- package/dist/hooks/useToast.d.ts +1 -1
- package/dist/index.js +2 -2
- package/dist/index.js.map +1 -1
- package/dist/modules/components/alert/alertContainer/index.js.map +1 -1
- package/dist/modules/components/alert/alertContent/index.js.map +1 -1
- package/dist/modules/components/alert/alertDescription/index.js.map +1 -1
- package/dist/modules/components/alert/alertIcon/index.js.map +1 -1
- package/dist/modules/components/alert/alertTitle/index.js.map +1 -1
- package/dist/modules/components/audioPlayer/index.js.map +1 -1
- package/dist/modules/components/audioUpload/index.js.map +1 -1
- package/dist/modules/components/badge/index.js.map +1 -1
- package/dist/modules/components/button/index.js.map +1 -1
- package/dist/modules/components/cardTab/cardTabButton/index.js.map +1 -1
- package/dist/modules/components/cardTab/cardTabContainer/index.js.map +1 -1
- package/dist/modules/components/checkbox/index.js.map +1 -1
- package/dist/modules/components/clientOnly.js.map +1 -1
- package/dist/modules/components/currencyInput/index.js.map +1 -1
- package/dist/modules/components/datePicker/index.js.map +1 -1
- package/dist/modules/components/divider/index.js.map +1 -1
- package/dist/modules/components/drawer/drawerContainer/index.js.map +1 -1
- package/dist/modules/components/drawer/drawerHeader/index.js.map +1 -1
- package/dist/modules/components/facebookPixel/index.js.map +1 -1
- package/dist/modules/components/fieldError/index.js.map +1 -1
- package/dist/modules/components/fieldLabel/index.js.map +1 -1
- package/dist/modules/components/fieldWrapper/index.js.map +1 -1
- package/dist/modules/components/fileUpload/index.js.map +1 -1
- package/dist/modules/components/googleAnalytics/index.js.map +1 -1
- package/dist/modules/components/googleTagManager/index.js.map +1 -1
- package/dist/modules/components/iconButton/index.js.map +1 -1
- package/dist/modules/components/imageUpload/index.js.map +1 -1
- package/dist/modules/components/input/index.js.map +1 -1
- package/dist/modules/components/mapView/index.js.map +1 -1
- package/dist/modules/components/maskedInput/index.js.map +1 -1
- package/dist/modules/components/modal/modalContainer/index.js.map +1 -1
- package/dist/modules/components/modal/modalFooter/index.js.map +1 -1
- package/dist/modules/components/modal/modalHeader/index.js.map +1 -1
- package/dist/modules/components/multiSelect/index.js.map +1 -1
- package/dist/modules/components/pagination/index.js.map +1 -1
- package/dist/modules/components/phoneInput/index.js +59 -59
- package/dist/modules/components/phoneInput/index.js.map +1 -1
- package/dist/modules/components/popover/index.js.map +1 -1
- package/dist/modules/components/radio/radioBox/index.js.map +1 -1
- package/dist/modules/components/radio/radioGroup/index.js.map +1 -1
- package/dist/modules/components/richText/index.js.map +1 -1
- package/dist/modules/components/searchPlaces.js.map +1 -1
- package/dist/modules/components/select/index.js.map +1 -1
- package/dist/modules/components/slider/index.js.map +1 -1
- package/dist/modules/components/switch/index.js.map +1 -1
- package/dist/modules/components/tab/tabButton/index.js.map +1 -1
- package/dist/modules/components/tab/tabContainer/index.js.map +1 -1
- package/dist/modules/components/table/tableBody/index.js.map +1 -1
- package/dist/modules/components/table/tableCaption/index.js.map +1 -1
- package/dist/modules/components/table/tableContainer/index.js.map +1 -1
- package/dist/modules/components/table/tableFooter/index.js.map +1 -1
- package/dist/modules/components/table/tableHeader/index.js.map +1 -1
- package/dist/modules/components/textarea/index.js.map +1 -1
- package/dist/modules/components/tooltip/index.js.map +1 -1
- package/dist/modules/hooks/useAutomation.js.map +1 -1
- package/dist/modules/hooks/useDrawer.js.map +1 -1
- package/dist/modules/hooks/useForm.js.map +1 -1
- package/dist/modules/hooks/useHydrated.js.map +1 -1
- package/dist/modules/hooks/useModal.js.map +1 -1
- package/dist/modules/hooks/useScopedParams.js.map +1 -1
- package/dist/modules/hooks/useScrollLock.js.map +1 -1
- package/dist/modules/hooks/useSearchAutomation.js.map +1 -1
- package/dist/modules/hooks/useSlider.js.map +1 -1
- package/dist/modules/hooks/useToast.js.map +1 -1
- package/dist/modules/providers/drawerProvider.js.map +1 -1
- package/dist/modules/providers/formProvider.js.map +1 -1
- package/dist/modules/providers/modalProvider.js.map +1 -1
- package/dist/modules/providers/placesProvider.js.map +1 -1
- package/dist/modules/providers/toastProvider.js.map +1 -1
- package/dist/modules/services/toHtml.js.map +1 -1
- package/dist/modules/services/toRichTextValue.js.map +1 -1
- package/dist/providers/drawerProvider.d.ts +1 -1
- package/dist/providers/formProvider.d.ts +1 -1
- package/dist/providers/modalProvider.d.ts +1 -1
- package/dist/providers/placesProvider.d.ts +1 -1
- package/dist/providers/toastProvider.d.ts +1 -1
- package/dist/services/toHtml.d.ts +1 -1
- package/dist/services/toRichTextValue.d.ts +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/alert/alertContainer/index.tsx"],"sourcesContent":["import {\n\tcreateContext,\n\ttype HTMLAttributes,\n\ttype JSX,\n\ttype ReactNode,\n\tuseContext,\n\tuseMemo,\n} from \"react\";\nimport { AlertTitle } from \"../alertTitle\";\nimport \"./styles.css\";\n\ntype AlertContainerProps = {\n\t/**\n\t * Visual style and semantic meaning.\n\t * - `success`: green
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/alert/alertContainer/index.tsx"],"sourcesContent":["import {\n\tcreateContext,\n\ttype HTMLAttributes,\n\ttype JSX,\n\ttype ReactNode,\n\tuseContext,\n\tuseMemo,\n} from \"react\";\nimport { AlertTitle } from \"../alertTitle\";\nimport \"./styles.css\";\n\ntype AlertContainerProps = {\n\t/**\n\t * Visual style and semantic meaning.\n\t * - `success`: green, operation completed.\n\t * - `danger`: red, error or destructive action.\n\t * - `warning`: yellow, caution required.\n\t * - `info`: blue, informational message.\n\t */\n\tscheme: \"success\" | \"danger\" | \"warning\" | \"info\";\n} & HTMLAttributes<HTMLDivElement>;\n\nconst AlertContainerContext = createContext({} as AlertContainerProps);\n\n/** @internal Accesses the schema and HTML props of the enclosing `AlertContainer`. */\nfunction useAlertContainer(): AlertContainerProps {\n\treturn useContext(AlertContainerContext);\n}\n\n/**\n * AlertContainer, root wrapper for the Alert component set. Provides schema context to child components.\n *\n * Automatically detects whether an `AlertTitle` is present among children and adjusts layout:\n * centered when no title, left-aligned when a title is present.\n *\n * @param props.scheme - Visual style variant. Required.\n * @param props.children - Alert sub-components: `AlertIcon`, `AlertContent`, `AlertTitle`, `AlertDescription`.\n *\n * **...Other valid HTML properties for `<div>`**\n *\n * @returns AlertContainer JSX element.\n *\n * @example\n * ```tsx\n * // Inline alert, no title, centered layout\n * <AlertContainer scheme=\"success\">\n * <AlertIcon />\n * <AlertContent>Your subscription has been activated.</AlertContent>\n * </AlertContainer>\n *\n * // Full alert with title and description, left-aligned layout\n * <AlertContainer scheme=\"danger\">\n * <AlertIcon />\n * <AlertContent>\n * <AlertTitle>Payment failed</AlertTitle>\n * <AlertDescription>Please check your card details and try again.</AlertDescription>\n * </AlertContent>\n * </AlertContainer>\n * ```\n */\n\nfunction AlertContainer(props: AlertContainerProps): JSX.Element {\n\tconst { scheme, children, className: baseClassName, ...rest } = props;\n\n\tconst hasAlertTitle = (children: ReactNode): boolean => {\n\t\tlet found = false;\n\t\tconst searchForAlertTitle = (nodes: ReactNode) => {\n\t\t\tif (Array.isArray(nodes)) {\n\t\t\t\tnodes.forEach(searchForAlertTitle);\n\t\t\t} else if (nodes && typeof nodes === \"object\" && \"type\" in nodes) {\n\t\t\t\tif (nodes.type === AlertTitle) {\n\t\t\t\t\tfound = true;\n\t\t\t\t} else if (\n\t\t\t\t\tnodes.props &&\n\t\t\t\t\ttypeof nodes.props === \"object\" &&\n\t\t\t\t\tnodes.props !== null &&\n\t\t\t\t\t\"children\" in nodes.props\n\t\t\t\t) {\n\t\t\t\t\t// biome-ignore lint/suspicious/noExplicitAny: intentional\n\t\t\t\t\tsearchForAlertTitle((nodes.props as any).children);\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\t\tsearchForAlertTitle(children);\n\t\treturn found;\n\t};\n\n\tconst shouldAlignCenter = !hasAlertTitle(children);\n\tconst finalClassName = shouldAlignCenter\n\t\t? \"nonExistsAlertTitle\"\n\t\t: \"existsAlertTitle\";\n\n\tconst className = `arkynAlertContainer ${scheme} ${finalClassName} ${baseClassName}`;\n\n\tconst value = useMemo(() => ({ scheme }), [scheme]);\n\n\treturn (\n\t\t<AlertContainerContext.Provider value={value}>\n\t\t\t<div className={className.trim()} {...rest}>\n\t\t\t\t{children}\n\t\t\t</div>\n\t\t</AlertContainerContext.Provider>\n\t);\n}\n\nexport { AlertContainer, useAlertContainer };\n"],"mappings":";;;;;AAsBA,IAAM,IAAwB,EAAc,CAAC,CAAwB;AAGrE,SAAS,IAAyC;CACjD,OAAO,EAAW,CAAqB;AACxC;AAkCA,SAAS,EAAe,GAAyC;CAChE,IAAM,EAAE,WAAQ,aAAU,WAAW,GAAe,GAAG,MAAS,GA8B1D,IAAY,uBAAuB,EAAO,KA5BzB,MAAiC;EACvD,IAAI,IAAQ,IACN,KAAuB,MAAqB;GACjD,AAAI,MAAM,QAAQ,CAAK,IACtB,EAAM,QAAQ,CAAmB,IACvB,KAAS,OAAO,KAAU,YAAY,UAAU,MACtD,EAAM,SAAS,IAClB,IAAQ,KAER,EAAM,SACN,OAAO,EAAM,SAAU,YACvB,EAAM,UAAU,QAChB,cAAc,EAAM,SAGpB,EAAqB,EAAM,MAAc,QAAQ;EAGpD;EAEA,OADA,EAAoB,CAAQ,GACrB;CACR,EAE2B,CAAc,CAAQ,IAG9C,qBADA,sBAG+D,GAAG,KAE/D,IAAQ,SAAe,EAAE,UAAO,IAAI,CAAC,CAAM,CAAC;CAElD,OACC,kBAAC,EAAsB,UAAvB;EAAuC;YACtC,kBAAC,OAAD;GAAK,WAAW,EAAU,KAAK;GAAG,GAAI;GACpC;EACG,CAAA;CAC0B,CAAA;AAElC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/alert/alertContent/index.tsx"],"sourcesContent":["import type { HTMLAttributes, JSX } from \"react\";\nimport \"./styles.css\";\n\ntype AlertContentProps = HTMLAttributes<HTMLDivElement>;\n\n/**\n * AlertContent
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/alert/alertContent/index.tsx"],"sourcesContent":["import type { HTMLAttributes, JSX } from \"react\";\nimport \"./styles.css\";\n\ntype AlertContentProps = HTMLAttributes<HTMLDivElement>;\n\n/**\n * AlertContent, text/content area inside an `AlertContainer`. Wraps `AlertTitle` and `AlertDescription`.\n *\n * Accepts all standard `<div>` HTML attributes.\n *\n * @returns AlertContent JSX element.\n *\n * @example\n * ```tsx\n * <AlertContainer scheme=\"warning\">\n * <AlertIcon />\n * <AlertContent>\n * <AlertTitle>Session expiring</AlertTitle>\n * <AlertDescription>You will be logged out in 5 minutes.</AlertDescription>\n * </AlertContent>\n * </AlertContainer>\n * ```\n */\n\nfunction AlertContent(props: AlertContentProps): JSX.Element {\n\tconst { className: baseClassName, ...rest } = props;\n\tconst className = `arkynAlertContent ${baseClassName}`;\n\n\treturn <div className={className.trim()} {...rest} />;\n}\n\nexport { AlertContent };\n"],"mappings":";;;AAwBA,SAAS,EAAa,GAAuC;CAC5D,IAAM,EAAE,WAAW,GAAe,GAAG,MAAS;CAG9C,OAAO,kBAAC,OAAD;EAAK,WAAW,qBAFgB,IAEN,KAAK;EAAG,GAAI;CAAO,CAAA;AACrD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/alert/alertDescription/index.tsx"],"sourcesContent":["import type { HTMLAttributes, JSX } from \"react\";\nimport \"./styles.css\";\n\ntype AlertDescriptionProps = HTMLAttributes<HTMLDivElement>;\n\n/**\n * AlertDescription
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/alert/alertDescription/index.tsx"],"sourcesContent":["import type { HTMLAttributes, JSX } from \"react\";\nimport \"./styles.css\";\n\ntype AlertDescriptionProps = HTMLAttributes<HTMLDivElement>;\n\n/**\n * AlertDescription, body text for an alert. Place inside `AlertContent`.\n *\n * Accepts all standard `<div>` HTML attributes.\n *\n * @returns AlertDescription JSX element.\n *\n * @example\n * ```tsx\n * <AlertContainer scheme=\"info\">\n * <AlertContent>\n * <AlertTitle>Maintenance scheduled</AlertTitle>\n * <AlertDescription>The service will be unavailable on Sunday from 2–4 AM UTC.</AlertDescription>\n * </AlertContent>\n * </AlertContainer>\n * ```\n */\n\nfunction AlertDescription(props: AlertDescriptionProps): JSX.Element {\n\tconst { className: baseClassName, ...rest } = props;\n\tconst className = `arkynAlertDescription ${baseClassName}`;\n\n\treturn <div className={className.trim()} {...rest} />;\n}\n\nexport { AlertDescription };\n"],"mappings":";;;AAuBA,SAAS,EAAiB,GAA2C;CACpE,IAAM,EAAE,WAAW,GAAe,GAAG,MAAS;CAG9C,OAAO,kBAAC,OAAD;EAAK,WAAW,yBAFoB,IAEV,KAAK;EAAG,GAAI;CAAO,CAAA;AACrD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/alert/alertIcon/index.tsx"],"sourcesContent":["import {\n\tAlertTriangle,\n\tCheckCircle2,\n\tInfo,\n\ttype LucideProps,\n\tXCircle,\n} from \"lucide-react\";\n\nimport type { JSX } from \"react\";\nimport { useAlertContainer } from \"../alertContainer\";\nimport \"./styles.css\";\n\ntype AlertIconProps = LucideProps;\n\n/**\n * AlertIcon
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/alert/alertIcon/index.tsx"],"sourcesContent":["import {\n\tAlertTriangle,\n\tCheckCircle2,\n\tInfo,\n\ttype LucideProps,\n\tXCircle,\n} from \"lucide-react\";\n\nimport type { JSX } from \"react\";\nimport { useAlertContainer } from \"../alertContainer\";\nimport \"./styles.css\";\n\ntype AlertIconProps = LucideProps;\n\n/**\n * AlertIcon, renders a scheme-appropriate icon from `AlertContainer` context.\n *\n * - `success` → `CheckCircle2`\n * - `danger` → `XCircle`\n * - `warning` → `AlertTriangle`\n * - `info` → `Info`\n *\n * Must be placed inside an `AlertContainer`. Accepts all Lucide icon props.\n *\n * @returns The scheme-matched Lucide icon element.\n *\n * @example\n * ```tsx\n * <AlertContainer scheme=\"danger\">\n * <AlertIcon />\n * <AlertContent>\n * <AlertTitle>Payment failed</AlertTitle>\n * <AlertDescription>Please check your card details.</AlertDescription>\n * </AlertContent>\n * </AlertContainer>\n * ```\n */\nfunction AlertIcon(props: AlertIconProps): JSX.Element {\n\tconst { className: baseClassName, ...rest } = props;\n\tconst { scheme } = useAlertContainer();\n\n\tconst className = `arkynAlertIcon ${scheme} ${baseClassName}`;\n\n\tswitch (scheme) {\n\t\tcase \"success\":\n\t\t\treturn <CheckCircle2 className={className} {...rest} />;\n\t\tcase \"danger\":\n\t\t\treturn <XCircle className={className} {...rest} />;\n\t\tcase \"warning\":\n\t\t\treturn <AlertTriangle className={className} {...rest} />;\n\t\tcase \"info\":\n\t\t\treturn <Info className={className} {...rest} />;\n\t}\n}\n\nexport { AlertIcon };\n"],"mappings":";;;;;AAqCA,SAAS,EAAU,GAAoC;CACtD,IAAM,EAAE,WAAW,GAAe,GAAG,MAAS,GACxC,EAAE,cAAW,EAAkB,GAE/B,IAAY,kBAAkB,EAAO,GAAG;CAE9C,QAAQ,GAAR;EACC,KAAK,WACJ,OAAO,kBAAC,GAAD;GAAyB;GAAW,GAAI;EAAO,CAAA;EACvD,KAAK,UACJ,OAAO,kBAAC,GAAD;GAAoB;GAAW,GAAI;EAAO,CAAA;EAClD,KAAK,WACJ,OAAO,kBAAC,GAAD;GAA0B;GAAW,GAAI;EAAO,CAAA;EACxD,KAAK,QACJ,OAAO,kBAAC,GAAD;GAAiB;GAAW,GAAI;EAAO,CAAA;CAChD;AACD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/alert/alertTitle/index.tsx"],"sourcesContent":["import type { HTMLAttributes, JSX } from \"react\";\nimport \"./styles.css\";\n\ntype AlertTitleProps = HTMLAttributes<HTMLDivElement>;\n\n/**\n * AlertTitle
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/alert/alertTitle/index.tsx"],"sourcesContent":["import type { HTMLAttributes, JSX } from \"react\";\nimport \"./styles.css\";\n\ntype AlertTitleProps = HTMLAttributes<HTMLDivElement>;\n\n/**\n * AlertTitle, bold heading for an alert. Place inside `AlertContent`.\n *\n * Its presence is detected by `AlertContainer` to switch the layout from centered to left-aligned.\n * Accepts all standard `<div>` HTML attributes.\n *\n * @returns AlertTitle JSX element.\n *\n * @example\n * ```tsx\n * <AlertContainer scheme=\"danger\">\n * <AlertIcon />\n * <AlertContent>\n * <AlertTitle>Access denied</AlertTitle>\n * <AlertDescription>You don't have permission to view this page.</AlertDescription>\n * </AlertContent>\n * </AlertContainer>\n * ```\n */\nfunction AlertTitle(props: AlertTitleProps): JSX.Element {\n\tconst { className: baseClassName, ...rest } = props;\n\tconst className = `arkynAlertTitle ${baseClassName}`;\n\n\treturn <div className={className.trim()} {...rest} />;\n}\n\nexport { AlertTitle };\n"],"mappings":";;;AAwBA,SAAS,EAAW,GAAqC;CACxD,IAAM,EAAE,WAAW,GAAe,GAAG,MAAS;CAG9C,OAAO,kBAAC,OAAD;EAAK,WAAW,mBAFc,IAEJ,KAAK;EAAG,GAAI;CAAO,CAAA;AACrD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/audioPlayer/index.tsx"],"sourcesContent":["import { Pause, Play } from \"lucide-react\";\nimport {\n\ttype AudioHTMLAttributes,\n\ttype JSX,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n} from \"react\";\n\nimport { useSlider } from \"../../hooks/useSlider\";\nimport { Slider } from \"../slider\";\nimport \"./styles.css\";\n\n/** Audio state snapshot passed to play/pause callbacks. */\ntype AudioInformationProps = {\n\t/** Current playback position in seconds. */\n\tcurrentTime: number;\n\t/** Total audio duration in seconds. */\n\ttotalTime: number;\n\t/** Current position formatted as `MM:SS`. */\n\tformattedCurrentTime: string;\n\t/** Total duration formatted as `MM:SS`. */\n\tformattedTotalTime: string;\n};\n\ntype AudioPlayerProps = Omit<\n\tAudioHTMLAttributes<HTMLAudioElement>,\n\t\"onEnded\" | \"src\"\n> & {\n\t/** Audio file URL. Required. */\n\tsrc: string;\n\t/** Disables the play/pause button and the progress slider. @default false */\n\tdisabled?: boolean;\n\t/** Callback fired when playback starts. Receives the current audio state. */\n\tonPlayAudio?: (props: AudioInformationProps) => void;\n\t/** Callback fired when playback is paused. Receives the current audio state. */\n\tonPauseAudio?: (props: AudioInformationProps) => void;\n};\n\n/**\n * AudioPlayer
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/audioPlayer/index.tsx"],"sourcesContent":["import { Pause, Play } from \"lucide-react\";\nimport {\n\ttype AudioHTMLAttributes,\n\ttype JSX,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n} from \"react\";\n\nimport { useSlider } from \"../../hooks/useSlider\";\nimport { Slider } from \"../slider\";\nimport \"./styles.css\";\n\n/** Audio state snapshot passed to play/pause callbacks. */\ntype AudioInformationProps = {\n\t/** Current playback position in seconds. */\n\tcurrentTime: number;\n\t/** Total audio duration in seconds. */\n\ttotalTime: number;\n\t/** Current position formatted as `MM:SS`. */\n\tformattedCurrentTime: string;\n\t/** Total duration formatted as `MM:SS`. */\n\tformattedTotalTime: string;\n};\n\ntype AudioPlayerProps = Omit<\n\tAudioHTMLAttributes<HTMLAudioElement>,\n\t\"onEnded\" | \"src\"\n> & {\n\t/** Audio file URL. Required. */\n\tsrc: string;\n\t/** Disables the play/pause button and the progress slider. @default false */\n\tdisabled?: boolean;\n\t/** Callback fired when playback starts. Receives the current audio state. */\n\tonPlayAudio?: (props: AudioInformationProps) => void;\n\t/** Callback fired when playback is paused. Receives the current audio state. */\n\tonPauseAudio?: (props: AudioInformationProps) => void;\n};\n\n/**\n * AudioPlayer, play/pause controls, a scrubable progress bar, and elapsed/total time display.\n *\n * @param props.src - Audio file URL. Required.\n * @param props.disabled - Disables controls. Default: false\n * @param props.onPlayAudio - Callback fired when playback starts.\n * @param props.onPauseAudio - Callback fired when playback is paused.\n *\n * **...Other valid HTML properties for `<audio>` (except `onEnded` and `src`)**\n *\n * @returns AudioPlayer JSX element.\n *\n * @example\n * ```tsx\n * // Basic\n * <AudioPlayer src=\"/audio/episode.mp3\" />\n *\n * // With play/pause callbacks\n * <AudioPlayer\n * src=\"/audio/episode.mp3\"\n * onPlayAudio={(info) => console.log(\"Playing at\", info.formattedCurrentTime)}\n * onPauseAudio={(info) => console.log(\"Paused at\", info.formattedCurrentTime)}\n * />\n * ```\n */\nfunction AudioPlayer(props: AudioPlayerProps): JSX.Element {\n\tconst { onPlayAudio, onPauseAudio, disabled, style, ...rest } = props;\n\n\tconst [sliderValue, setSliderValue] = useSlider(0);\n\tconst [isPlaying, setIsPlaying] = useState(false);\n\tconst [isDragging, setIsDragging] = useState(false);\n\n\tconst audioReference = useRef<HTMLAudioElement>(null);\n\n\tconst currentTime = audioReference.current?.currentTime || 0;\n\tconst totalTime = audioReference.current?.duration || 0;\n\n\tconst formattedCurrentTime = formatTime(currentTime);\n\tconst formattedTotalTime = formatTime(totalTime);\n\n\tconst audioInformation: AudioInformationProps = {\n\t\ttotalTime,\n\t\tcurrentTime,\n\t\tformattedCurrentTime,\n\t\tformattedTotalTime,\n\t};\n\n\tfunction formatTime(time?: number): string {\n\t\tif (!time) return \"00:00\";\n\n\t\tconst minutes = Math.floor(time / 60);\n\t\tconst seconds = Math.floor(time % 60);\n\n\t\tconst formattedMinutes = String(minutes).padStart(2, \"0\");\n\t\tconst formattedSeconds = String(seconds).padStart(2, \"0\");\n\n\t\treturn `${formattedMinutes}:${formattedSeconds}`;\n\t}\n\n\tfunction handlePlayAudio(): void {\n\t\tconst audioElement = audioReference.current;\n\t\tif (!audioElement) return;\n\t\tif (props.onPlayAudio) props.onPlayAudio(audioInformation);\n\t\taudioElement.play();\n\t\tsetIsPlaying(true);\n\t}\n\n\tfunction handlePauseAudio(): void {\n\t\tconst audioElement = audioReference.current;\n\t\tif (!audioElement) return;\n\t\tif (props.onPauseAudio) props.onPauseAudio(audioInformation);\n\t\taudioElement.pause();\n\t\tsetIsPlaying(false);\n\t}\n\n\tfunction handleToggleAudio(): void {\n\t\tif (isPlaying) handlePauseAudio();\n\t\telse handlePlayAudio();\n\t}\n\n\tfunction handleSliderChange(value: number): void {\n\t\tconst audioElement = audioReference.current;\n\t\tif (!audioElement) return;\n\n\t\tconst totalTime = audioElement.duration;\n\t\tconst currentTime = (value / 100) * totalTime;\n\n\t\taudioElement.currentTime = currentTime;\n\t}\n\n\tif (isDragging || !isPlaying) {\n\t\taudioReference.current?.pause();\n\t} else if (isPlaying) {\n\t\taudioReference.current?.play();\n\t}\n\n\tuseEffect(() => {\n\t\tconst audioElement = audioReference.current;\n\t\tif (!audioElement) return;\n\n\t\tconst handleTimeUpdate = () => {\n\t\t\tconst totalTime = audioElement.duration;\n\t\t\tconst currentTime = audioElement.currentTime;\n\n\t\t\tconst value = (currentTime / totalTime) * 100;\n\t\t\tsetSliderValue(value);\n\t\t};\n\n\t\taudioElement.addEventListener(\"timeupdate\", handleTimeUpdate);\n\n\t\treturn () => {\n\t\t\taudioElement.removeEventListener(\"timeupdate\", handleTimeUpdate);\n\t\t};\n\t}, [setSliderValue]);\n\n\treturn (\n\t\t<div className=\"arkynAudioPlayer\" style={style}>\n\t\t\t<audio\n\t\t\t\t{...rest}\n\t\t\t\tref={audioReference}\n\t\t\t\tsrc={props.src || undefined}\n\t\t\t\tonEnded={handlePauseAudio}\n\t\t\t/>\n\n\t\t\t<button type=\"button\" disabled={disabled} onClick={handleToggleAudio}>\n\t\t\t\t{isPlaying && <Pause />}\n\t\t\t\t{!isPlaying && <Play />}\n\t\t\t</button>\n\n\t\t\t<p>{formattedCurrentTime}</p>\n\n\t\t\t<Slider\n\t\t\t\tvalue={sliderValue}\n\t\t\t\tonChange={handleSliderChange}\n\t\t\t\tonDragging={setIsDragging}\n\t\t\t\tdisabled={disabled}\n\t\t\t/>\n\n\t\t\t<p>{formattedTotalTime}</p>\n\t\t</div>\n\t);\n}\n\nexport { AudioPlayer };\n"],"mappings":";;;;;;;AAgEA,SAAS,EAAY,GAAsC;CAC1D,IAAM,EAAE,gBAAa,iBAAc,aAAU,UAAO,GAAG,MAAS,GAE1D,CAAC,GAAa,KAAkB,EAAU,CAAC,GAC3C,CAAC,GAAW,KAAgB,EAAS,EAAK,GAC1C,CAAC,GAAY,KAAiB,EAAS,EAAK,GAE5C,IAAiB,EAAyB,IAAI,GAE9C,IAAc,EAAe,SAAS,eAAe,GACrD,IAAY,EAAe,SAAS,YAAY,GAEhD,IAAuB,EAAW,CAAW,GAC7C,IAAqB,EAAW,CAAS,GAEzC,IAA0C;EAC/C;EACA;EACA;EACA;CACD;CAEA,SAAS,EAAW,GAAuB;EAC1C,IAAI,CAAC,GAAM,OAAO;EAElB,IAAM,IAAU,KAAK,MAAM,IAAO,EAAE,GAC9B,IAAU,KAAK,MAAM,IAAO,EAAE;EAKpC,OAAO,GAHkB,OAAO,CAAO,CAAC,CAAC,SAAS,GAAG,GAG3C,EAAiB,GAFF,OAAO,CAAO,CAAC,CAAC,SAAS,GAAG,GAEvB;CAC/B;CAEA,SAAS,IAAwB;EAChC,IAAM,IAAe,EAAe;EAC/B,MACD,EAAM,eAAa,EAAM,YAAY,CAAgB,GACzD,EAAa,KAAK,GAClB,EAAa,EAAI;CAClB;CAEA,SAAS,IAAyB;EACjC,IAAM,IAAe,EAAe;EAC/B,MACD,EAAM,gBAAc,EAAM,aAAa,CAAgB,GAC3D,EAAa,MAAM,GACnB,EAAa,EAAK;CACnB;CAEA,SAAS,IAA0B;EAClC,AAAI,IAAW,EAAiB,IAC3B,EAAgB;CACtB;CAEA,SAAS,EAAmB,GAAqB;EAChD,IAAM,IAAe,EAAe;EACpC,IAAI,CAAC,GAAc;EAEnB,IAAM,IAAY,EAAa;EAG/B,EAAa,cAFQ,IAAQ,MAAO;CAGrC;CA2BA,OAzBI,KAAc,CAAC,IAClB,EAAe,SAAS,MAAM,IACpB,KACV,EAAe,SAAS,KAAK,GAG9B,QAAgB;EACf,IAAM,IAAe,EAAe;EACpC,IAAI,CAAC,GAAc;EAEnB,IAAM,UAAyB;GAC9B,IAAM,IAAY,EAAa;GAI/B,EAHoB,EAAa,cAEJ,IAAa,GACtB;EACrB;EAIA,OAFA,EAAa,iBAAiB,cAAc,CAAgB,SAE/C;GACZ,EAAa,oBAAoB,cAAc,CAAgB;EAChE;CACD,GAAG,CAAC,CAAc,CAAC,GAGlB,kBAAC,OAAD;EAAK,WAAU;EAA0B;YAAzC;GACC,kBAAC,SAAD;IACC,GAAI;IACJ,KAAK;IACL,KAAK,EAAM,OAAO,KAAA;IAClB,SAAS;GACT,CAAA;GAED,kBAAC,UAAD;IAAQ,MAAK;IAAmB;IAAU,SAAS;cAAnD,CACE,KAAa,kBAAC,GAAD,CAAQ,CAAA,GACrB,CAAC,KAAa,kBAAC,GAAD,CAAO,CAAA,CACf;;GAER,kBAAC,KAAD,EAAA,UAAI,EAAwB,CAAA;GAE5B,kBAAC,GAAD;IACC,OAAO;IACP,UAAU;IACV,YAAY;IACF;GACV,CAAA;GAED,kBAAC,KAAD,EAAA,UAAI,EAAsB,CAAA;EACtB;;AAEP"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/audioUpload/index.tsx"],"sourcesContent":["import { useState } from \"react\";\n\nimport { useForm } from \"../../hooks/useForm\";\nimport { FieldError } from \"../fieldError\";\nimport { FieldLabel } from \"../fieldLabel\";\nimport { FieldWrapper } from \"../fieldWrapper\";\n\nimport { HasFileContent } from \"./hasFileContent\";\nimport { NoFileContent } from \"./noFileContent\";\nimport \"./styles.css\";\n\ntype AudioUploadProps = {\n\t/** Field name for form submission (stores the uploaded audio URL). Required. */\n\tname: string;\n\t/** Server endpoint URL that receives the `multipart/form-data` upload request. Required. */\n\taction: string;\n\t/** Form-data field name used for the file. @default \"file\" */\n\tfileName?: string;\n\t/** HTTP method for the upload request. @default \"POST\" */\n\tmethod?: string;\n\t/** Accepted audio MIME types or extensions (e.g. `\"audio/mp3,audio/wav\"`). @default \"audio/*\" */\n\tacceptAudio?: string;\n\t/** Text displayed in the drag-and-drop zone. @default \"Ou arraste e solte um arquivo de áudio aqui\" */\n\tdropAudioText?: string;\n\t/** Label for the file-picker button before a file is selected. @default \"Selecionar arquivo de áudio\" */\n\tselectAudioButtonText?: string;\n\t/** Label for the file-picker button after a file is selected. @default \"Trocar arquivo de áudio\" */\n\tchangeAudioButtonText?: string;\n\t/** Callback fired after a successful upload. Receives the URL returned by the server. */\n\tonChange?: (url?: string) => void;\n\t/** Property name in the server response that contains the file URL. @default \"url\" */\n\tfileResponseName?: string;\n\t/** Optional label text displayed above the upload area. */\n\tlabel?: string;\n\t/** Displays an asterisk on the label to signal a required field. @default false */\n\tshowAsterisk?: boolean;\n\t/** Disables file selection and upload. @default false */\n\tdisabled?: boolean;\n\t/** Pre-populated audio URL (e.g. an existing recording). @default \"\" */\n\tdefaultValue?: string;\n};\n\n/**\n * AudioUpload
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/audioUpload/index.tsx"],"sourcesContent":["import { useState } from \"react\";\n\nimport { useForm } from \"../../hooks/useForm\";\nimport { FieldError } from \"../fieldError\";\nimport { FieldLabel } from \"../fieldLabel\";\nimport { FieldWrapper } from \"../fieldWrapper\";\n\nimport { HasFileContent } from \"./hasFileContent\";\nimport { NoFileContent } from \"./noFileContent\";\nimport \"./styles.css\";\n\ntype AudioUploadProps = {\n\t/** Field name for form submission (stores the uploaded audio URL). Required. */\n\tname: string;\n\t/** Server endpoint URL that receives the `multipart/form-data` upload request. Required. */\n\taction: string;\n\t/** Form-data field name used for the file. @default \"file\" */\n\tfileName?: string;\n\t/** HTTP method for the upload request. @default \"POST\" */\n\tmethod?: string;\n\t/** Accepted audio MIME types or extensions (e.g. `\"audio/mp3,audio/wav\"`). @default \"audio/*\" */\n\tacceptAudio?: string;\n\t/** Text displayed in the drag-and-drop zone. @default \"Ou arraste e solte um arquivo de áudio aqui\" */\n\tdropAudioText?: string;\n\t/** Label for the file-picker button before a file is selected. @default \"Selecionar arquivo de áudio\" */\n\tselectAudioButtonText?: string;\n\t/** Label for the file-picker button after a file is selected. @default \"Trocar arquivo de áudio\" */\n\tchangeAudioButtonText?: string;\n\t/** Callback fired after a successful upload. Receives the URL returned by the server. */\n\tonChange?: (url?: string) => void;\n\t/** Property name in the server response that contains the file URL. @default \"url\" */\n\tfileResponseName?: string;\n\t/** Optional label text displayed above the upload area. */\n\tlabel?: string;\n\t/** Displays an asterisk on the label to signal a required field. @default false */\n\tshowAsterisk?: boolean;\n\t/** Disables file selection and upload. @default false */\n\tdisabled?: boolean;\n\t/** Pre-populated audio URL (e.g. an existing recording). @default \"\" */\n\tdefaultValue?: string;\n};\n\n/**\n * AudioUpload, drag-and-drop audio file uploader with server upload and playback preview.\n *\n * Sends the file via `fetch` as `multipart/form-data` and stores the returned URL\n * in a hidden `<input>` for form submission.\n * Integrates with `useForm` to display validation errors by field name.\n *\n * @param props.name - Field name for form submission. Required.\n * @param props.action - Upload endpoint URL. Required.\n * @param props.fileName - Form-data field name for the file. Default: \"file\"\n * @param props.method - HTTP method. Default: \"POST\"\n * @param props.acceptAudio - Accepted MIME types / extensions. Default: \"audio/*\"\n * @param props.onChange - Callback fired after a successful upload, receives the audio URL.\n * @param props.fileResponseName - Server response property containing the URL. Default: \"url\"\n * @param props.label - Label text displayed above the upload area.\n * @param props.showAsterisk - Appends `*` to the label. Default: false\n * @param props.disabled - Disables file selection and upload. Default: false\n * @param props.defaultValue - Pre-populated audio URL.\n *\n * @returns AudioUpload JSX element wrapped in `FieldWrapper`.\n *\n * @example\n * ```tsx\n * // Basic\n * <AudioUpload name=\"audio\" action=\"/api/upload\" />\n *\n * // With label and custom texts\n * <AudioUpload\n * name=\"podcast\"\n * action=\"/api/upload/podcast\"\n * label=\"Podcast Episode\"\n * showAsterisk\n * selectAudioButtonText=\"Choose audio file\"\n * onChange={(url) => setPodcastUrl(url)}\n * />\n * ```\n */\n\nfunction AudioUpload(props: AudioUploadProps) {\n\tconst {\n\t\tname,\n\t\tlabel,\n\t\tfileName = \"file\",\n\t\tmethod = \"POST\",\n\t\tonChange,\n\t\tfileResponseName = \"url\",\n\t\tselectAudioButtonText = \"Selecionar arquivo de áudio\",\n\t\tdropAudioText = \"Ou arraste e solte um arquivo de áudio aqui\",\n\t\tchangeAudioButtonText = \"Trocar arquivo de áudio\",\n\t\tacceptAudio = \"audio/*\",\n\t\taction,\n\t\tdefaultValue = \"\",\n\t\tshowAsterisk = false,\n\t\tdisabled = false,\n\t} = props;\n\n\tconst { fieldErrors } = useForm();\n\tconst fieldError = fieldErrors?.[name];\n\n\tconst [value, setValue] = useState(defaultValue);\n\tconst [error, setError] = useState(\"\");\n\tconst [file, setFile] = useState<File | null>(null);\n\tconst [filePath, setFilePath] = useState(defaultValue);\n\tconst [isLoading, setIsLoading] = useState(false);\n\n\tasync function handleUploadAudio(file: File) {\n\t\tif (disabled) return;\n\n\t\tsetIsLoading(true);\n\t\tsetFile(file);\n\t\tsetError(\"\");\n\n\t\tconst formData = new FormData();\n\t\tformData.append(fileName, file);\n\n\t\tawait fetch(action, { method: method, body: formData })\n\t\t\t.then(async (response) => await response.json())\n\t\t\t.then((response) => {\n\t\t\t\tif (response?.error) setError(response.error);\n\t\t\t\telse setValue(response?.[fileResponseName]);\n\t\t\t\tonChange?.(response?.[fileResponseName]);\n\t\t\t})\n\t\t\t.catch((error) => {\n\t\t\t\tconsole.error(error);\n\t\t\t\tsetError(\"Erro ao enviar audio\");\n\t\t\t})\n\t\t\t.finally(() => setIsLoading(false));\n\t}\n\n\tfunction handleSelectFile(file: File) {\n\t\tif (disabled) return;\n\n\t\tif (file.type.indexOf(\"audio\") === -1) {\n\t\t\tsetError(\"O arquivo selecionado não é um arquivo de áudio\");\n\t\t\treturn;\n\t\t}\n\n\t\tsetFilePath(URL.createObjectURL(file));\n\t\thandleUploadAudio(file);\n\t}\n\n\tconst errorMessage = fieldError || error;\n\n\tconst hasErrorClassName = errorMessage ? \"hasError\" : \"noHasError\";\n\tconst hasImageClassName = filePath ? \"hasAudio\" : \"noHasAudio\";\n\tconst className = `arkynAudioUpload ${hasErrorClassName} ${hasImageClassName}`;\n\n\treturn (\n\t\t<FieldWrapper>\n\t\t\t{label && <FieldLabel showAsterisk={showAsterisk}>{label}</FieldLabel>}\n\n\t\t\t<div className={className}>\n\t\t\t\t<input type=\"hidden\" name={name} value={value || \"\"} />\n\n\t\t\t\t{!filePath && (\n\t\t\t\t\t<NoFileContent\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\tisLoading={isLoading}\n\t\t\t\t\t\tacceptAudio={acceptAudio}\n\t\t\t\t\t\tdropAudioText={dropAudioText}\n\t\t\t\t\t\thandleSelectFile={handleSelectFile}\n\t\t\t\t\t\tselectAudioButtonText={selectAudioButtonText}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\n\t\t\t\t{filePath && (\n\t\t\t\t\t<HasFileContent\n\t\t\t\t\t\tfilePath={filePath}\n\t\t\t\t\t\tacceptAudio={acceptAudio}\n\t\t\t\t\t\tchangeAudioButtonText={changeAudioButtonText}\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\thandleSelectFile={handleSelectFile}\n\t\t\t\t\t\tisLoading={isLoading}\n\t\t\t\t\t\treSendAudio={\n\t\t\t\t\t\t\terrorMessage && file ? () => handleUploadAudio(file) : undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</div>\n\n\t\t\t{errorMessage && <FieldError>{errorMessage}</FieldError>}\n\t\t</FieldWrapper>\n\t);\n}\n\nexport { AudioUpload };\n"],"mappings":";;;;;;;;;;AAgFA,SAAS,EAAY,GAAyB;CAC7C,IAAM,EACL,SACA,UACA,cAAW,QACX,YAAS,QACT,aACA,sBAAmB,OACnB,2BAAwB,+BACxB,mBAAgB,+CAChB,2BAAwB,2BACxB,iBAAc,WACd,WACA,kBAAe,IACf,kBAAe,IACf,cAAW,OACR,GAEE,EAAE,mBAAgB,EAAQ,GAC1B,IAAa,IAAc,IAE3B,CAAC,GAAO,KAAY,EAAS,CAAY,GACzC,CAAC,GAAO,KAAY,EAAS,EAAE,GAC/B,CAAC,GAAM,KAAW,EAAsB,IAAI,GAC5C,CAAC,GAAU,KAAe,EAAS,CAAY,GAC/C,CAAC,GAAW,KAAgB,EAAS,EAAK;CAEhD,eAAe,EAAkB,GAAY;EAC5C,IAAI,GAAU;EAId,AAFA,EAAa,EAAI,GACjB,EAAQ,CAAI,GACZ,EAAS,EAAE;EAEX,IAAM,IAAW,IAAI,SAAS;EAG9B,AAFA,EAAS,OAAO,GAAU,CAAI,GAE9B,MAAM,MAAM,GAAQ;GAAU;GAAQ,MAAM;EAAS,CAAC,CAAC,CACrD,KAAK,OAAO,MAAa,MAAM,EAAS,KAAK,CAAC,CAAC,CAC/C,MAAM,MAAa;GAGnB,AAFI,GAAU,QAAO,EAAS,EAAS,KAAK,IACvC,EAAS,IAAW,EAAiB,GAC1C,IAAW,IAAW,EAAiB;EACxC,CAAC,CAAC,CACD,OAAO,MAAU;GAEjB,AADA,QAAQ,MAAM,CAAK,GACnB,EAAS,sBAAsB;EAChC,CAAC,CAAC,CACD,cAAc,EAAa,EAAK,CAAC;CACpC;CAEA,SAAS,EAAiB,GAAY;EACjC,QAEJ;OAAI,EAAK,KAAK,QAAQ,OAAO,MAAM,IAAI;IACtC,EAAS,iDAAiD;IAC1D;GACD;GAGA,AADA,EAAY,IAAI,gBAAgB,CAAI,CAAC,GACrC,EAAkB,CAAI;EAHtB;CAID;CAEA,IAAM,IAAe,KAAc;CAMnC,OACC,kBAAC,GAAD,EAAA,UAAA;EACE,KAAS,kBAAC,GAAD;GAA0B;aAAe;EAAkB,CAAA;EAErE,kBAAC,OAAD;GAAgB,WAAA,oBARQ,IAAe,aAAa,aAEE,GAD9B,IAAW,aAAa;aAOhD;IACC,kBAAC,SAAD;KAAO,MAAK;KAAe;KAAM,OAAO,KAAS;IAAK,CAAA;IAErD,CAAC,KACD,kBAAC,GAAD;KACW;KACC;KACE;KACE;KACG;KACK;IACvB,CAAA;IAGD,KACA,kBAAC,GAAD;KACW;KACG;KACU;KACb;KACQ;KACP;KACX,aACC,KAAgB,UAAa,EAAkB,CAAI,IAAI,KAAA;IAExD,CAAA;GAEE;;EAEJ,KAAgB,kBAAC,GAAD,EAAA,UAAa,EAAyB,CAAA;CAC1C,EAAA,CAAA;AAEhB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/badge/index.tsx"],"sourcesContent":["import type { LucideIcon } from \"lucide-react\";\nimport type { HTMLAttributes } from \"react\";\n\nimport { IconRenderer } from \"../../services/iconRenderer\";\nimport \"./styles.css\";\n\ntype BadgeProps = HTMLAttributes<HTMLDivElement> & {\n\t/**\n\t * Badge size.\n\t * @default \"lg\"\n\t */\n\tsize?: \"md\" | \"lg\";\n\t/**\n\t * Visual style variant.\n\t * - `solid`: filled background.\n\t * - `outline`: bordered, transparent background.\n\t * - `ghost`: no border, subtle background on hover.\n\t * @default \"ghost\"\n\t */\n\tvariant?: \"solid\" | \"outline\" | \"ghost\";\n\t/**\n\t * Color scheme applied to the badge.\n\t * @default \"primary\"\n\t */\n\tscheme?: \"primary\" | \"secondary\" | \"success\" | \"warning\" | \"danger\" | \"info\";\n\t/** Lucide icon rendered to the left of the label. */\n\tleftIcon?: LucideIcon;\n\t/** Lucide icon rendered to the right of the label. */\n\trightIcon?: LucideIcon;\n};\n\n/**\n * Badge
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/badge/index.tsx"],"sourcesContent":["import type { LucideIcon } from \"lucide-react\";\nimport type { HTMLAttributes } from \"react\";\n\nimport { IconRenderer } from \"../../services/iconRenderer\";\nimport \"./styles.css\";\n\ntype BadgeProps = HTMLAttributes<HTMLDivElement> & {\n\t/**\n\t * Badge size.\n\t * @default \"lg\"\n\t */\n\tsize?: \"md\" | \"lg\";\n\t/**\n\t * Visual style variant.\n\t * - `solid`: filled background.\n\t * - `outline`: bordered, transparent background.\n\t * - `ghost`: no border, subtle background on hover.\n\t * @default \"ghost\"\n\t */\n\tvariant?: \"solid\" | \"outline\" | \"ghost\";\n\t/**\n\t * Color scheme applied to the badge.\n\t * @default \"primary\"\n\t */\n\tscheme?: \"primary\" | \"secondary\" | \"success\" | \"warning\" | \"danger\" | \"info\";\n\t/** Lucide icon rendered to the left of the label. */\n\tleftIcon?: LucideIcon;\n\t/** Lucide icon rendered to the right of the label. */\n\trightIcon?: LucideIcon;\n};\n\n/**\n * Badge, displays labels, statuses, and categorization tags.\n *\n * @param props.size - Badge size (`md` | `lg`). Default: \"lg\"\n * @param props.variant - Visual style variant. Default: \"ghost\"\n * @param props.scheme - Color scheme. Default: \"primary\"\n * @param props.leftIcon - Lucide icon rendered to the left of the label.\n * @param props.rightIcon - Lucide icon rendered to the right of the label.\n *\n * **...Other valid HTML properties for `<div>`**\n *\n * @returns Badge JSX element.\n *\n * @example\n * ```tsx\n * // Basic badge\n * <Badge>New</Badge>\n *\n * // With color scheme\n * <Badge scheme=\"success\">Approved</Badge>\n *\n * // With icon\n * <Badge leftIcon={CheckIcon} scheme=\"success\">Completed</Badge>\n *\n * // Custom size, variant and scheme\n * <Badge size=\"lg\" variant=\"solid\" scheme=\"warning\" rightIcon={AlertIcon}>\n * Warning\n * </Badge>\n * ```\n */\n\nfunction Badge(props: BadgeProps) {\n\tconst {\n\t\tvariant = \"ghost\",\n\t\tscheme = \"primary\",\n\t\tsize = \"lg\",\n\t\tleftIcon,\n\t\trightIcon,\n\t\tclassName: baseClassName = \"\",\n\t\tchildren,\n\t\t...rest\n\t} = props;\n\n\tconst iconSizes = { md: 12, lg: 14 };\n\tconst iconSize = iconSizes[size];\n\n\tconst className = `arkynBadge ${variant} ${scheme} ${size} ${baseClassName}`;\n\n\treturn (\n\t\t<div className={className.trim()} {...rest}>\n\t\t\t<IconRenderer iconSize={iconSize} icon={leftIcon} />\n\t\t\t<p>{children}</p>\n\t\t\t<IconRenderer iconSize={iconSize} icon={rightIcon} />\n\t\t</div>\n\t);\n}\n\nexport { Badge };\n"],"mappings":";;;;AA8DA,SAAS,EAAM,GAAmB;CACjC,IAAM,EACL,aAAU,SACV,YAAS,WACT,UAAO,MACP,aACA,cACA,WAAW,IAAgB,IAC3B,aACA,GAAG,MACA,GAGE,IAAW;EADG,IAAI;EAAI,IAAI;CACf,EAAU;CAI3B,OACC,kBAAC,OAAD;EAAK,WAAW,cAHe,EAAQ,GAAG,EAAO,GAAG,EAAK,GAAG,IAGlC,KAAK;EAAG,GAAI;YAAtC;GACC,kBAAC,GAAD;IAAwB;IAAU,MAAM;GAAW,CAAA;GACnD,kBAAC,KAAD,EAAI,YAAY,CAAA;GAChB,kBAAC,GAAD;IAAwB;IAAU,MAAM;GAAY,CAAA;EAChD;;AAEP"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/button/index.tsx"],"sourcesContent":["import { Loader2, type LucideIcon } from \"lucide-react\";\nimport type { ButtonHTMLAttributes } from \"react\";\n\nimport { IconRenderer } from \"../../services/iconRenderer\";\nimport \"./styles.css\";\n\ntype ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {\n\t/** Shows a spinner and disables the button during async operations. @default false */\n\tisLoading?: boolean;\n\t/** Text displayed beside the spinner when `isLoading` is true. */\n\tloadingText?: string;\n\t/**\n\t * Button size.\n\t * @default \"md\"\n\t */\n\tsize?: \"xs\" | \"sm\" | \"md\" | \"lg\";\n\t/**\n\t * Visual style variant.\n\t * - `solid`: filled background.\n\t * - `outline`: bordered, transparent background.\n\t * - `ghost`: no border, subtle hover.\n\t * - `invisible`: no visual styling.\n\t * @default \"solid\"\n\t */\n\tvariant?: \"solid\" | \"outline\" | \"ghost\" | \"invisible\";\n\t/**\n\t * Color scheme applied to the button.\n\t * @default \"primary\"\n\t */\n\tscheme?: \"primary\" | \"secondary\" | \"success\" | \"warning\" | \"danger\" | \"info\";\n\t/** Lucide icon rendered to the left of the label. */\n\tleftIcon?: LucideIcon;\n\t/** Lucide icon rendered to the right of the label. */\n\trightIcon?: LucideIcon;\n};\n\n/**\n * Button
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/button/index.tsx"],"sourcesContent":["import { Loader2, type LucideIcon } from \"lucide-react\";\nimport type { ButtonHTMLAttributes } from \"react\";\n\nimport { IconRenderer } from \"../../services/iconRenderer\";\nimport \"./styles.css\";\n\ntype ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {\n\t/** Shows a spinner and disables the button during async operations. @default false */\n\tisLoading?: boolean;\n\t/** Text displayed beside the spinner when `isLoading` is true. */\n\tloadingText?: string;\n\t/**\n\t * Button size.\n\t * @default \"md\"\n\t */\n\tsize?: \"xs\" | \"sm\" | \"md\" | \"lg\";\n\t/**\n\t * Visual style variant.\n\t * - `solid`: filled background.\n\t * - `outline`: bordered, transparent background.\n\t * - `ghost`: no border, subtle hover.\n\t * - `invisible`: no visual styling.\n\t * @default \"solid\"\n\t */\n\tvariant?: \"solid\" | \"outline\" | \"ghost\" | \"invisible\";\n\t/**\n\t * Color scheme applied to the button.\n\t * @default \"primary\"\n\t */\n\tscheme?: \"primary\" | \"secondary\" | \"success\" | \"warning\" | \"danger\" | \"info\";\n\t/** Lucide icon rendered to the left of the label. */\n\tleftIcon?: LucideIcon;\n\t/** Lucide icon rendered to the right of the label. */\n\trightIcon?: LucideIcon;\n};\n\n/**\n * Button, used for user interactions and form submissions.\n *\n * @param props.isLoading - Shows a spinner and disables the button. Default: false\n * @param props.loadingText - Text displayed beside the spinner when loading.\n * @param props.size - Button size (`xs` | `sm` | `md` | `lg`). Default: \"md\"\n * @param props.variant - Visual style variant. Default: \"solid\"\n * @param props.scheme - Color scheme. Default: \"primary\"\n * @param props.leftIcon - Lucide icon rendered to the left of the label.\n * @param props.rightIcon - Lucide icon rendered to the right of the label.\n *\n * **...Other valid HTML properties for `<button>`**\n *\n * @returns Button JSX element.\n *\n * @example\n * ```tsx\n * // Basic button\n * <Button>Click me</Button>\n *\n * // With color scheme\n * <Button scheme=\"success\">Save</Button>\n *\n * // With loading state\n * <Button isLoading loadingText=\"Saving...\">Save</Button>\n *\n * // With icons\n * <Button leftIcon={SaveIcon} scheme=\"success\">Save</Button>\n *\n * // Custom size, variant and scheme\n * <Button size=\"lg\" variant=\"outline\" scheme=\"danger\" rightIcon={TrashIcon}>\n * Delete\n * </Button>\n * ```\n */\n\nfunction Button(props: ButtonProps) {\n\tconst {\n\t\tisLoading = false,\n\t\tscheme = \"primary\",\n\t\tvariant = \"solid\",\n\t\tloadingText,\n\t\tsize = \"md\",\n\t\tleftIcon,\n\t\trightIcon,\n\t\tdisabled,\n\t\tclassName: baseClassName = \"\",\n\t\tchildren,\n\t\t...rest\n\t} = props;\n\n\tconst iconSizes = { xs: 12, sm: 16, md: 20, lg: 24 };\n\tconst iconSize = iconSizes[size];\n\n\tconst loadingClass = isLoading ? \"loadingTrue\" : \"loadingFalse\";\n\tconst loadingTextClass = loadingText ? \"loadingTextTrue\" : \"loadingTextFalse\";\n\n\tconst className = `arkynButton ${loadingClass} ${variant} ${scheme} ${size} ${loadingTextClass} ${baseClassName}`;\n\n\treturn (\n\t\t<button className={className} disabled={disabled || isLoading} {...rest}>\n\t\t\t<div className=\"arkynButtonSpinner\">\n\t\t\t\t<Loader2 size={iconSize} strokeWidth={2.5} />\n\t\t\t\t{loadingText && loadingText}\n\t\t\t</div>\n\n\t\t\t<div className=\"arkynButtonContent\">\n\t\t\t\t<IconRenderer iconSize={iconSize} icon={leftIcon} />\n\t\t\t\t{children}\n\t\t\t\t<IconRenderer iconSize={iconSize} icon={rightIcon} />\n\t\t\t</div>\n\t\t</button>\n\t);\n}\n\nexport { Button };\n"],"mappings":";;;;;AAwEA,SAAS,EAAO,GAAoB;CACnC,IAAM,EACL,eAAY,IACZ,YAAS,WACT,aAAU,SACV,gBACA,UAAO,MACP,aACA,cACA,aACA,WAAW,IAAgB,IAC3B,aACA,GAAG,MACA,GAGE,IAAW;EADG,IAAI;EAAI,IAAI;EAAI,IAAI;EAAI,IAAI;CAC/B,EAAU;CAO3B,OACC,kBAAC,UAAD;EAAmB,WAAA,eANC,IAAY,gBAAgB,eAGH,GAAG,EAAQ,GAAG,EAAO,GAAG,EAAK,GAFlD,IAAc,oBAAoB,mBAEoC,GAAG;EAGnE,UAAU,KAAY;EAAW,GAAI;YAAnE,CACC,kBAAC,OAAD;GAAK,WAAU;aAAf,CACC,kBAAC,GAAD;IAAS,MAAM;IAAU,aAAa;GAAM,CAAA,GAC3C,KAAe,CACZ;MAEL,kBAAC,OAAD;GAAK,WAAU;aAAf;IACC,kBAAC,GAAD;KAAwB;KAAU,MAAM;IAAW,CAAA;IAClD;IACD,kBAAC,GAAD;KAAwB;KAAU,MAAM;IAAY,CAAA;GAChD;IACE;;AAEV"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/cardTab/cardTabButton/index.tsx"],"sourcesContent":["import type { ButtonHTMLAttributes, MouseEvent, ReactNode } from \"react\";\n\nimport { useCardTab } from \"../cardTabContext\";\nimport \"./styles.css\";\n\ntype CardTabButtonProps = Omit<\n\tButtonHTMLAttributes<HTMLButtonElement>,\n\t\"children\" | \"value\" | \"type\"\n> & {\n\t/** Content displayed inside the tab button. */\n\tchildren: ReactNode;\n\t/** Unique identifier for this tab; matched against the container's active value. */\n\tvalue: string;\n};\n\n/**\n * CardTabButton
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/cardTab/cardTabButton/index.tsx"],"sourcesContent":["import type { ButtonHTMLAttributes, MouseEvent, ReactNode } from \"react\";\n\nimport { useCardTab } from \"../cardTabContext\";\nimport \"./styles.css\";\n\ntype CardTabButtonProps = Omit<\n\tButtonHTMLAttributes<HTMLButtonElement>,\n\t\"children\" | \"value\" | \"type\"\n> & {\n\t/** Content displayed inside the tab button. */\n\tchildren: ReactNode;\n\t/** Unique identifier for this tab; matched against the container's active value. */\n\tvalue: string;\n};\n\n/**\n * CardTabButton, individual tab button inside a `CardTabContainer`.\n *\n * Reads active state and disabled state from `CardTabContainer` context.\n * The button's own `disabled` prop is ORed with the container's `disabled`.\n *\n * @param props.children - Tab label content. Required.\n * @param props.value - Tab identifier. Required.\n * @param props.disabled - Disables this tab individually (container can also disable all tabs).\n *\n * **...Other valid HTML `<button>` properties except `type`**\n *\n * @returns CardTabButton JSX element.\n *\n * @example\n * ```tsx\n * <CardTabContainer defaultValue=\"details\" onChange={setTab}>\n * <CardTabButton value=\"details\">Details</CardTabButton>\n * <CardTabButton value=\"history\">History</CardTabButton>\n * <CardTabButton value=\"settings\" disabled>Settings</CardTabButton>\n * </CardTabContainer>\n * ```\n */\n\nfunction CardTabButton(props: CardTabButtonProps) {\n\tconst {\n\t\tchildren,\n\t\tdisabled: rawDisabled = false,\n\t\tclassName: baseClassName = \"\",\n\t\tonClick,\n\t\tvalue,\n\t\t...rest\n\t} = props;\n\n\tconst { disabled, currentTab, changeCurrentTab } = useCardTab();\n\n\tconst isDisabled = disabled || rawDisabled;\n\n\tconst disabledClass = isDisabled ? \"isDisabled\" : \"\";\n\tconst activeClass = currentTab === value && value ? \"isActive\" : \"\";\n\tconst className = `arkynCardTabButton ${disabledClass} ${activeClass} ${baseClassName}`;\n\n\tfunction handleClick(event: MouseEvent<HTMLButtonElement>) {\n\t\tchangeCurrentTab(value);\n\t\tonClick?.(event);\n\t}\n\n\treturn (\n\t\t<button\n\t\t\tonClick={handleClick}\n\t\t\tclassName={className.trim()}\n\t\t\t{...rest}\n\t\t\tdisabled={isDisabled}\n\t\t\ttype=\"button\"\n\t\t>\n\t\t\t{children}\n\t\t</button>\n\t);\n}\n\nexport { CardTabButton };\n"],"mappings":";;;;AAuCA,SAAS,EAAc,GAA2B;CACjD,IAAM,EACL,aACA,UAAU,IAAc,IACxB,WAAW,IAAgB,IAC3B,YACA,UACA,GAAG,MACA,GAEE,EAAE,aAAU,eAAY,wBAAqB,EAAW,GAExD,IAAa,KAAY,GAIzB,IAAY,sBAFI,IAAa,eAAe,GAEI,GADlC,MAAe,KAAS,IAAQ,aAAa,GACI,GAAG;CAExE,SAAS,EAAY,GAAsC;EAE1D,AADA,EAAiB,CAAK,GACtB,IAAU,CAAK;CAChB;CAEA,OACC,kBAAC,UAAD;EACC,SAAS;EACT,WAAW,EAAU,KAAK;EAC1B,GAAI;EACJ,UAAU;EACV,MAAK;EAEJ;CACM,CAAA;AAEV"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/cardTab/cardTabContainer/index.tsx"],"sourcesContent":["import { type HTMLAttributes, type ReactNode, useState } from \"react\";\n\nimport { CardTabProvider } from \"../cardTabContext\";\nimport \"./styles.css\";\n\ntype CardTabContainerProps = Omit<\n\tHTMLAttributes<HTMLElement>,\n\t\"onClick\" | \"children\" | \"ref\" | \"onChange\"\n> & {\n\t/** `CardTabButton` components to render as tabs. Required. */\n\tchildren: ReactNode;\n\t/** Disables all tab buttons at once. @default false */\n\tdisabled?: boolean;\n\t/** Initially selected tab value. */\n\tdefaultValue?: string;\n\t/** Callback fired when the active tab changes, receiving the new value. */\n\tonChange?: (index: string) => void;\n};\n\n/**\n * CardTabContainer
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/cardTab/cardTabContainer/index.tsx"],"sourcesContent":["import { type HTMLAttributes, type ReactNode, useState } from \"react\";\n\nimport { CardTabProvider } from \"../cardTabContext\";\nimport \"./styles.css\";\n\ntype CardTabContainerProps = Omit<\n\tHTMLAttributes<HTMLElement>,\n\t\"onClick\" | \"children\" | \"ref\" | \"onChange\"\n> & {\n\t/** `CardTabButton` components to render as tabs. Required. */\n\tchildren: ReactNode;\n\t/** Disables all tab buttons at once. @default false */\n\tdisabled?: boolean;\n\t/** Initially selected tab value. */\n\tdefaultValue?: string;\n\t/** Callback fired when the active tab changes, receiving the new value. */\n\tonChange?: (index: string) => void;\n};\n\n/**\n * CardTabContainer, wrapper that manages active state for a group of `CardTabButton` components.\n *\n * Renders as a `<nav>` element. Provides context consumed by each `CardTabButton`.\n *\n * @param props.children - `CardTabButton` elements. Required.\n * @param props.defaultValue - Initially selected tab value.\n * @param props.disabled - Disables all buttons. Default: false\n * @param props.onChange - Called with the new value whenever the active tab changes.\n *\n * **...Other valid HTML `<nav>` properties**\n *\n * @returns CardTabContainer JSX element.\n *\n * @example\n * ```tsx\n * <CardTabContainer defaultValue=\"overview\" onChange={setActiveTab}>\n * <CardTabButton value=\"overview\">Overview</CardTabButton>\n * <CardTabButton value=\"analytics\">Analytics</CardTabButton>\n * <CardTabButton value=\"settings\">Settings</CardTabButton>\n * </CardTabContainer>\n *\n * {activeTab === 'overview' && <OverviewPanel />}\n * {activeTab === 'analytics' && <AnalyticsPanel />}\n * ```\n */\n\nfunction CardTabContainer(props: CardTabContainerProps) {\n\tconst {\n\t\tchildren,\n\t\tonChange,\n\t\tdefaultValue,\n\t\tdisabled = false,\n\t\tclassName: baseClassName,\n\t\t...rest\n\t} = props;\n\n\tconst [currentTab, setCurrentTab] = useState(defaultValue || \"\");\n\n\tconst className = `arkynCardTabContainer ${baseClassName || \"\"}`;\n\n\tfunction changeCurrentTab(value: string) {\n\t\tsetCurrentTab(value);\n\t\tif (onChange) onChange(value);\n\t}\n\n\treturn (\n\t\t<CardTabProvider\n\t\t\tdisabled={disabled}\n\t\t\tcurrentTab={currentTab}\n\t\t\tchangeCurrentTab={changeCurrentTab}\n\t\t>\n\t\t\t<nav className={className.trim()} {...rest}>\n\t\t\t\t{children}\n\t\t\t</nav>\n\t\t</CardTabProvider>\n\t);\n}\n\nexport { CardTabContainer };\n"],"mappings":";;;;;AA8CA,SAAS,EAAiB,GAA8B;CACvD,IAAM,EACL,aACA,aACA,iBACA,cAAW,IACX,WAAW,GACX,GAAG,MACA,GAEE,CAAC,GAAY,KAAiB,EAAS,KAAgB,EAAE,GAEzD,IAAY,yBAAyB,KAAiB;CAE5D,SAAS,EAAiB,GAAe;EAExC,AADA,EAAc,CAAK,GACf,KAAU,EAAS,CAAK;CAC7B;CAEA,OACC,kBAAC,GAAD;EACW;EACE;EACM;YAElB,kBAAC,OAAD;GAAK,WAAW,EAAU,KAAK;GAAG,GAAI;GACpC;EACG,CAAA;CACW,CAAA;AAEnB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/checkbox/index.tsx"],"sourcesContent":["import { Check } from \"lucide-react\";\nimport { type ButtonHTMLAttributes, useId, useRef, useState } from \"react\";\n\nimport { useForm } from \"../../hooks/useForm\";\nimport { FieldTemplate } from \"../../services/fieldTemplate\";\n\nimport \"./styles.css\";\n\ntype CheckboxProps = Omit<\n\tButtonHTMLAttributes<HTMLButtonElement>,\n\t| \"size\"\n\t| \"prefix\"\n\t| \"type\"\n\t| \"name\"\n\t| \"defaultValue\"\n\t| \"value\"\n\t| \"onChange\"\n\t| \"onSelect\"\n\t| \"onClick\"\n> & {\n\t/** Optional label text displayed beside the checkbox. */\n\tlabel?: string;\n\t/** Displays an asterisk on the label to signal a required field. */\n\tshowAsterisk?: boolean;\n\t/** When true, skips `FieldTemplate` wrapper (label and error text). @default false */\n\tunShowFieldTemplate?: boolean;\n\t/** Validation error message displayed below the checkbox. */\n\terrorMessage?: string;\n\t/**\n\t * Checkbox size.\n\t * @default \"md\"\n\t */\n\tsize?: \"md\" | \"lg\" | \"sm\";\n\t/** Field name for form submission. Required. */\n\tname: string;\n\t/** Value stored in the hidden input when checked. @default \"checked\" */\n\tvalue?: string;\n\t/** Controlled checked state. */\n\tchecked?: boolean;\n\t/** Uncontrolled initial checked state. @default false */\n\tdefaultChecked?: boolean;\n\t/** Callback fired on toggle
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/checkbox/index.tsx"],"sourcesContent":["import { Check } from \"lucide-react\";\nimport { type ButtonHTMLAttributes, useId, useRef, useState } from \"react\";\n\nimport { useForm } from \"../../hooks/useForm\";\nimport { FieldTemplate } from \"../../services/fieldTemplate\";\n\nimport \"./styles.css\";\n\ntype CheckboxProps = Omit<\n\tButtonHTMLAttributes<HTMLButtonElement>,\n\t| \"size\"\n\t| \"prefix\"\n\t| \"type\"\n\t| \"name\"\n\t| \"defaultValue\"\n\t| \"value\"\n\t| \"onChange\"\n\t| \"onSelect\"\n\t| \"onClick\"\n> & {\n\t/** Optional label text displayed beside the checkbox. */\n\tlabel?: string;\n\t/** Displays an asterisk on the label to signal a required field. */\n\tshowAsterisk?: boolean;\n\t/** When true, skips `FieldTemplate` wrapper (label and error text). @default false */\n\tunShowFieldTemplate?: boolean;\n\t/** Validation error message displayed below the checkbox. */\n\terrorMessage?: string;\n\t/**\n\t * Checkbox size.\n\t * @default \"md\"\n\t */\n\tsize?: \"md\" | \"lg\" | \"sm\";\n\t/** Field name for form submission. Required. */\n\tname: string;\n\t/** Value stored in the hidden input when checked. @default \"checked\" */\n\tvalue?: string;\n\t/** Controlled checked state. */\n\tchecked?: boolean;\n\t/** Uncontrolled initial checked state. @default false */\n\tdefaultChecked?: boolean;\n\t/** Callback fired on toggle, receives the value string (or `\"\"` when unchecked). */\n\tonCheck?: (value: string) => void;\n\t/**\n\t * Layout direction forwarded to `FieldTemplate`.\n\t * @default \"horizontalReverse\"\n\t */\n\torientation?: \"horizontal\" | \"vertical\" | \"horizontalReverse\";\n};\n\n/**\n * Checkbox, interactive checkbox input with label, validation, and form integration.\n *\n * Stores value in a hidden `<input>` for native form submission.\n * Integrates with `useForm` to display validation errors by field name.\n *\n * @param props.name - Field name for form submission. Required.\n * @param props.label - Label text displayed beside the checkbox.\n * @param props.size - Checkbox size (`sm` | `md` | `lg`). Default: \"md\"\n * @param props.value - Value stored when checked. Default: \"checked\"\n * @param props.checked - Controlled checked state.\n * @param props.defaultChecked - Uncontrolled initial checked state. Default: false\n * @param props.onCheck - Callback fired on toggle, receives value or `\"\"` when unchecked.\n * @param props.errorMessage - Validation error message.\n * @param props.showAsterisk - Appends `*` to the label.\n * @param props.orientation - Layout direction (`horizontal` | `vertical` | `horizontalReverse`). Default: \"horizontalReverse\"\n * @param props.unShowFieldTemplate - Skips wrapper, label, and error rendering. Default: false\n *\n * **...Other valid HTML properties for `<button>` (except `type`, `name`, `defaultValue`, `value`, `onChange`, `onSelect`, `onClick`)**\n *\n * @returns Checkbox JSX element wrapped in `FieldTemplate`.\n *\n * @example\n * ```tsx\n * // Basic\n * <Checkbox name=\"terms\" label=\"I agree to the terms and conditions\" />\n *\n * // With custom value and error\n * <Checkbox\n * name=\"newsletter\"\n * label=\"Subscribe to newsletter\"\n * value=\"subscribed\"\n * errorMessage={errors.newsletter}\n * />\n *\n * // Controlled\n * <Checkbox\n * name=\"premium\"\n * label=\"Enable premium features\"\n * size=\"lg\"\n * checked={isPremium}\n * onCheck={(v) => setIsPremium(!!v)}\n * />\n * ```\n */\n\nfunction Checkbox(props: CheckboxProps) {\n\tconst {\n\t\tid,\n\t\tname,\n\t\tclassName: wrapperClassName = \"\",\n\t\tsize = \"md\",\n\t\terrorMessage: baseErrorMessage,\n\t\tdefaultChecked = false,\n\t\tlabel,\n\t\tchecked: baseChecked = null,\n\t\tonCheck,\n\t\torientation = \"horizontalReverse\",\n\t\tshowAsterisk,\n\t\tunShowFieldTemplate,\n\t\tvalue,\n\t\t...rest\n\t} = props;\n\n\tconst { fieldErrors } = useForm();\n\n\tconst checkboxRef = useRef<HTMLInputElement>(null);\n\tconst generatedId = useId();\n\tconst checkboxId = id || generatedId;\n\n\tconst errorMessage = baseErrorMessage || fieldErrors?.[name];\n\tconst isError = !!errorMessage;\n\n\tconst [isChecked, setIsChecked] = useState(defaultChecked || false);\n\n\tconst currentChecked =\n\t\ttypeof baseChecked === \"boolean\" ? baseChecked : isChecked;\n\n\tconst errorClass = isError ? \"errorTrue\" : \"errorFalse\";\n\tconst currentCheckedClass = currentChecked ? \"checkedTrue\" : \"checkedFalse\";\n\n\tconst className = `arkynCheckbox ${size} ${errorClass} ${currentCheckedClass}`;\n\n\tfunction handleCheck() {\n\t\tconst defaultChecked = isChecked;\n\t\tsetIsChecked(!defaultChecked);\n\t\tonCheck?.(!defaultChecked ? value || \"checked\" : \"\");\n\t}\n\n\treturn (\n\t\t<FieldTemplate\n\t\t\tname={name}\n\t\t\tlabel={label}\n\t\t\tshowAsterisk={showAsterisk}\n\t\t\tclassName={wrapperClassName}\n\t\t\terrorMessage={errorMessage}\n\t\t\tunShowFieldTemplate={unShowFieldTemplate}\n\t\t\torientation={orientation}\n\t\t>\n\t\t\t<button\n\t\t\t\tid={checkboxId}\n\t\t\t\ttype=\"button\"\n\t\t\t\tclassName={className}\n\t\t\t\tonClick={handleCheck}\n\t\t\t\t{...rest}\n\t\t\t>\n\t\t\t\t<input\n\t\t\t\t\ttype=\"hidden\"\n\t\t\t\t\tname={name}\n\t\t\t\t\tref={checkboxRef}\n\t\t\t\t\tvalue={currentChecked ? value || \"checked\" : \"\"}\n\t\t\t\t/>\n\n\t\t\t\t<Check />\n\t\t\t</button>\n\t\t</FieldTemplate>\n\t);\n}\n\nexport { Checkbox };\n"],"mappings":";;;;;;;AAgGA,SAAS,EAAS,GAAsB;CACvC,IAAM,EACL,OACA,SACA,WAAW,IAAmB,IAC9B,UAAO,MACP,cAAc,GACd,oBAAiB,IACjB,UACA,SAAS,IAAc,MACvB,YACA,iBAAc,qBACd,iBACA,wBACA,UACA,GAAG,MACA,GAEE,EAAE,mBAAgB,EAAQ,GAE1B,IAAc,EAAyB,IAAI,GAC3C,IAAc,EAAM,GACpB,IAAa,KAAM,GAEnB,IAAe,KAAoB,IAAc,IACjD,IAAU,CAAC,CAAC,GAEZ,CAAC,GAAW,KAAgB,EAAS,KAAkB,EAAK,GAE5D,IACL,OAAO,KAAgB,YAAY,IAAc,GAK5C,IAAY,iBAAiB,EAAK,GAHrB,IAAU,cAAc,aAGW,GAF1B,IAAiB,gBAAgB;CAI7D,SAAS,IAAc;EACtB,IAAM,IAAiB;EAEvB,AADA,EAAa,CAAC,CAAc,GAC5B,IAAW,IAAsC,KAArB,KAAS,SAAc;CACpD;CAEA,OACC,kBAAC,GAAD;EACO;EACC;EACO;EACd,WAAW;EACG;EACO;EACR;YAEb,kBAAC,UAAD;GACC,IAAI;GACJ,MAAK;GACM;GACX,SAAS;GACT,GAAI;aALL,CAOC,kBAAC,SAAD;IACC,MAAK;IACC;IACN,KAAK;IACL,OAAO,IAAiB,KAAS,YAAY;GAC7C,CAAA,GAED,kBAAC,GAAD,CAAQ,CAAA,CACD;;CACM,CAAA;AAEjB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"clientOnly.js","names":[],"sources":["../../../src/components/clientOnly.tsx"],"sourcesContent":["import { useHydrated } from \"../hooks/useHydrated\";\n\ntype ClientOnlyProps = {\n\t/** Render function
|
|
1
|
+
{"version":3,"file":"clientOnly.js","names":[],"sources":["../../../src/components/clientOnly.tsx"],"sourcesContent":["import { useHydrated } from \"../hooks/useHydrated\";\n\ntype ClientOnlyProps = {\n\t/** Render function, called after hydration on the client. Required. */\n\tchildren(): React.ReactNode;\n\t/** Content rendered during SSR or before hydration. @default null */\n\tfallback?: React.ReactNode;\n};\n\n/**\n * ClientOnly, renders its children only after client-side hydration.\n *\n * Prevents React hydration mismatches for components that rely on browser-only APIs\n * (e.g. `window`, `navigator`, `document`). Uses `useHydrated` internally.\n *\n * @param props.children - Render function executed after hydration. Required.\n * @param props.fallback - Content shown during SSR / before hydration. Default: null\n *\n * @returns `children()` after hydration, otherwise `fallback`.\n *\n * @example\n * ```tsx\n * // With a skeleton fallback\n * <ClientOnly fallback={<Skeleton />}>\n * {() => <InteractiveWidget />}\n * </ClientOnly>\n *\n * // Using browser APIs safely\n * <ClientOnly fallback={<p>Loading...</p>}>\n * {() => <p>Current time: {new Date().toLocaleString()}</p>}\n * </ClientOnly>\n * ```\n */\n\nfunction ClientOnly(props: ClientOnlyProps) {\n\tconst { children, fallback = null } = props;\n\treturn useHydrated() ? children() : fallback;\n}\n\nexport { ClientOnly };\n"],"mappings":";;AAkCA,SAAS,EAAW,GAAwB;CAC3C,IAAM,EAAE,aAAU,cAAW,SAAS;CACtC,OAAO,EAAY,IAAI,EAAS,IAAI;AACrC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/currencyInput/index.tsx"],"sourcesContent":["import { Loader2, type LucideIcon } from \"lucide-react\";\nimport {\n\ttype ChangeEvent,\n\ttype FocusEvent,\n\ttype InputHTMLAttributes,\n\tuseEffect,\n\tuseId,\n\tuseRef,\n\tuseState,\n} from \"react\";\n\nimport { useForm } from \"../../hooks/useForm\";\nimport { FieldTemplate } from \"../../services/fieldTemplate\";\nimport { IconRenderer } from \"../../services/iconRenderer\";\nimport {\n\tmaskCurrencyValues,\n\tnormalizeValue,\n} from \"../../services/maskCurrencyValues\";\n\nimport \"./style.css\";\n\ntype Locale =\n\t| \"USD\"\n\t| \"EUR\"\n\t| \"JPY\"\n\t| \"GBP\"\n\t| \"AUD\"\n\t| \"CAD\"\n\t| \"CHF\"\n\t| \"CNY\"\n\t| \"SEK\"\n\t| \"NZD\"\n\t| \"BRL\"\n\t| \"INR\"\n\t| \"RUB\"\n\t| \"ZAR\"\n\t| \"MXN\"\n\t| \"SGD\"\n\t| \"HKD\"\n\t| \"NOK\"\n\t| \"KRW\"\n\t| \"TRY\"\n\t| \"IDR\"\n\t| \"THB\";\n\ntype CurrencyInputProps = Omit<\n\tInputHTMLAttributes<HTMLInputElement>,\n\t| \"size\"\n\t| \"prefix\"\n\t| \"name\"\n\t| \"type\"\n\t| \"max\"\n\t| \"defaultValue\"\n\t| \"value\"\n\t| \"onChange\"\n\t| \"placeholder\"\n> & {\n\t/** Field name for form submission. Required. */\n\tname: string;\n\t/**\n\t * Currency locale used to format the displayed value.\n\t * Supported: `\"USD\"` | `\"EUR\"` | `\"BRL\"` | `\"JPY\"` | `\"GBP\"` | … (22 locales).\n\t * Required.\n\t */\n\tlocale: Locale;\n\t/** Optional label text displayed above the input. */\n\tlabel?: string;\n\t/** Validation error message displayed below the input. */\n\terrorMessage?: string;\n\t/** Shows a spinner and disables the input during async operations. @default false */\n\tisLoading?: boolean;\n\t/** When true, skips `FieldTemplate` wrapper (label and error text). @default false */\n\tunShowFieldTemplate?: boolean;\n\t/**\n\t * Input size.\n\t * @default \"md\"\n\t */\n\tsize?: \"md\" | \"lg\";\n\t/**\n\t * Visual style variant.\n\t * - `solid`: filled background.\n\t * - `outline`: bordered, transparent background.\n\t * - `underline`: bottom border only.\n\t * @default \"solid\"\n\t */\n\tvariant?: \"solid\" | \"outline\" | \"underline\";\n\t/**\n\t * Layout direction forwarded to `FieldTemplate`.\n\t * @default \"horizontal\"\n\t */\n\torientation?: \"horizontal\" | \"vertical\" | \"horizontalReverse\";\n\t/** Text or icon rendered at the far left, outside the input area. */\n\tprefix?: string | LucideIcon;\n\t/** Text or icon rendered at the far right, outside the input area. */\n\tsuffix?: string | LucideIcon;\n\t/** Displays an asterisk on the label to signal a required field. */\n\tshowAsterisk?: boolean;\n\t/** Lucide icon rendered inside the input on the left. */\n\tleftIcon?: LucideIcon;\n\t/** Lucide icon rendered inside the input on the right. */\n\trightIcon?: LucideIcon;\n\t/** Maximum numeric value allowed. @default 1_000_000_000 */\n\tmax?: number;\n\t/** Controlled numeric value. */\n\tvalue?: number;\n\t/** Uncontrolled default numeric value. */\n\tdefaultValue?: number;\n\t/**\n\t * Callback fired on value change.\n\t * @param event - Native change event.\n\t * @param originalValue - Raw numeric string (e.g. `\"1234.56\"`).\n\t * @param maskedValue - Formatted display string (e.g. `\"$ 1,234.56\"`).\n\t */\n\tonChange?: (\n\t\tevent: ChangeEvent<HTMLInputElement>,\n\t\toriginalValue: string,\n\t\tmaskedValue: string,\n\t) => void;\n};\n\n/**\n * CurrencyInput — numeric input that automatically formats the displayed value according to a currency locale.\n *\n * The raw numeric value is stored in a hidden `<input>` for form submission.\n * Integrates with `useForm` to display validation errors by field name.\n *\n * @param props.name - Field name for form submission. Required.\n * @param props.locale - Currency locale (e.g. `\"USD\"`, `\"BRL\"`, `\"EUR\"`). Required.\n * @param props.label - Label text displayed above the input.\n * @param props.errorMessage - Validation error message.\n * @param props.isLoading - Shows a spinner and disables the input. Default: false\n * @param props.size - Input size (`md` | `lg`). Default: \"md\"\n * @param props.variant - Visual style variant. Default: \"solid\"\n * @param props.max - Maximum numeric value allowed. Default: 1_000_000_000\n * @param props.value - Controlled numeric value.\n * @param props.defaultValue - Uncontrolled default numeric value.\n * @param props.onChange - Callback fired on change — receives the event, the raw numeric string, and the formatted string.\n * @param props.prefix - Text or icon at the far left.\n * @param props.suffix - Text or icon at the far right.\n * @param props.leftIcon - Lucide icon inside the input on the left.\n * @param props.rightIcon - Lucide icon inside the input on the right.\n * @param props.showAsterisk - Appends `*` to the label.\n * @param props.orientation - Layout direction. Default: \"horizontal\"\n * @param props.unShowFieldTemplate - Skips wrapper, label, and error rendering. Default: false\n *\n * **...Other valid HTML properties for `<input>` (except `type`, `max`, `value`, `defaultValue`, `onChange`, `placeholder`)**\n *\n * @returns CurrencyInput JSX element wrapped in `FieldTemplate`.\n *\n * @example\n * ```tsx\n * // Basic\n * <CurrencyInput name=\"price\" locale=\"USD\" />\n *\n * // With label and validation\n * <CurrencyInput\n * name=\"salary\"\n * locale=\"BRL\"\n * label=\"Monthly Salary\"\n * showAsterisk\n * errorMessage=\"Please enter a valid amount\"\n * />\n *\n * // With max value and controlled state\n * <CurrencyInput\n * name=\"limit\"\n * locale=\"USD\"\n * label=\"Credit Limit\"\n * max={10000}\n * value={creditLimit}\n * onChange={(e, original) => setCreditLimit(Number(original))}\n * />\n * ```\n */\n\nfunction CurrencyInput(props: CurrencyInputProps) {\n\tconst {\n\t\tname,\n\t\tdisabled,\n\t\ttitle,\n\t\tstyle,\n\t\tvariant = \"solid\",\n\t\tlabel,\n\t\tclassName: wrapperClassName = \"\",\n\t\tvalue,\n\t\tdefaultValue,\n\t\tmax = 1000000000,\n\t\tlocale,\n\t\tonChange,\n\t\tprefix,\n\t\tsuffix,\n\t\tisLoading = false,\n\t\tleftIcon,\n\t\treadOnly,\n\t\tonFocus,\n\t\tonBlur,\n\t\terrorMessage: baseErrorMessage,\n\t\tunShowFieldTemplate,\n\t\torientation,\n\t\tshowAsterisk,\n\t\trightIcon,\n\t\tsize = \"md\",\n\t\tid,\n\t\t...rest\n\t} = props;\n\n\tconst { fieldErrors } = useForm();\n\tconst [isFocused, setIsFocused] = useState(false);\n\tconst [maskedValue, setMaskedValue] = useState(\"0\");\n\n\tconst inputRef = useRef<HTMLInputElement>(null);\n\tconst generatedId = useId();\n\tconst inputId = id || generatedId;\n\n\tconst errorMessage = baseErrorMessage || fieldErrors?.[name];\n\tconst isError = !!errorMessage;\n\tconst isDisabled = disabled || isLoading;\n\n\tconst iconSizes = { md: 20, lg: 20 };\n\tconst iconSize = iconSizes[size];\n\n\tconst loadingPosition = rightIcon ? \"right\" : \"left\";\n\n\tconst showLeftSpinner = loadingPosition === \"left\" && isLoading;\n\tconst showRightSpinner = loadingPosition === \"right\" && isLoading;\n\n\tfunction handleSectionClick() {\n\t\tif (isDisabled || !inputRef?.current) return;\n\t\tsetIsFocused(true);\n\t\tinputRef.current.focus();\n\t}\n\n\tfunction handleFocus(e: FocusEvent<HTMLInputElement>) {\n\t\tsetIsFocused(true);\n\t\tif (onFocus) onFocus(e);\n\t}\n\n\tfunction handleBlur(e: FocusEvent<HTMLInputElement>) {\n\t\tsetIsFocused(false);\n\t\tif (onBlur) onBlur(e);\n\t}\n\n\tconst updateValues = (originalValue: string | number) => {\n\t\tconst [calculatedValue, calculatedMaskedValue] = maskCurrencyValues(\n\t\t\toriginalValue,\n\t\t\tlocale,\n\t\t);\n\n\t\tif (!max || calculatedValue <= max) {\n\t\t\tsetMaskedValue(calculatedMaskedValue);\n\t\t\treturn [calculatedValue, calculatedMaskedValue];\n\t\t}\n\n\t\treturn maskCurrencyValues(originalValue, locale);\n\t};\n\n\tconst handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n\t\tevent.preventDefault();\n\t\tconst [originalValue, maskedValue] = updateValues(event.target.value);\n\n\t\tonChange?.(event, String(originalValue), String(maskedValue));\n\t};\n\n\tuseEffect(() => {\n\t\tfunction currentValue() {\n\t\t\tif (typeof value === \"number\") return value;\n\t\t\tif (typeof defaultValue === \"number\") return defaultValue;\n\t\t\treturn undefined;\n\t\t}\n\n\t\tconst [, maskedValue] = maskCurrencyValues(currentValue(), locale);\n\n\t\tsetMaskedValue(maskedValue);\n\t}, [locale, defaultValue, value]);\n\n\tconst hasPrefix = prefix ? \"hasPrefix\" : \"\";\n\tconst hasSuffix = suffix ? \"hasSuffix\" : \"\";\n\tconst errored = isError ? \"errored\" : \"\";\n\tconst opacity = isDisabled || readOnly || isLoading ? \"opacity\" : \"\";\n\tconst focused = isFocused ? \"focused\" : \"\";\n\n\tconst className = `arkynCurrencyInput ${hasPrefix} ${hasSuffix} ${variant} ${size} ${opacity} ${errored} ${focused}`;\n\n\treturn (\n\t\t<FieldTemplate\n\t\t\tname={name}\n\t\t\tlabel={label}\n\t\t\tshowAsterisk={showAsterisk}\n\t\t\tclassName={wrapperClassName}\n\t\t\terrorMessage={errorMessage}\n\t\t\tunShowFieldTemplate={unShowFieldTemplate}\n\t\t\torientation={orientation}\n\t\t>\n\t\t\t<section\n\t\t\t\ttitle={title}\n\t\t\t\tstyle={style}\n\t\t\t\tclassName={className}\n\t\t\t\tonClick={handleSectionClick}\n\t\t\t>\n\t\t\t\t<IconRenderer iconSize={iconSize} icon={prefix} className=\"prefix\" />\n\n\t\t\t\t<IconRenderer\n\t\t\t\t\tshow={showLeftSpinner}\n\t\t\t\t\ticonSize={iconSize}\n\t\t\t\t\tclassName=\"spinner\"\n\t\t\t\t\ticon={Loader2}\n\t\t\t\t/>\n\n\t\t\t\t<IconRenderer show={!isLoading} icon={leftIcon} iconSize={iconSize} />\n\n\t\t\t\t<input\n\t\t\t\t\tdisabled={isDisabled}\n\t\t\t\t\treadOnly={readOnly}\n\t\t\t\t\tref={inputRef}\n\t\t\t\t\tonFocus={handleFocus}\n\t\t\t\t\tonBlur={handleBlur}\n\t\t\t\t\tonChange={handleChange}\n\t\t\t\t\tid={inputId}\n\t\t\t\t\tplaceholder={isDisabled ? maskedValue : undefined}\n\t\t\t\t\tvalue={isDisabled ? undefined : maskedValue}\n\t\t\t\t\t{...rest}\n\t\t\t\t/>\n\n\t\t\t\t<input\n\t\t\t\t\ttype=\"hidden\"\n\t\t\t\t\tname={name}\n\t\t\t\t\tvalue={normalizeValue(maskedValue)}\n\t\t\t\t\treadOnly\n\t\t\t\t/>\n\n\t\t\t\t<IconRenderer show={!isLoading} icon={rightIcon} iconSize={iconSize} />\n\n\t\t\t\t<IconRenderer\n\t\t\t\t\tshow={showRightSpinner}\n\t\t\t\t\ticonSize={iconSize}\n\t\t\t\t\tclassName=\"spinner\"\n\t\t\t\t\ticon={Loader2}\n\t\t\t\t/>\n\n\t\t\t\t<IconRenderer iconSize={iconSize} icon={suffix} className=\"suffix\" />\n\t\t\t</section>\n\t\t</FieldTemplate>\n\t);\n}\n\nexport { CurrencyInput };\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/currencyInput/index.tsx"],"sourcesContent":["import { Loader2, type LucideIcon } from \"lucide-react\";\nimport {\n\ttype ChangeEvent,\n\ttype FocusEvent,\n\ttype InputHTMLAttributes,\n\tuseEffect,\n\tuseId,\n\tuseRef,\n\tuseState,\n} from \"react\";\n\nimport { useForm } from \"../../hooks/useForm\";\nimport { FieldTemplate } from \"../../services/fieldTemplate\";\nimport { IconRenderer } from \"../../services/iconRenderer\";\nimport {\n\tmaskCurrencyValues,\n\tnormalizeValue,\n} from \"../../services/maskCurrencyValues\";\n\nimport \"./style.css\";\n\ntype Locale =\n\t| \"USD\"\n\t| \"EUR\"\n\t| \"JPY\"\n\t| \"GBP\"\n\t| \"AUD\"\n\t| \"CAD\"\n\t| \"CHF\"\n\t| \"CNY\"\n\t| \"SEK\"\n\t| \"NZD\"\n\t| \"BRL\"\n\t| \"INR\"\n\t| \"RUB\"\n\t| \"ZAR\"\n\t| \"MXN\"\n\t| \"SGD\"\n\t| \"HKD\"\n\t| \"NOK\"\n\t| \"KRW\"\n\t| \"TRY\"\n\t| \"IDR\"\n\t| \"THB\";\n\ntype CurrencyInputProps = Omit<\n\tInputHTMLAttributes<HTMLInputElement>,\n\t| \"size\"\n\t| \"prefix\"\n\t| \"name\"\n\t| \"type\"\n\t| \"max\"\n\t| \"defaultValue\"\n\t| \"value\"\n\t| \"onChange\"\n\t| \"placeholder\"\n> & {\n\t/** Field name for form submission. Required. */\n\tname: string;\n\t/**\n\t * Currency locale used to format the displayed value.\n\t * Supported: `\"USD\"` | `\"EUR\"` | `\"BRL\"` | `\"JPY\"` | `\"GBP\"` | … (22 locales).\n\t * Required.\n\t */\n\tlocale: Locale;\n\t/** Optional label text displayed above the input. */\n\tlabel?: string;\n\t/** Validation error message displayed below the input. */\n\terrorMessage?: string;\n\t/** Shows a spinner and disables the input during async operations. @default false */\n\tisLoading?: boolean;\n\t/** When true, skips `FieldTemplate` wrapper (label and error text). @default false */\n\tunShowFieldTemplate?: boolean;\n\t/**\n\t * Input size.\n\t * @default \"md\"\n\t */\n\tsize?: \"md\" | \"lg\";\n\t/**\n\t * Visual style variant.\n\t * - `solid`: filled background.\n\t * - `outline`: bordered, transparent background.\n\t * - `underline`: bottom border only.\n\t * @default \"solid\"\n\t */\n\tvariant?: \"solid\" | \"outline\" | \"underline\";\n\t/**\n\t * Layout direction forwarded to `FieldTemplate`.\n\t * @default \"horizontal\"\n\t */\n\torientation?: \"horizontal\" | \"vertical\" | \"horizontalReverse\";\n\t/** Text or icon rendered at the far left, outside the input area. */\n\tprefix?: string | LucideIcon;\n\t/** Text or icon rendered at the far right, outside the input area. */\n\tsuffix?: string | LucideIcon;\n\t/** Displays an asterisk on the label to signal a required field. */\n\tshowAsterisk?: boolean;\n\t/** Lucide icon rendered inside the input on the left. */\n\tleftIcon?: LucideIcon;\n\t/** Lucide icon rendered inside the input on the right. */\n\trightIcon?: LucideIcon;\n\t/** Maximum numeric value allowed. @default 1_000_000_000 */\n\tmax?: number;\n\t/** Controlled numeric value. */\n\tvalue?: number;\n\t/** Uncontrolled default numeric value. */\n\tdefaultValue?: number;\n\t/**\n\t * Callback fired on value change.\n\t * @param event - Native change event.\n\t * @param originalValue - Raw numeric string (e.g. `\"1234.56\"`).\n\t * @param maskedValue - Formatted display string (e.g. `\"$ 1,234.56\"`).\n\t */\n\tonChange?: (\n\t\tevent: ChangeEvent<HTMLInputElement>,\n\t\toriginalValue: string,\n\t\tmaskedValue: string,\n\t) => void;\n};\n\n/**\n * CurrencyInput, numeric input that automatically formats the displayed value according to a currency locale.\n *\n * The raw numeric value is stored in a hidden `<input>` for form submission.\n * Integrates with `useForm` to display validation errors by field name.\n *\n * @param props.name - Field name for form submission. Required.\n * @param props.locale - Currency locale (e.g. `\"USD\"`, `\"BRL\"`, `\"EUR\"`). Required.\n * @param props.label - Label text displayed above the input.\n * @param props.errorMessage - Validation error message.\n * @param props.isLoading - Shows a spinner and disables the input. Default: false\n * @param props.size - Input size (`md` | `lg`). Default: \"md\"\n * @param props.variant - Visual style variant. Default: \"solid\"\n * @param props.max - Maximum numeric value allowed. Default: 1_000_000_000\n * @param props.value - Controlled numeric value.\n * @param props.defaultValue - Uncontrolled default numeric value.\n * @param props.onChange - Callback fired on change, receives the event, the raw numeric string, and the formatted string.\n * @param props.prefix - Text or icon at the far left.\n * @param props.suffix - Text or icon at the far right.\n * @param props.leftIcon - Lucide icon inside the input on the left.\n * @param props.rightIcon - Lucide icon inside the input on the right.\n * @param props.showAsterisk - Appends `*` to the label.\n * @param props.orientation - Layout direction. Default: \"horizontal\"\n * @param props.unShowFieldTemplate - Skips wrapper, label, and error rendering. Default: false\n *\n * **...Other valid HTML properties for `<input>` (except `type`, `max`, `value`, `defaultValue`, `onChange`, `placeholder`)**\n *\n * @returns CurrencyInput JSX element wrapped in `FieldTemplate`.\n *\n * @example\n * ```tsx\n * // Basic\n * <CurrencyInput name=\"price\" locale=\"USD\" />\n *\n * // With label and validation\n * <CurrencyInput\n * name=\"salary\"\n * locale=\"BRL\"\n * label=\"Monthly Salary\"\n * showAsterisk\n * errorMessage=\"Please enter a valid amount\"\n * />\n *\n * // With max value and controlled state\n * <CurrencyInput\n * name=\"limit\"\n * locale=\"USD\"\n * label=\"Credit Limit\"\n * max={10000}\n * value={creditLimit}\n * onChange={(e, original) => setCreditLimit(Number(original))}\n * />\n * ```\n */\n\nfunction CurrencyInput(props: CurrencyInputProps) {\n\tconst {\n\t\tname,\n\t\tdisabled,\n\t\ttitle,\n\t\tstyle,\n\t\tvariant = \"solid\",\n\t\tlabel,\n\t\tclassName: wrapperClassName = \"\",\n\t\tvalue,\n\t\tdefaultValue,\n\t\tmax = 1000000000,\n\t\tlocale,\n\t\tonChange,\n\t\tprefix,\n\t\tsuffix,\n\t\tisLoading = false,\n\t\tleftIcon,\n\t\treadOnly,\n\t\tonFocus,\n\t\tonBlur,\n\t\terrorMessage: baseErrorMessage,\n\t\tunShowFieldTemplate,\n\t\torientation,\n\t\tshowAsterisk,\n\t\trightIcon,\n\t\tsize = \"md\",\n\t\tid,\n\t\t...rest\n\t} = props;\n\n\tconst { fieldErrors } = useForm();\n\tconst [isFocused, setIsFocused] = useState(false);\n\tconst [maskedValue, setMaskedValue] = useState(\"0\");\n\n\tconst inputRef = useRef<HTMLInputElement>(null);\n\tconst generatedId = useId();\n\tconst inputId = id || generatedId;\n\n\tconst errorMessage = baseErrorMessage || fieldErrors?.[name];\n\tconst isError = !!errorMessage;\n\tconst isDisabled = disabled || isLoading;\n\n\tconst iconSizes = { md: 20, lg: 20 };\n\tconst iconSize = iconSizes[size];\n\n\tconst loadingPosition = rightIcon ? \"right\" : \"left\";\n\n\tconst showLeftSpinner = loadingPosition === \"left\" && isLoading;\n\tconst showRightSpinner = loadingPosition === \"right\" && isLoading;\n\n\tfunction handleSectionClick() {\n\t\tif (isDisabled || !inputRef?.current) return;\n\t\tsetIsFocused(true);\n\t\tinputRef.current.focus();\n\t}\n\n\tfunction handleFocus(e: FocusEvent<HTMLInputElement>) {\n\t\tsetIsFocused(true);\n\t\tif (onFocus) onFocus(e);\n\t}\n\n\tfunction handleBlur(e: FocusEvent<HTMLInputElement>) {\n\t\tsetIsFocused(false);\n\t\tif (onBlur) onBlur(e);\n\t}\n\n\tconst updateValues = (originalValue: string | number) => {\n\t\tconst [calculatedValue, calculatedMaskedValue] = maskCurrencyValues(\n\t\t\toriginalValue,\n\t\t\tlocale,\n\t\t);\n\n\t\tif (!max || calculatedValue <= max) {\n\t\t\tsetMaskedValue(calculatedMaskedValue);\n\t\t\treturn [calculatedValue, calculatedMaskedValue];\n\t\t}\n\n\t\treturn maskCurrencyValues(originalValue, locale);\n\t};\n\n\tconst handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n\t\tevent.preventDefault();\n\t\tconst [originalValue, maskedValue] = updateValues(event.target.value);\n\n\t\tonChange?.(event, String(originalValue), String(maskedValue));\n\t};\n\n\tuseEffect(() => {\n\t\tfunction currentValue() {\n\t\t\tif (typeof value === \"number\") return value;\n\t\t\tif (typeof defaultValue === \"number\") return defaultValue;\n\t\t\treturn undefined;\n\t\t}\n\n\t\tconst [, maskedValue] = maskCurrencyValues(currentValue(), locale);\n\n\t\tsetMaskedValue(maskedValue);\n\t}, [locale, defaultValue, value]);\n\n\tconst hasPrefix = prefix ? \"hasPrefix\" : \"\";\n\tconst hasSuffix = suffix ? \"hasSuffix\" : \"\";\n\tconst errored = isError ? \"errored\" : \"\";\n\tconst opacity = isDisabled || readOnly || isLoading ? \"opacity\" : \"\";\n\tconst focused = isFocused ? \"focused\" : \"\";\n\n\tconst className = `arkynCurrencyInput ${hasPrefix} ${hasSuffix} ${variant} ${size} ${opacity} ${errored} ${focused}`;\n\n\treturn (\n\t\t<FieldTemplate\n\t\t\tname={name}\n\t\t\tlabel={label}\n\t\t\tshowAsterisk={showAsterisk}\n\t\t\tclassName={wrapperClassName}\n\t\t\terrorMessage={errorMessage}\n\t\t\tunShowFieldTemplate={unShowFieldTemplate}\n\t\t\torientation={orientation}\n\t\t>\n\t\t\t<section\n\t\t\t\ttitle={title}\n\t\t\t\tstyle={style}\n\t\t\t\tclassName={className}\n\t\t\t\tonClick={handleSectionClick}\n\t\t\t>\n\t\t\t\t<IconRenderer iconSize={iconSize} icon={prefix} className=\"prefix\" />\n\n\t\t\t\t<IconRenderer\n\t\t\t\t\tshow={showLeftSpinner}\n\t\t\t\t\ticonSize={iconSize}\n\t\t\t\t\tclassName=\"spinner\"\n\t\t\t\t\ticon={Loader2}\n\t\t\t\t/>\n\n\t\t\t\t<IconRenderer show={!isLoading} icon={leftIcon} iconSize={iconSize} />\n\n\t\t\t\t<input\n\t\t\t\t\tdisabled={isDisabled}\n\t\t\t\t\treadOnly={readOnly}\n\t\t\t\t\tref={inputRef}\n\t\t\t\t\tonFocus={handleFocus}\n\t\t\t\t\tonBlur={handleBlur}\n\t\t\t\t\tonChange={handleChange}\n\t\t\t\t\tid={inputId}\n\t\t\t\t\tplaceholder={isDisabled ? maskedValue : undefined}\n\t\t\t\t\tvalue={isDisabled ? undefined : maskedValue}\n\t\t\t\t\t{...rest}\n\t\t\t\t/>\n\n\t\t\t\t<input\n\t\t\t\t\ttype=\"hidden\"\n\t\t\t\t\tname={name}\n\t\t\t\t\tvalue={normalizeValue(maskedValue)}\n\t\t\t\t\treadOnly\n\t\t\t\t/>\n\n\t\t\t\t<IconRenderer show={!isLoading} icon={rightIcon} iconSize={iconSize} />\n\n\t\t\t\t<IconRenderer\n\t\t\t\t\tshow={showRightSpinner}\n\t\t\t\t\ticonSize={iconSize}\n\t\t\t\t\tclassName=\"spinner\"\n\t\t\t\t\ticon={Loader2}\n\t\t\t\t/>\n\n\t\t\t\t<IconRenderer iconSize={iconSize} icon={suffix} className=\"suffix\" />\n\t\t\t</section>\n\t\t</FieldTemplate>\n\t);\n}\n\nexport { CurrencyInput };\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/datePicker/index.tsx"],"sourcesContent":["import type { LucideIcon } from \"lucide-react\";\nimport { type FocusEvent, useId, useRef, useState } from \"react\";\n\nimport { useForm } from \"../../hooks/useForm\";\nimport { FieldTemplate } from \"../../services/fieldTemplate\";\nimport { IconRenderer } from \"../../services/iconRenderer\";\n\nimport { Calendar } from \"../calendar\";\n\nimport { DatePickerCalendarContainer } from \"./datePickerCalendarContainer\";\nimport { DatePickerChevron } from \"./datePickerChevron\";\nimport { DatePickerContainer } from \"./datePickerContainer\";\nimport { DatePickerContent } from \"./datePickerContent\";\nimport { DatePickerOverlay } from \"./datePickerOverlay\";\nimport { DatePickerSpinner } from \"./datePickerSpinner\";\n\nfunction toInputDateValue(date: Date) {\n\tconst pad = (value: number) => String(value).padStart(2, \"0\");\n\treturn `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}`;\n}\n\nfunction toDisplayDateValue(date: Date) {\n\treturn date.toLocaleDateString(\"pt-BR\");\n}\n\ntype BaseDatePickerProps = {\n\t/** Field name for form submission. Required. */\n\tname: string;\n\t/** Optional HTML id for the underlying hidden input. */\n\tid?: string;\n\t/** Displays an asterisk on the label to signal a required field. */\n\tshowAsterisk?: boolean;\n\t/** Optional label text displayed above the date picker. */\n\tlabel?: string;\n\t/** Validation error message displayed below the date picker. */\n\terrorMessage?: string;\n\t/** Placeholder text shown when no date is selected. @default \"Selecione uma data...\" */\n\tplaceholder?: string;\n\t/** Additional CSS class applied to the wrapper element. */\n\tclassName?: string;\n\t/** Disables all interactions. @default false */\n\tdisabled?: boolean;\n\t/** Prevents value changes while keeping the current value visible. @default false */\n\treadOnly?: boolean;\n\t/** Shows a loading spinner and disables interactions. @default false */\n\tisLoading?: boolean;\n\t/**\n\t * Closes the calendar after a date is picked.\n\t * @default true for `single`, `false` for `range`.\n\t */\n\tcloseOnSelect?: boolean;\n\t/** Callback fired when the date picker gains focus. */\n\tonFocus?: () => void;\n\t/** Callback fired when the date picker loses focus. */\n\tonBlur?: (e: FocusEvent<HTMLDivElement>) => void;\n\t/**\n\t * DatePicker size.\n\t * @default \"md\"\n\t */\n\tsize?: \"md\" | \"lg\";\n\t/**\n\t * Visual style variant.\n\t * - `solid`: filled background.\n\t * - `outline`: bordered, transparent background.\n\t * - `underline`: bottom border only.\n\t * @default \"solid\"\n\t */\n\tvariant?: \"solid\" | \"outline\" | \"underline\";\n\t/** Text or icon rendered at the far left, outside the date picker area. */\n\tprefix?: string | LucideIcon;\n\t/** Lucide icon rendered inside the date picker on the left. */\n\tleftIcon?: LucideIcon;\n\t/** When true, skips `FieldTemplate` wrapper (label and error text). @default false */\n\tunShowFieldTemplate?: boolean;\n\t/**\n\t * Layout direction forwarded to `FieldTemplate`.\n\t * @default \"vertical\"\n\t */\n\torientation?: \"horizontal\" | \"vertical\" | \"horizontalReverse\";\n\t/**\n\t * Visual/behavioral variant forwarded to the internal `Calendar`.\n\t * @default \"complete\"\n\t */\n\tcalendarVariant?: \"basic\" | \"complete\";\n};\n\n/**\n * Props for DatePicker single-date selection mode.\n */\ntype SingleDatePickerProps = BaseDatePickerProps & {\n\t/** Sets single-date selection mode. */\n\ttype: \"single\";\n\t/** Controlled selected date. */\n\tvalue?: Date;\n\t/** Uncontrolled default selected date. */\n\tdefaultValue?: Date;\n\t/** Callback fired when the selected date changes. */\n\tonChange?: (date: Date) => void;\n\t/** Currently focused calendar view date. */\n\tviewValue?: Date;\n\t/** Initial focused calendar view date. */\n\tdefaultViewValue?: Date;\n\t/** Callback fired when the calendar view (month/year) changes. */\n\tonChangeView?: (date: Date) => void;\n};\n\n/**\n * Props for DatePicker range selection mode.\n */\ntype RangeDatePickerProps = BaseDatePickerProps & {\n\t/** Sets range selection mode. */\n\ttype: \"range\";\n\t/** Controlled selected range in `[start, end]` format. */\n\tvalue?: [Date, Date];\n\t/** Uncontrolled default range in `[start, end]` format. */\n\tdefaultValue?: [Date, Date];\n\t/** Callback fired when the selected range changes. */\n\tonChange?: (date: [Date, Date]) => void;\n\t/** Currently focused calendar view date. */\n\tviewValue?: Date;\n\t/** Initial focused calendar view date. */\n\tdefaultViewValue?: Date;\n\t/** Callback fired when the calendar view (month/year) changes. */\n\tonChangeView?: (date: Date) => void;\n\t/** Text placed between the start and end dates. @default \" até \" */\n\trangeSeparator?: string;\n};\n\n/**\n * Discriminated union of DatePicker props.\n */\ntype DatePickerProps = SingleDatePickerProps | RangeDatePickerProps;\n\n/**\n * DatePicker — date input field with a popover `Calendar`, supporting single-date\n * (`single`) and range (`range`) selection modes.\n *\n * Opens the calendar on click, the same way `Select` opens its options list, flipping\n * upward or downward depending on the available viewport space so it never renders\n * off-screen. Integrates with `useForm` to display validation errors by field name.\n *\n * @param props.name - Field name for form submission. Required.\n * @param props.type - Selection mode (`single` | `range`). Required.\n * @param props.value - Controlled selected date (`single`) or range (`range`).\n * @param props.defaultValue - Uncontrolled default date or range.\n * @param props.label - Label text displayed above the date picker.\n * @param props.placeholder - Placeholder shown when nothing is selected. Default: \"Selecione uma data...\"\n * @param props.errorMessage - Validation error message.\n * @param props.isLoading - Shows a loading spinner and disables interactions. Default: false\n * @param props.closeOnSelect - Closes the calendar after picking. Default: `true` for `single`, `false` for `range`.\n * @param props.onChange - Callback fired when the selected date/range changes.\n * @param props.calendarVariant - Visual/behavioral variant of the internal `Calendar`. Default: \"complete\"\n * @param props.size - DatePicker size (`md` | `lg`). Default: \"md\"\n * @param props.variant - Visual style variant. Default: \"solid\"\n * @param props.orientation - Layout direction. Default: \"vertical\"\n * @param props.unShowFieldTemplate - Skips wrapper, label, and error rendering. Default: false\n *\n * @returns DatePicker JSX element wrapped in `FieldTemplate`.\n *\n * @example\n * ```tsx\n * // Single date\n * <DatePicker\n * type=\"single\"\n * name=\"birthDate\"\n * label=\"Data de nascimento\"\n * onChange={(date) => console.log(\"Selected date:\", date)}\n * />\n *\n * // Range\n * <DatePicker\n * type=\"range\"\n * name=\"stay\"\n * label=\"Período da estadia\"\n * calendarVariant=\"basic\"\n * onChange={([start, end]) => console.log(\"Range:\", start, end)}\n * />\n * ```\n */\nfunction DatePicker(props: DatePickerProps) {\n\tconst {\n\t\tname,\n\t\tclassName: wrapperClassName = \"\",\n\t\tplaceholder = \"Selecione uma data...\",\n\t\terrorMessage: baseErrorMessage,\n\t\tisLoading = false,\n\t\treadOnly = false,\n\t\tid,\n\t\tlabel,\n\t\tshowAsterisk,\n\t\tleftIcon: LeftIcon,\n\t\tonFocus,\n\t\tonBlur,\n\t\tdisabled: baseDisabled = false,\n\t\tprefix,\n\t\tsize = \"md\",\n\t\tvalue,\n\t\tvariant = \"solid\",\n\t\torientation = \"vertical\",\n\t\tunShowFieldTemplate = false,\n\t\tcalendarVariant = \"complete\",\n\t} = props;\n\n\tconst closeOnSelect = props.closeOnSelect ?? props.type === \"single\";\n\n\tconst { fieldErrors } = useForm();\n\n\tconst datePickerRef = useRef<HTMLInputElement>(null);\n\tconst generatedId = useId();\n\tconst datePickerId = id || generatedId;\n\n\tconst errorMessage = baseErrorMessage || fieldErrors?.[name];\n\tconst isError = !!errorMessage;\n\tconst disabled = baseDisabled || isLoading || readOnly;\n\n\tconst iconSizes = { md: 20, lg: 20 };\n\tconst iconSize = iconSizes[size];\n\n\tconst [isFocused, setIsFocused] = useState(false);\n\tconst [internalSingleValue, setInternalSingleValue] = useState<\n\t\tDate | undefined\n\t>(props.type === \"single\" ? props.defaultValue : undefined);\n\tconst [internalRangeValue, setInternalRangeValue] = useState<\n\t\t[Date, Date] | undefined\n\t>(props.type === \"range\" ? props.defaultValue : undefined);\n\n\tfunction handleContainerFocus() {\n\t\tif (disabled || !datePickerRef?.current || isFocused) return;\n\t\tsetIsFocused(true);\n\t\tdatePickerRef.current.focus();\n\t\tonFocus?.();\n\t}\n\n\tfunction handleBlur() {\n\t\tsetIsFocused(false);\n\t\tif (onBlur && datePickerRef.current) datePickerRef.current.blur();\n\t}\n\n\tfunction handleChangeSingleDate(date: Date) {\n\t\tif (value === undefined) setInternalSingleValue(date);\n\t\tif (props.type === \"single\") props.onChange?.(date);\n\t\tif (closeOnSelect) handleBlur();\n\t}\n\n\tfunction handleChangeRangeDate(range: [Date, Date]) {\n\t\tif (value === undefined) setInternalRangeValue(range);\n\t\tif (props.type === \"range\") props.onChange?.(range);\n\t\tif (closeOnSelect) handleBlur();\n\t}\n\n\tif (props.type === \"range\") {\n\t\tconst rangeSeparator = props.rangeSeparator ?? \" até \";\n\t\tconst forceValue =\n\t\t\tvalue !== undefined ? (value as [Date, Date]) : internalRangeValue;\n\n\t\tconst hiddenInputValue = forceValue\n\t\t\t? JSON.stringify([\n\t\t\t\t\ttoInputDateValue(forceValue[0]),\n\t\t\t\t\ttoInputDateValue(forceValue[1]),\n\t\t\t\t])\n\t\t\t: \"\";\n\n\t\treturn (\n\t\t\t<FieldTemplate\n\t\t\t\tname={name}\n\t\t\t\tlabel={label}\n\t\t\t\tshowAsterisk={showAsterisk}\n\t\t\t\tclassName={wrapperClassName}\n\t\t\t\terrorMessage={errorMessage}\n\t\t\t\tunShowFieldTemplate={unShowFieldTemplate}\n\t\t\t\torientation={orientation}\n\t\t\t>\n\t\t\t\t<DatePickerContainer\n\t\t\t\t\thandleContainerFocus={handleContainerFocus}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tisError={isError}\n\t\t\t\t\tisFocused={isFocused}\n\t\t\t\t\tisLoading={isLoading}\n\t\t\t\t\treadOnly={readOnly}\n\t\t\t\t\tsize={size}\n\t\t\t\t\tvariant={variant}\n\t\t\t\t\tprefixExists={!!prefix}\n\t\t\t\t\tid={datePickerId}\n\t\t\t\t>\n\t\t\t\t\t<input\n\t\t\t\t\t\tref={datePickerRef}\n\t\t\t\t\t\tname={name}\n\t\t\t\t\t\tvalue={hiddenInputValue}\n\t\t\t\t\t\ttype=\"hidden\"\n\t\t\t\t\t/>\n\n\t\t\t\t\t<IconRenderer iconSize={iconSize} icon={prefix} className=\"prefix\" />\n\n\t\t\t\t\t{LeftIcon && <LeftIcon size={iconSize} strokeWidth={2.5} />}\n\n\t\t\t\t\t<DatePickerContent size={size}>\n\t\t\t\t\t\t{forceValue ? (\n\t\t\t\t\t\t\t<p className=\"hasValue\">\n\t\t\t\t\t\t\t\t{toDisplayDateValue(forceValue[0])}\n\t\t\t\t\t\t\t\t{rangeSeparator}\n\t\t\t\t\t\t\t\t{toDisplayDateValue(forceValue[1])}\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<p>{placeholder}</p>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</DatePickerContent>\n\n\t\t\t\t\t<DatePickerCalendarContainer isFocused={isFocused}>\n\t\t\t\t\t\t<Calendar\n\t\t\t\t\t\t\ttype=\"range\"\n\t\t\t\t\t\t\tvariant={calendarVariant}\n\t\t\t\t\t\t\tvalue={forceValue}\n\t\t\t\t\t\t\tonChange={handleChangeRangeDate}\n\t\t\t\t\t\t\tviewValue={props.viewValue}\n\t\t\t\t\t\t\tdefaultViewValue={props.defaultViewValue}\n\t\t\t\t\t\t\tonChangeView={props.onChangeView}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</DatePickerCalendarContainer>\n\n\t\t\t\t\t<DatePickerChevron\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\tisFocused={isFocused}\n\t\t\t\t\t\treadOnly={readOnly}\n\t\t\t\t\t\ticonSize={iconSize}\n\t\t\t\t\t\tisLoading={isLoading}\n\t\t\t\t\t/>\n\n\t\t\t\t\t<DatePickerSpinner iconSize={iconSize} isLoading={isLoading} />\n\t\t\t\t\t<DatePickerOverlay handleBlur={handleBlur} isFocused={isFocused} />\n\t\t\t\t</DatePickerContainer>\n\t\t\t</FieldTemplate>\n\t\t);\n\t}\n\n\tconst forceValue =\n\t\tvalue !== undefined ? (value as Date) : internalSingleValue;\n\n\tconst hiddenInputValue = forceValue ? toInputDateValue(forceValue) : \"\";\n\n\treturn (\n\t\t<FieldTemplate\n\t\t\tname={name}\n\t\t\tlabel={label}\n\t\t\tshowAsterisk={showAsterisk}\n\t\t\tclassName={wrapperClassName}\n\t\t\terrorMessage={errorMessage}\n\t\t\tunShowFieldTemplate={unShowFieldTemplate}\n\t\t\torientation={orientation}\n\t\t>\n\t\t\t<DatePickerContainer\n\t\t\t\thandleContainerFocus={handleContainerFocus}\n\t\t\t\tdisabled={disabled}\n\t\t\t\tisError={isError}\n\t\t\t\tisFocused={isFocused}\n\t\t\t\tisLoading={isLoading}\n\t\t\t\treadOnly={readOnly}\n\t\t\t\tsize={size}\n\t\t\t\tvariant={variant}\n\t\t\t\tprefixExists={!!prefix}\n\t\t\t\tid={datePickerId}\n\t\t\t>\n\t\t\t\t<input\n\t\t\t\t\tref={datePickerRef}\n\t\t\t\t\tname={name}\n\t\t\t\t\tvalue={hiddenInputValue}\n\t\t\t\t\ttype=\"hidden\"\n\t\t\t\t/>\n\n\t\t\t\t<IconRenderer iconSize={iconSize} icon={prefix} className=\"prefix\" />\n\n\t\t\t\t{LeftIcon && <LeftIcon size={iconSize} strokeWidth={2.5} />}\n\n\t\t\t\t<DatePickerContent size={size}>\n\t\t\t\t\t{forceValue ? (\n\t\t\t\t\t\t<p className=\"hasValue\">{toDisplayDateValue(forceValue)}</p>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<p>{placeholder}</p>\n\t\t\t\t\t)}\n\t\t\t\t</DatePickerContent>\n\n\t\t\t\t<DatePickerCalendarContainer isFocused={isFocused}>\n\t\t\t\t\t<Calendar\n\t\t\t\t\t\ttype=\"single\"\n\t\t\t\t\t\tvariant={calendarVariant}\n\t\t\t\t\t\tvalue={forceValue}\n\t\t\t\t\t\tonChange={handleChangeSingleDate}\n\t\t\t\t\t\tviewValue={props.viewValue}\n\t\t\t\t\t\tdefaultViewValue={props.defaultViewValue}\n\t\t\t\t\t\tonChangeView={props.onChangeView}\n\t\t\t\t\t/>\n\t\t\t\t</DatePickerCalendarContainer>\n\n\t\t\t\t<DatePickerChevron\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tisFocused={isFocused}\n\t\t\t\t\treadOnly={readOnly}\n\t\t\t\t\ticonSize={iconSize}\n\t\t\t\t\tisLoading={isLoading}\n\t\t\t\t/>\n\n\t\t\t\t<DatePickerSpinner iconSize={iconSize} isLoading={isLoading} />\n\t\t\t\t<DatePickerOverlay handleBlur={handleBlur} isFocused={isFocused} />\n\t\t\t</DatePickerContainer>\n\t\t</FieldTemplate>\n\t);\n}\n\nexport { DatePicker };\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/datePicker/index.tsx"],"sourcesContent":["import type { LucideIcon } from \"lucide-react\";\nimport { type FocusEvent, useId, useRef, useState } from \"react\";\n\nimport { useForm } from \"../../hooks/useForm\";\nimport { FieldTemplate } from \"../../services/fieldTemplate\";\nimport { IconRenderer } from \"../../services/iconRenderer\";\n\nimport { Calendar } from \"../calendar\";\n\nimport { DatePickerCalendarContainer } from \"./datePickerCalendarContainer\";\nimport { DatePickerChevron } from \"./datePickerChevron\";\nimport { DatePickerContainer } from \"./datePickerContainer\";\nimport { DatePickerContent } from \"./datePickerContent\";\nimport { DatePickerOverlay } from \"./datePickerOverlay\";\nimport { DatePickerSpinner } from \"./datePickerSpinner\";\n\nfunction toInputDateValue(date: Date) {\n\tconst pad = (value: number) => String(value).padStart(2, \"0\");\n\treturn `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())}`;\n}\n\nfunction toDisplayDateValue(date: Date) {\n\treturn date.toLocaleDateString(\"pt-BR\");\n}\n\ntype BaseDatePickerProps = {\n\t/** Field name for form submission. Required. */\n\tname: string;\n\t/** Optional HTML id for the underlying hidden input. */\n\tid?: string;\n\t/** Displays an asterisk on the label to signal a required field. */\n\tshowAsterisk?: boolean;\n\t/** Optional label text displayed above the date picker. */\n\tlabel?: string;\n\t/** Validation error message displayed below the date picker. */\n\terrorMessage?: string;\n\t/** Placeholder text shown when no date is selected. @default \"Selecione uma data...\" */\n\tplaceholder?: string;\n\t/** Additional CSS class applied to the wrapper element. */\n\tclassName?: string;\n\t/** Disables all interactions. @default false */\n\tdisabled?: boolean;\n\t/** Prevents value changes while keeping the current value visible. @default false */\n\treadOnly?: boolean;\n\t/** Shows a loading spinner and disables interactions. @default false */\n\tisLoading?: boolean;\n\t/**\n\t * Closes the calendar after a date is picked.\n\t * @default true for `single`, `false` for `range`.\n\t */\n\tcloseOnSelect?: boolean;\n\t/** Callback fired when the date picker gains focus. */\n\tonFocus?: () => void;\n\t/** Callback fired when the date picker loses focus. */\n\tonBlur?: (e: FocusEvent<HTMLDivElement>) => void;\n\t/**\n\t * DatePicker size.\n\t * @default \"md\"\n\t */\n\tsize?: \"md\" | \"lg\";\n\t/**\n\t * Visual style variant.\n\t * - `solid`: filled background.\n\t * - `outline`: bordered, transparent background.\n\t * - `underline`: bottom border only.\n\t * @default \"solid\"\n\t */\n\tvariant?: \"solid\" | \"outline\" | \"underline\";\n\t/** Text or icon rendered at the far left, outside the date picker area. */\n\tprefix?: string | LucideIcon;\n\t/** Lucide icon rendered inside the date picker on the left. */\n\tleftIcon?: LucideIcon;\n\t/** When true, skips `FieldTemplate` wrapper (label and error text). @default false */\n\tunShowFieldTemplate?: boolean;\n\t/**\n\t * Layout direction forwarded to `FieldTemplate`.\n\t * @default \"vertical\"\n\t */\n\torientation?: \"horizontal\" | \"vertical\" | \"horizontalReverse\";\n\t/**\n\t * Visual/behavioral variant forwarded to the internal `Calendar`.\n\t * @default \"complete\"\n\t */\n\tcalendarVariant?: \"basic\" | \"complete\";\n};\n\n/**\n * Props for DatePicker single-date selection mode.\n */\ntype SingleDatePickerProps = BaseDatePickerProps & {\n\t/** Sets single-date selection mode. */\n\ttype: \"single\";\n\t/** Controlled selected date. */\n\tvalue?: Date;\n\t/** Uncontrolled default selected date. */\n\tdefaultValue?: Date;\n\t/** Callback fired when the selected date changes. */\n\tonChange?: (date: Date) => void;\n\t/** Currently focused calendar view date. */\n\tviewValue?: Date;\n\t/** Initial focused calendar view date. */\n\tdefaultViewValue?: Date;\n\t/** Callback fired when the calendar view (month/year) changes. */\n\tonChangeView?: (date: Date) => void;\n};\n\n/**\n * Props for DatePicker range selection mode.\n */\ntype RangeDatePickerProps = BaseDatePickerProps & {\n\t/** Sets range selection mode. */\n\ttype: \"range\";\n\t/** Controlled selected range in `[start, end]` format. */\n\tvalue?: [Date, Date];\n\t/** Uncontrolled default range in `[start, end]` format. */\n\tdefaultValue?: [Date, Date];\n\t/** Callback fired when the selected range changes. */\n\tonChange?: (date: [Date, Date]) => void;\n\t/** Currently focused calendar view date. */\n\tviewValue?: Date;\n\t/** Initial focused calendar view date. */\n\tdefaultViewValue?: Date;\n\t/** Callback fired when the calendar view (month/year) changes. */\n\tonChangeView?: (date: Date) => void;\n\t/** Text placed between the start and end dates. @default \" até \" */\n\trangeSeparator?: string;\n};\n\n/**\n * Discriminated union of DatePicker props.\n */\ntype DatePickerProps = SingleDatePickerProps | RangeDatePickerProps;\n\n/**\n * DatePicker, date input field with a popover `Calendar`, supporting single-date\n * (`single`) and range (`range`) selection modes.\n *\n * Opens the calendar on click, the same way `Select` opens its options list, flipping\n * upward or downward depending on the available viewport space so it never renders\n * off-screen. Integrates with `useForm` to display validation errors by field name.\n *\n * @param props.name - Field name for form submission. Required.\n * @param props.type - Selection mode (`single` | `range`). Required.\n * @param props.value - Controlled selected date (`single`) or range (`range`).\n * @param props.defaultValue - Uncontrolled default date or range.\n * @param props.label - Label text displayed above the date picker.\n * @param props.placeholder - Placeholder shown when nothing is selected. Default: \"Selecione uma data...\"\n * @param props.errorMessage - Validation error message.\n * @param props.isLoading - Shows a loading spinner and disables interactions. Default: false\n * @param props.closeOnSelect - Closes the calendar after picking. Default: `true` for `single`, `false` for `range`.\n * @param props.onChange - Callback fired when the selected date/range changes.\n * @param props.calendarVariant - Visual/behavioral variant of the internal `Calendar`. Default: \"complete\"\n * @param props.size - DatePicker size (`md` | `lg`). Default: \"md\"\n * @param props.variant - Visual style variant. Default: \"solid\"\n * @param props.orientation - Layout direction. Default: \"vertical\"\n * @param props.unShowFieldTemplate - Skips wrapper, label, and error rendering. Default: false\n *\n * @returns DatePicker JSX element wrapped in `FieldTemplate`.\n *\n * @example\n * ```tsx\n * // Single date\n * <DatePicker\n * type=\"single\"\n * name=\"birthDate\"\n * label=\"Data de nascimento\"\n * onChange={(date) => console.log(\"Selected date:\", date)}\n * />\n *\n * // Range\n * <DatePicker\n * type=\"range\"\n * name=\"stay\"\n * label=\"Período da estadia\"\n * calendarVariant=\"basic\"\n * onChange={([start, end]) => console.log(\"Range:\", start, end)}\n * />\n * ```\n */\nfunction DatePicker(props: DatePickerProps) {\n\tconst {\n\t\tname,\n\t\tclassName: wrapperClassName = \"\",\n\t\tplaceholder = \"Selecione uma data...\",\n\t\terrorMessage: baseErrorMessage,\n\t\tisLoading = false,\n\t\treadOnly = false,\n\t\tid,\n\t\tlabel,\n\t\tshowAsterisk,\n\t\tleftIcon: LeftIcon,\n\t\tonFocus,\n\t\tonBlur,\n\t\tdisabled: baseDisabled = false,\n\t\tprefix,\n\t\tsize = \"md\",\n\t\tvalue,\n\t\tvariant = \"solid\",\n\t\torientation = \"vertical\",\n\t\tunShowFieldTemplate = false,\n\t\tcalendarVariant = \"complete\",\n\t} = props;\n\n\tconst closeOnSelect = props.closeOnSelect ?? props.type === \"single\";\n\n\tconst { fieldErrors } = useForm();\n\n\tconst datePickerRef = useRef<HTMLInputElement>(null);\n\tconst generatedId = useId();\n\tconst datePickerId = id || generatedId;\n\n\tconst errorMessage = baseErrorMessage || fieldErrors?.[name];\n\tconst isError = !!errorMessage;\n\tconst disabled = baseDisabled || isLoading || readOnly;\n\n\tconst iconSizes = { md: 20, lg: 20 };\n\tconst iconSize = iconSizes[size];\n\n\tconst [isFocused, setIsFocused] = useState(false);\n\tconst [internalSingleValue, setInternalSingleValue] = useState<\n\t\tDate | undefined\n\t>(props.type === \"single\" ? props.defaultValue : undefined);\n\tconst [internalRangeValue, setInternalRangeValue] = useState<\n\t\t[Date, Date] | undefined\n\t>(props.type === \"range\" ? props.defaultValue : undefined);\n\n\tfunction handleContainerFocus() {\n\t\tif (disabled || !datePickerRef?.current || isFocused) return;\n\t\tsetIsFocused(true);\n\t\tdatePickerRef.current.focus();\n\t\tonFocus?.();\n\t}\n\n\tfunction handleBlur() {\n\t\tsetIsFocused(false);\n\t\tif (onBlur && datePickerRef.current) datePickerRef.current.blur();\n\t}\n\n\tfunction handleChangeSingleDate(date: Date) {\n\t\tif (value === undefined) setInternalSingleValue(date);\n\t\tif (props.type === \"single\") props.onChange?.(date);\n\t\tif (closeOnSelect) handleBlur();\n\t}\n\n\tfunction handleChangeRangeDate(range: [Date, Date]) {\n\t\tif (value === undefined) setInternalRangeValue(range);\n\t\tif (props.type === \"range\") props.onChange?.(range);\n\t\tif (closeOnSelect) handleBlur();\n\t}\n\n\tif (props.type === \"range\") {\n\t\tconst rangeSeparator = props.rangeSeparator ?? \" até \";\n\t\tconst forceValue =\n\t\t\tvalue !== undefined ? (value as [Date, Date]) : internalRangeValue;\n\n\t\tconst hiddenInputValue = forceValue\n\t\t\t? JSON.stringify([\n\t\t\t\t\ttoInputDateValue(forceValue[0]),\n\t\t\t\t\ttoInputDateValue(forceValue[1]),\n\t\t\t\t])\n\t\t\t: \"\";\n\n\t\treturn (\n\t\t\t<FieldTemplate\n\t\t\t\tname={name}\n\t\t\t\tlabel={label}\n\t\t\t\tshowAsterisk={showAsterisk}\n\t\t\t\tclassName={wrapperClassName}\n\t\t\t\terrorMessage={errorMessage}\n\t\t\t\tunShowFieldTemplate={unShowFieldTemplate}\n\t\t\t\torientation={orientation}\n\t\t\t>\n\t\t\t\t<DatePickerContainer\n\t\t\t\t\thandleContainerFocus={handleContainerFocus}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tisError={isError}\n\t\t\t\t\tisFocused={isFocused}\n\t\t\t\t\tisLoading={isLoading}\n\t\t\t\t\treadOnly={readOnly}\n\t\t\t\t\tsize={size}\n\t\t\t\t\tvariant={variant}\n\t\t\t\t\tprefixExists={!!prefix}\n\t\t\t\t\tid={datePickerId}\n\t\t\t\t>\n\t\t\t\t\t<input\n\t\t\t\t\t\tref={datePickerRef}\n\t\t\t\t\t\tname={name}\n\t\t\t\t\t\tvalue={hiddenInputValue}\n\t\t\t\t\t\ttype=\"hidden\"\n\t\t\t\t\t/>\n\n\t\t\t\t\t<IconRenderer iconSize={iconSize} icon={prefix} className=\"prefix\" />\n\n\t\t\t\t\t{LeftIcon && <LeftIcon size={iconSize} strokeWidth={2.5} />}\n\n\t\t\t\t\t<DatePickerContent size={size}>\n\t\t\t\t\t\t{forceValue ? (\n\t\t\t\t\t\t\t<p className=\"hasValue\">\n\t\t\t\t\t\t\t\t{toDisplayDateValue(forceValue[0])}\n\t\t\t\t\t\t\t\t{rangeSeparator}\n\t\t\t\t\t\t\t\t{toDisplayDateValue(forceValue[1])}\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<p>{placeholder}</p>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</DatePickerContent>\n\n\t\t\t\t\t<DatePickerCalendarContainer isFocused={isFocused}>\n\t\t\t\t\t\t<Calendar\n\t\t\t\t\t\t\ttype=\"range\"\n\t\t\t\t\t\t\tvariant={calendarVariant}\n\t\t\t\t\t\t\tvalue={forceValue}\n\t\t\t\t\t\t\tonChange={handleChangeRangeDate}\n\t\t\t\t\t\t\tviewValue={props.viewValue}\n\t\t\t\t\t\t\tdefaultViewValue={props.defaultViewValue}\n\t\t\t\t\t\t\tonChangeView={props.onChangeView}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</DatePickerCalendarContainer>\n\n\t\t\t\t\t<DatePickerChevron\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\tisFocused={isFocused}\n\t\t\t\t\t\treadOnly={readOnly}\n\t\t\t\t\t\ticonSize={iconSize}\n\t\t\t\t\t\tisLoading={isLoading}\n\t\t\t\t\t/>\n\n\t\t\t\t\t<DatePickerSpinner iconSize={iconSize} isLoading={isLoading} />\n\t\t\t\t\t<DatePickerOverlay handleBlur={handleBlur} isFocused={isFocused} />\n\t\t\t\t</DatePickerContainer>\n\t\t\t</FieldTemplate>\n\t\t);\n\t}\n\n\tconst forceValue =\n\t\tvalue !== undefined ? (value as Date) : internalSingleValue;\n\n\tconst hiddenInputValue = forceValue ? toInputDateValue(forceValue) : \"\";\n\n\treturn (\n\t\t<FieldTemplate\n\t\t\tname={name}\n\t\t\tlabel={label}\n\t\t\tshowAsterisk={showAsterisk}\n\t\t\tclassName={wrapperClassName}\n\t\t\terrorMessage={errorMessage}\n\t\t\tunShowFieldTemplate={unShowFieldTemplate}\n\t\t\torientation={orientation}\n\t\t>\n\t\t\t<DatePickerContainer\n\t\t\t\thandleContainerFocus={handleContainerFocus}\n\t\t\t\tdisabled={disabled}\n\t\t\t\tisError={isError}\n\t\t\t\tisFocused={isFocused}\n\t\t\t\tisLoading={isLoading}\n\t\t\t\treadOnly={readOnly}\n\t\t\t\tsize={size}\n\t\t\t\tvariant={variant}\n\t\t\t\tprefixExists={!!prefix}\n\t\t\t\tid={datePickerId}\n\t\t\t>\n\t\t\t\t<input\n\t\t\t\t\tref={datePickerRef}\n\t\t\t\t\tname={name}\n\t\t\t\t\tvalue={hiddenInputValue}\n\t\t\t\t\ttype=\"hidden\"\n\t\t\t\t/>\n\n\t\t\t\t<IconRenderer iconSize={iconSize} icon={prefix} className=\"prefix\" />\n\n\t\t\t\t{LeftIcon && <LeftIcon size={iconSize} strokeWidth={2.5} />}\n\n\t\t\t\t<DatePickerContent size={size}>\n\t\t\t\t\t{forceValue ? (\n\t\t\t\t\t\t<p className=\"hasValue\">{toDisplayDateValue(forceValue)}</p>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<p>{placeholder}</p>\n\t\t\t\t\t)}\n\t\t\t\t</DatePickerContent>\n\n\t\t\t\t<DatePickerCalendarContainer isFocused={isFocused}>\n\t\t\t\t\t<Calendar\n\t\t\t\t\t\ttype=\"single\"\n\t\t\t\t\t\tvariant={calendarVariant}\n\t\t\t\t\t\tvalue={forceValue}\n\t\t\t\t\t\tonChange={handleChangeSingleDate}\n\t\t\t\t\t\tviewValue={props.viewValue}\n\t\t\t\t\t\tdefaultViewValue={props.defaultViewValue}\n\t\t\t\t\t\tonChangeView={props.onChangeView}\n\t\t\t\t\t/>\n\t\t\t\t</DatePickerCalendarContainer>\n\n\t\t\t\t<DatePickerChevron\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tisFocused={isFocused}\n\t\t\t\t\treadOnly={readOnly}\n\t\t\t\t\ticonSize={iconSize}\n\t\t\t\t\tisLoading={isLoading}\n\t\t\t\t/>\n\n\t\t\t\t<DatePickerSpinner iconSize={iconSize} isLoading={isLoading} />\n\t\t\t\t<DatePickerOverlay handleBlur={handleBlur} isFocused={isFocused} />\n\t\t\t</DatePickerContainer>\n\t\t</FieldTemplate>\n\t);\n}\n\nexport { DatePicker };\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/divider/index.tsx"],"sourcesContent":["import type { HTMLAttributes } from \"react\";\nimport \"./styles.css\";\n\ntype DividerProps = HTMLAttributes<HTMLDivElement> & {\n\t/**\n\t * Divider orientation.\n\t * @default \"horizontal\"\n\t */\n\torientation?: \"horizontal\" | \"vertical\";\n};\n\n/**\n * Divider
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/divider/index.tsx"],"sourcesContent":["import type { HTMLAttributes } from \"react\";\nimport \"./styles.css\";\n\ntype DividerProps = HTMLAttributes<HTMLDivElement> & {\n\t/**\n\t * Divider orientation.\n\t * @default \"horizontal\"\n\t */\n\torientation?: \"horizontal\" | \"vertical\";\n};\n\n/**\n * Divider, visually separates content sections.\n *\n * @param props.orientation - Line direction (`horizontal` | `vertical`). Default: \"horizontal\"\n *\n * **...Other valid HTML properties for `<div>`**\n *\n * @returns Divider JSX element.\n *\n * @example\n * ```tsx\n * // Between sections\n * <h2>Section 1</h2>\n * <Divider />\n * <h2>Section 2</h2>\n *\n * // Vertical (e.g. between sidebar and content)\n * <Divider orientation=\"vertical\" />\n * ```\n */\n\nfunction Divider(props: DividerProps) {\n\tconst {\n\t\tclassName: baseClassName,\n\t\torientation = \"horizontal\",\n\t\t...rest\n\t} = props;\n\n\tconst className = `arkynDivider ${orientation} ${baseClassName}`;\n\n\treturn <div className={className.trim()} {...rest} />;\n}\n\nexport { Divider };\n"],"mappings":";;;AAgCA,SAAS,EAAQ,GAAqB;CACrC,IAAM,EACL,WAAW,GACX,iBAAc,cACd,GAAG,MACA;CAIJ,OAAO,kBAAC,OAAD;EAAK,WAAW,gBAFW,EAAY,GAAG,IAEhB,KAAK;EAAG,GAAI;CAAO,CAAA;AACrD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/drawer/drawerContainer/index.tsx"],"sourcesContent":["import {\n\ttype AnimationEvent,\n\ttype HTMLAttributes,\n\tuseEffect,\n\tuseState,\n} from \"react\";\n\nimport { useScrollLock } from \"../../../hooks/useScrollLock\";\nimport { DrawerProvider } from \"../drawerContext\";\nimport \"./styles.css\";\n\ntype DrawerContainerProps = HTMLAttributes<HTMLElement> & {\n\t/** Controls whether the drawer is visible. */\n\tisVisible: boolean;\n\t/** Callback invoked when the overlay is clicked to close the drawer. */\n\tmakeInvisible: () => void;\n\t/** Side from which the drawer slides in. @default \"left\" */\n\torientation?: \"left\" | \"right\";\n};\n\n/**\n * DrawerContainer
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/drawer/drawerContainer/index.tsx"],"sourcesContent":["import {\n\ttype AnimationEvent,\n\ttype HTMLAttributes,\n\tuseEffect,\n\tuseState,\n} from \"react\";\n\nimport { useScrollLock } from \"../../../hooks/useScrollLock\";\nimport { DrawerProvider } from \"../drawerContext\";\nimport \"./styles.css\";\n\ntype DrawerContainerProps = HTMLAttributes<HTMLElement> & {\n\t/** Controls whether the drawer is visible. */\n\tisVisible: boolean;\n\t/** Callback invoked when the overlay is clicked to close the drawer. */\n\tmakeInvisible: () => void;\n\t/** Side from which the drawer slides in. @default \"left\" */\n\torientation?: \"left\" | \"right\";\n};\n\n/**\n * DrawerContainer, animated slide-in panel rendered over an overlay backdrop.\n *\n * Locks body scroll while open. Closes when the overlay is clicked.\n * Provides context consumed by `DrawerHeader` (close button).\n *\n * @param props.isVisible - Whether the drawer is open. Required.\n * @param props.makeInvisible - Called when the overlay or close button is clicked. Required.\n * @param props.orientation - Slide direction. Default: `\"left\"`\n *\n * **...Other valid HTML `<aside>` properties**\n *\n * @returns DrawerContainer JSX element.\n *\n * @example\n * ```tsx\n * const [isOpen, setIsOpen] = useState(false);\n *\n * <DrawerContainer isVisible={isOpen} makeInvisible={() => setIsOpen(false)} orientation=\"right\">\n * <DrawerHeader><h2>Navigation</h2></DrawerHeader>\n * <nav>...</nav>\n * </DrawerContainer>\n * ```\n */\n\nfunction DrawerContainer(props: DrawerContainerProps) {\n\tconst {\n\t\tisVisible,\n\t\tmakeInvisible,\n\t\torientation = \"left\",\n\t\tchildren,\n\t\tclassName: baseClassName,\n\t\t...rest\n\t} = props;\n\n\tconst [mounted, setMounted] = useState(isVisible);\n\tconst [isExiting, setIsExiting] = useState(false);\n\n\tuseEffect(() => {\n\t\tif (isVisible) {\n\t\t\tsetMounted(true);\n\t\t\tsetIsExiting(false);\n\t\t} else if (mounted) {\n\t\t\tsetIsExiting(true);\n\t\t}\n\t}, [isVisible, mounted]);\n\n\tuseScrollLock(isVisible);\n\n\tfunction handleOverlayAnimationEnd(e: AnimationEvent<HTMLDivElement>) {\n\t\tif (e.target === e.currentTarget && isExiting) {\n\t\t\tsetIsExiting(false);\n\t\t\tsetMounted(false);\n\t\t\tmakeInvisible();\n\t\t}\n\t}\n\n\tif (!mounted) return null;\n\n\tconst className = [\n\t\t\"arkynDrawerContainer\",\n\t\torientation,\n\t\tisExiting ? \"exiting\" : \"\",\n\t\tbaseClassName,\n\t]\n\t\t.filter(Boolean)\n\t\t.join(\" \");\n\n\treturn (\n\t\t<DrawerProvider makeInvisible={() => setIsExiting(true)}>\n\t\t\t<aside className={className} {...rest}>\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"arkynDrawerContainerOverlay\"\n\t\t\t\t\tonClick={() => setIsExiting(true)}\n\t\t\t\t\tonAnimationEnd={handleOverlayAnimationEnd}\n\t\t\t\t/>\n\t\t\t\t<div className=\"arkynDrawerContainerContent\">{children}</div>\n\t\t\t</aside>\n\t\t</DrawerProvider>\n\t);\n}\n\nexport { DrawerContainer };\n"],"mappings":";;;;;;AA6CA,SAAS,EAAgB,GAA6B;CACrD,IAAM,EACL,cACA,kBACA,iBAAc,QACd,aACA,WAAW,GACX,GAAG,MACA,GAEE,CAAC,GAAS,KAAc,EAAS,CAAS,GAC1C,CAAC,GAAW,KAAgB,EAAS,EAAK;CAWhD,AATA,QAAgB;EACf,AAAI,KACH,EAAW,EAAI,GACf,EAAa,EAAK,KACR,KACV,EAAa,EAAI;CAEnB,GAAG,CAAC,GAAW,CAAO,CAAC,GAEvB,EAAc,CAAS;CAEvB,SAAS,EAA0B,GAAmC;EACrE,AAAI,EAAE,WAAW,EAAE,iBAAiB,MACnC,EAAa,EAAK,GAClB,EAAW,EAAK,GAChB,EAAc;CAEhB;CAaA,OAXK,IAYJ,kBAAC,GAAD;EAAgB,qBAAqB,EAAa,EAAI;YACrD,kBAAC,SAAD;GAAkB,WAXF;IACjB;IACA;IACA,IAAY,YAAY;IACxB;GACD,CAAC,CACC,OAAO,OAAO,CAAC,CACf,KAAK,GAIa;GAAW,GAAI;aAAjC,CACC,kBAAC,OAAD;IACC,WAAU;IACV,eAAe,EAAa,EAAI;IAChC,gBAAgB;GAChB,CAAA,GACD,kBAAC,OAAD;IAAK,WAAU;IAA+B;GAAc,CAAA,CACtD;;CACQ,CAAA,IArBI;AAuBtB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/drawer/drawerHeader/index.tsx"],"sourcesContent":["import { X } from \"lucide-react\";\nimport type { HTMLAttributes } from \"react\";\n\nimport { useDrawer } from \"../drawerContext\";\nimport \"./styles.css\";\n\ntype DrawerHeaderProps = HTMLAttributes<HTMLElement> & {\n\t/** Whether to render the X close button. @default true */\n\tshowCloseButton?: boolean;\n};\n\n/**\n * DrawerHeader
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/drawer/drawerHeader/index.tsx"],"sourcesContent":["import { X } from \"lucide-react\";\nimport type { HTMLAttributes } from \"react\";\n\nimport { useDrawer } from \"../drawerContext\";\nimport \"./styles.css\";\n\ntype DrawerHeaderProps = HTMLAttributes<HTMLElement> & {\n\t/** Whether to render the X close button. @default true */\n\tshowCloseButton?: boolean;\n};\n\n/**\n * DrawerHeader, header section for a `DrawerContainer`, with an optional close button.\n *\n * The close button calls `makeInvisible` from the nearest `DrawerContainer` context.\n * Must be rendered inside a `DrawerContainer`.\n *\n * @param props.showCloseButton - Renders the X close button. Default: true\n *\n * **...Other valid HTML `<header>` properties**\n *\n * @returns DrawerHeader JSX element.\n *\n * @example\n * ```tsx\n * <DrawerContainer isVisible={isOpen} makeInvisible={() => setIsOpen(false)}>\n * <DrawerHeader>\n * <h2>Navigation</h2>\n * </DrawerHeader>\n * <nav>...</nav>\n * </DrawerContainer>\n * ```\n */\n\nfunction DrawerHeader(props: DrawerHeaderProps) {\n\tconst {\n\t\tshowCloseButton = true,\n\t\tclassName: baseClassName,\n\t\tchildren,\n\t\t...rest\n\t} = props;\n\n\tconst { makeInvisible } = useDrawer();\n\tconst className = `arkynDrawerHeader ${baseClassName}`;\n\n\treturn (\n\t\t<header className={className.trim()} {...rest}>\n\t\t\t{children}\n\n\t\t\t{showCloseButton && (\n\t\t\t\t<button\n\t\t\t\t\tclassName=\"arkynDrawerHeaderCloseButton\"\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tonClick={makeInvisible}\n\t\t\t\t\taria-label=\"Close drawer\"\n\t\t\t\t>\n\t\t\t\t\t<X size={24} />\n\t\t\t\t</button>\n\t\t\t)}\n\t\t</header>\n\t);\n}\n\nexport { DrawerHeader };\n"],"mappings":";;;;;AAkCA,SAAS,EAAa,GAA0B;CAC/C,IAAM,EACL,qBAAkB,IAClB,WAAW,GACX,aACA,GAAG,MACA,GAEE,EAAE,qBAAkB,EAAU;CAGpC,OACC,kBAAC,UAAD;EAAQ,WAAW,qBAHmB,IAGT,KAAK;EAAG,GAAI;YAAzC,CACE,GAEA,KACA,kBAAC,UAAD;GACC,WAAU;GACV,MAAK;GACL,SAAS;GACT,cAAW;aAEX,kBAAC,GAAD,EAAG,MAAM,GAAK,CAAA;EACP,CAAA,CAEF;;AAEV"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/facebookPixel/index.tsx"],"sourcesContent":["import { ClientOnly } from \"../clientOnly\";\nimport { FacebookPixelClient } from \"./facebookPixel.client\";\n\ntype FacebookPixelProps = {\n\t/** Facebook Pixel ID from your Ads Manager account. Required. */\n\tpixelId: string;\n\t/** When true, renders the pixel in development mode (bypasses the production check). @default false */\n\tshowInDevMode?: boolean;\n\t/** Pixel initialization options. */\n\toptions?: {\n\t\t/** Enables automatic configuration. @default true */\n\t\tautoConfig?: boolean;\n\t\t/** Enables debug logging in the browser console. @default false */\n\t\tdebug?: boolean;\n\t};\n\t/** When true, fires a standard `PageView` event on mount. */\n\tpageView?: boolean;\n\t/** When true, grants cookie/tracking consent via `fbq(\"consent\", \"grant\")`. */\n\tgrantConsent?: boolean;\n\t/** When true, revokes cookie/tracking consent via `fbq(\"consent\", \"revoke\")`. */\n\trevokeConsent?: boolean;\n\t/** Standard event to track: `[eventName, eventData?]`. */\n\t// biome-ignore lint/suspicious/noExplicitAny: intentional\n\ttrack?: [string, any?];\n\t/** Custom event to track: `[eventName, eventData?]`. */\n\t// biome-ignore lint/suspicious/noExplicitAny: intentional\n\ttrackCustom?: [string, any?];\n\t/** Single-pixel standard event: `[eventName, eventData?]`. */\n\t// biome-ignore lint/suspicious/noExplicitAny: intentional\n\ttrackSingle?: [string, any?];\n\t/** Single-pixel custom event: `[eventName, eventData?]`. */\n\t// biome-ignore lint/suspicious/noExplicitAny: intentional\n\ttrackSingleCustom?: [string, any?];\n};\n\n/**\n * FacebookPixel
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/facebookPixel/index.tsx"],"sourcesContent":["import { ClientOnly } from \"../clientOnly\";\nimport { FacebookPixelClient } from \"./facebookPixel.client\";\n\ntype FacebookPixelProps = {\n\t/** Facebook Pixel ID from your Ads Manager account. Required. */\n\tpixelId: string;\n\t/** When true, renders the pixel in development mode (bypasses the production check). @default false */\n\tshowInDevMode?: boolean;\n\t/** Pixel initialization options. */\n\toptions?: {\n\t\t/** Enables automatic configuration. @default true */\n\t\tautoConfig?: boolean;\n\t\t/** Enables debug logging in the browser console. @default false */\n\t\tdebug?: boolean;\n\t};\n\t/** When true, fires a standard `PageView` event on mount. */\n\tpageView?: boolean;\n\t/** When true, grants cookie/tracking consent via `fbq(\"consent\", \"grant\")`. */\n\tgrantConsent?: boolean;\n\t/** When true, revokes cookie/tracking consent via `fbq(\"consent\", \"revoke\")`. */\n\trevokeConsent?: boolean;\n\t/** Standard event to track: `[eventName, eventData?]`. */\n\t// biome-ignore lint/suspicious/noExplicitAny: intentional\n\ttrack?: [string, any?];\n\t/** Custom event to track: `[eventName, eventData?]`. */\n\t// biome-ignore lint/suspicious/noExplicitAny: intentional\n\ttrackCustom?: [string, any?];\n\t/** Single-pixel standard event: `[eventName, eventData?]`. */\n\t// biome-ignore lint/suspicious/noExplicitAny: intentional\n\ttrackSingle?: [string, any?];\n\t/** Single-pixel custom event: `[eventName, eventData?]`. */\n\t// biome-ignore lint/suspicious/noExplicitAny: intentional\n\ttrackSingleCustom?: [string, any?];\n};\n\n/**\n * FacebookPixel, injects the Facebook Pixel tracking script client-side.\n *\n * Renders nothing in development mode unless `showInDevMode` is `true`.\n * Wrapped in `ClientOnly` to avoid SSR errors.\n *\n * @param props.pixelId - Facebook Pixel ID. Required.\n * @param props.showInDevMode - Renders in development mode. Default: false\n * @param props.pageView - Fires a `PageView` event on mount.\n * @param props.grantConsent - Grants tracking consent.\n * @param props.revokeConsent - Revokes tracking consent.\n * @param props.track - Standard event to fire: `[eventName, params?]`.\n * @param props.trackCustom - Custom event to fire: `[eventName, params?]`.\n *\n * @returns Empty fragment in dev mode; otherwise the pixel script component.\n *\n * @example\n * ```tsx\n * // Basic page view tracking in root layout\n * <FacebookPixel pixelId=\"123456789012345\" pageView />\n *\n * // With LGPD consent handling\n * <FacebookPixel\n * pixelId=\"123456789012345\"\n * pageView\n * grantConsent={userAcceptedCookies}\n * />\n *\n * // Track a purchase event\n * <FacebookPixel\n * pixelId=\"123456789012345\"\n * track={[\"Purchase\", { value: 99.90, currency: \"BRL\" }]}\n * />\n * ```\n */\nfunction FacebookPixel(props: FacebookPixelProps) {\n\tif (process.env.NODE_ENV !== \"production\" && !props.showInDevMode) {\n\t\treturn null;\n\t}\n\n\treturn <ClientOnly>{() => <FacebookPixelClient {...props} />}</ClientOnly>;\n}\n\nexport { FacebookPixel, type FacebookPixelProps };\n"],"mappings":";;;;AAsEA,SAAS,EAAc,GAA2B;CAKjD,OAJA,QAAA,IAAA,aAA6B,gBAAgB,CAAC,EAAM,gBAC5C,OAGD,kBAAC,GAAD,EAAA,gBAAmB,kBAAC,GAAD,EAAqB,GAAI,EAAQ,CAAA,EAAc,CAAA;AAC1E"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/fieldError/index.tsx"],"sourcesContent":["import type { HTMLAttributes } from \"react\";\nimport \"./styles.css\";\n\ntype FieldErrorProps = HTMLAttributes<HTMLElement>;\n\n/**\n * FieldError
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/fieldError/index.tsx"],"sourcesContent":["import type { HTMLAttributes } from \"react\";\nimport \"./styles.css\";\n\ntype FieldErrorProps = HTMLAttributes<HTMLElement>;\n\n/**\n * FieldError, displays a validation error message below a form field.\n *\n * Renders nothing when `children` is empty or falsy.\n *\n * **...Other valid HTML properties for `<strong>`**\n *\n * @returns FieldError `<strong>` element, or an empty fragment when there is no message.\n *\n * @example\n * ```tsx\n * <FieldError>This field is required</FieldError>\n *\n * {error && <FieldError>{error}</FieldError>}\n * ```\n */\n\nfunction FieldError(props: FieldErrorProps) {\n\tconst { children, className: baseClassName, ...rest } = props;\n\tconst className = `arkynFieldError ${baseClassName}`;\n\n\tif (!children) return null;\n\n\treturn (\n\t\t<strong className={className.trim()} {...rest}>\n\t\t\t{children}\n\t\t</strong>\n\t);\n}\n\nexport { FieldError };\n"],"mappings":";;;AAsBA,SAAS,EAAW,GAAwB;CAC3C,IAAM,EAAE,aAAU,WAAW,GAAe,GAAG,MAAS,GAClD,IAAY,mBAAmB;CAIrC,OAFK,IAGJ,kBAAC,UAAD;EAAQ,WAAW,EAAU,KAAK;EAAG,GAAI;EACvC;CACM,CAAA,IALa;AAOvB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/fieldLabel/index.tsx"],"sourcesContent":["import type { LabelHTMLAttributes } from \"react\";\nimport \"./styles.css\";\n\ntype FieldLabelProps = LabelHTMLAttributes<HTMLLabelElement> & {\n\t/** When true, appends an asterisk (*) to signal a required field. @default false */\n\tshowAsterisk?: boolean;\n};\n\n/**\n * FieldLabel
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/fieldLabel/index.tsx"],"sourcesContent":["import type { LabelHTMLAttributes } from \"react\";\nimport \"./styles.css\";\n\ntype FieldLabelProps = LabelHTMLAttributes<HTMLLabelElement> & {\n\t/** When true, appends an asterisk (*) to signal a required field. @default false */\n\tshowAsterisk?: boolean;\n};\n\n/**\n * FieldLabel, label for form fields, with an optional required-field asterisk.\n *\n * @param props.showAsterisk - Appends `*` to the label. Default: false\n *\n * **...Other valid HTML properties for `<label>`**\n *\n * @returns FieldLabel JSX element.\n *\n * @example\n * ```tsx\n * <FieldLabel htmlFor=\"email\" showAsterisk>Email Address</FieldLabel>\n * ```\n */\n\nfunction FieldLabel(props: FieldLabelProps) {\n\tconst {\n\t\tshowAsterisk = false,\n\t\tclassName: baseClassName = \"\",\n\t\t...rest\n\t} = props;\n\n\tconst show = showAsterisk ? \"asteriskTrue\" : \"asteriskFalse\";\n\tconst className = `arkynFieldLabel ${show} ${baseClassName}`;\n\n\t// biome-ignore lint/a11y/noLabelWithoutControl: htmlFor is passed via ...rest\n\treturn <label className={className.trim()} {...rest} />;\n}\n\nexport { FieldLabel };\n"],"mappings":";;;AAuBA,SAAS,EAAW,GAAwB;CAC3C,IAAM,EACL,kBAAe,IACf,WAAW,IAAgB,IAC3B,GAAG,MACA;CAMJ,OAAO,kBAAC,SAAD;EAAO,WAAW,mBAJZ,IAAe,iBAAiB,gBACH,GAAG,IAGV,KAAK;EAAG,GAAI;CAAO,CAAA;AACvD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/fieldWrapper/index.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport \"./styles.css\";\n\ntype FieldWrapperProps = HTMLAttributes<HTMLElement> & {\n\t/** Field elements to render inside the wrapper (label, input, error, etc.). Required. */\n\tchildren: ReactNode;\n\t/**\n\t * Layout orientation of the wrapper.\n\t * @default \"vertical\"\n\t */\n\torientation?: \"vertical\" | \"horizontal\" | \"horizontalReverse\";\n};\n\n/**\n * FieldWrapper
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/fieldWrapper/index.tsx"],"sourcesContent":["import type { HTMLAttributes, ReactNode } from \"react\";\nimport \"./styles.css\";\n\ntype FieldWrapperProps = HTMLAttributes<HTMLElement> & {\n\t/** Field elements to render inside the wrapper (label, input, error, etc.). Required. */\n\tchildren: ReactNode;\n\t/**\n\t * Layout orientation of the wrapper.\n\t * @default \"vertical\"\n\t */\n\torientation?: \"vertical\" | \"horizontal\" | \"horizontalReverse\";\n};\n\n/**\n * FieldWrapper, `<section>` container that groups a form field with its label and error message.\n *\n * @param props.children - Field elements (label, input, error, etc.).\n * @param props.orientation - Layout direction. Default: \"vertical\"\n *\n * **...Other valid HTML properties for `<section>`**\n *\n * @returns FieldWrapper JSX element.\n *\n * @example\n * ```tsx\n * <FieldWrapper>\n * <FieldLabel showAsterisk>Email</FieldLabel>\n * <Input name=\"email\" type=\"email\" />\n * <FieldError>Invalid email address</FieldError>\n * </FieldWrapper>\n * ```\n */\n\nfunction FieldWrapper(props: FieldWrapperProps) {\n\tconst {\n\t\tchildren,\n\t\tclassName: baseClassName,\n\t\torientation = \"vertical\",\n\t\t...rest\n\t} = props;\n\n\tconst className = `arkynFieldWrapper ${baseClassName} ${orientation}`;\n\n\treturn (\n\t\t<section className={className.trim()} {...rest}>\n\t\t\t{children}\n\t\t</section>\n\t);\n}\n\nexport { FieldWrapper };\n"],"mappings":";;;AAiCA,SAAS,EAAa,GAA0B;CAC/C,IAAM,EACL,aACA,WAAW,GACX,iBAAc,YACd,GAAG,MACA;CAIJ,OACC,kBAAC,WAAD;EAAS,WAAW,qBAHkB,EAAc,GAAG,IAGzB,KAAK;EAAG,GAAI;EACxC;CACO,CAAA;AAEX"}
|