@lindle/linoardo 1.0.39 → 1.0.40

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.cts CHANGED
@@ -22,6 +22,7 @@ export { default as Icon } from './icon.cjs';
22
22
  import { NotificationArgs } from './notification.cjs';
23
23
  export { default as Notification, NotificationPlacement, NotificationProps, NotificationType, NotificationVariant } from './notification.cjs';
24
24
  export { default as Progress, ProgressProps, ProgressStatus, ProgressType } from './progress.cjs';
25
+ export { default as TimeLine, TimeLineAlign, TimeLineDensity, TimeLineDotSize, TimeLineDotVariant, TimeLineItem, TimeLineItemProps, TimeLineProps, TimeLineSide } from './timeline.cjs';
25
26
  export { E as ExpansionPanelDensity, a as ExpansionPanelItem, b as ExpansionPanelItemProps, c as ExpansionPanelProps, d as ExpansionPanelRounded, e as ExpansionPanelValue, f as ExpansionPanelVariant } from './ExpansionPanelItem-ufS2RIZf.cjs';
26
27
  export { L as ListDensity, a as ListItem, b as ListItemProps, c as ListLines, d as ListRounded, e as ListVariant } from './index-B7xZzSwm.cjs';
27
28
  import 'react';
package/dist/index.d.ts CHANGED
@@ -22,6 +22,7 @@ export { default as Icon } from './icon.js';
22
22
  import { NotificationArgs } from './notification.js';
23
23
  export { default as Notification, NotificationPlacement, NotificationProps, NotificationType, NotificationVariant } from './notification.js';
24
24
  export { default as Progress, ProgressProps, ProgressStatus, ProgressType } from './progress.js';
25
+ export { default as TimeLine, TimeLineAlign, TimeLineDensity, TimeLineDotSize, TimeLineDotVariant, TimeLineItem, TimeLineItemProps, TimeLineProps, TimeLineSide } from './timeline.js';
25
26
  export { E as ExpansionPanelDensity, a as ExpansionPanelItem, b as ExpansionPanelItemProps, c as ExpansionPanelProps, d as ExpansionPanelRounded, e as ExpansionPanelValue, f as ExpansionPanelVariant } from './ExpansionPanelItem-CFm8a8R_.js';
26
27
  export { L as ListDensity, a as ListItem, b as ListItemProps, c as ListLines, d as ListRounded, e as ListVariant } from './index-BhfThlf0.js';
27
28
  import 'react';
package/dist/index.js CHANGED
@@ -1,10 +1,11 @@
1
1
  export { Notification_default as Notification } from './chunk-S7VLFCLP.js';
2
2
  export { Progress_default as Progress } from './chunk-Z5A2OIDI.js';
3
- export { Input_default as Input } from './chunk-P3ESW6KM.js';
3
+ export { TimeLine_default as TimeLine, TimeLineItem } from './chunk-4J3SRVOS.js';
4
+ export { Input_default as Input } from './chunk-OBGYXMZ3.js';
4
5
  export { TextArea_default as TextArea } from './chunk-SCJMH5VE.js';
5
6
  export { Slider_default as Slider } from './chunk-GMDNSU26.js';
6
7
  export { Switch_default as Switch } from './chunk-5LWU5T2C.js';
7
- export { Select_default as Select } from './chunk-BDN4EDJQ.js';
8
+ export { Select_default as Select } from './chunk-LULQOD2K.js';
8
9
  import './chunk-6SKW43XI.js';
9
10
  export { Icon_default as Icon } from './chunk-HEXJCQRO.js';
10
11
  export { Hero_default as Hero } from './chunk-VPF7M2PB.js';
@@ -18,7 +19,8 @@ export { Block_default as Block } from './chunk-5GT6L4BE.js';
18
19
  export { AppBar_default as AppBar } from './chunk-67BAO35I.js';
19
20
  export { Masonry_default as Masonry } from './chunk-HAXGOTZO.js';
20
21
  export { Button_default as Button } from './chunk-DIWGVTWO.js';
21
- export { Chip_default as Chip } from './chunk-HJFHZNOV.js';
22
+ export { Chip_default as Chip } from './chunk-HT5XBHWN.js';
23
+ import './chunk-PSMGRUU5.js';
22
24
  import './chunk-IEILIKS2.js';
23
25
  export { Badge_default as Badge } from './chunk-HIRPMCQJ.js';
