@tachui/primitives 0.8.34 → 0.11.0

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.
Files changed (6) hide show
  1. package/dist/{Picker-CV6BRZGk.js → Picker-DoiXP31Q.js} +467 -386
  2. package/dist/controls/Button.d.ts +103 -9
  3. package/dist/controls/Button.d.ts.map +1 -1
  4. package/dist/controls/index.js +1 -1
  5. package/dist/index.js +2 -2
  6. package/package.json +3 -3
package/dist/{Picker-CV6BRZGk.js → Picker-DoiXP31Q.js} RENAMED
@@ -1,8 +1,8 @@
1
- import { withModifiers as A, ComponentWithCSSClasses as q, createSignal as F, useLifecycle as J, createEffect as Y, isSignal as l, ColorAsset as $, h as a, text as d, ConcatenatedComponent as z, clonePropsPreservingReactivity as N, resetLifecycleState as U, createComputed as Q } from "@tachui/core";
2
- import { createComponentInstance as ee } from "@tachui/core/components";
3
- import { T as W } from "./Text-DmpfnY1o.js";
4
- var te = Object.defineProperty, ie = (i, e, t) => e in i ? te(i, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : i[e] = t, y = (i, e, t) => ie(i, typeof e != "symbol" ? e + "" : e, t);
5
- const se = {
1
+ import { withModifiers as A, ComponentWithCSSClasses as ee, createSignal as $, useLifecycle as te, createEffect as K, untrack as ie, isSignal as l, ColorAsset as E, getOwner as N, createMemo as U, h as a, text as d, ConcatenatedComponent as P, clonePropsPreservingReactivity as W, resetLifecycleState as G, createComputed as se } from "@tachui/core";
2
+ import { createComponentInstance as re } from "@tachui/core/components";
3
+ import { T as j } from "./Text-DmpfnY1o.js";
4
+ var ne = Object.defineProperty, oe = (s, e, t) => e in s ? ne(s, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : s[e] = t, b = (s, e, t) => oe(s, typeof e != "symbol" ? e + "" : e, t);
5
+ const ae = {
6
6
  colors: {
7
7
  primary: "#007AFF",
8
8
  secondary: "#5856D6",
@@ -31,17 +31,17 @@ const se = {
31
31
  large: { size: 18, weight: "600" }
32
32
  }
33
33
  };
34
- class I extends q {
35
- constructor(e, t = se) {
36
- super(), y(this, "props", e), y(this, "type", "component"), y(this, "id"), y(this, "mounted", !1), y(this, "cleanup", []), y(this, "stateSignal"), y(this, "setState"), y(this, "theme"), this.id = `button-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`, this.theme = t;
37
- const [s, o] = F("normal");
38
- this.stateSignal = s, this.setState = o, this.setupDOMEventListeners();
34
+ class z extends ee {
35
+ constructor(e, t = ae) {
36
+ super(), b(this, "props", e), b(this, "type", "component"), b(this, "id"), b(this, "mounted", !1), b(this, "cleanup", []), b(this, "stateSignal"), b(this, "setState"), b(this, "theme"), b(this, "ownStyleProperties", /* @__PURE__ */ new Set()), b(this, "warnedOwnerless", !1), this.id = `button-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`, this.theme = t;
37
+ const [i, n] = $("normal");
38
+ this.stateSignal = i, this.setState = n, this.setupDOMEventListeners();
39
39
  }
40
40
  /**
41
41
  * Set up DOM event listeners for button interactions
42
42
  */
43
43
  setupDOMEventListeners() {
44
- J(this, {
44
+ te(this, {
45
45
  onDOMReady: (e, t) => {
46
46
  t instanceof HTMLButtonElement && this.setupReactiveStyles(t);
47
47
  }
@@ -51,12 +51,11 @@ class I extends q {
51
51
  * Set up reactive style updates based on state changes
52
52
  */
53
53
  setupReactiveStyles(e) {
54
- const t = Y(() => {
55
- this.stateSignal(), this.isEnabled(), this.isLoading();
56
- const { tint: s, backgroundColor: o, foregroundColor: n } = this.props;
57
- s && l(s) ? s() : s instanceof $ && s.resolve(), o && l(o) ? o() : o instanceof $ && o.resolve(), n && l(n) ? n() : n instanceof $ && n.resolve();
58
- const r = this.getButtonStyles();
59
- this.applyStylesToElement(e, r);
54
+ const t = K(() => {
55
+ this.stateSignal(), ie(() => {
56
+ const { tint: i, backgroundColor: n, foregroundColor: r } = this.props;
57
+ i && l(i) ? i() : i instanceof E && i.resolve(), n && l(n) ? n() : n instanceof E && n.resolve(), r && l(r) ? r() : r instanceof E && r.resolve(), this.applyStylesToElement(e, this.getButtonStyles());
58
+ });
60
59
  });
61
60
  this.cleanup.push(() => {
62
61
  t && typeof t.dispose == "function" && t.dispose();
@@ -66,11 +65,11 @@ class I extends q {
66
65
  * Apply computed styles to the button element, respecting modifier-applied styles
67
66
  */
68
67
  applyStylesToElement(e, t) {
69
- Object.entries(t).forEach(([s, o]) => {
70
- const n = this.camelToKebabCase(s);
71
- if (typeof o == "string" || typeof o == "number") {
72
- const r = e.style.getPropertyValue(n), c = r && r !== "" && r !== "inherit";
73
- process.env.NODE_ENV === "development" && n === "font-family" && (console.log("[Button.applyButtonStyles] Font-family check:"), console.log("[Button.applyButtonStyles] property:", s, "cssProperty:", n), console.log("[Button.applyButtonStyles] currentValue:", r), console.log("[Button.applyButtonStyles] hasModifierValue:", c), console.log("[Button.applyButtonStyles] will set to:", o)), n === "transform" ? e.style.setProperty(n, String(o)) : c ? process.env.NODE_ENV === "development" && n === "font-family" && console.log("[Button.applyButtonStyles] Button SKIPPED font-family (has modifier value):", r) : (e.style.setProperty(n, String(o)), process.env.NODE_ENV === "development" && n === "font-family" && (console.log("[Button.applyButtonStyles] Button SET font-family to:", String(o)), console.log("[Button.applyButtonStyles] Element after set:", e.style.fontFamily)));
68
+ Object.entries(t).forEach(([i, n]) => {
69
+ const r = this.camelToKebabCase(i);
70
+ if (typeof n == "string" || typeof n == "number") {
71
+ const o = e.style.getPropertyValue(r), c = o && o !== "" && o !== "inherit" && !this.ownStyleProperties.has(r);
72
+ process.env.NODE_ENV === "development" && r === "font-family" && (console.log("[Button.applyButtonStyles] Font-family check:"), console.log("[Button.applyButtonStyles] property:", i, "cssProperty:", r), console.log("[Button.applyButtonStyles] currentValue:", o), console.log("[Button.applyButtonStyles] hasModifierValue:", c), console.log("[Button.applyButtonStyles] will set to:", n)), r === "transform" ? (this.ownStyleProperties.add(r), e.style.setProperty(r, String(n))) : c ? process.env.NODE_ENV === "development" && r === "font-family" && console.log("[Button.applyButtonStyles] Button SKIPPED font-family (has modifier value):", o) : (this.ownStyleProperties.add(r), e.style.setProperty(r, String(n)), process.env.NODE_ENV === "development" && r === "font-family" && (console.log("[Button.applyButtonStyles] Button SET font-family to:", String(n)), console.log("[Button.applyButtonStyles] Element after set:", e.style.fontFamily)));
74
73
  }
75
74
  });
76
75
  }
@@ -89,23 +88,89 @@ class I extends q {
89
88
  return e;
90
89
  if (l(e))
91
90
  return e();
92
- if (e instanceof $)
91
+ if (e instanceof E)
93
92
  return e.resolve();
94
93
  }
95
94
  }
96
95
  /**
97
- * Check if button is enabled
96
+ * Check if button is enabled.
97
+ *
98
+ * Resolves, the way `isLoading` already did. Handing back the signal itself
99
+ * made every consumer wrong in the same direction: `if (!isEnabled)` on a
100
+ * function is never true, so disabled styling never applied and the press
101
+ * guard never fired, while a reactive effect reading this subscribed to
102
+ * nothing.
98
103
  */
99
104
  isEnabled() {
105
+ const e = this.enabledSource();
106
+ return typeof e == "function" ? e() : e;
107
+ }
108
+ /**
109
+ * The `isEnabled` prop in the form it was given, signal and all.
110
+ *
111
+ * `render` needs the unresolved form: a boolean it can hand straight to the
112
+ * renderer, or a signal the renderer can subscribe to. Everything else wants
113
+ * the resolved value and should use {@link isEnabled}.
114
+ */
115
+ enabledSource() {
100
116
  const { isEnabled: e } = this.props;
101
117
  return e === void 0 ? !0 : typeof e == "boolean" || l(e) ? e : !0;
102
118
  }
119
+ /**
120
+ * `disabled` as the renderer wants it.
121
+ *
122
+ * The renderer subscribes to a prop whose value is a signal and re-applies
123
+ * it on change, which is the only path that works here — the reactive style
124
+ * effect runs on DOM-ready, which `renderComponent` never fires.
125
+ *
126
+ * Built fresh on every render rather than cached, and the identity matters
127
+ * as much as the value. A render happens inside an effect, so an enclosing
128
+ * component re-rendering for any reason at all disposes this scope and takes
129
+ * the renderer's prop subscription with it. The renderer then diffs the new
130
+ * props against the old by identity and skips anything unchanged — so a
131
+ * cached accessor would be recognised, skipped, and never resubscribed,
132
+ * leaving the attribute frozen at whatever it last read. A new memo each
133
+ * time is a prop that has changed, which is precisely what has happened.
134
+ */
135
+ /**
136
+ * The computed styles, as the renderer wants them.
137
+ *
138
+ * Owned the same way `disabled` is, and for the same reason: a subscription
139
+ * made where nothing disposes it is held for the life of the process. With an
140
+ * owner the renderer tracks the styles and re-applies them; without one they
141
+ * are a snapshot, which is still more than the DOM-ready effect managed on
142
+ * that path.
143
+ *
144
+ * Applied *before* modifiers, which is the ordering that makes modifier
145
+ * precedence work by construction rather than by inspecting what is already
146
+ * on the element.
147
+ */
148
+ /**
149
+ * Says once, in development, that this Button is rendering where nothing can
150
+ * dispose a subscription — so its reactive props are snapshots.
151
+ *
152
+ * The alternative is a control that silently stops tracking depending on how
153
+ * its container happened to mount it. The comparison is written inline so a
154
+ * bundler can drop it.
155
+ */
156
+ warnOwnerlessRender() {
157
+ process.env.NODE_ENV === "production" || this.warnedOwnerless || (this.warnedOwnerless = !0, console.warn(
158
+ "[tachUI] Button is rendering outside a reactive owner, so its `disabled` attribute and its styles are snapshots and will not follow their signals. Subscribing here would never be released, because nothing would dispose it. Both of the framework's own mount paths provide an owner; reaching this means render() was called directly. Render through renderComponent() or mountComponentTree(), or wrap the call in createRoot()."
159
+ ));
160
+ }
161
+ styleProp() {
162
+ return N() === null ? (this.warnOwnerlessRender(), this.getButtonStyles()) : U(() => this.getButtonStyles());
163
+ }
164
+ disabledProp() {
165
+ const e = this.enabledSource();
166
+ return typeof e == "boolean" ? !e : N() === null ? (this.warnOwnerlessRender(), !e()) : U(() => !e());
167
+ }
103
168
  /**
104
169
  * Render the button component
105
170
  */
106
171
  render() {
107
- const e = this.isEnabled(), t = [];
108
- this.props.systemImage && t.push(
172
+ const e = [];
173
+ this.props.systemImage && e.push(
109
174
  a(
110
175
  "span",
111
176
  {
@@ -117,7 +182,7 @@ class I extends q {
117
182
  },
118
183
  d(this.props.systemImage)
119
184
  )
120
- ), t.push(
185
+ ), e.push(
121
186
  a(
122
187
  "span",
123
188
  {
@@ -126,26 +191,36 @@ class I extends q {
126
191
  d(this.props.title || "")
127
192
  )
128
193
  );
129
- const s = ["tachui-button"];
194
+ const t = ["tachui-button"];
130
195
  return [{
131
196
  type: "element",
132
197
  tag: "button",
133
198
  props: {
134
- className: this.createClassString(this.props, s),
199
+ className: this.createClassString(this.props, t),
135
200
  type: "button",
136
- disabled: typeof e == "boolean" ? !e : !e(),
137
- // Invert enabled to disabled
201
+ // A signal here rather than a snapshot of one: the renderer subscribes
202
+ // to a reactive prop and re-applies it, which is what makes `disabled`
203
+ // follow its signal instead of freezing at whatever it read on mount.
204
+ disabled: this.disabledProp(),
205
+ // Styles travel with the element rather than being written onto it
206
+ // afterwards. The effect that used to do it runs on DOM ready, which
207
+ // the ordinary render path never fires — so a Button rendered that way
208
+ // had no styles at all, disabled or otherwise. Here the renderer owns
209
+ // the subscription, applies it before modifiers run, and disposes it
210
+ // with the element.
211
+ style: this.styleProp(),
138
212
  onClick: this.props.action ? () => {
139
- try {
140
- this.props.action?.();
141
- } catch (r) {
142
- console.error("Button action error:", r);
143
- }
213
+ if (!(!this.isEnabled() || this.isLoading()))
214
+ try {
215
+ this.props.action?.();
216
+ } catch (r) {
217
+ console.error("Button action error:", r);
218
+ }
144
219
  } : void 0,
145
220
  // Pass through debug label for debug system
146
221
  ...this.props.debugLabel && { debugLabel: this.props.debugLabel }
147
222
  },
148
- children: t,
223
+ children: e,
149
224
  // Attach component metadata for modifier processing
150
225
  componentMetadata: {
151
226
  id: this.id,
@@ -166,21 +241,21 @@ class I extends q {
166
241
  */
167
242
  hasColorModifiers() {
168
243
  let e = this.modifiers;
169
- return !e && this.modifierBuilder && (e = this.modifierBuilder.modifiers), !e && this.modifiableComponent && (e = this.modifiableComponent.modifiers), !e || !Array.isArray(e) ? !1 : e.some((t) => t.type === "appearance" || t.constructor?.name === "AppearanceModifier" ? t.properties && (t.properties.foregroundColor !== void 0 || t.properties.color !== void 0) : t.properties ? ["foregroundColor", "color", "textColor"].some((o) => t.properties[o] !== void 0) : !1);
244
+ return !e && this.modifierBuilder && (e = this.modifierBuilder.modifiers), !e && this.modifiableComponent && (e = this.modifiableComponent.modifiers), !e || !Array.isArray(e) ? !1 : e.some((t) => t.type === "appearance" || t.constructor?.name === "AppearanceModifier" ? t.properties && (t.properties.foregroundColor !== void 0 || t.properties.color !== void 0) : t.properties ? ["foregroundColor", "color", "textColor"].some((n) => t.properties[n] !== void 0) : !1);
170
245
  }
171
246
  /**
172
247
  * Check if the button has typography-related modifiers applied
173
248
  */
174
249
  hasTypographyModifiers() {
175
250
  let e = this.modifiers;
176
- return !e && this.modifierBuilder && (e = this.modifierBuilder.modifiers), !e && this.modifiableComponent && (e = this.modifiableComponent.modifiers), !e || !Array.isArray(e) ? !1 : e.some((s) => s.type === "typography" || s.constructor?.name === "TypographyModifier" ? s.properties && (s.properties.transform !== void 0 || s.properties.textTransform !== void 0) : !1);
251
+ return !e && this.modifierBuilder && (e = this.modifierBuilder.modifiers), !e && this.modifiableComponent && (e = this.modifiableComponent.modifiers), !e || !Array.isArray(e) ? !1 : e.some((i) => i.type === "typography" || i.constructor?.name === "TypographyModifier" ? i.properties && (i.properties.transform !== void 0 || i.properties.textTransform !== void 0) : !1);
177
252
  }
178
253
  /**
179
254
  * Check if the button has a shadow modifier applied
180
255
  */
181
256
  hasShadowModifier() {
182
257
  let e = this.modifiers;
183
- return !e && this.modifierBuilder && (e = this.modifierBuilder.modifiers), !e && this.modifiableComponent && (e = this.modifiableComponent.modifiers), !e || !Array.isArray(e) ? !1 : e.some((s) => s.type === "appearance" || s.type === "shadow" || s.constructor?.name === "AppearanceModifier" || s.constructor?.name === "ShadowModifier" ? s.properties && s.properties.shadow !== void 0 : !1);
258
+ return !e && this.modifierBuilder && (e = this.modifierBuilder.modifiers), !e && this.modifiableComponent && (e = this.modifiableComponent.modifiers), !e || !Array.isArray(e) ? !1 : e.some((i) => i.type === "appearance" || i.type === "shadow" || i.constructor?.name === "AppearanceModifier" || i.constructor?.name === "ShadowModifier" ? i.properties && i.properties.shadow !== void 0 : !1);
184
259
  }
185
260
  /**
186
261
  * Get computed button styles based on variant, size, role, and state
@@ -190,17 +265,17 @@ class I extends q {
190
265
  const {
191
266
  variant: e,
192
267
  size: t,
193
- role: s = "none",
194
- tint: o,
195
- backgroundColor: n,
196
- foregroundColor: r
197
- } = this.props, c = this.stateSignal(), u = this.isLoading(), T = this.isEnabled(), m = this.hasColorModifiers(), w = this.hasTypographyModifiers(), C = {
268
+ role: i = "none",
269
+ tint: n,
270
+ backgroundColor: r,
271
+ foregroundColor: o
272
+ } = this.props, c = this.stateSignal(), h = this.isLoading(), T = this.isEnabled(), m = this.hasColorModifiers(), v = this.hasTypographyModifiers(), x = {
198
273
  // Only set color property if no modifiers will handle it
199
274
  // This prevents conflicts between Button styles and AppearanceModifier
200
- ...!m && !r && !e && { color: "inherit" },
275
+ ...!m && !o && !e && { color: "inherit" },
201
276
  // Only set text-related properties if no typography modifiers will handle them
202
277
  // This prevents conflicts between Button styles and TypographyModifier
203
- ...!w && {
278
+ ...!v && {
204
279
  fontStyle: "inherit",
205
280
  lineHeight: "inherit",
206
281
  textTransform: "inherit",
@@ -215,40 +290,40 @@ class I extends q {
215
290
  // Let modifiers control: fontFamily, fontSize, fontWeight, letterSpacing, textAlign
216
291
  };
217
292
  if (t) {
218
- const L = this.theme.spacing[t] || this.theme.spacing.medium, Z = this.theme.borderRadius[t] || this.theme.borderRadius.medium, H = this.theme.typography[t] || this.theme.typography.medium, K = {
293
+ const k = this.theme.spacing[t] || this.theme.spacing.medium, J = this.theme.borderRadius[t] || this.theme.borderRadius.medium, H = this.theme.typography[t] || this.theme.typography.medium, Q = {
219
294
  small: "32px",
220
295
  medium: "40px",
221
296
  large: "48px"
222
297
  };
223
- C.padding = `${L}px ${L * 2}px`, C.borderRadius = `${Z}px`, C.fontSize = `${H.size}px`, C.fontWeight = H.weight, C.minHeight = K[t];
298
+ x.padding = `${k}px ${k * 2}px`, x.borderRadius = `${J}px`, x.fontSize = `${H.size}px`, x.fontWeight = H.weight, x.minHeight = Q[t];
224
299
  }
225
- let b = "transparent", v = "transparent", _ = "1px", k;
226
- const X = this.resolveColorValue(o), D = this.resolveColorValue(n), E = this.resolveColorValue(r);
300
+ let f = "transparent", S = "transparent", _ = "1px", C;
301
+ const q = this.resolveColorValue(n), O = this.resolveColorValue(r), D = this.resolveColorValue(o);
227
302
  if (e) {
228
- const L = X || this.theme.colors.primary;
303
+ const k = q || this.theme.colors.primary;
229
304
  switch (e) {
230
305
  case "filled":
231
- s === "destructive" ? b = this.theme.colors.destructive : s === "cancel" ? b = this.theme.colors.secondary : b = L, k = this.theme.colors.onPrimary;
306
+ i === "destructive" ? f = this.theme.colors.destructive : i === "cancel" ? f = this.theme.colors.secondary : f = k, C = this.theme.colors.onPrimary;
232
307
  break;
233
308
  case "outlined":
234
- v = s === "destructive" ? this.theme.colors.destructive : L, k = s === "destructive" ? this.theme.colors.destructive : L;
309
+ S = i === "destructive" ? this.theme.colors.destructive : k, C = i === "destructive" ? this.theme.colors.destructive : k;
235
310
  break;
236
311
  case "bordered":
237
- b = this.theme.colors.background, v = this.theme.colors.border;
312
+ f = this.theme.colors.background, S = this.theme.colors.border;
238
313
  break;
239
314
  case "borderedProminent":
240
- b = this.theme.colors.surface, v = this.theme.colors.primary, _ = "2px";
315
+ f = this.theme.colors.surface, S = this.theme.colors.primary, _ = "2px";
241
316
  break;
242
317
  }
243
318
  }
244
- D && (b = D), E && (k = E);
245
- let B = "1", O = "auto", M, V = "none";
246
- T ? u ? (B = "0.6", O = "none") : c === "pressed" ? (b = this.darkenColor(b, 0.1), v = this.darkenColor(v, 0.1), M = "scale(0.95)") : c === "focused" && (V = "0 0 0 3px #007AFF40") : (b = this.theme.colors.disabled, v = this.theme.colors.disabled, k = this.theme.colors.disabled, B = "0.6", O = "none");
319
+ O && (f = O), D && (C = D);
320
+ let F = "1", I = "auto", B, V = "none";
321
+ T ? h ? (F = "0.6", I = "none") : c === "pressed" ? (f = this.darkenColor(f, 0.1), S = this.darkenColor(S, 0.1), B = "scale(0.95)") : c === "focused" && (V = "0 0 0 3px #007AFF40") : (f = this.theme.colors.disabled, S = this.theme.colors.disabled, C = this.theme.colors.disabled, F = "0.6", I = "none");
247
322
  const p = {
248
- ...C
323
+ ...x
249
324
  // Size-based styles (only if size provided)
250
325
  };
251
- return e && (p.backgroundColor = b, p.borderColor = v, p.borderWidth = _, k !== void 0 && (p.color = k)), D && (p.backgroundColor = D), E && (p.color = E), p.cursor = T ? "pointer" : "not-allowed", p.opacity = B, p.pointerEvents = O, p.transform = M !== void 0 ? M : "none", this.hasShadowModifier() || (p.boxShadow = V), p.transition = "all 0.2s ease", p;
326
+ return e && (p.backgroundColor = f, p.borderColor = S, p.borderWidth = _, C !== void 0 && (p.color = C)), O && (p.backgroundColor = O), D && (p.color = D), p.cursor = T ? "pointer" : "not-allowed", p.opacity = F, p.pointerEvents = I, p.transform = B !== void 0 ? B : "none", this.hasShadowModifier() || (p.boxShadow = V), p.transition = "all 0.2s ease", p;
252
327
  }
253
328
  /**
254
329
  * Handle button press with proper state management
@@ -279,8 +354,8 @@ class I extends q {
279
354
  darkenColor(e, t) {
280
355
  if (e === "transparent") return e;
281
356
  if (e.startsWith("#")) {
282
- const s = e.slice(1), o = parseInt(s, 16), n = Math.max(0, Math.floor((o >> 16) * (1 - t))), r = Math.max(0, Math.floor((o >> 8 & 255) * (1 - t))), c = Math.max(0, Math.floor((o & 255) * (1 - t)));
283
- return `#${(n << 16 | r << 8 | c).toString(16).padStart(6, "0")}`;
357
+ const i = e.slice(1), n = parseInt(i, 16), r = Math.max(0, Math.floor((n >> 16) * (1 - t))), o = Math.max(0, Math.floor((n >> 8 & 255) * (1 - t))), c = Math.max(0, Math.floor((n & 255) * (1 - t)));
358
+ return `#${(r << 16 | o << 8 | c).toString(16).padStart(6, "0")}`;
284
359
  }
285
360
  return e;
286
361
  }
@@ -291,16 +366,16 @@ class I extends q {
291
366
  * Concatenate this button with another concatenatable component
292
367
  */
293
368
  concat(e) {
294
- const t = this.toSegment(), s = e.toSegment(), o = {
295
- totalSegments: e instanceof z ? e.segments.length + 1 : 2,
296
- accessibilityRole: e instanceof z ? this.mergeAccessibilityRoles(
369
+ const t = this.toSegment(), i = e.toSegment(), n = {
370
+ totalSegments: e instanceof P ? e.segments.length + 1 : 2,
371
+ accessibilityRole: e instanceof P ? this.mergeAccessibilityRoles(
297
372
  "composite",
298
373
  e.metadata.accessibilityRole
299
374
  ) : this.determineAccessibilityRole(e),
300
375
  semanticStructure: "inline"
301
376
  // Buttons are typically inline in concatenation
302
377
  };
303
- return new z([t, s], o);
378
+ return new P([t, i], n);
304
379
  }
305
380
  /**
306
381
  * Convert this button to a segment for concatenation
@@ -352,14 +427,14 @@ class I extends q {
352
427
  return e.deep ? this.deepClone() : this.shallowClone();
353
428
  }
354
429
  shallowClone() {
355
- const e = N(this.props), t = new I(e, this.theme);
356
- return this.syncStateToClone(t), U(t), t;
430
+ const e = W(this.props), t = new z(e, this.theme);
431
+ return this.syncStateToClone(t), G(t), t;
357
432
  }
358
433
  deepClone() {
359
- const e = N(this.props, {
434
+ const e = W(this.props, {
360
435
  deep: !0
361
- }), t = new I(e, this.theme);
362
- return this.syncStateToClone(t), U(t), t;
436
+ }), t = new z(e, this.theme);
437
+ return this.syncStateToClone(t), G(t), t;
363
438
  }
364
439
  syncStateToClone(e) {
365
440
  try {
@@ -370,53 +445,59 @@ class I extends q {
370
445
  }
371
446
  }
372
447
  }
373
- function h(i, e, t = {}) {
374
- const s = typeof e == "function" ? e : void 0, n = {
448
+ function Y(s, e, t = {}) {
449
+ const i = typeof e == "function" ? e : void 0, r = {
375
450
  ...e != null && typeof e != "function" ? e : t,
376
- title: i,
377
- ...s && { action: s }
378
- }, r = ee(I, n);
379
- return A(r);
451
+ title: s,
452
+ ...i && { action: i }
453
+ }, o = re(z, r);
454
+ return A(o);
455
+ }
456
+ function L(s) {
457
+ return (t, i, n = {}) => i == null || typeof i == "function" ? Y(t, i, {
458
+ ...n,
459
+ ...s
460
+ }) : Y(t, { ...i, ...s });
380
461
  }
381
- const ge = {
462
+ const we = {
382
463
  /**
383
464
  * Filled button (primary)
384
465
  */
385
- Filled: (i, e, t = {}) => e == null || typeof e == "function" ? h(i, e, { ...t, variant: "filled" }) : h(i, { ...e ?? {}, variant: "filled" }),
466
+ Filled: L({ variant: "filled" }),
386
467
  /**
387
468
  * Outlined button
388
469
  */
389
- Outlined: (i, e, t = {}) => e == null || typeof e == "function" ? h(i, e, { ...t, variant: "outlined" }) : h(i, { ...e ?? {}, variant: "outlined" }),
470
+ Outlined: L({ variant: "outlined" }),
390
471
  /**
391
472
  * Plain button (text only)
392
473
  */
393
- Plain: (i, e, t = {}) => e == null || typeof e == "function" ? h(i, e, { ...t, variant: "plain" }) : h(i, { ...e ?? {}, variant: "plain" }),
474
+ Plain: L({ variant: "plain" }),
394
475
  /**
395
476
  * Bordered button
396
477
  */
397
- Bordered: (i, e, t = {}) => e == null || typeof e == "function" ? h(i, e, { ...t, variant: "bordered" }) : h(i, { ...e ?? {}, variant: "bordered" }),
478
+ Bordered: L({ variant: "bordered" }),
398
479
  /**
399
480
  * Destructive button
400
481
  */
401
- Destructive: (i, e, t = {}) => e == null || typeof e == "function" ? h(i, e, { ...t, role: "destructive" }) : h(i, { ...e ?? {}, role: "destructive" }),
482
+ Destructive: L({ role: "destructive" }),
402
483
  /**
403
484
  * Cancel button
404
485
  */
405
- Cancel: (i, e, t = {}) => e == null || typeof e == "function" ? h(i, e, { ...t, role: "cancel" }) : h(i, { ...e ?? {}, role: "cancel" })
406
- }, ne = `
486
+ Cancel: L({ role: "cancel" })
487
+ }, le = `
407
488
  @keyframes spin {
408
489
  from { transform: rotate(0deg); }
409
490
  to { transform: rotate(360deg); }
410
491
  }
411
492
  `;
412
493
  if (typeof document < "u") {
413
- const i = document.createElement("style");
414
- i.textContent = ne, document.head.appendChild(i);
494
+ const s = document.createElement("style");
495
+ s.textContent = le, document.head.appendChild(s);
415
496
  }
416
- var oe = Object.defineProperty, re = (i, e, t) => e in i ? oe(i, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : i[e] = t, P = (i, e, t) => re(i, typeof e != "symbol" ? e + "" : e, t);
417
- class G {
497
+ var ce = Object.defineProperty, de = (s, e, t) => e in s ? ce(s, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : s[e] = t, M = (s, e, t) => de(s, typeof e != "symbol" ? e + "" : e, t);
498
+ class X {
418
499
  constructor(e) {
419
- P(this, "type", "component"), P(this, "id"), P(this, "props"), this.props = e, this.id = `enhanced-link-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
500
+ M(this, "type", "component"), M(this, "id"), M(this, "props"), this.props = e, this.id = `enhanced-link-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
420
501
  }
421
502
  resolveValue(e) {
422
503
  return l(e) ? e() : e;
@@ -429,15 +510,15 @@ class G {
429
510
  const e = this.resolveValue(this.props.target);
430
511
  if (e)
431
512
  return e;
432
- const t = this.resolveValue(this.props.destination), s = t instanceof URL ? t.toString() : t;
433
- return this.isExternalURL(s) ? "_blank" : "_self";
513
+ const t = this.resolveValue(this.props.destination), i = t instanceof URL ? t.toString() : t;
514
+ return this.isExternalURL(i) ? "_blank" : "_self";
434
515
  }
435
516
  getRoutingMode() {
436
517
  return this.resolveValue(this.props.routingMode) || "auto";
437
518
  }
438
519
  getRel() {
439
- const e = this.resolveValue(this.props.rel), t = this.getTarget(), s = this.getDestination(), n = this.isExternalURL(s) && t === "_blank" ? "noopener noreferrer" : "";
440
- return e && n ? `${e} ${n}`.trim() : e || n;
520
+ const e = this.resolveValue(this.props.rel), t = this.getTarget(), i = this.getDestination(), r = this.isExternalURL(i) && t === "_blank" ? "noopener noreferrer" : "";
521
+ return e && r ? `${e} ${r}`.trim() : e || r;
441
522
  }
442
523
  getDownload() {
443
524
  return this.resolveValue(this.props.download);
@@ -469,8 +550,8 @@ class G {
469
550
  if (this.props.onPress)
470
551
  try {
471
552
  this.props.onPress(e);
472
- } catch (n) {
473
- console.error("Link onPress error:", n);
553
+ } catch (r) {
554
+ console.error("Link onPress error:", r);
474
555
  }
475
556
  const t = this.getDestination();
476
557
  if (this.isSpecialScheme(t) || (e.preventDefault(), this.props.openURLAction && this.props.openURLAction(t) === "handled"))
@@ -479,21 +560,21 @@ class G {
479
560
  try {
480
561
  if (!await this.props.onBeforeNavigation(t))
481
562
  return;
482
- } catch (n) {
483
- throw console.error("Link onBeforeNavigation error:", n), n;
563
+ } catch (r) {
564
+ throw console.error("Link onBeforeNavigation error:", r), r;
484
565
  }
485
- const s = this.getTarget(), o = this.getRoutingMode();
566
+ const i = this.getTarget(), n = this.getRoutingMode();
486
567
  if (this.shouldUseInternalRouting(t)) {
487
568
  if (this.props.onInternalNavigation)
488
569
  try {
489
570
  if (await this.props.onInternalNavigation(t))
490
571
  return;
491
- } catch (n) {
492
- console.error("Link onInternalNavigation error:", n);
572
+ } catch (r) {
573
+ console.error("Link onInternalNavigation error:", r);
493
574
  }
494
- o === "spa" ? this.handleSPANavigation(t) : s === "_blank" ? window.open(t, s) : window.location.href = t;
575
+ n === "spa" ? this.handleSPANavigation(t) : i === "_blank" ? window.open(t, i) : window.location.href = t;
495
576
  } else
496
- s === "_blank" || s === "_top" || s === "_parent" ? window.open(t, s) : window.location.href = t;
577
+ i === "_blank" || i === "_top" || i === "_parent" ? window.open(t, i) : window.location.href = t;
497
578
  }
498
579
  handleSPANavigation(e) {
499
580
  typeof window < "u" && window.history && window.history.pushState ? (window.history.pushState(null, "", e), window.dispatchEvent(new PopStateEvent("popstate"))) : window.location.href = e;
@@ -507,15 +588,15 @@ class G {
507
588
  }
508
589
  renderContent() {
509
590
  if (this.props.label) {
510
- const n = this.props.label().render();
511
- return Array.isArray(n) ? n : [n];
591
+ const r = this.props.label().render();
592
+ return Array.isArray(r) ? r : [r];
512
593
  }
513
594
  if (this.props.children)
514
595
  return this.renderChildren();
515
596
  let e;
516
- this.props.text ? e = this.props.text : l(this.props.destination) ? e = Q(() => this.getDestination()) : e = this.getDestination();
517
- const s = W(e).render();
518
- return Array.isArray(s) ? s : [s];
597
+ this.props.text ? e = this.props.text : l(this.props.destination) ? e = se(() => this.getDestination()) : e = this.getDestination();
598
+ const i = j(e).render();
599
+ return Array.isArray(i) ? i : [i];
519
600
  }
520
601
  renderChildren() {
521
602
  const { children: e } = this.props;
@@ -523,43 +604,43 @@ class G {
523
604
  }
524
605
  renderChild(e) {
525
606
  if (typeof e == "string") {
526
- const s = W(e).render();
527
- return Array.isArray(s) ? s : [s];
607
+ const i = j(e).render();
608
+ return Array.isArray(i) ? i : [i];
528
609
  } else {
529
610
  const t = e.render();
530
611
  return Array.isArray(t) ? t : [t];
531
612
  }
532
613
  }
533
614
  render() {
534
- const e = this.renderContent(), t = this.isDisabled(), s = {
615
+ const e = this.renderContent(), t = this.isDisabled(), i = {
535
616
  id: this.id,
536
617
  "data-component": "enhanced-link"
537
618
  };
538
- l(this.props.destination) ? s.href = () => this.getDestination() : s.href = this.getDestination(), this.props.target && (l(this.props.target) ? s.target = () => this.getTarget() : s.target = this.getTarget());
539
- const o = this.getRel();
540
- o && (l(this.props.rel) || l(this.props.target) ? s.rel = () => this.getRel() : s.rel = o);
541
- const n = this.getDownload();
542
- n !== void 0 && (l(this.props.download) ? s.download = () => this.getDownload() : n === !0 ? s.download = !0 : typeof n == "string" && (s.download = n));
543
- const r = this.getAccessibilityLabel();
544
- r && (l(this.props.accessibilityLabel) ? s["aria-label"] = () => this.getAccessibilityLabel() : s["aria-label"] = r);
619
+ l(this.props.destination) ? i.href = () => this.getDestination() : i.href = this.getDestination(), this.props.target && (l(this.props.target) ? i.target = () => this.getTarget() : i.target = this.getTarget());
620
+ const n = this.getRel();
621
+ n && (l(this.props.rel) || l(this.props.target) ? i.rel = () => this.getRel() : i.rel = n);
622
+ const r = this.getDownload();
623
+ r !== void 0 && (l(this.props.download) ? i.download = () => this.getDownload() : r === !0 ? i.download = !0 : typeof r == "string" && (i.download = r));
624
+ const o = this.getAccessibilityLabel();
625
+ o && (l(this.props.accessibilityLabel) ? i["aria-label"] = () => this.getAccessibilityLabel() : i["aria-label"] = o);
545
626
  const c = this.getAccessibilityHint();
546
- c && (l(this.props.accessibilityHint) ? s["aria-describedby"] = () => this.getAccessibilityHint() : s["aria-describedby"] = c);
547
- const u = this.getAccessibilityRole();
548
- return u && (l(this.props.accessibilityRole) ? s.role = () => this.getAccessibilityRole() : s.role = u), t && (s["aria-disabled"] = "true", s.tabindex = "-1"), s.onclick = (m) => this.handleClick(m), s.style = {
627
+ c && (l(this.props.accessibilityHint) ? i["aria-describedby"] = () => this.getAccessibilityHint() : i["aria-describedby"] = c);
628
+ const h = this.getAccessibilityRole();
629
+ return h && (l(this.props.accessibilityRole) ? i.role = () => this.getAccessibilityRole() : i.role = h), t && (i["aria-disabled"] = "true", i.tabindex = "-1"), i.onclick = (m) => this.handleClick(m), i.style = {
549
630
  textDecoration: "none",
550
631
  color: "inherit",
551
632
  cursor: t ? "not-allowed" : "pointer",
552
633
  opacity: t ? 0.6 : 1
553
- }, a("a", s, ...e);
634
+ }, a("a", i, ...e);
554
635
  }
555
636
  // Concatenation support
556
637
  concat(e) {
557
- const t = this.toSegment(), s = e.toSegment(), o = {
638
+ const t = this.toSegment(), i = e.toSegment(), n = {
558
639
  totalSegments: 2,
559
640
  accessibilityRole: "composite",
560
641
  semanticStructure: "inline"
561
642
  };
562
- return new z([t, s], o);
643
+ return new P([t, i], n);
563
644
  }
564
645
  toSegment() {
565
646
  return {
@@ -573,24 +654,24 @@ class G {
573
654
  return !0;
574
655
  }
575
656
  }
576
- function me(i, e) {
657
+ function ve(s, e) {
577
658
  if (e !== void 0) {
578
- const o = {
579
- text: i,
659
+ const n = {
660
+ text: s,
580
661
  destination: e
581
- }, n = new G(o);
582
- return A(n);
662
+ }, r = new X(n);
663
+ return A(r);
583
664
  }
584
- const t = i, s = new G(t);
585
- return A(s);
665
+ const t = s, i = new X(t);
666
+ return A(i);
586
667
  }
587
- const x = {
668
+ const w = {
588
669
  /**
589
670
  * Create an external link that opens in a new tab
590
671
  */
591
- external(i, e, t = {}) {
672
+ external(s, e, t = {}) {
592
673
  return {
593
- destination: i,
674
+ destination: s,
594
675
  children: e,
595
676
  target: "_blank",
596
677
  routingMode: "external",
@@ -602,9 +683,9 @@ const x = {
602
683
  /**
603
684
  * Create an internal link for same-domain navigation
604
685
  */
605
- internal(i, e, t = {}) {
686
+ internal(s, e, t = {}) {
606
687
  return {
607
- destination: i,
688
+ destination: s,
608
689
  children: e,
609
690
  routingMode: "internal",
610
691
  target: "_self",
@@ -614,9 +695,9 @@ const x = {
614
695
  /**
615
696
  * Create a SPA link using History API
616
697
  */
617
- spa(i, e, t = {}) {
698
+ spa(s, e, t = {}) {
618
699
  return {
619
- destination: i,
700
+ destination: s,
620
701
  children: e,
621
702
  routingMode: "spa",
622
703
  target: "_self",
@@ -627,33 +708,33 @@ const x = {
627
708
  /**
628
709
  * Create an email link with optional subject and body
629
710
  */
630
- email(i, e, t, s) {
631
- let o = `mailto:${i}`;
632
- const n = new URLSearchParams();
633
- return e && n.append("subject", e), t && n.append("body", t), n.toString() && (o += `?${n.toString()}`), {
634
- destination: o,
635
- children: s || i,
636
- accessibilityLabel: `Send email to ${i}`,
711
+ email(s, e, t, i) {
712
+ let n = `mailto:${s}`;
713
+ const r = new URLSearchParams();
714
+ return e && r.append("subject", e), t && r.append("body", t), r.toString() && (n += `?${r.toString()}`), {
715
+ destination: n,
716
+ children: i || s,
717
+ accessibilityLabel: `Send email to ${s}`,
637
718
  accessibilityHint: "Opens your email app"
638
719
  };
639
720
  },
640
721
  /**
641
722
  * Create a phone link with formatted display
642
723
  */
643
- phone(i, e) {
724
+ phone(s, e) {
644
725
  return {
645
- destination: `tel:${i.replace(/[^\d+]/g, "")}`,
646
- children: e || i,
647
- accessibilityLabel: `Call ${i}`,
726
+ destination: `tel:${s.replace(/[^\d+]/g, "")}`,
727
+ children: e || s,
728
+ accessibilityLabel: `Call ${s}`,
648
729
  accessibilityHint: "Opens your phone app"
649
730
  };
650
731
  },
651
732
  /**
652
733
  * Create a download link
653
734
  */
654
- download(i, e, t) {
735
+ download(s, e, t) {
655
736
  return {
656
- destination: i,
737
+ destination: s,
657
738
  children: t || `Download ${e || "file"}`,
658
739
  download: e || !0,
659
740
  accessibilityLabel: `Download ${e || "file"}`,
@@ -664,39 +745,39 @@ const x = {
664
745
  * Social media link utilities
665
746
  */
666
747
  social: {
667
- twitter(i, e) {
668
- return x.external(
669
- `https://twitter.com/${i}`,
670
- e || `@${i}`,
671
- { accessibilityLabel: `Visit ${i} on Twitter` }
748
+ twitter(s, e) {
749
+ return w.external(
750
+ `https://twitter.com/${s}`,
751
+ e || `@${s}`,
752
+ { accessibilityLabel: `Visit ${s} on Twitter` }
672
753
  );
673
754
  },
674
- github(i, e) {
675
- return x.external(
676
- `https://github.com/${i}`,
677
- e || i,
678
- { accessibilityLabel: `Visit ${i} on GitHub` }
755
+ github(s, e) {
756
+ return w.external(
757
+ `https://github.com/${s}`,
758
+ e || s,
759
+ { accessibilityLabel: `Visit ${s} on GitHub` }
679
760
  );
680
761
  },
681
- linkedin(i, e) {
682
- return x.external(
683
- `https://linkedin.com/in/${i}`,
684
- e || i,
685
- { accessibilityLabel: `Visit ${i} on LinkedIn` }
762
+ linkedin(s, e) {
763
+ return w.external(
764
+ `https://linkedin.com/in/${s}`,
765
+ e || s,
766
+ { accessibilityLabel: `Visit ${s} on LinkedIn` }
686
767
  );
687
768
  },
688
- instagram(i, e) {
689
- return x.external(
690
- `https://instagram.com/${i}`,
691
- e || `@${i}`,
692
- { accessibilityLabel: `Visit ${i} on Instagram` }
769
+ instagram(s, e) {
770
+ return w.external(
771
+ `https://instagram.com/${s}`,
772
+ e || `@${s}`,
773
+ { accessibilityLabel: `Visit ${s} on Instagram` }
693
774
  );
694
775
  },
695
- facebook(i, e) {
696
- return x.external(
697
- `https://facebook.com/${i}`,
698
- e || i,
699
- { accessibilityLabel: `Visit ${i} on Facebook` }
776
+ facebook(s, e) {
777
+ return w.external(
778
+ `https://facebook.com/${s}`,
779
+ e || s,
780
+ { accessibilityLabel: `Visit ${s} on Facebook` }
700
781
  );
701
782
  }
702
783
  },
@@ -704,9 +785,9 @@ const x = {
704
785
  * App store link utilities
705
786
  */
706
787
  appStore: {
707
- ios(i, e) {
708
- return x.external(
709
- `https://apps.apple.com/app/id${i}`,
788
+ ios(s, e) {
789
+ return w.external(
790
+ `https://apps.apple.com/app/id${s}`,
710
791
  e || "Download from App Store",
711
792
  {
712
793
  accessibilityLabel: "Download from the iOS App Store",
@@ -714,9 +795,9 @@ const x = {
714
795
  }
715
796
  );
716
797
  },
717
- android(i, e) {
718
- return x.external(
719
- `https://play.google.com/store/apps/details?id=${i}`,
798
+ android(s, e) {
799
+ return w.external(
800
+ `https://play.google.com/store/apps/details?id=${s}`,
720
801
  e || "Get it on Google Play",
721
802
  {
722
803
  accessibilityLabel: "Download from Google Play Store",
@@ -728,24 +809,24 @@ const x = {
728
809
  /**
729
810
  * Create a custom OpenURL action
730
811
  */
731
- openURLAction(i) {
732
- return (e) => i(e) ? "handled" : "systemAction";
812
+ openURLAction(s) {
813
+ return (e) => s(e) ? "handled" : "systemAction";
733
814
  }
734
815
  };
735
- var ae = Object.defineProperty, le = (i, e, t) => e in i ? ae(i, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : i[e] = t, S = (i, e, t) => le(i, typeof e != "symbol" ? e + "" : e, t);
736
- class ce {
816
+ var pe = Object.defineProperty, he = (s, e, t) => e in s ? pe(s, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : s[e] = t, y = (s, e, t) => he(s, typeof e != "symbol" ? e + "" : e, t);
817
+ class ue {
737
818
  constructor(e) {
738
- S(this, "props", e), S(this, "type", "component"), S(this, "id"), S(this, "mounted", !1), S(this, "cleanup", []), S(this, "toggleElement", null), S(this, "setIsAnimating"), S(this, "handleToggle", async (s) => {
739
- if (s.preventDefault(), this.isDisabled()) return;
740
- const o = !this.getIsOn();
819
+ y(this, "props", e), y(this, "type", "component"), y(this, "id"), y(this, "mounted", !1), y(this, "cleanup", []), y(this, "toggleElement", null), y(this, "setIsAnimating"), y(this, "handleToggle", async (i) => {
820
+ if (i.preventDefault(), this.isDisabled()) return;
821
+ const n = !this.getIsOn();
741
822
  this.props.animated !== !1 && (this.setIsAnimating(!0), setTimeout(() => {
742
823
  this.setIsAnimating(!1);
743
- }, 200)), this.props.onToggle && this.props.onToggle(o);
824
+ }, 200)), this.props.onToggle && this.props.onToggle(n);
744
825
  }), this.id = `toggle-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
745
- const [, t] = F(!1);
746
- this.setIsAnimating = t, Y(() => {
747
- const s = this.getIsOn();
748
- this.toggleElement && this.toggleElement.checked !== s && (this.toggleElement.checked = s);
826
+ const [, t] = $(!1);
827
+ this.setIsAnimating = t, K(() => {
828
+ const i = this.getIsOn();
829
+ this.toggleElement && this.toggleElement.checked !== i && (this.toggleElement.checked = i);
749
830
  });
750
831
  }
751
832
  /**
@@ -843,12 +924,12 @@ class ce {
843
924
  * Render switch variant
844
925
  */
845
926
  renderSwitch() {
846
- const e = this.getIsOn(), t = this.isDisabled(), s = this.getSizeStyles(), {
847
- color: o = "#007AFF",
848
- offColor: n = "#e2e8f0",
849
- thumbColor: r = "#ffffff",
927
+ const e = this.getIsOn(), t = this.isDisabled(), i = this.getSizeStyles(), {
928
+ color: n = "#007AFF",
929
+ offColor: r = "#e2e8f0",
930
+ thumbColor: o = "#ffffff",
850
931
  animated: c = !0
851
- } = this.props, u = e ? o : n, T = e ? `translateX(${parseInt(s.width) - parseInt(s.thumbSize) - 2}px)` : "translateX(2px)", m = this.getInputAccessibilityProps();
932
+ } = this.props, h = e ? n : r, T = e ? `translateX(${parseInt(i.width) - parseInt(i.thumbSize) - 2}px)` : "translateX(2px)", m = this.getInputAccessibilityProps();
852
933
  return a(
853
934
  "div",
854
935
  {
@@ -859,9 +940,9 @@ class ce {
859
940
  },
860
941
  // Hidden input for form integration
861
942
  a("input", {
862
- ref: (w) => {
863
- this.toggleElement = w, w && !this.mounted && (w.addEventListener("change", this.handleToggle), this.cleanup.push(() => {
864
- w.removeEventListener("change", this.handleToggle);
943
+ ref: (v) => {
944
+ this.toggleElement = v, v && !this.mounted && (v.addEventListener("change", this.handleToggle), this.cleanup.push(() => {
945
+ v.removeEventListener("change", this.handleToggle);
865
946
  }));
866
947
  },
867
948
  type: "checkbox",
@@ -885,10 +966,10 @@ class ce {
885
966
  "div",
886
967
  {
887
968
  style: {
888
- width: s.width,
889
- height: s.height,
890
- backgroundColor: u,
891
- borderRadius: s.height,
969
+ width: i.width,
970
+ height: i.height,
971
+ backgroundColor: h,
972
+ borderRadius: i.height,
892
973
  position: "relative",
893
974
  cursor: t ? "not-allowed" : "pointer",
894
975
  opacity: t ? 0.5 : 1,
@@ -900,9 +981,9 @@ class ce {
900
981
  // Switch thumb
901
982
  a("div", {
902
983
  style: {
903
- width: s.thumbSize,
904
- height: s.thumbSize,
905
- backgroundColor: r,
984
+ width: i.thumbSize,
985
+ height: i.thumbSize,
986
+ backgroundColor: o,
906
987
  borderRadius: "50%",
907
988
  position: "absolute",
908
989
  top: "50%",
@@ -919,7 +1000,7 @@ class ce {
919
1000
  * Render checkbox variant
920
1001
  */
921
1002
  renderCheckbox() {
922
- const e = this.getIsOn(), t = this.isDisabled(), s = this.getSizeStyles(), { color: o = "#007AFF" } = this.props, n = this.getInputAccessibilityProps();
1003
+ const e = this.getIsOn(), t = this.isDisabled(), i = this.getSizeStyles(), { color: n = "#007AFF" } = this.props, r = this.getInputAccessibilityProps();
923
1004
  return a(
924
1005
  "div",
925
1006
  {
@@ -930,13 +1011,13 @@ class ce {
930
1011
  },
931
1012
  // Hidden input
932
1013
  a("input", {
933
- ref: (r) => {
934
- this.toggleElement = r, r && !this.mounted && (r.addEventListener("change", this.handleToggle), this.cleanup.push(() => {
935
- r.removeEventListener("change", this.handleToggle);
1014
+ ref: (o) => {
1015
+ this.toggleElement = o, o && !this.mounted && (o.addEventListener("change", this.handleToggle), this.cleanup.push(() => {
1016
+ o.removeEventListener("change", this.handleToggle);
936
1017
  }));
937
1018
  },
938
1019
  type: "checkbox",
939
- id: n.id,
1020
+ id: r.id,
940
1021
  checked: e,
941
1022
  disabled: t,
942
1023
  style: {
@@ -947,20 +1028,20 @@ class ce {
947
1028
  margin: 0,
948
1029
  cursor: t ? "not-allowed" : "pointer"
949
1030
  },
950
- "aria-label": n["aria-label"],
951
- "aria-labelledby": n["aria-labelledby"],
952
- "aria-describedby": n["aria-describedby"]
1031
+ "aria-label": r["aria-label"],
1032
+ "aria-labelledby": r["aria-labelledby"],
1033
+ "aria-describedby": r["aria-describedby"]
953
1034
  }),
954
1035
  // Checkbox visual
955
1036
  a(
956
1037
  "div",
957
1038
  {
958
1039
  style: {
959
- width: s.thumbSize,
960
- height: s.thumbSize,
961
- border: `2px solid ${e ? o : "#d1d5db"}`,
1040
+ width: i.thumbSize,
1041
+ height: i.thumbSize,
1042
+ border: `2px solid ${e ? n : "#d1d5db"}`,
962
1043
  borderRadius: "4px",
963
- backgroundColor: e ? o : "#ffffff",
1044
+ backgroundColor: e ? n : "#ffffff",
964
1045
  display: "flex",
965
1046
  alignItems: "center",
966
1047
  justifyContent: "center",
@@ -991,24 +1072,24 @@ class ce {
991
1072
  * Render button variant
992
1073
  */
993
1074
  renderButton() {
994
- const e = this.getIsOn(), t = this.isDisabled(), s = this.getSizeStyles(), { color: o = "#007AFF", offColor: n = "#f3f4f6" } = this.props;
1075
+ const e = this.getIsOn(), t = this.isDisabled(), i = this.getSizeStyles(), { color: n = "#007AFF", offColor: r = "#f3f4f6" } = this.props;
995
1076
  return a(
996
1077
  "button",
997
1078
  {
998
- ref: (r) => {
999
- r && !this.mounted && (r.addEventListener("click", this.handleToggle), this.cleanup.push(() => {
1000
- r.removeEventListener("click", this.handleToggle);
1079
+ ref: (o) => {
1080
+ o && !this.mounted && (o.addEventListener("click", this.handleToggle), this.cleanup.push(() => {
1081
+ o.removeEventListener("click", this.handleToggle);
1001
1082
  }));
1002
1083
  },
1003
1084
  type: "button",
1004
1085
  disabled: t,
1005
1086
  style: {
1006
1087
  padding: "8px 16px",
1007
- backgroundColor: e ? o : n,
1088
+ backgroundColor: e ? n : r,
1008
1089
  color: e ? "#ffffff" : "#374151",
1009
- border: `1px solid ${e ? o : "#d1d5db"}`,
1090
+ border: `1px solid ${e ? n : "#d1d5db"}`,
1010
1091
  borderRadius: "6px",
1011
- fontSize: s.fontSize,
1092
+ fontSize: i.fontSize,
1012
1093
  fontWeight: "500",
1013
1094
  cursor: t ? "not-allowed" : "pointer",
1014
1095
  opacity: t ? 0.5 : 1,
@@ -1041,13 +1122,13 @@ class ce {
1041
1122
  renderLabel(e = !1) {
1042
1123
  const t = this.resolveLabel();
1043
1124
  if (!t) return null;
1044
- const s = this.getSizeStyles();
1125
+ const i = this.getSizeStyles();
1045
1126
  return a(
1046
1127
  "span",
1047
1128
  {
1048
1129
  id: this.getLabelId(),
1049
1130
  style: {
1050
- fontSize: s.fontSize,
1131
+ fontSize: i.fontSize,
1051
1132
  color: this.isDisabled() ? "#9ca3af" : "#374151",
1052
1133
  cursor: this.isDisabled() ? "not-allowed" : "pointer"
1053
1134
  },
@@ -1060,15 +1141,15 @@ class ce {
1060
1141
  const {
1061
1142
  variant: e = "switch",
1062
1143
  labelPosition: t = "trailing",
1063
- spacing: s = 8,
1064
- accessibilityHint: o
1065
- } = this.props, n = this.renderLabel(e === "button"), r = this.renderToggleControl(), c = t === "leading" && n ? [n, r] : n ? [r, n] : [r], u = e === "button" ? a(
1144
+ spacing: i = 8,
1145
+ accessibilityHint: n
1146
+ } = this.props, r = this.renderLabel(e === "button"), o = this.renderToggleControl(), c = t === "leading" && r ? [r, o] : r ? [o, r] : [o], h = e === "button" ? a(
1066
1147
  "div",
1067
1148
  {
1068
1149
  style: {
1069
1150
  display: "flex",
1070
1151
  alignItems: "center",
1071
- gap: n ? `${s}px` : "0",
1152
+ gap: r ? `${i}px` : "0",
1072
1153
  cursor: this.isDisabled() ? "not-allowed" : "pointer"
1073
1154
  }
1074
1155
  },
@@ -1080,7 +1161,7 @@ class ce {
1080
1161
  style: {
1081
1162
  display: "flex",
1082
1163
  alignItems: "center",
1083
- gap: n ? `${s}px` : "0",
1164
+ gap: r ? `${i}px` : "0",
1084
1165
  cursor: this.isDisabled() ? "not-allowed" : "pointer"
1085
1166
  }
1086
1167
  },
@@ -1089,10 +1170,10 @@ class ce {
1089
1170
  return a(
1090
1171
  "div",
1091
1172
  {
1092
- "aria-describedby": o ? `${this.id}-hint` : void 0
1173
+ "aria-describedby": n ? `${this.id}-hint` : void 0
1093
1174
  },
1094
- u,
1095
- ...o ? [
1175
+ h,
1176
+ ...n ? [
1096
1177
  a(
1097
1178
  "div",
1098
1179
  {
@@ -1105,75 +1186,75 @@ class ce {
1105
1186
  width: "100%"
1106
1187
  }
1107
1188
  },
1108
- d(o)
1189
+ d(n)
1109
1190
  )
1110
1191
  ] : []
1111
1192
  );
1112
1193
  }
1113
1194
  }
1114
- function g(i, e = {}) {
1115
- const t = { ...e, isOn: i }, s = new ce(t);
1116
- return A(s);
1195
+ function g(s, e = {}) {
1196
+ const t = { ...e, isOn: s }, i = new ue(t);
1197
+ return A(i);
1117
1198
  }
1118
- function j(i, e, t = {}) {
1119
- return g(e, { ...t, label: i });
1199
+ function Z(s, e, t = {}) {
1200
+ return g(e, { ...t, label: s });
1120
1201
  }
1121
- const ye = {
1202
+ const xe = {
1122
1203
  /**
1123
1204
  * Switch toggle (default)
1124
1205
  */
1125
- Switch(i, e = {}) {
1126
- return g(i, { ...e, variant: "switch" });
1206
+ Switch(s, e = {}) {
1207
+ return g(s, { ...e, variant: "switch" });
1127
1208
  },
1128
1209
  /**
1129
1210
  * Checkbox toggle
1130
1211
  */
1131
- Checkbox(i, e = {}) {
1132
- return g(i, { ...e, variant: "checkbox" });
1212
+ Checkbox(s, e = {}) {
1213
+ return g(s, { ...e, variant: "checkbox" });
1133
1214
  },
1134
1215
  /**
1135
1216
  * Button toggle
1136
1217
  */
1137
- Button(i, e = {}) {
1138
- return g(i, { ...e, variant: "button" });
1218
+ Button(s, e = {}) {
1219
+ return g(s, { ...e, variant: "button" });
1139
1220
  },
1140
1221
  /**
1141
1222
  * Small toggle
1142
1223
  */
1143
- Small(i, e = {}) {
1144
- return g(i, { ...e, size: "small" });
1224
+ Small(s, e = {}) {
1225
+ return g(s, { ...e, size: "small" });
1145
1226
  },
1146
1227
  /**
1147
1228
  * Large toggle
1148
1229
  */
1149
- Large(i, e = {}) {
1150
- return g(i, { ...e, size: "large" });
1230
+ Large(s, e = {}) {
1231
+ return g(s, { ...e, size: "large" });
1151
1232
  },
1152
1233
  /**
1153
1234
  * Custom color toggle
1154
1235
  */
1155
- CustomColor(i, e, t = {}) {
1156
- return g(i, { ...t, color: e });
1236
+ CustomColor(s, e, t = {}) {
1237
+ return g(s, { ...t, color: e });
1157
1238
  },
1158
1239
  /**
1159
1240
  * Toggle with leading label
1160
1241
  */
1161
- WithLeadingLabel(i, e, t = {}) {
1162
- return g(e, { ...t, label: i, labelPosition: "leading" });
1242
+ WithLeadingLabel(s, e, t = {}) {
1243
+ return g(e, { ...t, label: s, labelPosition: "leading" });
1163
1244
  },
1164
1245
  /**
1165
1246
  * Toggle with trailing label (default)
1166
1247
  */
1167
- WithTrailingLabel(i, e, t = {}) {
1168
- return g(e, { ...t, label: i, labelPosition: "trailing" });
1248
+ WithTrailingLabel(s, e, t = {}) {
1249
+ return g(e, { ...t, label: s, labelPosition: "trailing" });
1169
1250
  }
1170
- }, Se = {
1251
+ }, Ce = {
1171
1252
  /**
1172
1253
  * Create a toggle group with multiple options
1173
1254
  */
1174
- createGroup(i, e = {}) {
1175
- return i.map(
1176
- (t) => j(t.label, t.isOn, {
1255
+ createGroup(s, e = {}) {
1256
+ return s.map(
1257
+ (t) => Z(t.label, t.isOn, {
1177
1258
  ...e,
1178
1259
  onToggle: t.onToggle
1179
1260
  })
@@ -1182,13 +1263,13 @@ const ye = {
1182
1263
  /**
1183
1264
  * Create exclusive toggle group (radio-like behavior)
1184
1265
  */
1185
- createExclusiveGroup(i, e, t, s = {}) {
1186
- const o = () => l(e) ? e() : e;
1187
- return i.map(
1188
- (n) => j(n.label, o() === n.key, {
1189
- ...s,
1190
- onToggle: (r) => {
1191
- r && t && t(n.key);
1266
+ createExclusiveGroup(s, e, t, i = {}) {
1267
+ const n = () => l(e) ? e() : e;
1268
+ return s.map(
1269
+ (r) => Z(r.label, n() === r.key, {
1270
+ ...i,
1271
+ onToggle: (o) => {
1272
+ o && t && t(r.key);
1192
1273
  }
1193
1274
  })
1194
1275
  );
@@ -1200,47 +1281,47 @@ const ye = {
1200
1281
  /**
1201
1282
  * Toggle all items in a group
1202
1283
  */
1203
- toggleAll(i, e) {
1204
- i.forEach((t) => {
1284
+ toggleAll(s, e) {
1285
+ s.forEach((t) => {
1205
1286
  t.onToggle && t.onToggle(e);
1206
1287
  });
1207
1288
  },
1208
1289
  /**
1209
1290
  * Get state of all toggles in a group
1210
1291
  */
1211
- getStates(i) {
1212
- return i.map((e) => l(e.isOn) ? e.isOn() : e.isOn);
1292
+ getStates(s) {
1293
+ return s.map((e) => l(e.isOn) ? e.isOn() : e.isOn);
1213
1294
  },
1214
1295
  /**
1215
1296
  * Check if all toggles are on
1216
1297
  */
1217
- allOn(i) {
1218
- return this.getStates(i).every((e) => e);
1298
+ allOn(s) {
1299
+ return this.getStates(s).every((e) => e);
1219
1300
  },
1220
1301
  /**
1221
1302
  * Check if any toggle is on
1222
1303
  */
1223
- anyOn(i) {
1224
- return this.getStates(i).some((e) => e);
1304
+ anyOn(s) {
1305
+ return this.getStates(s).some((e) => e);
1225
1306
  }
1226
1307
  }
1227
1308
  };
1228
- var de = Object.defineProperty, pe = (i, e, t) => e in i ? de(i, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : i[e] = t, f = (i, e, t) => pe(i, typeof e != "symbol" ? e + "" : e, t);
1229
- class he {
1309
+ var fe = Object.defineProperty, be = (s, e, t) => e in s ? fe(s, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : s[e] = t, u = (s, e, t) => be(s, typeof e != "symbol" ? e + "" : e, t);
1310
+ class ge {
1230
1311
  constructor(e) {
1231
- f(this, "props", e), f(this, "type", "component"), f(this, "id"), f(this, "mounted", !1), f(this, "cleanup", []), f(this, "isOpen"), f(this, "setIsOpen"), f(this, "searchTerm"), f(this, "setSearchTerm"), f(this, "handleSelection", (r) => {
1232
- this.props.onSelectionChange && this.props.onSelectionChange(r), (this.props.variant === "dropdown" || this.props.variant === "menu") && this.setIsOpen(!1), this.setSearchTerm("");
1233
- }), f(this, "toggleOpen", () => {
1312
+ u(this, "props", e), u(this, "type", "component"), u(this, "id"), u(this, "mounted", !1), u(this, "cleanup", []), u(this, "isOpen"), u(this, "setIsOpen"), u(this, "searchTerm"), u(this, "setSearchTerm"), u(this, "handleSelection", (o) => {
1313
+ this.props.onSelectionChange && this.props.onSelectionChange(o), (this.props.variant === "dropdown" || this.props.variant === "menu") && this.setIsOpen(!1), this.setSearchTerm("");
1314
+ }), u(this, "toggleOpen", () => {
1234
1315
  this.isDisabled() || this.setIsOpen(!this.isOpen());
1235
1316
  }), this.id = `picker-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
1236
- const [t, s] = F(!1), [o, n] = F("");
1237
- if (this.isOpen = t, this.setIsOpen = s, this.searchTerm = o, this.setSearchTerm = n, typeof window < "u") {
1238
- const r = (c) => {
1239
- const u = document.getElementById(this.id);
1240
- u && !u.contains(c.target) && this.setIsOpen(!1);
1317
+ const [t, i] = $(!1), [n, r] = $("");
1318
+ if (this.isOpen = t, this.setIsOpen = i, this.searchTerm = n, this.setSearchTerm = r, typeof window < "u") {
1319
+ const o = (c) => {
1320
+ const h = document.getElementById(this.id);
1321
+ h && !h.contains(c.target) && this.setIsOpen(!1);
1241
1322
  };
1242
- document.addEventListener("click", r), this.cleanup.push(() => {
1243
- document.removeEventListener("click", r);
1323
+ document.addEventListener("click", o), this.cleanup.push(() => {
1324
+ document.removeEventListener("click", o);
1244
1325
  });
1245
1326
  }
1246
1327
  }
@@ -1264,7 +1345,7 @@ class he {
1264
1345
  getFilteredOptions() {
1265
1346
  const e = this.getOptions(), t = this.searchTerm().toLowerCase();
1266
1347
  return !t || !this.props.searchable ? e : e.filter(
1267
- (s) => s.label.toLowerCase().includes(t) || s.description?.toLowerCase().includes(t)
1348
+ (i) => i.label.toLowerCase().includes(t) || i.description?.toLowerCase().includes(t)
1268
1349
  );
1269
1350
  }
1270
1351
  /**
@@ -1279,7 +1360,7 @@ class he {
1279
1360
  */
1280
1361
  getSelectedOption() {
1281
1362
  const e = this.getSelection();
1282
- return this.getOptions().find((s) => s.value === e) || null;
1363
+ return this.getOptions().find((i) => i.value === e) || null;
1283
1364
  }
1284
1365
  /**
1285
1366
  * Get picker size styles
@@ -1311,7 +1392,7 @@ class he {
1311
1392
  * Render dropdown variant
1312
1393
  */
1313
1394
  renderDropdown() {
1314
- const e = this.getSelectedOption(), t = this.getFilteredOptions(), s = this.getSizeStyles(), o = this.isOpen();
1395
+ const e = this.getSelectedOption(), t = this.getFilteredOptions(), i = this.getSizeStyles(), n = this.isOpen();
1315
1396
  return a(
1316
1397
  "div",
1317
1398
  {
@@ -1330,7 +1411,7 @@ class he {
1330
1411
  onClick: this.toggleOpen,
1331
1412
  disabled: this.isDisabled(),
1332
1413
  style: {
1333
- ...s,
1414
+ ...i,
1334
1415
  width: "100%",
1335
1416
  display: "flex",
1336
1417
  alignItems: "center",
@@ -1340,7 +1421,7 @@ class he {
1340
1421
  borderRadius: "6px",
1341
1422
  cursor: this.isDisabled() ? "not-allowed" : "pointer",
1342
1423
  opacity: this.isDisabled() ? 0.6 : 1,
1343
- ...o && {
1424
+ ...n && {
1344
1425
  borderColor: this.props.tint || "#007AFF",
1345
1426
  boxShadow: `0 0 0 1px ${this.props.tint || "#007AFF"}`
1346
1427
  }
@@ -1363,14 +1444,14 @@ class he {
1363
1444
  style: {
1364
1445
  fontSize: "12px",
1365
1446
  color: "#6b7280",
1366
- transform: o ? "rotate(180deg)" : "rotate(0deg)",
1447
+ transform: n ? "rotate(180deg)" : "rotate(0deg)",
1367
1448
  transition: "transform 0.2s"
1368
1449
  }
1369
1450
  },
1370
1451
  d("▼")
1371
1452
  )
1372
1453
  ),
1373
- ...o ? [
1454
+ ...n ? [
1374
1455
  a(
1375
1456
  "div",
1376
1457
  {
@@ -1402,9 +1483,9 @@ class he {
1402
1483
  type: "text",
1403
1484
  placeholder: "Search options...",
1404
1485
  value: this.searchTerm(),
1405
- onInput: (n) => {
1406
- const r = n.target;
1407
- this.setSearchTerm(r.value);
1486
+ onInput: (r) => {
1487
+ const o = r.target;
1488
+ this.setSearchTerm(o.value);
1408
1489
  },
1409
1490
  style: {
1410
1491
  width: "100%",
@@ -1417,21 +1498,21 @@ class he {
1417
1498
  )
1418
1499
  ] : [],
1419
1500
  ...t.map(
1420
- (n) => a(
1501
+ (r) => a(
1421
1502
  "button",
1422
1503
  {
1423
1504
  type: "button",
1424
- key: String(n.value),
1425
- onClick: () => this.handleSelection(n.value),
1426
- disabled: n.disabled,
1505
+ key: String(r.value),
1506
+ onClick: () => this.handleSelection(r.value),
1507
+ disabled: r.disabled,
1427
1508
  style: {
1428
1509
  width: "100%",
1429
1510
  padding: "8px 12px",
1430
1511
  textAlign: "left",
1431
- backgroundColor: n.value === this.getSelection() ? "#f3f4f6" : "transparent",
1512
+ backgroundColor: r.value === this.getSelection() ? "#f3f4f6" : "transparent",
1432
1513
  border: "none",
1433
- cursor: n.disabled ? "not-allowed" : "pointer",
1434
- opacity: n.disabled ? 0.5 : 1,
1514
+ cursor: r.disabled ? "not-allowed" : "pointer",
1515
+ opacity: r.disabled ? 0.5 : 1,
1435
1516
  fontSize: "14px",
1436
1517
  display: "flex",
1437
1518
  alignItems: "center",
@@ -1441,18 +1522,18 @@ class he {
1441
1522
  }
1442
1523
  }
1443
1524
  },
1444
- ...n.icon ? [
1525
+ ...r.icon ? [
1445
1526
  a(
1446
1527
  "span",
1447
1528
  { style: { fontSize: "16px" } },
1448
- d(n.icon)
1529
+ d(r.icon)
1449
1530
  )
1450
1531
  ] : [],
1451
1532
  a(
1452
1533
  "div",
1453
1534
  {},
1454
- a("div", {}, d(n.label)),
1455
- ...n.description ? [
1535
+ a("div", {}, d(r.label)),
1536
+ ...r.description ? [
1456
1537
  a(
1457
1538
  "div",
1458
1539
  {
@@ -1462,7 +1543,7 @@ class he {
1462
1543
  marginTop: "2px"
1463
1544
  }
1464
1545
  },
1465
- d(n.description)
1546
+ d(r.description)
1466
1547
  )
1467
1548
  ] : []
1468
1549
  )
@@ -1490,7 +1571,7 @@ class he {
1490
1571
  * Render segmented variant
1491
1572
  */
1492
1573
  renderSegmented() {
1493
- const e = this.getOptions(), t = this.getSelection(), s = this.getSizeStyles();
1574
+ const e = this.getOptions(), t = this.getSelection(), i = this.getSizeStyles();
1494
1575
  return a(
1495
1576
  "div",
1496
1577
  {
@@ -1504,33 +1585,33 @@ class he {
1504
1585
  "aria-label": this.props.accessibilityLabel
1505
1586
  },
1506
1587
  ...e.map(
1507
- (o, n) => a(
1588
+ (n, r) => a(
1508
1589
  "button",
1509
1590
  {
1510
1591
  type: "button",
1511
- key: String(o.value),
1512
- onClick: () => this.handleSelection(o.value),
1513
- disabled: o.disabled || this.isDisabled(),
1592
+ key: String(n.value),
1593
+ onClick: () => this.handleSelection(n.value),
1594
+ disabled: n.disabled || this.isDisabled(),
1514
1595
  role: "radio",
1515
- "aria-checked": o.value === t,
1596
+ "aria-checked": n.value === t,
1516
1597
  style: {
1517
- ...s,
1598
+ ...i,
1518
1599
  flex: 1,
1519
1600
  border: "none",
1520
1601
  borderRadius: "6px",
1521
- backgroundColor: o.value === t ? "#ffffff" : "transparent",
1522
- color: o.value === t ? "#1a1a1a" : "#6b7280",
1523
- fontWeight: o.value === t ? "600" : "400",
1524
- cursor: o.disabled || this.isDisabled() ? "not-allowed" : "pointer",
1525
- opacity: o.disabled || this.isDisabled() ? 0.5 : 1,
1526
- boxShadow: o.value === t ? "0 1px 2px rgba(0, 0, 0, 0.1)" : "none",
1602
+ backgroundColor: n.value === t ? "#ffffff" : "transparent",
1603
+ color: n.value === t ? "#1a1a1a" : "#6b7280",
1604
+ fontWeight: n.value === t ? "600" : "400",
1605
+ cursor: n.disabled || this.isDisabled() ? "not-allowed" : "pointer",
1606
+ opacity: n.disabled || this.isDisabled() ? 0.5 : 1,
1607
+ boxShadow: n.value === t ? "0 1px 2px rgba(0, 0, 0, 0.1)" : "none",
1527
1608
  transition: "all 0.2s",
1528
1609
  margin: "0",
1529
- ...n === 0 && { marginRight: "1px" },
1530
- ...n === e.length - 1 && { marginLeft: "1px" }
1610
+ ...r === 0 && { marginRight: "1px" },
1611
+ ...r === e.length - 1 && { marginLeft: "1px" }
1531
1612
  }
1532
1613
  },
1533
- ...o.icon ? [
1614
+ ...n.icon ? [
1534
1615
  a(
1535
1616
  "span",
1536
1617
  {
@@ -1539,10 +1620,10 @@ class he {
1539
1620
  fontSize: "14px"
1540
1621
  }
1541
1622
  },
1542
- d(o.icon)
1623
+ d(n.icon)
1543
1624
  )
1544
1625
  ] : [],
1545
- d(o.label)
1626
+ d(n.label)
1546
1627
  )
1547
1628
  )
1548
1629
  );
@@ -1556,11 +1637,11 @@ class he {
1556
1637
  "select",
1557
1638
  {
1558
1639
  value: String(t),
1559
- onChange: (s) => {
1560
- const o = s.target, n = e.find(
1561
- (r) => String(r.value) === o.value
1640
+ onChange: (i) => {
1641
+ const n = i.target, r = e.find(
1642
+ (o) => String(o.value) === n.value
1562
1643
  );
1563
- n && this.handleSelection(n.value);
1644
+ r && this.handleSelection(r.value);
1564
1645
  },
1565
1646
  disabled: this.isDisabled(),
1566
1647
  style: {
@@ -1574,14 +1655,14 @@ class he {
1574
1655
  }
1575
1656
  },
1576
1657
  ...e.map(
1577
- (s) => a(
1658
+ (i) => a(
1578
1659
  "option",
1579
1660
  {
1580
- key: String(s.value),
1581
- value: String(s.value),
1582
- disabled: s.disabled
1661
+ key: String(i.value),
1662
+ value: String(i.value),
1663
+ disabled: i.disabled
1583
1664
  },
1584
- d(s.label)
1665
+ d(i.label)
1585
1666
  )
1586
1667
  )
1587
1668
  );
@@ -1590,28 +1671,28 @@ class he {
1590
1671
  const {
1591
1672
  variant: e = "dropdown",
1592
1673
  accessibilityLabel: t,
1593
- accessibilityHint: s
1594
- } = this.props, o = {
1674
+ accessibilityHint: i
1675
+ } = this.props, n = {
1595
1676
  "aria-label": t,
1596
- "aria-describedby": s ? `${this.id}-hint` : void 0
1677
+ "aria-describedby": i ? `${this.id}-hint` : void 0
1597
1678
  };
1598
- let n;
1679
+ let r;
1599
1680
  switch (e) {
1600
1681
  case "segmented":
1601
- n = this.renderSegmented();
1682
+ r = this.renderSegmented();
1602
1683
  break;
1603
1684
  case "wheel":
1604
- n = this.renderWheel();
1685
+ r = this.renderWheel();
1605
1686
  break;
1606
1687
  default:
1607
- n = this.renderDropdown();
1688
+ r = this.renderDropdown();
1608
1689
  break;
1609
1690
  }
1610
1691
  return a(
1611
1692
  "div",
1612
- o,
1613
1693
  n,
1614
- ...s ? [
1694
+ r,
1695
+ ...i ? [
1615
1696
  a(
1616
1697
  "div",
1617
1698
  {
@@ -1622,51 +1703,51 @@ class he {
1622
1703
  marginTop: "4px"
1623
1704
  }
1624
1705
  },
1625
- d(s)
1706
+ d(i)
1626
1707
  )
1627
1708
  ] : []
1628
1709
  );
1629
1710
  }
1630
1711
  }
1631
- function R(i, e, t = {}) {
1632
- const s = { ...t, selection: i, options: e }, o = new he(s);
1633
- return A(o);
1712
+ function R(s, e, t = {}) {
1713
+ const i = { ...t, selection: s, options: e }, n = new ge(i);
1714
+ return A(n);
1634
1715
  }
1635
- const ve = {
1716
+ const ke = {
1636
1717
  /**
1637
1718
  * Dropdown picker (default)
1638
1719
  */
1639
1720
  // biome-ignore lint/suspicious/noExplicitAny: Generic dropdown picker requires flexible type
1640
- Dropdown(i, e, t = {}) {
1641
- return R(i, e, { ...t, variant: "dropdown" });
1721
+ Dropdown(s, e, t = {}) {
1722
+ return R(s, e, { ...t, variant: "dropdown" });
1642
1723
  },
1643
1724
  /**
1644
1725
  * Segmented picker
1645
1726
  */
1646
1727
  // biome-ignore lint/suspicious/noExplicitAny: Generic segmented picker requires flexible type
1647
- Segmented(i, e, t = {}) {
1648
- return R(i, e, { ...t, variant: "segmented" });
1728
+ Segmented(s, e, t = {}) {
1729
+ return R(s, e, { ...t, variant: "segmented" });
1649
1730
  },
1650
1731
  /**
1651
1732
  * Wheel picker (native select)
1652
1733
  */
1653
1734
  // biome-ignore lint/suspicious/noExplicitAny: Generic wheel picker requires flexible type
1654
- Wheel(i, e, t = {}) {
1655
- return R(i, e, { ...t, variant: "wheel" });
1735
+ Wheel(s, e, t = {}) {
1736
+ return R(s, e, { ...t, variant: "wheel" });
1656
1737
  },
1657
1738
  /**
1658
1739
  * Menu picker
1659
1740
  */
1660
1741
  // biome-ignore lint/suspicious/noExplicitAny: Generic menu picker requires flexible type
1661
- Menu(i, e, t = {}) {
1662
- return R(i, e, { ...t, variant: "menu" });
1742
+ Menu(s, e, t = {}) {
1743
+ return R(s, e, { ...t, variant: "menu" });
1663
1744
  }
1664
- }, xe = {
1745
+ }, Le = {
1665
1746
  /**
1666
1747
  * Create options from simple array
1667
1748
  */
1668
- fromArray(i, e) {
1669
- return i.map((t) => ({
1749
+ fromArray(s, e) {
1750
+ return s.map((t) => ({
1670
1751
  value: t,
1671
1752
  label: String(e && typeof t == "object" && t !== null ? t[e] : t)
1672
1753
  }));
@@ -1674,8 +1755,8 @@ const ve = {
1674
1755
  /**
1675
1756
  * Create options from enum
1676
1757
  */
1677
- fromEnum(i) {
1678
- return Object.entries(i).map(([e, t]) => ({
1758
+ fromEnum(s) {
1759
+ return Object.entries(s).map(([e, t]) => ({
1679
1760
  value: t,
1680
1761
  label: e.replace(/([A-Z])/g, " $1").trim()
1681
1762
  }));
@@ -1683,30 +1764,30 @@ const ve = {
1683
1764
  /**
1684
1765
  * Group options by category
1685
1766
  */
1686
- grouped(i) {
1687
- return i.reduce(
1767
+ grouped(s) {
1768
+ return s.reduce(
1688
1769
  (e, t) => {
1689
- const s = t.category || "Other";
1690
- return e[s] || (e[s] = []), e[s].push(t), e;
1770
+ const i = t.category || "Other";
1771
+ return e[i] || (e[i] = []), e[i].push(t), e;
1691
1772
  },
1692
1773
  {}
1693
1774
  );
1694
1775
  }
1695
1776
  };
1696
1777
  export {
1697
- h as B,
1698
- I as E,
1699
- me as L,
1778
+ Y as B,
1779
+ z as E,
1780
+ ve as L,
1700
1781
  R as P,
1701
1782
  g as T,
1702
- ge as a,
1703
- he as b,
1704
- ce as c,
1705
- x as d,
1706
- ve as e,
1707
- xe as f,
1708
- ye as g,
1709
- Se as h,
1710
- j as i,
1711
- se as j
1783
+ we as a,
1784
+ ge as b,
1785
+ ue as c,
1786
+ w as d,
1787
+ ke as e,
1788
+ Le as f,
1789
+ xe as g,
1790
+ Ce as h,
1791
+ Z as i,
1792
+ ae as j
1712
1793
  };