jvdm-ui 1.0.5

package/dist/chunk-WWOXGKLF.js

@@ -0,0 +1,724 @@
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { DatePicker } from 'jvdm-ui/client/date-picker';
+export * from 'jvdm-ui/client/date-picker';
+import { TimePicker } from 'jvdm-ui/client/time-picker';
+export * from 'jvdm-ui/client/time-picker';
+export * from 'jvdm-ui/client/file-upload';
+export { PasswordInput } from 'jvdm-ui/client/password-input';
+export * from 'jvdm-ui/client/multi-select';
+export * from 'jvdm-ui/client/number-input';
+export * from 'jvdm-ui/client/pin-input';
+export { ThemeToggle } from 'jvdm-ui/client/theme-toggle';
+
+// src/atoms/avatar/index.tsx
+function initials(name) {
+  const parts = name.trim().split(/\s+/);
+  const first = parts[0]?.[0] ?? "";
+  const last = parts.length > 1 ? parts[parts.length - 1][0] ?? "" : "";
+  return (first + last).toUpperCase();
+}
+var SIZES = {
+  sm: "size-8 text-xs",
+  md: "size-10 text-sm",
+  lg: "size-12 text-base"
+};
+function Avatar({
+  name,
+  size = "md",
+  label = name
+}) {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      "aria-label": label,
+      className: `flex shrink-0 items-center justify-center rounded-md bg-raised font-medium text-ink-muted ${SIZES[size]}`,
+      role: "img",
+      children: initials(name)
+    }
+  );
+}
+var TONES = {
+  neutral: "bg-raised text-ink-soft",
+  accent: "bg-accent-soft text-accent-ink",
+  ok: "bg-ok-soft text-ok",
+  warn: "bg-warn-soft text-warn",
+  danger: "bg-danger-soft text-danger",
+  info: "bg-info-soft text-info"
+};
+function Badge({
+  tone = "neutral",
+  children,
+  className = ""
+}) {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: `inline-flex items-center gap-1 rounded-xs px-2 py-0.5 text-2xs font-medium ${TONES[tone]} ${className}`,
+      children
+    }
+  );
+}
+
+// src/atoms/button/button-style.ts
+var VARIANTS = {
+  primary: "bg-accent font-medium text-on-accent hover:bg-accent-ink",
+  secondary: "border border-line-strong hover:bg-raised",
+  ghost: "text-ink-muted hover:bg-raised hover:text-ink-soft",
+  danger: "border border-danger/50 text-danger hover:bg-danger-soft"
+};
+var SIZES2 = {
+  sm: "gap-2 px-3 py-2 text-xs",
+  md: "gap-2 px-4 py-3 text-sm",
+  lg: "gap-2 px-4 py-4 text-base",
+  icon: "h-10 w-10 shrink-0",
+  "icon-sm": "h-8 w-8 shrink-0"
+};
+var BASE = "inline-flex touch-manipulation select-none items-center justify-center rounded-md transition-[background-color,border-color,color,box-shadow,transform] duration-(--duration-fast) ease-out active:scale-95 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent focus-visible:ring-2 focus-visible:ring-accent/30 disabled:pointer-events-none disabled:opacity-50";
+function buttonClass({
+  variant = "secondary",
+  size = "md",
+  className = ""
+} = {}) {
+  return `${BASE} ${VARIANTS[variant]} ${SIZES2[size]} ${className}`;
+}
+function Button({
+  variant,
+  size,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx("button", { type: "button", ...props, className: buttonClass({ variant, size, className }) });
+}
+var PADDINGS = {
+  none: "",
+  sm: "p-4",
+  md: "p-5",
+  lg: "p-6"
+};
+function Card({
+  children,
+  padding = "md",
+  className = ""
+}) {
+  return /* @__PURE__ */ jsx("div", { className: `rounded-md border border-line bg-surface ${PADDINGS[padding]} ${className}`, children });
+}
+function Checkbox({
+  label,
+  className = "",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs("label", { className: `inline-flex min-h-10 items-center gap-3 text-sm text-ink-soft ${className}`, children: [
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        ...props,
+        className: "size-5 shrink-0 accent-accent focus-visible:ring-2 focus-visible:ring-accent/30 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent",
+        type: "checkbox"
+      }
+    ),
+    label ? /* @__PURE__ */ jsx("span", { children: label }) : null
+  ] });
+}
+function Combobox({
+  options,
+  onValueChange,
+  className = "",
+  ...props
+}) {
+  const listId = `${props.id ?? props.name ?? "combobox"}-options`;
+  function handleChange(event) {
+    onValueChange?.(event.target.value);
+  }
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        ...props,
+        className: `w-full min-w-0 rounded-md border border-line-strong bg-field px-4 py-3 text-base text-ink transition-[background-color,border-color,box-shadow] duration-(--duration-fast) ease-out outline-none focus:border-accent focus:ring-2 focus:ring-accent/30 sm:text-sm ${className}`,
+        list: listId,
+        onChange: handleChange
+      }
+    ),
+    /* @__PURE__ */ jsx("datalist", { id: listId, children: options.map((option) => /* @__PURE__ */ jsx("option", { label: option.label, value: option.value }, option.value)) })
+  ] });
+}
+
+// src/atoms/date-time-picker/locales.ts
+var locales = { date: "Date", time: "Time" };
+function DateTimePicker({
+  date,
+  time,
+  onDateChange,
+  onTimeChange,
+  className = ""
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: `grid gap-3 sm:grid-cols-[1.4fr_1fr] ${className}`, children: [
+    /* @__PURE__ */ jsx(DatePicker, { "aria-label": locales.date, onValueChange: onDateChange, value: date }),
+    /* @__PURE__ */ jsx(TimePicker, { "aria-label": locales.time, onValueChange: onTimeChange, value: time })
+  ] });
+}
+function Divider({
+  children,
+  vertical = false,
+  className = ""
+}) {
+  if (vertical) {
+    return /* @__PURE__ */ jsx("div", { "aria-hidden": "true", className: `w-px self-stretch bg-line ${className}` });
+  }
+  if (!children) {
+    return /* @__PURE__ */ jsx("hr", { className: `h-px border-0 bg-line ${className}` });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: `flex items-center gap-3 ${className}`, children: [
+    /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "h-px flex-1 bg-line" }),
+    /* @__PURE__ */ jsx("span", { className: "text-2xs font-medium tracking-caps text-ink-dim uppercase", children }),
+    /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "h-px flex-1 bg-line" })
+  ] });
+}
+function FormAlert({
+  className = "",
+  children
+}) {
+  return /* @__PURE__ */ jsx(
+    "p",
+    {
+      role: "alert",
+      className: `rounded-md bg-danger-soft px-3 py-2 text-sm text-danger ${className}`,
+      children
+    }
+  );
+}
+var SIZES3 = {
+  sm: "h-3 w-3",
+  md: "h-4 w-4",
+  lg: "h-5 w-5",
+  xl: "h-6 w-6",
+  "2xl": "h-8 w-8"
+};
+function Svg({ size = "md", className = "", children }) {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      className: `${SIZES3[size]} shrink-0 ${className}`,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "1.6",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      children
+    }
+  );
+}
+function AccessIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("path", { d: "M4 8V5.5A1.5 1.5 0 0 1 5.5 4H8" }),
+    /* @__PURE__ */ jsx("path", { d: "M16 4h2.5A1.5 1.5 0 0 1 20 5.5V8" }),
+    /* @__PURE__ */ jsx("path", { d: "M20 16v2.5a1.5 1.5 0 0 1-1.5 1.5H16" }),
+    /* @__PURE__ */ jsx("path", { d: "M8 20H5.5A1.5 1.5 0 0 1 4 18.5V16" }),
+    /* @__PURE__ */ jsx("path", { d: "M4 12h16" })
+  ] });
+}
+function AlertIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("path", { d: "M12 8.5v5" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 16.7h.01" }),
+    /* @__PURE__ */ jsx("path", { d: "M10.3 3.9 2.6 17.4A1.9 1.9 0 0 0 4.3 20.3h15.4a1.9 1.9 0 0 0 1.7-2.9L13.7 3.9a1.9 1.9 0 0 0-3.4 0Z" })
+  ] });
+}
+function BackIcon(p) {
+  return /* @__PURE__ */ jsx(Svg, { ...p, children: /* @__PURE__ */ jsx("path", { d: "m14 6-6 6 6 6" }) });
+}
+function BoxIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("path", { d: "M20.5 8.2v7.6a1.6 1.6 0 0 1-.8 1.4l-6.9 3.8a1.6 1.6 0 0 1-1.6 0l-6.9-3.8a1.6 1.6 0 0 1-.8-1.4V8.2" }),
+    /* @__PURE__ */ jsx("path", { d: "m3.9 7.3 7.3-4a1.6 1.6 0 0 1 1.6 0l7.3 4a1 1 0 0 1 0 1.7l-7.3 4a1.6 1.6 0 0 1-1.6 0l-7.3-4a1 1 0 0 1 0-1.7Z" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 12.8v8" })
+  ] });
+}
+function BuildingIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("path", { d: "M4.5 20.5V5a1.5 1.5 0 0 1 1.5-1.5h7A1.5 1.5 0 0 1 14.5 5v15.5" }),
+    /* @__PURE__ */ jsx("path", { d: "M14.5 10h4A1.5 1.5 0 0 1 20 11.5v9" }),
+    /* @__PURE__ */ jsx("path", { d: "M3 20.5h18M7.5 7.5h4M7.5 11h4M7.5 14.5h4M7.5 18h4" })
+  ] });
+}
+function CalendarIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("rect", { x: "3.5", y: "5", width: "17", height: "16", rx: "2.5" }),
+    /* @__PURE__ */ jsx("path", { d: "M3.5 10h17M8 3.5v3M16 3.5v3" })
+  ] });
+}
+function CarIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("path", { d: "M3 13.5 5 8a2 2 0 0 1 1.9-1.4h10.2A2 2 0 0 1 19 8l2 5.5" }),
+    /* @__PURE__ */ jsx("path", { d: "M2.5 13.5h19v4a1 1 0 0 1-1 1h-17a1 1 0 0 1-1-1Z" }),
+    /* @__PURE__ */ jsx("path", { d: "M6 18.5v2M18 18.5v2M6 16h1.5M16.5 16H18" })
+  ] });
+}
+function ChevronIcon(p) {
+  return /* @__PURE__ */ jsx(Svg, { ...p, children: /* @__PURE__ */ jsx("path", { d: "m6 9 6 6 6-6" }) });
+}
+function CloseIcon(p) {
+  return /* @__PURE__ */ jsx(Svg, { ...p, children: /* @__PURE__ */ jsx("path", { d: "M6 6l12 12M18 6 6 18" }) });
+}
+function DashboardIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("rect", { x: "3", y: "3", width: "7", height: "7", rx: "1.5" }),
+    /* @__PURE__ */ jsx("rect", { x: "14", y: "3", width: "7", height: "7", rx: "1.5" }),
+    /* @__PURE__ */ jsx("rect", { x: "3", y: "14", width: "7", height: "7", rx: "1.5" }),
+    /* @__PURE__ */ jsx("rect", { x: "14", y: "14", width: "7", height: "7", rx: "1.5" })
+  ] });
+}
+function EyeIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("path", { d: "M2.5 12S6 5.5 12 5.5 21.5 12 21.5 12 18 18.5 12 18.5 2.5 12 2.5 12Z" }),
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "3" })
+  ] });
+}
+function EyeOffIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("path", { d: "M9.9 5.8A9.3 9.3 0 0 1 12 5.5c6 0 9.5 6.5 9.5 6.5a17 17 0 0 1-3.3 4.1" }),
+    /* @__PURE__ */ jsx("path", { d: "M6.4 7.6A17 17 0 0 0 2.5 12S6 18.5 12 18.5a9.5 9.5 0 0 0 3.7-.7" }),
+    /* @__PURE__ */ jsx("path", { d: "M10 10a2.8 2.8 0 0 0 4 4" }),
+    /* @__PURE__ */ jsx("path", { d: "m4 4 16 16" })
+  ] });
+}
+function FaceIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "9.5", r: "3.6" }),
+    /* @__PURE__ */ jsx("path", { d: "M4.5 20c0-3.6 3.4-5.6 7.5-5.6s7.5 2 7.5 5.6" })
+  ] });
+}
+function FactoryIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("path", { d: "M2.5 20.5V11l6 3.5V11l6 3.5V6.5a1 1 0 0 1 1-1h3a1 1 0 0 1 1 1v14Z" }),
+    /* @__PURE__ */ jsx("path", { d: "M2 20.5h20" })
+  ] });
+}
+function FunnelIcon(p) {
+  return /* @__PURE__ */ jsx(Svg, { ...p, children: /* @__PURE__ */ jsx("path", { d: "M3 5h18l-7 8v6l-4 2v-8z" }) });
+}
+function GavelIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("path", { d: "m13.4 6.6 4 4" }),
+    /* @__PURE__ */ jsx("path", { d: "M15.9 2.9a2 2 0 0 1 2.8 0l2.4 2.4a2 2 0 0 1 0 2.8l-2 2a2 2 0 0 1-2.8 0l-2.4-2.4a2 2 0 0 1 0-2.8Z" }),
+    /* @__PURE__ */ jsx("path", { d: "m14.2 9.8-7.6 7.6a2 2 0 0 0 0 2.8 2 2 0 0 0 2.8 0l7.6-7.6" }),
+    /* @__PURE__ */ jsx("path", { d: "M3.5 21.5h7" })
+  ] });
+}
+function InstagramIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("rect", { x: "3.5", y: "3.5", width: "17", height: "17", rx: "4.5" }),
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "3.8" }),
+    /* @__PURE__ */ jsx("path", { d: "M17 7h.01" })
+  ] });
+}
+function LogoutIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("path", { d: "M9 4.5H6A1.5 1.5 0 0 0 4.5 6v12A1.5 1.5 0 0 0 6 19.5h3" }),
+    /* @__PURE__ */ jsx("path", { d: "M15.5 15.5 19.5 12l-4-3.5M19 12H9.5" })
+  ] });
+}
+function MailIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("rect", { x: "2.5", y: "4.5", width: "19", height: "15", rx: "2.5" }),
+    /* @__PURE__ */ jsx("path", { d: "m3.5 7 7.4 5.2a2 2 0 0 0 2.2 0L20.5 7" })
+  ] });
+}
+function MoonIcon(p) {
+  return /* @__PURE__ */ jsx(Svg, { ...p, children: /* @__PURE__ */ jsx("path", { d: "M20 14.2A8.2 8.2 0 0 1 9.8 4a8.2 8.2 0 1 0 10.2 10.2Z" }) });
+}
+function PencilIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("path", { d: "M4 20h4l10-10a2.8 2.8 0 0 0-4-4L4 16v4Z" }),
+    /* @__PURE__ */ jsx("path", { d: "M13.5 6.5l4 4" })
+  ] });
+}
+function PhoneIcon(p) {
+  return /* @__PURE__ */ jsx(Svg, { ...p, children: /* @__PURE__ */ jsx("path", { d: "M8.4 3.5H5.2a1.9 1.9 0 0 0-1.9 2.1c.4 3.7 1.8 7.2 4.1 10.1a19 19 0 0 0 5.9 5.1 1.9 1.9 0 0 0 2.6-.7l1.4-2.3a1.9 1.9 0 0 0-.6-2.5l-2.2-1.4-2.3 2.3a14 14 0 0 1-3.9-3.9l2.3-2.3-1.4-2.2a1.9 1.9 0 0 0-1.6-.9Z" }) });
+}
+function PlansIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("rect", { x: "2.5", y: "5", width: "19", height: "14", rx: "2.5" }),
+    /* @__PURE__ */ jsx("path", { d: "M2.5 10h19" })
+  ] });
+}
+function PlusIcon(p) {
+  return /* @__PURE__ */ jsx(Svg, { ...p, children: /* @__PURE__ */ jsx("path", { d: "M12 5v14M5 12h14" }) });
+}
+function SearchIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("circle", { cx: "11", cy: "11", r: "6.5" }),
+    /* @__PURE__ */ jsx("path", { d: "m16 16 4.5 4.5" })
+  ] });
+}
+function ShieldCheckIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("path", { d: "M12 2.8 4.5 5.9v5.6c0 4.4 3.1 8.5 7.5 9.7 4.4-1.2 7.5-5.3 7.5-9.7V5.9Z" }),
+    /* @__PURE__ */ jsx("path", { d: "m9 11.8 2.2 2.2 4-4" })
+  ] });
+}
+function StaffIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("rect", { x: "2.5", y: "4.5", width: "19", height: "15", rx: "2.5" }),
+    /* @__PURE__ */ jsx("circle", { cx: "8.5", cy: "10.5", r: "2.2" }),
+    /* @__PURE__ */ jsx("path", { d: "M5 16.4c0-1.7 1.6-2.6 3.5-2.6s3.5.9 3.5 2.6" }),
+    /* @__PURE__ */ jsx("path", { d: "M15 10h4" }),
+    /* @__PURE__ */ jsx("path", { d: "M15 14h4" })
+  ] });
+}
+function StudentsIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("circle", { cx: "9", cy: "8", r: "3.2" }),
+    /* @__PURE__ */ jsx("path", { d: "M3.5 19c0-3 2.5-4.6 5.5-4.6s5.5 1.6 5.5 4.6" }),
+    /* @__PURE__ */ jsx("path", { d: "M16.5 6.6a3 3 0 0 1 0 5.6" }),
+    /* @__PURE__ */ jsx("path", { d: "M18 14.6c2 .6 3.2 2 3.2 4.4" })
+  ] });
+}
+function SunIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "4" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 2.5v2M12 19.5v2M4.6 4.6l1.4 1.4M18 18l1.4 1.4M2.5 12h2M19.5 12h2M4.6 19.4 6 18M18 6l1.4-1.4" })
+  ] });
+}
+function TrashIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("path", { d: "M5 7h14" }),
+    /* @__PURE__ */ jsx("path", { d: "M9 7V5a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2" }),
+    /* @__PURE__ */ jsx("path", { d: "M7 7l1 13a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1l1-13" }),
+    /* @__PURE__ */ jsx("path", { d: "M10 11v6" }),
+    /* @__PURE__ */ jsx("path", { d: "M14 11v6" })
+  ] });
+}
+function WhatsappIcon(p) {
+  return /* @__PURE__ */ jsxs(Svg, { ...p, children: [
+    /* @__PURE__ */ jsx("path", { d: "M3.4 20.6 4.7 16a8.2 8.2 0 1 1 3.3 3.2Z" }),
+    /* @__PURE__ */ jsx("path", { d: "M9 9.2c0 3 2.3 5.4 5.2 5.5.7 0 1.3-.5 1.4-1.2l-2-1-.8.9a5 5 0 0 1-2.2-2.3l.9-.8-1-2c-.7.1-1.2.7-1.2 1.4Z" })
+  ] });
+}
+function IconButton({
+  label,
+  variant = "ghost",
+  size = "icon",
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      ...props,
+      "aria-label": label,
+      title: label,
+      className: buttonClass({ variant, size, className })
+    }
+  );
+}
+
+// src/atoms/input/control.ts
+var CONTROL = "w-full min-w-0 rounded-md border border-line-strong bg-field text-base text-ink sm:text-sm outline-none transition-[background-color,border-color,box-shadow] duration-(--duration-fast) ease-out focus:border-accent focus:ring-2 focus:ring-accent/30 aria-invalid:border-danger aria-invalid:ring-2 aria-invalid:ring-danger/20";
+var CONTROL_SIZES = {
+  md: "px-4 py-3",
+  sm: "px-3 py-2"
+};
+function Input({
+  size = "md",
+  className = "",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx("input", { ...props, className: `${CONTROL} ${CONTROL_SIZES[size]} ${className}` });
+}
+function Select({
+  size = "md",
+  className = "",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs("span", { className: "relative block", children: [
+    /* @__PURE__ */ jsx(
+      "select",
+      {
+        ...props,
+        className: `${CONTROL} ${CONTROL_SIZES[size]} appearance-none pr-10 ${className}`
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      ChevronIcon,
+      {
+        className: "pointer-events-none absolute top-1/2 right-4 -translate-y-1/2 text-ink-muted",
+        size: "md"
+      }
+    )
+  ] });
+}
+function Textarea({
+  size = "md",
+  rows = 4,
+  className = "",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "textarea",
+    {
+      ...props,
+      rows,
+      className: `${CONTROL} ${CONTROL_SIZES[size]} resize-y ${className}`
+    }
+  );
+}
+function Kbd({ children, className = "" }) {
+  return /* @__PURE__ */ jsx(
+    "kbd",
+    {
+      className: `inline-flex min-w-6 items-center justify-center rounded-xs border border-line-strong bg-raised px-1 py-0.5 font-mono text-2xs text-ink-soft ${className}`,
+      children
+    }
+  );
+}
+var TONES2 = {
+  muted: "text-ink-muted",
+  dim: "text-ink-dim",
+  accent: "text-accent-ink"
+};
+function Label({
+  children,
+  tone = "muted",
+  className = ""
+}) {
+  return /* @__PURE__ */ jsx("span", { className: `text-2xs tracking-caps ${TONES2[tone]} ${className}`, children });
+}
+var TONES3 = {
+  accent: "text-accent-ink decoration-accent/40 hover:decoration-accent",
+  ink: "text-ink decoration-line-strong hover:decoration-ink-muted",
+  muted: "text-ink-muted decoration-line hover:text-ink-soft hover:decoration-line-strong"
+};
+function Link({
+  tone = "accent",
+  className = "",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "a",
+    {
+      ...props,
+      className: `rounded-xs underline decoration-1 underline-offset-4 transition-colors duration-(--duration-fast) ease-out focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent ${TONES3[tone]} ${className}`
+    }
+  );
+}
+function MoreIcon() {
+  return /* @__PURE__ */ jsxs(Svg, { size: "lg", children: [
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "5", r: "1.5", fill: "currentColor", stroke: "none" }),
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "1.5", fill: "currentColor", stroke: "none" }),
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "19", r: "1.5", fill: "currentColor", stroke: "none" })
+  ] });
+}
+var FILL = {
+  accent: "bg-accent",
+  ok: "bg-ok",
+  warn: "bg-warn",
+  danger: "bg-danger"
+};
+var HEIGHTS = { md: "h-2", xs: "h-1" };
+function ProgressBar({
+  value,
+  tone = "accent",
+  size = "md",
+  dim = false,
+  label,
+  className = ""
+}) {
+  const pct = Math.max(0, Math.min(1, value)) * 100;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "aria-label": label,
+      "aria-valuemax": 100,
+      "aria-valuemin": 0,
+      "aria-valuenow": pct,
+      className: `${HEIGHTS[size]} overflow-hidden rounded-full bg-raised ${className}`,
+      role: "progressbar",
+      children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: `h-full origin-left rounded-full transition-transform duration-(--duration-base) ease-out ${FILL[tone]} ${dim ? "opacity-45" : ""}`,
+          style: { transform: `scaleX(${pct / 100})` }
+        }
+      )
+    }
+  );
+}
+
+// src/atoms/range-date-picker/locales.ts
+var locales2 = { start: "Start date", end: "End date" };
+function RangeDatePicker({
+  start,
+  end,
+  onStartChange,
+  onEndChange,
+  className = ""
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: `grid gap-3 sm:grid-cols-2 ${className}`, children: [
+    /* @__PURE__ */ jsx(DatePicker, { "aria-label": locales2.start, onValueChange: onStartChange, value: start }),
+    /* @__PURE__ */ jsx(DatePicker, { "aria-label": locales2.end, onValueChange: onEndChange, value: end })
+  ] });
+}
+function Radio({
+  label,
+  className = "",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs("label", { className: `inline-flex min-h-10 items-center gap-3 text-sm text-ink-soft ${className}`, children: [
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        ...props,
+        className: "size-5 shrink-0 accent-accent focus-visible:ring-2 focus-visible:ring-accent/30 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent",
+        type: "radio"
+      }
+    ),
+    label ? /* @__PURE__ */ jsx("span", { children: label }) : null
+  ] });
+}
+function Segmented({
+  name,
+  options,
+  value,
+  defaultValue,
+  onValueChange,
+  label,
+  className = ""
+}) {
+  function handleChange(event) {
+    onValueChange?.(event.target.value);
+  }
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      role: "group",
+      "aria-label": label,
+      className: `inline-flex gap-1 rounded-md border border-line bg-panel p-1 ${className}`,
+      children: options.map((option) => /* @__PURE__ */ jsxs(
+        "label",
+        {
+          className: "relative inline-flex min-h-8 cursor-pointer items-center justify-center rounded-sm px-3 text-xs text-ink-muted transition-colors duration-(--duration-fast) ease-out select-none not-has-checked:hover:bg-raised not-has-checked:hover:text-ink-soft has-checked:bg-accent has-checked:font-medium has-checked:text-on-accent has-focus-visible:outline-2 has-focus-visible:outline-offset-2 has-focus-visible:outline-accent has-disabled:cursor-not-allowed has-disabled:opacity-50",
+          children: [
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                className: "absolute size-0 opacity-0",
+                type: "radio",
+                name,
+                value: option.value,
+                disabled: option.disabled,
+                checked: value === void 0 ? void 0 : value === option.value,
+                defaultChecked: value === void 0 ? defaultValue === option.value : void 0,
+                onChange: handleChange
+              }
+            ),
+            option.label
+          ]
+        },
+        option.value
+      ))
+    }
+  );
+}
+function Skeleton({ className = "" }) {
+  return /* @__PURE__ */ jsx("div", { className: `animate-pulse rounded-sm bg-raised ${className}` });
+}
+function Slider({ className = "", ...props }) {
+  return /* @__PURE__ */ jsx(
+    "input",
+    {
+      ...props,
+      className: `h-6 w-full cursor-grab touch-manipulation bg-transparent accent-accent focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent active:cursor-grabbing disabled:cursor-not-allowed disabled:opacity-50 ${className}`,
+      type: "range"
+    }
+  );
+}
+
+// src/atoms/spinner/locales.ts
+var locales3 = {
+  label: "Loading"
+};
+var SIZES4 = {
+  sm: "h-3 w-3",
+  md: "h-4 w-4",
+  lg: "h-5 w-5",
+  xl: "h-6 w-6",
+  "2xl": "h-8 w-8"
+};
+function Spinner({
+  size = "md",
+  label = locales3.label,
+  className = ""
+}) {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      className: `${SIZES4[size]} shrink-0 animate-spin ${className}`,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      role: "status",
+      "aria-label": label,
+      children: [
+        /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "9", stroke: "currentColor", strokeWidth: "2.4", opacity: "0.2" }),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M21 12a9 9 0 0 0-9-9",
+            stroke: "currentColor",
+            strokeWidth: "2.4",
+            strokeLinecap: "round"
+          }
+        )
+      ]
+    }
+  );
+}
+function Switch({
+  checked,
+  onCheckedChange,
+  label,
+  disabled = false,
+  className = ""
+}) {
+  return /* @__PURE__ */ jsxs("label", { className: `inline-flex min-h-10 items-center gap-3 text-sm text-ink-soft ${className}`, children: [
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        "aria-checked": checked,
+        className: `relative h-6 w-10 shrink-0 rounded-full transition-colors duration-(--duration-fast) ease-out focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent disabled:opacity-50 ${checked ? "bg-accent" : "bg-raised"}`,
+        disabled,
+        onClick: () => onCheckedChange(!checked),
+        role: "switch",
+        type: "button",
+        children: /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: `absolute top-1 left-1 size-4 rounded-full transition-[background-color,transform] duration-(--duration-fast) ease-out ${checked ? "translate-x-4 bg-on-accent" : "translate-x-0 bg-ink"}`
+          }
+        )
+      }
+    ),
+    label ? /* @__PURE__ */ jsx("span", { children: label }) : null
+  ] });
+}
+function Thumb({
+  src,
+  alt,
+  fallback,
+  className = ""
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: `flex aspect-[4/3] items-center justify-center overflow-hidden rounded-md bg-raised text-ink-dim ${className}`,
+      children: src ? /* @__PURE__ */ jsx("img", { src, alt, loading: "lazy", className: "h-full w-full object-cover" }) : fallback
+    }
+  );
+}
+
+export { AccessIcon, AlertIcon, Avatar, BackIcon, Badge, BoxIcon, BuildingIcon, Button, CONTROL, CONTROL_SIZES, CalendarIcon, CarIcon, Card, Checkbox, ChevronIcon, CloseIcon, Combobox, DashboardIcon, DateTimePicker, Divider, EyeIcon, EyeOffIcon, FaceIcon, FactoryIcon, FormAlert, FunnelIcon, GavelIcon, IconButton, Input, InstagramIcon, Kbd, Label, Link, LogoutIcon, MailIcon, MoonIcon, MoreIcon, PencilIcon, PhoneIcon, PlansIcon, PlusIcon, ProgressBar, Radio, RangeDatePicker, SearchIcon, Segmented, Select, ShieldCheckIcon, Skeleton, Slider, Spinner, StaffIcon, StudentsIcon, SunIcon, Svg, Switch, Textarea, Thumb, TrashIcon, WhatsappIcon, buttonClass };
+//# sourceMappingURL=chunk-WWOXGKLF.js.map
+//# sourceMappingURL=chunk-WWOXGKLF.js.map