24
26
  export { Alert_default as Alert } from './chunk-KQOR3C7E.js';
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/Feedback/Notification/useNotification.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA,IAAM,eAAA,GAAkB,CAAC,cAAA,KAAsC;AAC7D,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAI,QAAA,CAA6B,EAAE,CAAA;AAE/D,EAAA,MAAM,kBAAA,GAAqB,CAAC,GAAA,KAAiB;AAC3C,IAAA,WAAA,CAAY,CAAA,IAAA,KAAS,GAAA,GAAM,IAAA,CAAK,MAAA,CAAO,CAAA,YAAA,KAAgB,aAAa,GAAA,KAAQ,GAAG,CAAA,GAAI,EAAG,CAAA;AAAA,EACxF,CAAA;AAEA,EAAA,MAAM,gBAAA,GAAmB,CAAC,YAAA,KAAmC;AAC3D,IAAA,MAAM,GAAA,GAAM,GAAG,IAAA,CAAK,GAAA,EAAK,CAAA,CAAA,EAAI,IAAA,CAAK,QAAQ,CAAA,CAAA;AAC1C,IAAA,WAAA,CAAY,CAAA,IAAA,KAAQ;AAAA,MAClB,GAAG,IAAA;AAAA,MACH;AAAA,QACE,QAAA,EAAU,GAAA;AAAA,QACV,OAAA,EAAS,MAAM,kBAAA,CAAmB,GAAG,CAAA;AAAA,QACrC,GAAG,cAAA;AAAA,QACH,GAAG,YAAA;AAAA,QACH;AAAA;AACF,KACD,CAAA;AAAA,EACH,CAAA;AAEA,EAAA,OAAO,EAAE,UAAU,gBAAA,EAAiB;AACtC,CAAA;AAEA,IAAO,uBAAA,GAAQ","file":"index.js","sourcesContent":["import { useState } from 'react';\nimport { NotificationArgs } from './types.notification';\n\nconst useNotification = (defaultMessage?: NotificationArgs) => {\n const [messages, setMessages] = useState<NotificationArgs[]>([]);\n\n const clearNotifications = (key?: string) => {\n setMessages(prev => (key ? prev.filter(notification => notification.key !== key) : []));\n };\n\n const showNotification = (notification: NotificationArgs) => {\n const key = `${Date.now()}-${Math.random()}`;\n setMessages(prev => [\n ...prev,\n {\n duration: 4000,\n onClose: () => clearNotifications(key),\n ...defaultMessage,\n ...notification,\n key\n }\n ]);\n };\n\n return { messages, showNotification };\n};\n\nexport default useNotification;\n"]}
1
+ {"version":3,"sources":["../src/Feedback/Notification/useNotification.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA,IAAM,eAAA,GAAkB,CAAC,cAAA,KAAsC;AAC7D,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAI,QAAA,CAA6B,EAAE,CAAA;AAE/D,EAAA,MAAM,kBAAA,GAAqB,CAAC,GAAA,KAAiB;AAC3C,IAAA,WAAA,CAAY,CAAA,IAAA,KAAS,GAAA,GAAM,IAAA,CAAK,MAAA,CAAO,CAAA,YAAA,KAAgB,aAAa,GAAA,KAAQ,GAAG,CAAA,GAAI,EAAG,CAAA;AAAA,EACxF,CAAA;AAEA,EAAA,MAAM,gBAAA,GAAmB,CAAC,YAAA,KAAmC;AAC3D,IAAA,MAAM,GAAA,GAAM,GAAG,IAAA,CAAK,GAAA,EAAK,CAAA,CAAA,EAAI,IAAA,CAAK,QAAQ,CAAA,CAAA;AAC1C,IAAA,WAAA,CAAY,CAAA,IAAA,KAAQ;AAAA,MAClB,GAAG,IAAA;AAAA,MACH;AAAA,QACE,QAAA,EAAU,GAAA;AAAA,QACV,OAAA,EAAS,MAAM,kBAAA,CAAmB,GAAG,CAAA;AAAA,QACrC,GAAG,cAAA;AAAA,QACH,GAAG,YAAA;AAAA,QACH;AAAA;AACF,KACD,CAAA;AAAA,EACH,CAAA;AAEA,EAAA,OAAO,EAAE,UAAU,gBAAA,EAAiB;AACtC,CAAA;AAEA,IAAO,uBAAA,GAAQ","file":"index.js","sourcesContent":["import { useState } from 'react';\nimport { NotificationArgs } from './types.notification';\n\nconst useNotification = (defaultMessage?: NotificationArgs) => {\n const [messages, setMessages] = useState<NotificationArgs[]>([]);\n\n const clearNotifications = (key?: string) => {\n setMessages(prev => (key ? prev.filter(notification => notification.key !== key) : []));\n };\n\n const showNotification = (notification: NotificationArgs) => {\n const key = `${Date.now()}-${Math.random()}`;\n setMessages(prev => [\n ...prev,\n {\n duration: 4000,\n onClose: () => clearNotifications(key),\n ...defaultMessage,\n ...notification,\n key\n }\n ]);\n };\n\n return { messages, showNotification };\n};\n\nexport default useNotification;\n"]}
package/dist/input.cjs CHANGED
@@ -52,6 +52,8 @@ var Input = React__default.default.forwardRef(
52
52
  className,
53
53
  wrapperClassName,
54
54
  label,
55
+ prefix,
56
+ suffix,
55
57
  ...props
56
58
  }, ref) => {
57
59
  const { placeholder, onFocus, onBlur, ...inputProps } = props;
@@ -72,19 +74,51 @@ var Input = React__default.default.forwardRef(
72
74
  rounded: "rounded-full px-4 border border-gray-300 bg-white focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/20 shadow-sm dark:border-gray-600 dark:bg-slate-900 dark:focus-visible:border-primary/70 dark:focus-visible:ring-primary/30 dark:shadow-black/20"
73
75
  };
74
76
  const sizeClasses = {
75
- "x-small": { paddingNoIcon: "px-2 py-2", paddingWithIcon: "pl-8 pr-2 py-2", text: "text-xs" },
77
+ "x-small": {
78
+ paddingY: "py-2",
79
+ paddingLeft: "pl-2",
80
+ paddingRight: "pr-2",
81
+ paddingLeftLeading: "pl-8",
82
+ paddingLeftLeadingDouble: "pl-12",
83
+ paddingRightTrailing: "pr-8",
84
+ text: "text-xs"
85
+ },
76
86
  small: {
77
- paddingNoIcon: "px-2.5 py-2.5",
78
- paddingWithIcon: "pl-9 pr-2.5 py-2.5",
87
+ paddingY: "py-2.5",
88
+ paddingLeft: "pl-2.5",
89
+ paddingRight: "pr-2.5",
90
+ paddingLeftLeading: "pl-9",
91
+ paddingLeftLeadingDouble: "pl-12",
92
+ paddingRightTrailing: "pr-9",
79
93
  text: "text-sm"
80
94
  },
81
- medium: { paddingNoIcon: "px-3 py-3", paddingWithIcon: "pl-10 pr-3 py-3", text: "text-base" },
95
+ medium: {
96
+ paddingY: "py-3",
97
+ paddingLeft: "pl-3",
98
+ paddingRight: "pr-3",
99
+ paddingLeftLeading: "pl-10",
100
+ paddingLeftLeadingDouble: "pl-14",
101
+ paddingRightTrailing: "pr-10",
102
+ text: "text-base"
103
+ },
82
104
  large: {
83
- paddingNoIcon: "px-3.5 py-3.5",
84
- paddingWithIcon: "pl-11 pr-3.5 py-3.5",
105
+ paddingY: "py-3.5",
106
+ paddingLeft: "pl-3.5",
107
+ paddingRight: "pr-3.5",
108
+ paddingLeftLeading: "pl-11",
109
+ paddingLeftLeadingDouble: "pl-14",
110
+ paddingRightTrailing: "pr-11",
85
111
  text: "text-lg"
86
112
  },
87
- "x-large": { paddingNoIcon: "px-4 py-4", paddingWithIcon: "pl-12 pr-4 py-4", text: "text-xl" }
113
+ "x-large": {
114
+ paddingY: "py-4",
115
+ paddingLeft: "pl-4",
116
+ paddingRight: "pr-4",
117
+ paddingLeftLeading: "pl-12",
118
+ paddingLeftLeadingDouble: "pl-16",
119
+ paddingRightTrailing: "pr-12",
120
+ text: "text-xl"
121
+ }
88
122
  };
89
123
  const status = error ? { tone: "error", message: error } : warn ? { tone: "warn", message: warn } : success ? { tone: "success", message: success } : void 0;
90
124
  const statusClasses = {
@@ -100,16 +134,23 @@ var Input = React__default.default.forwardRef(
100
134
  const variantClass = variantClasses[variant] ?? variantClasses.outline;
101
135
  const toneClass = status ? statusClasses[status.tone] : void 0;
102
136
  let prependIconClass = resolveIconClassName(icon);
137
+ const hasPrefix = typeof prefix === "string" ? prefix.trim().length > 0 : Boolean(prefix);
138
+ const hasSuffix = typeof suffix === "string" ? suffix.trim().length > 0 : Boolean(suffix);
139
+ const hasLeadingIcon = Boolean(prependIconClass);
140
+ const hasLeadingAdornment = hasLeadingIcon || hasPrefix;
141
+ const hasTrailingAdornment = hasSuffix;
103
142
  const sizeConfig = sizeClasses[size] ?? sizeClasses.medium;
104
- const sizeClass = [
105
- prependIconClass ? sizeConfig.paddingWithIcon : sizeConfig.paddingNoIcon,
106
- sizeConfig.text
107
- ].join(" ");
143
+ const leftPaddingClass = hasPrefix ? sizeConfig.paddingLeftLeadingDouble : hasLeadingAdornment ? sizeConfig.paddingLeftLeading : sizeConfig.paddingLeft;
144
+ const rightPaddingClass = hasTrailingAdornment ? sizeConfig.paddingRightTrailing : sizeConfig.paddingRight;
145
+ const sizeClass = [sizeConfig.paddingY, leftPaddingClass, rightPaddingClass, sizeConfig.text].join(" ");
108
146
  const inputName = inputProps.name || reactId;
109
147
  const basePlaceholder = placeholder ?? (hasLabel ? " " : void 0);
110
148
  const placeholderValue = hidePlaceholderUntilFocus ? isFocused ? placeholder : " " : basePlaceholder;
111
149
  const placeholderClass = hidePlaceholderUntilFocus ? "placeholder-transparent focus:placeholder-gray-500 focus:dark:placeholder-gray-400" : void 0;
112
- const labelLeftClass = prependIconClass ? "left-10" : "left-3";
150
+ const labelLeftClass = hasLeadingAdornment ? "left-10" : "left-3";
151
+ const labelFocusLeftClass = hasLeadingAdornment ? "peer-focus:left-10" : "peer-focus:left-3";
152
+ const renderPrefix = hasPrefix ? typeof prefix === "string" ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: tailwindMerge.twMerge("text-gray-500 dark:text-gray-400", sizeConfig.text), children: prefix }) : prefix : null;
153
+ const renderSuffix = hasSuffix ? typeof suffix === "string" ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: tailwindMerge.twMerge("text-gray-500 dark:text-gray-400", sizeConfig.text), children: suffix }) : suffix : null;
113
154
  const labelBgDefault = ["outline", "text", "underlined"].includes(variant) ? "bg-transparent" : "bg-white/90 dark:bg-slate-900";
114
155
  const handleFocus = (event) => {
115
156
  if (hidePlaceholderUntilFocus) setIsFocused(true);
@@ -121,17 +162,20 @@ var Input = React__default.default.forwardRef(
121
162
  };
122
163
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: tailwindMerge.twMerge("flex flex-col gap-1", wrapperClassName), children: [
123
164
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex items-center", children: [
124
- prependIconClass && /* @__PURE__ */ jsxRuntime.jsx(
125
- "i",
126
- {
127
- className: tailwindMerge.twMerge(
128
- "pointer-events-none absolute left-3 top-1/2 -translate-y-1/2 text-gray-500 dark:text-gray-400",
129
- status?.tone && statusMessageClasses[status?.tone] || "",
130
- prependIconClass
131
- ),
132
- "aria-hidden": true
133
- }
134
- ),
165
+ hasLeadingAdornment && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "absolute left-3 inset-y-0 flex items-center gap-2", children: [
166
+ prependIconClass && /* @__PURE__ */ jsxRuntime.jsx(
167
+ "i",
168
+ {
169
+ className: tailwindMerge.twMerge(
170
+ "text-gray-500 dark:text-gray-400",
171
+ status?.tone && statusMessageClasses[status?.tone] || "",
172
+ prependIconClass
173
+ ),
174
+ "aria-hidden": true
175
+ }
176
+ ),
177
+ renderPrefix
178
+ ] }),
135
179
  /* @__PURE__ */ jsxRuntime.jsx(
136
180
  "input",
137
181
  {
@@ -161,16 +205,18 @@ var Input = React__default.default.forwardRef(
161
205
  "absolute transition-all duration-150 pointer-events-none text-gray-700 rounded dark:text-gray-200",
162
206
  labelLeftClass,
163
207
  // Floated state: center label's vertical middle on the top border line
164
- "-top-1.5 left-1 peer-focus:left-7 -translate-y-2/3 text-xs px-1",
208
+ "-top-1.5 -translate-y-2/3 text-xs px-1",
165
209
  labelBgDefault,
166
210
  // focus state mirrors floated state (keeps center on border)
211
+ labelFocusLeftClass,
167
212
  "peer-focus:top-0 peer-focus:-translate-y-1/2 peer-focus:text-xs peer-focus:px-1 peer-focus:bg-white peer-focus:text-gray-600 dark:peer-focus:bg-slate-900 dark:peer-focus:text-gray-300",
168
213
  // when input is empty (placeholder shown) -> center label inside input
169
214
  "peer-placeholder-shown:top-1/2 peer-placeholder-shown:-translate-y-1/2 peer-placeholder-shown:text-sm peer-placeholder-shown:bg-transparent peer-placeholder-shown:text-gray-500 dark:peer-placeholder-shown:text-gray-400"
170
215
  ),
171
216
  children: label
172
217
  }
173
- )
218
+ ),
219
+ hasTrailingAdornment && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute right-3 inset-y-0 flex items-center", children: renderSuffix })
174
220
  ] }),
175
221
  status?.message && /* @__PURE__ */ jsxRuntime.jsx("span", { className: tailwindMerge.twMerge("text-sm", statusMessageClasses[status.tone]), children: status.message })
176
222
  ] });
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/globals.ts","../src/Form/Input/states.input.ts","../src/Form/Input/index.tsx"],"names":["normalizedName","React","twMerge","jsxs","jsx"],"mappings":"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","file":"input.cjs","sourcesContent":["export const iconBaseClasses = {\n mdi: ['mdi']\n} as const;\n","import { iconBaseClasses } from '@lindle/linoardo/globals';\nimport { InputProp } from './types';\n\nexport const resolveIconClassName = (icon?: InputProp['icon']) => {\n if (!icon) {\n return undefined;\n }\n\n if (typeof icon === 'string') {\n const trimmed = icon.trim();\n if (!trimmed) {\n return undefined;\n }\n\n if (trimmed.includes(' ')) {\n return trimmed;\n }\n\n const normalizedName = trimmed.startsWith('mdi-') ? trimmed : `mdi-${trimmed}`;\n return ['mdi', normalizedName].join(' ');\n }\n\n const [library, iconNameRaw] = icon;\n const baseClasses = iconBaseClasses[library] ?? [library];\n const iconName = iconNameRaw.trim();\n if (!iconName) {\n return baseClasses.join(' ');\n }\n const normalizedName = iconName.startsWith('mdi-') ? iconName : `mdi-${iconName}`;\n const classes = [...baseClasses, normalizedName];\n return Array.from(new Set(classes)).join(' ');\n};\n","import React from 'react';\nimport { twMerge } from 'tailwind-merge';\nimport { InputProp, InputVariant, InputSize } from './types';\nimport { resolveIconClassName } from './states.input';\n\n/**\n * Text input with multiple visual variants and inline status or icon adornments.\n * Label is purely CSS-driven (peer + placeholder-shown + focus), no hooks used.\n */\nconst Input = React.forwardRef<HTMLInputElement, InputProp>(\n (\n {\n variant = 'outline',\n size = 'medium',\n success,\n error,\n warn,\n icon,\n className,\n wrapperClassName,\n label,\n ...props\n },\n ref\n ) => {\n const { placeholder, onFocus, onBlur, ...inputProps } = props;\n const reactId = React.useId();\n const hasLabel = Boolean(label);\n const hasProvidedPlaceholder = typeof placeholder === 'string' && placeholder.trim().length > 0;\n const hidePlaceholderUntilFocus = hasLabel && hasProvidedPlaceholder;\n const [isFocused, setIsFocused] = React.useState(false);\n const classBase =\n 'input-base focus-visible:outline-none focus-visible:ring-primary transition-colors duration-200 disabled:opacity-50 disabled:cursor-not-allowed w-full text-gray-900 dark:text-gray-100 placeholder:text-gray-500 dark:placeholder:text-gray-400';\n const variantClasses = {\n solid:\n 'rounded border border-gray-400 bg-white shadow-sm focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/30 dark:border-gray-600 dark:bg-slate-900 dark:shadow-black/20 dark:focus-visible:border-primary/70 dark:focus-visible:ring-primary/40',\n sharp:\n 'rounded-none border border-gray-400 bg-white shadow-sm focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/30 dark:border-gray-600 dark:bg-slate-900 dark:shadow-black/20 dark:focus-visible:border-primary/70 dark:focus-visible:ring-primary/40',\n outline:\n 'rounded border-2 border-black bg-white focus-visible:border-black focus-visible:ring-2 focus-visible:ring-black/30 dark:border-black dark:bg-transparent dark:focus-visible:border-black dark:focus-visible:ring-black/40',\n text: 'rounded-none border-0 border-b border-transparent px-0 bg-transparent focus-visible:border-primary focus-visible:ring-0 focus-visible:ring-transparent dark:border-b-gray-600 dark:focus-visible:border-primary/70',\n ghost:\n 'rounded border border-transparent bg-gray-50 text-gray-900 focus-visible:bg-white focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/15 dark:bg-slate-800 dark:text-gray-100 dark:focus-visible:bg-slate-700 dark:focus-visible:border-primary/60 dark:focus-visible:ring-primary/25',\n filled:\n 'rounded border border-gray-200 bg-gray-100 focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/25 dark:border-gray-700 dark:bg-slate-800 dark:focus-visible:border-primary/60 dark:focus-visible:ring-primary/30',\n underlined:\n 'rounded-none border-0 border-b border-gray-300 px-0 bg-transparent focus-visible:border-primary focus-visible:ring-0 focus-visible:ring-transparent dark:border-b-gray-600 dark:focus-visible:border-primary/70',\n rounded:\n 'rounded-full px-4 border border-gray-300 bg-white focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/20 shadow-sm dark:border-gray-600 dark:bg-slate-900 dark:focus-visible:border-primary/70 dark:focus-visible:ring-primary/30 dark:shadow-black/20'\n } satisfies Record<InputVariant, string>;\n const sizeClasses = {\n 'x-small': { paddingNoIcon: 'px-2 py-2', paddingWithIcon: 'pl-8 pr-2 py-2', text: 'text-xs' },\n small: {\n paddingNoIcon: 'px-2.5 py-2.5',\n paddingWithIcon: 'pl-9 pr-2.5 py-2.5',\n text: 'text-sm'\n },\n medium: { paddingNoIcon: 'px-3 py-3', paddingWithIcon: 'pl-10 pr-3 py-3', text: 'text-base' },\n large: {\n paddingNoIcon: 'px-3.5 py-3.5',\n paddingWithIcon: 'pl-11 pr-3.5 py-3.5',\n text: 'text-lg'\n },\n 'x-large': { paddingNoIcon: 'px-4 py-4', paddingWithIcon: 'pl-12 pr-4 py-4', text: 'text-xl' }\n } satisfies Record<InputSize, { paddingNoIcon: string; paddingWithIcon: string; text: string }>;\n\n const status = error\n ? { tone: 'error' as const, message: error }\n : warn\n ? { tone: 'warn' as const, message: warn }\n : success\n ? { tone: 'success' as const, message: success }\n : undefined;\n\n const statusClasses = {\n error: 'border-red-500 focus:border-red-500 focus:ring-red-400',\n warn: 'border-amber-500 focus:border-amber-500 focus:ring-amber-400',\n success: 'border-emerald-500 focus:border-emerald-500 focus:ring-emerald-400'\n } as const;\n\n const statusMessageClasses = {\n error: 'text-red-600 dark:text-red-300',\n warn: 'text-amber-600 dark:text-amber-300',\n success: 'text-emerald-600 dark:text-emerald-300'\n } as const;\n\n const variantClass = variantClasses[variant] ?? variantClasses.outline;\n const toneClass = status ? statusClasses[status.tone] : undefined;\n let prependIconClass = resolveIconClassName(icon);\n const sizeConfig = sizeClasses[size] ?? sizeClasses.medium;\n const sizeClass = [\n prependIconClass ? sizeConfig.paddingWithIcon : sizeConfig.paddingNoIcon,\n sizeConfig.text\n ].join(' ');\n\n // useId keeps SSR/CSR ids consistent while still providing a fallback name\n const inputName = inputProps.name || reactId;\n\n // Ensure placeholder is present when label exists so :placeholder-shown works.\n // Label stays primary; placeholder only appears on focus when the field is empty.\n const basePlaceholder = placeholder ?? (hasLabel ? ' ' : undefined);\n const placeholderValue = hidePlaceholderUntilFocus\n ? isFocused\n ? placeholder\n : ' '\n : basePlaceholder;\n const placeholderClass = hidePlaceholderUntilFocus\n ? 'placeholder-transparent focus:placeholder-gray-500 focus:dark:placeholder-gray-400'\n : undefined;\n\n // Label left offset depends on icon presence\n const labelLeftClass = prependIconClass ? 'left-10' : 'left-3';\n\n // Background for floated label — keep transparent for outline/text/underlined variants\n const labelBgDefault = ['outline', 'text', 'underlined'].includes(variant)\n ? 'bg-transparent'\n : 'bg-white/90 dark:bg-slate-900';\n\n const handleFocus: React.FocusEventHandler<HTMLInputElement> = event => {\n if (hidePlaceholderUntilFocus) setIsFocused(true);\n onFocus?.(event);\n };\n\n const handleBlur: React.FocusEventHandler<HTMLInputElement> = event => {\n if (hidePlaceholderUntilFocus) setIsFocused(false);\n onBlur?.(event);\n };\n\n return (\n <div className={twMerge('flex flex-col gap-1', wrapperClassName)}>\n <div className='relative flex items-center'>\n {prependIconClass && (\n <i\n className={twMerge(\n 'pointer-events-none absolute left-3 top-1/2 -translate-y-1/2 text-gray-500 dark:text-gray-400',\n (status?.tone && statusMessageClasses[status?.tone]) || '',\n prependIconClass\n )}\n aria-hidden\n />\n )}\n\n {/* input is peer so label can react with peer-* utilities */}\n <input\n {...inputProps}\n ref={ref}\n id={inputName}\n name={inputName}\n placeholder={placeholderValue}\n onFocus={handleFocus}\n onBlur={handleBlur}\n className={twMerge(\n 'peer',\n classBase,\n variantClass,\n toneClass,\n sizeClass,\n placeholderClass,\n className\n )}\n />\n\n {label && (\n <label\n htmlFor={inputName}\n className={twMerge(\n 'absolute transition-all duration-150 pointer-events-none text-gray-700 rounded dark:text-gray-200',\n labelLeftClass,\n // Floated state: center label's vertical middle on the top border line\n '-top-1.5 left-1 peer-focus:left-7 -translate-y-2/3 text-xs px-1',\n labelBgDefault,\n // focus state mirrors floated state (keeps center on border)\n 'peer-focus:top-0 peer-focus:-translate-y-1/2 peer-focus:text-xs peer-focus:px-1 peer-focus:bg-white peer-focus:text-gray-600 dark:peer-focus:bg-slate-900 dark:peer-focus:text-gray-300',\n // when input is empty (placeholder shown) -> center label inside input\n 'peer-placeholder-shown:top-1/2 peer-placeholder-shown:-translate-y-1/2 peer-placeholder-shown:text-sm peer-placeholder-shown:bg-transparent peer-placeholder-shown:text-gray-500 dark:peer-placeholder-shown:text-gray-400'\n )}\n >\n {label}\n </label>\n )}\n\n {/* {appendIconClass && (\n <i className={twMerge('pointer-events-none absolute right-3 text-gray-500', appendIconClass)} aria-hidden />\n )} */}\n </div>\n {status?.message && (\n <span className={twMerge('text-sm', statusMessageClasses[status.tone])}>\n {status.message}\n </span>\n )}\n </div>\n );\n }\n);\n\nInput.displayName = 'Input';\n\nexport default Input;\n"]}
1
+ {"version":3,"sources":["../src/globals.ts","../src/Form/Input/states.input.ts","../src/Form/Input/index.tsx"],"names":["normalizedName","React","jsx","twMerge","jsxs"],"mappings":"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","file":"input.cjs","sourcesContent":["export const iconBaseClasses = {\n mdi: ['mdi']\n} as const;\n","import { iconBaseClasses } from '@lindle/linoardo/globals';\nimport { InputProp } from './types';\n\nexport const resolveIconClassName = (icon?: InputProp['icon']) => {\n if (!icon) {\n return undefined;\n }\n\n if (typeof icon === 'string') {\n const trimmed = icon.trim();\n if (!trimmed) {\n return undefined;\n }\n\n if (trimmed.includes(' ')) {\n return trimmed;\n }\n\n const normalizedName = trimmed.startsWith('mdi-') ? trimmed : `mdi-${trimmed}`;\n return ['mdi', normalizedName].join(' ');\n }\n\n const [library, iconNameRaw] = icon;\n const baseClasses = iconBaseClasses[library] ?? [library];\n const iconName = iconNameRaw.trim();\n if (!iconName) {\n return baseClasses.join(' ');\n }\n const normalizedName = iconName.startsWith('mdi-') ? iconName : `mdi-${iconName}`;\n const classes = [...baseClasses, normalizedName];\n return Array.from(new Set(classes)).join(' ');\n};\n","import React from 'react';\nimport { twMerge } from 'tailwind-merge';\nimport { InputProp, InputVariant, InputSize } from './types';\nimport { resolveIconClassName } from './states.input';\n\n/**\n * Text input with multiple visual variants and inline status or icon adornments.\n * Label is purely CSS-driven (peer + placeholder-shown + focus), no hooks used.\n */\nconst Input = React.forwardRef<HTMLInputElement, InputProp>(\n (\n {\n variant = 'outline',\n size = 'medium',\n success,\n error,\n warn,\n icon,\n className,\n wrapperClassName,\n label,\n prefix,\n suffix,\n ...props\n },\n ref\n ) => {\n const { placeholder, onFocus, onBlur, ...inputProps } = props;\n const reactId = React.useId();\n const hasLabel = Boolean(label);\n const hasProvidedPlaceholder = typeof placeholder === 'string' && placeholder.trim().length > 0;\n const hidePlaceholderUntilFocus = hasLabel && hasProvidedPlaceholder;\n const [isFocused, setIsFocused] = React.useState(false);\n const classBase =\n 'input-base focus-visible:outline-none focus-visible:ring-primary transition-colors duration-200 disabled:opacity-50 disabled:cursor-not-allowed w-full text-gray-900 dark:text-gray-100 placeholder:text-gray-500 dark:placeholder:text-gray-400';\n const variantClasses = {\n solid:\n 'rounded border border-gray-400 bg-white shadow-sm focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/30 dark:border-gray-600 dark:bg-slate-900 dark:shadow-black/20 dark:focus-visible:border-primary/70 dark:focus-visible:ring-primary/40',\n sharp:\n 'rounded-none border border-gray-400 bg-white shadow-sm focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/30 dark:border-gray-600 dark:bg-slate-900 dark:shadow-black/20 dark:focus-visible:border-primary/70 dark:focus-visible:ring-primary/40',\n outline:\n 'rounded border-2 border-black bg-white focus-visible:border-black focus-visible:ring-2 focus-visible:ring-black/30 dark:border-black dark:bg-transparent dark:focus-visible:border-black dark:focus-visible:ring-black/40',\n text: 'rounded-none border-0 border-b border-transparent px-0 bg-transparent focus-visible:border-primary focus-visible:ring-0 focus-visible:ring-transparent dark:border-b-gray-600 dark:focus-visible:border-primary/70',\n ghost:\n 'rounded border border-transparent bg-gray-50 text-gray-900 focus-visible:bg-white focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/15 dark:bg-slate-800 dark:text-gray-100 dark:focus-visible:bg-slate-700 dark:focus-visible:border-primary/60 dark:focus-visible:ring-primary/25',\n filled:\n 'rounded border border-gray-200 bg-gray-100 focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/25 dark:border-gray-700 dark:bg-slate-800 dark:focus-visible:border-primary/60 dark:focus-visible:ring-primary/30',\n underlined:\n 'rounded-none border-0 border-b border-gray-300 px-0 bg-transparent focus-visible:border-primary focus-visible:ring-0 focus-visible:ring-transparent dark:border-b-gray-600 dark:focus-visible:border-primary/70',\n rounded:\n 'rounded-full px-4 border border-gray-300 bg-white focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/20 shadow-sm dark:border-gray-600 dark:bg-slate-900 dark:focus-visible:border-primary/70 dark:focus-visible:ring-primary/30 dark:shadow-black/20'\n } satisfies Record<InputVariant, string>;\n const sizeClasses = {\n 'x-small': {\n paddingY: 'py-2',\n paddingLeft: 'pl-2',\n paddingRight: 'pr-2',\n paddingLeftLeading: 'pl-8',\n paddingLeftLeadingDouble: 'pl-12',\n paddingRightTrailing: 'pr-8',\n text: 'text-xs'\n },\n small: {\n paddingY: 'py-2.5',\n paddingLeft: 'pl-2.5',\n paddingRight: 'pr-2.5',\n paddingLeftLeading: 'pl-9',\n paddingLeftLeadingDouble: 'pl-12',\n paddingRightTrailing: 'pr-9',\n text: 'text-sm'\n },\n medium: {\n paddingY: 'py-3',\n paddingLeft: 'pl-3',\n paddingRight: 'pr-3',\n paddingLeftLeading: 'pl-10',\n paddingLeftLeadingDouble: 'pl-14',\n paddingRightTrailing: 'pr-10',\n text: 'text-base'\n },\n large: {\n paddingY: 'py-3.5',\n paddingLeft: 'pl-3.5',\n paddingRight: 'pr-3.5',\n paddingLeftLeading: 'pl-11',\n paddingLeftLeadingDouble: 'pl-14',\n paddingRightTrailing: 'pr-11',\n text: 'text-lg'\n },\n 'x-large': {\n paddingY: 'py-4',\n paddingLeft: 'pl-4',\n paddingRight: 'pr-4',\n paddingLeftLeading: 'pl-12',\n paddingLeftLeadingDouble: 'pl-16',\n paddingRightTrailing: 'pr-12',\n text: 'text-xl'\n }\n } satisfies Record<\n InputSize,\n {\n paddingY: string;\n paddingLeft: string;\n paddingRight: string;\n paddingLeftLeading: string;\n paddingLeftLeadingDouble: string;\n paddingRightTrailing: string;\n text: string;\n }\n >;\n\n const status = error\n ? { tone: 'error' as const, message: error }\n : warn\n ? { tone: 'warn' as const, message: warn }\n : success\n ? { tone: 'success' as const, message: success }\n : undefined;\n\n const statusClasses = {\n error: 'border-red-500 focus:border-red-500 focus:ring-red-400',\n warn: 'border-amber-500 focus:border-amber-500 focus:ring-amber-400',\n success: 'border-emerald-500 focus:border-emerald-500 focus:ring-emerald-400'\n } as const;\n\n const statusMessageClasses = {\n error: 'text-red-600 dark:text-red-300',\n warn: 'text-amber-600 dark:text-amber-300',\n success: 'text-emerald-600 dark:text-emerald-300'\n } as const;\n\n const variantClass = variantClasses[variant] ?? variantClasses.outline;\n const toneClass = status ? statusClasses[status.tone] : undefined;\n let prependIconClass = resolveIconClassName(icon);\n const hasPrefix = typeof prefix === 'string' ? prefix.trim().length > 0 : Boolean(prefix);\n const hasSuffix = typeof suffix === 'string' ? suffix.trim().length > 0 : Boolean(suffix);\n const hasLeadingIcon = Boolean(prependIconClass);\n const hasLeadingAdornment = hasLeadingIcon || hasPrefix;\n const hasTrailingAdornment = hasSuffix;\n const sizeConfig = sizeClasses[size] ?? sizeClasses.medium;\n const leftPaddingClass =\n hasPrefix\n ? sizeConfig.paddingLeftLeadingDouble\n : hasLeadingAdornment\n ? sizeConfig.paddingLeftLeading\n : sizeConfig.paddingLeft;\n const rightPaddingClass = hasTrailingAdornment\n ? sizeConfig.paddingRightTrailing\n : sizeConfig.paddingRight;\n const sizeClass = [sizeConfig.paddingY, leftPaddingClass, rightPaddingClass, sizeConfig.text].join(' ');\n\n // useId keeps SSR/CSR ids consistent while still providing a fallback name\n const inputName = inputProps.name || reactId;\n\n // Ensure placeholder is present when label exists so :placeholder-shown works.\n // Label stays primary; placeholder only appears on focus when the field is empty.\n const basePlaceholder = placeholder ?? (hasLabel ? ' ' : undefined);\n const placeholderValue = hidePlaceholderUntilFocus\n ? isFocused\n ? placeholder\n : ' '\n : basePlaceholder;\n const placeholderClass = hidePlaceholderUntilFocus\n ? 'placeholder-transparent focus:placeholder-gray-500 focus:dark:placeholder-gray-400'\n : undefined;\n\n // Label left offset depends on leading adornments\n const labelLeftClass = hasLeadingAdornment ? 'left-10' : 'left-3';\n const labelFocusLeftClass = hasLeadingAdornment ? 'peer-focus:left-10' : 'peer-focus:left-3';\n\n const renderPrefix = hasPrefix\n ? typeof prefix === 'string'\n ? (\n <span className={twMerge('text-gray-500 dark:text-gray-400', sizeConfig.text)}>\n {prefix}\n </span>\n )\n : (\n prefix\n )\n : null;\n const renderSuffix = hasSuffix\n ? typeof suffix === 'string'\n ? (\n <span className={twMerge('text-gray-500 dark:text-gray-400', sizeConfig.text)}>\n {suffix}\n </span>\n )\n : (\n suffix\n )\n : null;\n\n // Background for floated label — keep transparent for outline/text/underlined variants\n const labelBgDefault = ['outline', 'text', 'underlined'].includes(variant)\n ? 'bg-transparent'\n : 'bg-white/90 dark:bg-slate-900';\n\n const handleFocus: React.FocusEventHandler<HTMLInputElement> = event => {\n if (hidePlaceholderUntilFocus) setIsFocused(true);\n onFocus?.(event);\n };\n\n const handleBlur: React.FocusEventHandler<HTMLInputElement> = event => {\n if (hidePlaceholderUntilFocus) setIsFocused(false);\n onBlur?.(event);\n };\n\n return (\n <div className={twMerge('flex flex-col gap-1', wrapperClassName)}>\n <div className='relative flex items-center'>\n {hasLeadingAdornment && (\n <span className='absolute left-3 inset-y-0 flex items-center gap-2'>\n {prependIconClass && (\n <i\n className={twMerge(\n 'text-gray-500 dark:text-gray-400',\n (status?.tone && statusMessageClasses[status?.tone]) || '',\n prependIconClass\n )}\n aria-hidden\n />\n )}\n {renderPrefix}\n </span>\n )}\n\n {/* input is peer so label can react with peer-* utilities */}\n <input\n {...inputProps}\n ref={ref}\n id={inputName}\n name={inputName}\n placeholder={placeholderValue}\n onFocus={handleFocus}\n onBlur={handleBlur}\n className={twMerge(\n 'peer',\n classBase,\n variantClass,\n toneClass,\n sizeClass,\n placeholderClass,\n className\n )}\n />\n\n {label && (\n <label\n htmlFor={inputName}\n className={twMerge(\n 'absolute transition-all duration-150 pointer-events-none text-gray-700 rounded dark:text-gray-200',\n labelLeftClass,\n // Floated state: center label's vertical middle on the top border line\n '-top-1.5 -translate-y-2/3 text-xs px-1',\n labelBgDefault,\n // focus state mirrors floated state (keeps center on border)\n labelFocusLeftClass,\n 'peer-focus:top-0 peer-focus:-translate-y-1/2 peer-focus:text-xs peer-focus:px-1 peer-focus:bg-white peer-focus:text-gray-600 dark:peer-focus:bg-slate-900 dark:peer-focus:text-gray-300',\n // when input is empty (placeholder shown) -> center label inside input\n 'peer-placeholder-shown:top-1/2 peer-placeholder-shown:-translate-y-1/2 peer-placeholder-shown:text-sm peer-placeholder-shown:bg-transparent peer-placeholder-shown:text-gray-500 dark:peer-placeholder-shown:text-gray-400'\n )}\n >\n {label}\n </label>\n )}\n\n {hasTrailingAdornment && (\n <span className='absolute right-3 inset-y-0 flex items-center'>\n {renderSuffix}\n </span>\n )}\n\n {/* {appendIconClass && (\n <i className={twMerge('pointer-events-none absolute right-3 text-gray-500', appendIconClass)} aria-hidden />\n )} */}\n </div>\n {status?.message && (\n <span className={twMerge('text-sm', statusMessageClasses[status.tone])}>\n {status.message}\n </span>\n )}\n </div>\n );\n }\n);\n\nInput.displayName = 'Input';\n\nexport default Input;\n"]}
package/dist/input.d.cts CHANGED
@@ -12,6 +12,8 @@ declare const Input: react__default.ForwardRefExoticComponent<Omit<react__defaul
12
12
  icon?: InputIcon;
13
13
  wrapperClassName?: string;
14
14
  label?: react__default.ReactNode;
15
+ prefix?: react__default.ReactNode;
16
+ suffix?: react__default.ReactNode;
15
17
  } & react__default.RefAttributes<HTMLInputElement>>;
16
18
 
17
19
  export { Input as default };
package/dist/input.d.ts CHANGED
@@ -12,6 +12,8 @@ declare const Input: react__default.ForwardRefExoticComponent<Omit<react__defaul
12
12
  icon?: InputIcon;
13
13
  wrapperClassName?: string;
14
14
  label?: react__default.ReactNode;
15
+ prefix?: react__default.ReactNode;
16
+ suffix?: react__default.ReactNode;
15
17
  } & react__default.RefAttributes<HTMLInputElement>>;
16
18
 
17
19
  export { Input as default };
package/dist/input.js CHANGED
@@ -1,4 +1,4 @@
1
- export { Input_default as default } from './chunk-P3ESW6KM.js';
1
+ export { Input_default as default } from './chunk-OBGYXMZ3.js';
2
2
  import './chunk-IEILIKS2.js';
3
3
  //# sourceMappingURL=input.js.map
4
4
  //# sourceMappingURL=input.js.map
package/dist/select.cjs CHANGED
@@ -1,8 +1,13 @@
1
1
  'use strict';
2
2
 
3
+ var React = require('react');
3
4
  var tailwindMerge = require('tailwind-merge');
4
5
  var jsxRuntime = require('react/jsx-runtime');
5
6
 
7
+ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
8
+
9
+ var React__default = /*#__PURE__*/_interopDefault(React);
10
+
6
11
  // src/Form/Select/index.tsx
7
12
 
8
13
  // src/globals.ts
@@ -73,7 +78,7 @@ var resolveIconClassName = (icon) => {
73
78
  const classes = [...baseClasses, normalizedName];
74
79
  return Array.from(new Set(classes)).join(" ");
75
80
  };
76
- var Select = ({
81
+ var Select = React__default.default.forwardRef(({
77
82
  options,
78
83
  label,
79
84
  placeholder,
@@ -91,9 +96,11 @@ var Select = ({
91
96
  disabled,
92
97
  required,
93
98
  onChange,
99
+ onBlur,
94
100
  ...props
95
- }) => {
101
+ }, ref) => {
96
102
  const selectId = id || name || generateString();
103
+ const inputName = name || selectId;
97
104
  const variantClass = variantClasses[variant] ?? variantClasses.outline;
98
105
  const sizeConfig = sizeClasses[size] ?? sizeClasses.medium;
99
106
  const sizeClass = `${sizeConfig.padding} ${sizeConfig.text}`;
@@ -151,12 +158,14 @@ var Select = ({
151
158
  {
152
159
  type: multiple ? "checkbox" : "radio",
153
160
  id: inputId,
154
- name: name || selectId,
161
+ name: inputName,
155
162
  value: option.value,
156
163
  disabled: option.disabled || disabled,
157
164
  checked: value !== void 0 ? isSelected : void 0,
158
165
  defaultChecked: defaultValue !== void 0 ? isDefaultSelected : void 0,
159
166
  onChange: handleOptionChange,
167
+ onBlur,
168
+ ref,
160
169
  required: required && !multiple,
161
170
  className: "peer sr-only"
162
171
  }
@@ -180,7 +189,8 @@ var Select = ({
180
189
  ] }),
181
190
  helperText && /* @__PURE__ */ jsxRuntime.jsx("p", { className: tailwindMerge.twMerge("mt-1 text-xs text-gray-500", error && "text-red-500"), children: helperText })
182
191
  ] });
183
- };
192
+ });
193
+ Select.displayName = "Select";
184
194
  var Select_default = Select;
185
195
 
186
196
  module.exports = Select_default;
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/globals.ts","../src/utils/helpers/randomStr.ts","../src/Form/Select/index.tsx"],"names":["normalizedName","twMerge","jsxs","jsx"],"mappings":"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","file":"select.cjs","sourcesContent":["export const iconBaseClasses = {\n mdi: ['mdi']\n} as const;\n","const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';\n\nexport function generateString(length = 5) {\n let result: string = '';\n const charactersLength = characters.length;\n for (let i = 0; i < length; i++) {\n result += characters.charAt(Math.floor(Math.random() * charactersLength));\n }\n\n return result;\n}\n","import React from 'react';\nimport { twMerge } from 'tailwind-merge';\nimport { iconBaseClasses } from '@lindle/linoardo/globals';\nimport type { GlobalSize, PropIcon } from '@lindle/linoardo/global.types';\nimport type { InputVariant } from '../Input/types';\nimport { generateString } from '../../utils/helpers/randomStr';\n\nexport interface SelectOptionObject {\n value: string | number;\n label: string;\n disabled?: boolean;\n icon?: PropIcon;\n}\n\nexport type SelectOption = SelectOptionObject | string;\n\nexport interface SelectProps extends Omit<React.DetailsHTMLAttributes<HTMLDetailsElement>, 'onChange' | 'value' | 'defaultValue'> {\n options: SelectOption[];\n label?: string;\n placeholder?: string;\n variant?: InputVariant;\n size?: GlobalSize;\n wrapperClassName?: string;\n error?: boolean;\n helperText?: string;\n value?: string | number | readonly string[];\n defaultValue?: string | number | readonly string[];\n name?: string;\n multiple?: boolean;\n disabled?: boolean;\n required?: boolean;\n onChange?: React.ChangeEventHandler<HTMLInputElement>;\n}\n\nconst baseClass =\n 'select-base w-full appearance-none focus-visible:outline-none focus-visible:ring-primary transition-colors duration-200 disabled:opacity-50 disabled:cursor-not-allowed bg-white text-gray-900 placeholder:text-gray-500 dark:bg-slate-900 dark:text-gray-100 dark:placeholder:text-gray-400';\n\nconst variantClasses = {\n solid:\n 'rounded border border-gray-400 bg-white shadow-sm focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/30 dark:border-gray-600 dark:bg-slate-900 dark:shadow-black/20 dark:focus-visible:border-primary/70 dark:focus-visible:ring-primary/40',\n sharp:\n 'rounded-none border border-gray-400 bg-white shadow-sm focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/30 dark:border-gray-600 dark:bg-slate-900 dark:shadow-black/20 dark:focus-visible:border-primary/70 dark:focus-visible:ring-primary/40',\n outline:\n 'rounded border-2 border-black bg-white focus-visible:border-black focus-visible:ring-2 focus-visible:ring-black/30 dark:border-black dark:bg-transparent dark:focus-visible:border-black dark:focus-visible:ring-black/40',\n text: 'rounded-none border-0 border-b border-transparent pl-0 pr-10 bg-transparent focus-visible:border-primary focus-visible:ring-0 focus-visible:ring-transparent dark:border-b-gray-600 dark:focus-visible:border-primary/70',\n ghost:\n 'rounded border border-transparent bg-gray-50 text-gray-900 focus-visible:bg-white focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/15 dark:bg-slate-800 dark:text-gray-100 dark:focus-visible:bg-slate-700 dark:focus-visible:border-primary/60 dark:focus-visible:ring-primary/25',\n filled:\n 'rounded border border-gray-200 bg-gray-100 focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/25 dark:border-gray-700 dark:bg-slate-800 dark:focus-visible:border-primary/60 dark:focus-visible:ring-primary/30',\n underlined:\n 'rounded-none border-0 border-b border-gray-300 pl-0 pr-10 bg-transparent focus-visible:border-primary focus-visible:ring-0 focus-visible:ring-transparent dark:border-b-gray-300 dark:focus-visible:border-primary/70',\n rounded:\n 'rounded-full pl-4 pr-10 border border-gray-300 bg-white focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/20 shadow-sm dark:border-gray-600 dark:bg-slate-900 dark:focus-visible:border-primary/70 dark:focus-visible:ring-primary/30 dark:shadow-black/20'\n} satisfies Record<InputVariant, string>;\n\nconst sizeClasses = {\n 'x-small': { padding: 'pl-2 pr-8 py-2', text: 'text-xs' },\n small: { padding: 'pl-2.5 pr-9 py-2.5', text: 'text-sm' },\n medium: { padding: 'pl-3 pr-10 py-3', text: 'text-base' },\n large: { padding: 'pl-3.5 pr-11 py-3.5', text: 'text-lg' },\n 'x-large': { padding: 'pl-4 pr-12 py-4', text: 'text-xl' }\n} satisfies Record<GlobalSize, { padding: string; text: string }>;\n\nconst normalizeOption = (option: SelectOption): SelectOptionObject => {\n if (typeof option === 'string') {\n return { label: option, value: option };\n }\n return option;\n};\n\nconst toIdSafe = (value: string) => {\n const sanitized = value.replace(/\\s+/g, '-').replace(/[^A-Za-z0-9_-]/g, '');\n return sanitized || 'opt';\n};\n\nconst resolveIconClassName = (icon?: PropIcon) => {\n if (!icon) {\n return undefined;\n }\n\n if (typeof icon === 'string') {\n const trimmed = icon.trim();\n if (!trimmed) {\n return undefined;\n }\n\n if (trimmed.includes(' ')) {\n return trimmed;\n }\n\n const normalizedName = trimmed.startsWith('mdi-') ? trimmed : `mdi-${trimmed}`;\n return ['mdi', normalizedName].join(' ');\n }\n\n const [library, iconNameRaw] = icon;\n const baseClasses = iconBaseClasses[library] ?? [library];\n const iconName = iconNameRaw.trim();\n if (!iconName) {\n return baseClasses.join(' ');\n }\n\n const normalizedName = iconName.startsWith('mdi-') ? iconName : `mdi-${iconName}`;\n const classes = [...baseClasses, normalizedName];\n return Array.from(new Set(classes)).join(' ');\n};\n\n/**\n * Custom styled Select component using <details> and radio/checkbox inputs.\n * Supports icons and custom styling while remaining a Server Component (no hooks).\n */\nconst Select: React.FC<SelectProps> = ({\n options,\n label,\n placeholder,\n variant = 'outline',\n size = 'medium',\n className,\n wrapperClassName,\n id,\n name,\n multiple,\n value,\n defaultValue,\n error,\n helperText,\n disabled,\n required,\n onChange,\n ...props\n}) => {\n const selectId = id || name || generateString();\n const variantClass = variantClasses[variant] ?? variantClasses.outline;\n const sizeConfig = sizeClasses[size] ?? sizeClasses.medium;\n const sizeClass = `${sizeConfig.padding} ${sizeConfig.text}`;\n const normalizedOptions = options.map(normalizeOption);\n const selectedValueList =\n value !== undefined\n ? (Array.isArray(value) ? value : [value]).map(String)\n : defaultValue !== undefined\n ? (Array.isArray(defaultValue) ? defaultValue : [defaultValue]).map(String)\n : [];\n const selectedLabels = normalizedOptions\n .filter(option => selectedValueList.includes(String(option.value)))\n .map(option => option.label);\n const hasSelection = selectedLabels.length > 0;\n const summaryText = hasSelection\n ? multiple\n ? selectedLabels.join(', ')\n : selectedLabels[0]\n : placeholder || '\\u00A0';\n const handleOptionChange: React.ChangeEventHandler<HTMLInputElement> = event => {\n onChange?.(event);\n if (multiple) return;\n const detailsEl = event.currentTarget.closest('details');\n detailsEl?.removeAttribute('open');\n };\n\n return (\n <div className={twMerge('flex flex-col gap-1', wrapperClassName)}>\n <div className='relative'>\n <details className='group w-full' {...props} open={undefined}>\n <summary\n className={twMerge(\n baseClass,\n variantClass,\n sizeClass,\n 'list-none cursor-pointer flex items-center justify-between pr-10 relative [&::-webkit-details-marker]:hidden',\n error && 'border-red-500 focus-visible:border-red-500 focus-visible:ring-red-500',\n disabled && 'pointer-events-none opacity-50 cursor-not-allowed',\n className\n )}\n style={{ minHeight: '2.75rem' }}\n onClick={e => disabled && e.preventDefault()}\n >\n <span className={twMerge('truncate', !hasSelection && 'text-gray-500 dark:text-gray-400')}>{summaryText}</span>\n <span className='pointer-events-none absolute inset-y-0 right-3 flex items-center text-gray-500 dark:text-gray-300'>\n <i className='mdi mdi-chevron-down text-base leading-none transition-transform duration-200 group-open:rotate-180' aria-hidden />\n </span>\n </summary>\n\n <div className='absolute z-50 mt-1 max-h-60 w-full overflow-auto rounded-lg border border-gray-200 bg-white py-1 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none dark:bg-slate-800 dark:border-slate-700'>\n {normalizedOptions.map((option, index) => {\n const optionValueStr = String(option.value);\n const isSelected = Array.isArray(value) ? value.map(String).includes(optionValueStr) : String(value) === optionValueStr;\n const isDefaultSelected = Array.isArray(defaultValue)\n ? defaultValue.map(String).includes(optionValueStr)\n : String(defaultValue) === optionValueStr;\n const iconClassName = resolveIconClassName(option.icon);\n const inputId = `${selectId}-${toIdSafe(optionValueStr)}-${index}`;\n\n return (\n <label\n key={`${optionValueStr}-${index}`}\n htmlFor={inputId}\n className={twMerge(\n 'relative flex cursor-pointer select-none items-center gap-2 px-4 py-2 text-sm text-gray-900 hover:bg-gray-50 dark:text-gray-100 dark:hover:bg-slate-700',\n option.disabled && 'cursor-not-allowed opacity-50'\n )}\n >\n <input\n type={multiple ? 'checkbox' : 'radio'}\n id={inputId}\n name={name || selectId}\n value={option.value}\n disabled={option.disabled || disabled}\n checked={value !== undefined ? isSelected : undefined}\n defaultChecked={defaultValue !== undefined ? isDefaultSelected : undefined}\n onChange={handleOptionChange}\n required={required && !multiple}\n className='peer sr-only'\n />\n {iconClassName && <i className={twMerge(iconClassName, 'text-lg text-gray-500 peer-checked:text-primary dark:text-gray-400')} />}\n <span className='flex-1 truncate peer-checked:font-medium peer-checked:text-primary'>{option.label}</span>\n <i className='mdi mdi-check invisible ml-auto text-primary peer-checked:visible' />\n </label>\n );\n })}\n </div>\n </details>\n\n {label && (\n <label\n className={twMerge('absolute left-3 -top-1.5 text-xs bg-white px-1 text-gray-500 transition-all dark:bg-slate-900 dark:text-gray-400')}\n >\n {label}\n </label>\n )}\n </div>\n {helperText && <p className={twMerge('mt-1 text-xs text-gray-500', error && 'text-red-500')}>{helperText}</p>}\n </div>\n );\n};\n\nexport default Select;\n"]}
1
+ {"version":3,"sources":["../src/globals.ts","../src/utils/helpers/randomStr.ts","../src/Form/Select/index.tsx"],"names":["normalizedName","React","twMerge","jsxs","jsx"],"mappings":"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","file":"select.cjs","sourcesContent":["export const iconBaseClasses = {\n mdi: ['mdi']\n} as const;\n","const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';\n\nexport function generateString(length = 5) {\n let result: string = '';\n const charactersLength = characters.length;\n for (let i = 0; i < length; i++) {\n result += characters.charAt(Math.floor(Math.random() * charactersLength));\n }\n\n return result;\n}\n","import React from 'react';\nimport { twMerge } from 'tailwind-merge';\nimport { iconBaseClasses } from '@lindle/linoardo/globals';\nimport type { GlobalSize, PropIcon } from '@lindle/linoardo/global.types';\nimport type { InputVariant } from '../Input/types';\nimport { generateString } from '../../utils/helpers/randomStr';\n\nexport interface SelectOptionObject {\n value: string | number;\n label: string;\n disabled?: boolean;\n icon?: PropIcon;\n}\n\nexport type SelectOption = SelectOptionObject | string;\n\nexport interface SelectProps\n extends Omit<React.DetailsHTMLAttributes<HTMLDetailsElement>, 'onBlur' | 'onChange' | 'value' | 'defaultValue'> {\n options: SelectOption[];\n label?: string;\n placeholder?: string;\n variant?: InputVariant;\n size?: GlobalSize;\n wrapperClassName?: string;\n error?: boolean;\n helperText?: string;\n value?: string | number | readonly string[];\n defaultValue?: string | number | readonly string[];\n name?: string;\n multiple?: boolean;\n disabled?: boolean;\n required?: boolean;\n onChange?: React.ChangeEventHandler<HTMLInputElement>;\n onBlur?: React.FocusEventHandler<HTMLInputElement>;\n}\n\nconst baseClass =\n 'select-base w-full appearance-none focus-visible:outline-none focus-visible:ring-primary transition-colors duration-200 disabled:opacity-50 disabled:cursor-not-allowed bg-white text-gray-900 placeholder:text-gray-500 dark:bg-slate-900 dark:text-gray-100 dark:placeholder:text-gray-400';\n\nconst variantClasses = {\n solid:\n 'rounded border border-gray-400 bg-white shadow-sm focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/30 dark:border-gray-600 dark:bg-slate-900 dark:shadow-black/20 dark:focus-visible:border-primary/70 dark:focus-visible:ring-primary/40',\n sharp:\n 'rounded-none border border-gray-400 bg-white shadow-sm focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/30 dark:border-gray-600 dark:bg-slate-900 dark:shadow-black/20 dark:focus-visible:border-primary/70 dark:focus-visible:ring-primary/40',\n outline:\n 'rounded border-2 border-black bg-white focus-visible:border-black focus-visible:ring-2 focus-visible:ring-black/30 dark:border-black dark:bg-transparent dark:focus-visible:border-black dark:focus-visible:ring-black/40',\n text: 'rounded-none border-0 border-b border-transparent pl-0 pr-10 bg-transparent focus-visible:border-primary focus-visible:ring-0 focus-visible:ring-transparent dark:border-b-gray-600 dark:focus-visible:border-primary/70',\n ghost:\n 'rounded border border-transparent bg-gray-50 text-gray-900 focus-visible:bg-white focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/15 dark:bg-slate-800 dark:text-gray-100 dark:focus-visible:bg-slate-700 dark:focus-visible:border-primary/60 dark:focus-visible:ring-primary/25',\n filled:\n 'rounded border border-gray-200 bg-gray-100 focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/25 dark:border-gray-700 dark:bg-slate-800 dark:focus-visible:border-primary/60 dark:focus-visible:ring-primary/30',\n underlined:\n 'rounded-none border-0 border-b border-gray-300 pl-0 pr-10 bg-transparent focus-visible:border-primary focus-visible:ring-0 focus-visible:ring-transparent dark:border-b-gray-300 dark:focus-visible:border-primary/70',\n rounded:\n 'rounded-full pl-4 pr-10 border border-gray-300 bg-white focus-visible:border-primary focus-visible:ring-2 focus-visible:ring-primary/20 shadow-sm dark:border-gray-600 dark:bg-slate-900 dark:focus-visible:border-primary/70 dark:focus-visible:ring-primary/30 dark:shadow-black/20'\n} satisfies Record<InputVariant, string>;\n\nconst sizeClasses = {\n 'x-small': { padding: 'pl-2 pr-8 py-2', text: 'text-xs' },\n small: { padding: 'pl-2.5 pr-9 py-2.5', text: 'text-sm' },\n medium: { padding: 'pl-3 pr-10 py-3', text: 'text-base' },\n large: { padding: 'pl-3.5 pr-11 py-3.5', text: 'text-lg' },\n 'x-large': { padding: 'pl-4 pr-12 py-4', text: 'text-xl' }\n} satisfies Record<GlobalSize, { padding: string; text: string }>;\n\nconst normalizeOption = (option: SelectOption): SelectOptionObject => {\n if (typeof option === 'string') {\n return { label: option, value: option };\n }\n return option;\n};\n\nconst toIdSafe = (value: string) => {\n const sanitized = value.replace(/\\s+/g, '-').replace(/[^A-Za-z0-9_-]/g, '');\n return sanitized || 'opt';\n};\n\nconst resolveIconClassName = (icon?: PropIcon) => {\n if (!icon) {\n return undefined;\n }\n\n if (typeof icon === 'string') {\n const trimmed = icon.trim();\n if (!trimmed) {\n return undefined;\n }\n\n if (trimmed.includes(' ')) {\n return trimmed;\n }\n\n const normalizedName = trimmed.startsWith('mdi-') ? trimmed : `mdi-${trimmed}`;\n return ['mdi', normalizedName].join(' ');\n }\n\n const [library, iconNameRaw] = icon;\n const baseClasses = iconBaseClasses[library] ?? [library];\n const iconName = iconNameRaw.trim();\n if (!iconName) {\n return baseClasses.join(' ');\n }\n\n const normalizedName = iconName.startsWith('mdi-') ? iconName : `mdi-${iconName}`;\n const classes = [...baseClasses, normalizedName];\n return Array.from(new Set(classes)).join(' ');\n};\n\n/**\n * Custom styled Select component using <details> and radio/checkbox inputs.\n * Supports icons and custom styling while remaining a Server Component (no hooks).\n */\nconst Select = React.forwardRef<HTMLInputElement, SelectProps>(({\n options,\n label,\n placeholder,\n variant = 'outline',\n size = 'medium',\n className,\n wrapperClassName,\n id,\n name,\n multiple,\n value,\n defaultValue,\n error,\n helperText,\n disabled,\n required,\n onChange,\n onBlur,\n ...props\n}, ref) => {\n const selectId = id || name || generateString();\n const inputName = name || selectId;\n const variantClass = variantClasses[variant] ?? variantClasses.outline;\n const sizeConfig = sizeClasses[size] ?? sizeClasses.medium;\n const sizeClass = `${sizeConfig.padding} ${sizeConfig.text}`;\n const normalizedOptions = options.map(normalizeOption);\n const selectedValueList =\n value !== undefined\n ? (Array.isArray(value) ? value : [value]).map(String)\n : defaultValue !== undefined\n ? (Array.isArray(defaultValue) ? defaultValue : [defaultValue]).map(String)\n : [];\n const selectedLabels = normalizedOptions\n .filter(option => selectedValueList.includes(String(option.value)))\n .map(option => option.label);\n const hasSelection = selectedLabels.length > 0;\n const summaryText = hasSelection\n ? multiple\n ? selectedLabels.join(', ')\n : selectedLabels[0]\n : placeholder || '\\u00A0';\n const handleOptionChange: React.ChangeEventHandler<HTMLInputElement> = event => {\n onChange?.(event);\n if (multiple) return;\n const detailsEl = event.currentTarget.closest('details');\n detailsEl?.removeAttribute('open');\n };\n\n return (\n <div className={twMerge('flex flex-col gap-1', wrapperClassName)}>\n <div className='relative'>\n <details className='group w-full' {...props} open={undefined}>\n <summary\n className={twMerge(\n baseClass,\n variantClass,\n sizeClass,\n 'list-none cursor-pointer flex items-center justify-between pr-10 relative [&::-webkit-details-marker]:hidden',\n error && 'border-red-500 focus-visible:border-red-500 focus-visible:ring-red-500',\n disabled && 'pointer-events-none opacity-50 cursor-not-allowed',\n className\n )}\n style={{ minHeight: '2.75rem' }}\n onClick={e => disabled && e.preventDefault()}\n >\n <span className={twMerge('truncate', !hasSelection && 'text-gray-500 dark:text-gray-400')}>{summaryText}</span>\n <span className='pointer-events-none absolute inset-y-0 right-3 flex items-center text-gray-500 dark:text-gray-300'>\n <i className='mdi mdi-chevron-down text-base leading-none transition-transform duration-200 group-open:rotate-180' aria-hidden />\n </span>\n </summary>\n\n <div className='absolute z-50 mt-1 max-h-60 w-full overflow-auto rounded-lg border border-gray-200 bg-white py-1 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none dark:bg-slate-800 dark:border-slate-700'>\n {normalizedOptions.map((option, index) => {\n const optionValueStr = String(option.value);\n const isSelected = Array.isArray(value) ? value.map(String).includes(optionValueStr) : String(value) === optionValueStr;\n const isDefaultSelected = Array.isArray(defaultValue)\n ? defaultValue.map(String).includes(optionValueStr)\n : String(defaultValue) === optionValueStr;\n const iconClassName = resolveIconClassName(option.icon);\n const inputId = `${selectId}-${toIdSafe(optionValueStr)}-${index}`;\n\n return (\n <label\n key={`${optionValueStr}-${index}`}\n htmlFor={inputId}\n className={twMerge(\n 'relative flex cursor-pointer select-none items-center gap-2 px-4 py-2 text-sm text-gray-900 hover:bg-gray-50 dark:text-gray-100 dark:hover:bg-slate-700',\n option.disabled && 'cursor-not-allowed opacity-50'\n )}\n >\n <input\n type={multiple ? 'checkbox' : 'radio'}\n id={inputId}\n name={inputName}\n value={option.value}\n disabled={option.disabled || disabled}\n checked={value !== undefined ? isSelected : undefined}\n defaultChecked={defaultValue !== undefined ? isDefaultSelected : undefined}\n onChange={handleOptionChange}\n onBlur={onBlur}\n ref={ref}\n required={required && !multiple}\n className='peer sr-only'\n />\n {iconClassName && <i className={twMerge(iconClassName, 'text-lg text-gray-500 peer-checked:text-primary dark:text-gray-400')} />}\n <span className='flex-1 truncate peer-checked:font-medium peer-checked:text-primary'>{option.label}</span>\n <i className='mdi mdi-check invisible ml-auto text-primary peer-checked:visible' />\n </label>\n );\n })}\n </div>\n </details>\n\n {label && (\n <label\n className={twMerge('absolute left-3 -top-1.5 text-xs bg-white px-1 text-gray-500 transition-all dark:bg-slate-900 dark:text-gray-400')}\n >\n {label}\n </label>\n )}\n </div>\n {helperText && <p className={twMerge('mt-1 text-xs text-gray-500', error && 'text-red-500')}>{helperText}</p>}\n </div>\n );\n});\n\nSelect.displayName = 'Select';\n\nexport default Select;\n"]}
package/dist/select.d.cts CHANGED
@@ -9,7 +9,7 @@ interface SelectOptionObject {
9
9
  icon?: PropIcon;
10
10
  }
11
11
  type SelectOption = SelectOptionObject | string;
12
- interface SelectProps extends Omit<react__default.DetailsHTMLAttributes<HTMLDetailsElement>, 'onChange' | 'value' | 'defaultValue'> {
12
+ interface SelectProps extends Omit<react__default.DetailsHTMLAttributes<HTMLDetailsElement>, 'onBlur' | 'onChange' | 'value' | 'defaultValue'> {
13
13
  options: SelectOption[];
14
14
  label?: string;
15
15
  placeholder?: string;
@@ -25,11 +25,12 @@ interface SelectProps extends Omit<react__default.DetailsHTMLAttributes<HTMLDeta
25
25
  disabled?: boolean;
26
26
  required?: boolean;
27
27
  onChange?: react__default.ChangeEventHandler<HTMLInputElement>;
28
+ onBlur?: react__default.FocusEventHandler<HTMLInputElement>;
28
29
  }
29
30
  /**
30
31
  * Custom styled Select component using <details> and radio/checkbox inputs.
31
32
  * Supports icons and custom styling while remaining a Server Component (no hooks).
32
33
  */
33
- declare const Select: react__default.FC<SelectProps>;
34
+ declare const Select: react__default.ForwardRefExoticComponent<SelectProps & react__default.RefAttributes<HTMLInputElement>>;
34
35
 
35
36
  export { type SelectOption, type SelectOptionObject, type SelectProps, Select as default };
package/dist/select.d.ts CHANGED
@@ -9,7 +9,7 @@ interface SelectOptionObject {
9
9
  icon?: PropIcon;
10
10
  }
11
11
  type SelectOption = SelectOptionObject | string;
12
- interface SelectProps extends Omit<react__default.DetailsHTMLAttributes<HTMLDetailsElement>, 'onChange' | 'value' | 'defaultValue'> {
12
+ interface SelectProps extends Omit<react__default.DetailsHTMLAttributes<HTMLDetailsElement>, 'onBlur' | 'onChange' | 'value' | 'defaultValue'> {
13
13
  options: SelectOption[];
14
14
  label?: string;
15
15
  placeholder?: string;
@@ -25,11 +25,12 @@ interface SelectProps extends Omit<react__default.DetailsHTMLAttributes<HTMLDeta
25
25
  disabled?: boolean;
26
26
  required?: boolean;
27
27
  onChange?: react__default.ChangeEventHandler<HTMLInputElement>;
28
+ onBlur?: react__default.FocusEventHandler<HTMLInputElement>;
28
29
  }
29
30
  /**
30
31
  * Custom styled Select component using <details> and radio/checkbox inputs.
31
32
  * Supports icons and custom styling while remaining a Server Component (no hooks).
32
33
  */
33
- declare const Select: react__default.FC<SelectProps>;
34
+ declare const Select: react__default.ForwardRefExoticComponent<SelectProps & react__default.RefAttributes<HTMLInputElement>>;
34
35
 
35
36
  export { type SelectOption, type SelectOptionObject, type SelectProps, Select as default };
package/dist/select.js CHANGED
@@ -1,4 +1,4 @@
1
- export { Select_default as default } from './chunk-BDN4EDJQ.js';
1
+ export { Select_default as default } from './chunk-LULQOD2K.js';
2
2
  import './chunk-6SKW43XI.js';
3
3
  import './chunk-IEILIKS2.js';
4
4
  //# sourceMappingURL=select.js.map