@code0-tech/pictor 0.13.1 → 0.15.0

package/LICENSE

@@ -1,9 +1,8 @@
 Copyright 2023-2026 Code0 UG (haftungsbeschränkt)
 
 This license applies to all files in this repository EXCEPT the contents of the
-directory "src/components/icon/codezero" (and any build artifacts derived from
-it), which are governed by the "Excluded Assets" section at the bottom of this
-file.
+directories (and any derived build artifacts) covered by the "Excluded Assets" section
+at the bottom of this file.
 
 Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
 

package/dist/assets/components/avatar/Avatar.style.css

@@ -1 +1 @@
-.avatar{aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;overflow:hidden}.avatar{background:#191825;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;background:transparent;box-shadow:none}.avatar--image{padding:0}.avatar--identicon>div>div{--color: inherit;background:transparent;width:calc(var(--size) * 1px);height:calc(var(--size) * 1px)}.avatar--identicon>div>div>span>svg{width:calc(var(--size) * 1px);height:calc(var(--size) * 1px)}.avatar--identicon>div>div>span,.avatar--identicon>div>div>p{color:var(--color);font-size:calc(var(--size) * .75px)}
+.avatar{aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;overflow:hidden}.avatar{background:#191825;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;background:transparent;box-shadow:none}.avatar--image{padding:0}.avatar--identicon>div>div{--color: inherit;background:transparent;width:calc(var(--size) * 1px);height:calc(var(--size) * 1px)}.avatar--identicon>div>div>span>svg{width:calc(var(--size) * .75px);height:calc(var(--size) * .75px)}.avatar--identicon>div>div>span,.avatar--identicon>div>div>p{color:var(--color);font-size:calc(var(--size) * .75px)}

package/dist/assets/components/form/DateInput.style.css

@@ -0,0 +1 @@
+.date-input__control{flex:1;min-width:0;align-self:stretch;display:flex;align-items:center}.date-input__segment-group{flex:1;min-width:0;display:flex;align-items:center}.date-input__segment{padding:0 1px;border-radius:.65rem;font-variant-numeric:tabular-nums}.date-input__segment:focus{outline:none}.date-input__segment{font-family:Inter,sans-serif;font-weight:400;letter-spacing:-.5px}.date-input__segment[data-placeholder]{opacity:.5}.date-input__segment:focus,.date-input__segment[data-focus]{background:#191825;box-shadow:inset 0 1px 1px #ffffff1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box}.date-input__trigger{cursor:pointer;display:flex;align-items:center}.date-input__view-control{display:flex;align-items:center;justify-content:space-between;gap:.7rem;padding:.35rem}.date-input__prev-trigger,.date-input__next-trigger,.date-input__view-trigger{cursor:pointer;background:none;border:none;padding:.35rem .7rem;border-radius:.65rem}.date-input__prev-trigger,.date-input__next-trigger,.date-input__view-trigger{background:#070514;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box}.date-input__prev-trigger:focus,.date-input__next-trigger:focus,.date-input__view-trigger:focus{outline:none}.date-input__prev-trigger,.date-input__next-trigger,.date-input__view-trigger{font-family:Inter,sans-serif;font-weight:400;letter-spacing:-.5px;box-shadow:none}.date-input__prev-trigger:hover,.date-input__prev-trigger[data-focus=true],.date-input__next-trigger:hover,.date-input__next-trigger[data-focus=true],.date-input__view-trigger:hover,.date-input__view-trigger[data-focus=true]{background:#191825;box-shadow:inset 0 1px 1px #ffffff1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;box-shadow:none}.date-input__table{width:100%;border-collapse:collapse}.date-input__table-header{font-size:.8rem;padding:.35rem;text-align:center;opacity:.6}.date-input__table-header{font-family:Inter,sans-serif;font-weight:400;letter-spacing:-.5px}.date-input__cell{border-radius:.65rem;padding:.35rem;cursor:pointer;width:100%;display:flex;align-items:center;justify-content:center;font-size:.8rem}.date-input__cell{background:#070514;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box}.date-input__cell:focus{outline:none}.date-input__cell{font-family:Inter,sans-serif;font-weight:400;letter-spacing:-.5px}.date-input__cell:disabled,.date-input__cell[data-disabled],.date-input__cell[aria-disabled=true],.date-input__cell--disabled{cursor:not-allowed;opacity:25%;pointer-events:unset}.date-input__cell{box-shadow:none}.date-input__cell:focus,.date-input__cell:hover,.date-input__cell[data-focus=true],.date-input__cell[data-selected]{background:#191825;box-shadow:inset 0 1px 1px #ffffff1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;box-shadow:none}.date-input__cell[data-outside-range]{opacity:.4}.date-input__time{display:flex;align-items:center;justify-content:center;gap:.35rem;padding:.7rem .35rem .35rem}.date-input__time-separator{font-size:.8rem}.date-input__time-separator{font-family:Inter,sans-serif;font-weight:400;letter-spacing:-.5px}

package/dist/assets/components/toast/Toast.style.css

@@ -1 +1 @@
-.toast{padding:1rem;width:100%;overflow:hidden}.toast{border-radius:1rem;font-family:Inter,sans-serif;font-weight:400;letter-spacing:-.5px}.toast__header{align-items:flex-start;justify-content:space-between;gap:.7rem}.toast__icon{display:flex;align-items:center;justify-content:center}.toast__content{box-sizing:border-box;margin-left:27px}.toast__header-wrapper{align-items:flex-start;gap:.7rem}.toast__header-wrapper>svg{min-width:1rem;min-height:1rem}.toast__dismissible{cursor:pointer;display:flex;align-items:center;justify-content:center}.toast__dismissible{border-radius:1rem}.toast__dismissible svg{min-width:1rem;min-height:1rem}@keyframes toast-duration{0%{width:0%}to{width:100%}}.toast:hover .toast__duration:after{animation-play-state:paused}.toast__duration{position:relative;margin:1rem -1rem -1rem;padding:.35rem 1rem .6rem;gap:.35rem}.toast__duration{border-top:1px solid rgba(191,191,191,.1)}.toast__duration:after{content:"";position:absolute;left:0;bottom:0;width:0%;height:4px;background:#bfbfbf1a;animation-name:toast-duration;animation-duration:var(--toast-duration, 4s);animation-timing-function:linear;animation-fill-mode:forwards}.toast--primary{background:#070514;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box}.toast--secondary{background:#191825;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box}.toast--tertiary{background:#201e2c;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box}.toast--success{background:#0a1814;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box}.toast--warning{background:#201813;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box}.toast--error{background:#1c0516;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box}.toast--info{background:#121e24;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box}
+.toast{padding:1rem;width:100%;overflow:hidden}.toast{border-radius:1rem;font-family:Inter,sans-serif;font-weight:400;letter-spacing:-.5px}.toast__header{align-items:flex-start;justify-content:space-between;gap:.7rem}.toast__icon{display:flex;align-items:center;justify-content:center}.toast__content{box-sizing:border-box;margin-left:27px;margin-top:.35rem}.toast__header-wrapper{align-items:center;gap:.7rem}.toast__header-wrapper>svg{min-width:1rem;min-height:1rem}.toast--primary{background:#070514;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:1px solid rgba(191,191,191,.1);color:#070514}.toast--secondary{background:#070514;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:1px solid rgba(191,191,191,.1);color:#bfbfbf}.toast--tertiary{background:#070514;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:1px solid rgba(191,191,191,.1);color:#fff}.toast--success{background:#070514;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:1px solid rgba(191,191,191,.1);color:#29bf12}.toast--warning{background:#070514;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:1px solid rgba(191,191,191,.1);color:#ffbe0b}.toast--error{background:#070514;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:1px solid rgba(191,191,191,.1);color:#d90429}.toast--info{background:#070514;box-shadow:inset 0 1px 1px #bfbfbf1a;border:none;color:#ffffffbf;position:relative;box-sizing:border-box;border:1px solid rgba(191,191,191,.1);color:#70ffb2}

package/dist/components/command/Command.js

@@ -6,14 +6,25 @@ import "react";
 import { mergeComponentProps as r } from "../../utils/component.js";
 import "js-md5";
 import { DialogPortal as u, DialogContent as h, Dialog as g, DialogOverlay as C } from "../dialog/Dialog.js";
-import '../../assets/components/form/SelectInput.style.css';import '../../assets/components/form/FileInput.style.css';import '../../assets/components/form/Input.style.css';import '../../assets/components/command/Command.style.css';/* empty css                   */
+import '../../assets/components/form/FileInput.style.css';import '../../assets/components/form/DateInput.style.css';import '../../assets/components/form/SelectInput.style.css';import '../../assets/components/scroll-area/ScrollArea.style.css';import '../../assets/components/menu/Menu.style.css';import '../../assets/components/flex/Flex.style.css';import '../../assets/components/form/Input.style.css';import '../../assets/components/command/Command.style.css';/* empty css                   */
 import { Badge as _ } from "../badge/Badge.js";
 import "@radix-ui/react-checkbox";
 import "@tabler/icons-react";
 /* empty css                       */
+import "@ark-ui/react";
+import "@internationalized/date";
+import "../form/InputWrapper.js";
+/* empty css                      */
+/* empty css                      */
+import "@radix-ui/react-dropdown-menu";
+import "@radix-ui/react-scroll-area";
+/* empty css                                   */
+import "@radix-ui/react-select";
+/* empty css                             */
+/* empty css                           */
+import "../button/Button.js";
 import "../form/EditorInput.js";
 import "../form/EmailInput.js";
-import "@ark-ui/react";
 /* empty css                           */
 import "../form/Input.js";
 import "../form/InputSuggestion.js";
@@ -21,9 +32,6 @@ import "../form/NumberInput.js";
 import "../form/PasswordInput.js";
 import "@radix-ui/react-one-time-password-field";
 import "@radix-ui/react-radio-group";
-import "@radix-ui/react-select";
-import "../form/InputWrapper.js";
-/* empty css                             */
 import "../form/SwitchInput.js";
 import "../form/TextAreaInput.js";
 import { TextInput as $ } from "../form/TextInput.js";
@@ -34,7 +42,7 @@ const P = (e) => {
   const o = m;
   let n;
   return t[2] !== o ? (n = /* @__PURE__ */ i(a, { ...o }), t[2] = o, t[3] = n) : n = t[3], n;
-}, W = (e) => {
+}, mt = (e) => {
   const t = c.c(11);
   let m;
   t[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (m = /* @__PURE__ */ i(C, {}), t[0] = m) : m = t[0];
@@ -47,14 +55,14 @@ const P = (e) => {
   ] }), t[3] = e.contentProps, t[4] = o, t[5] = n) : n = t[5];
   let l;
   return t[6] !== e.dialogProps || t[7] !== e.onOpenChange || t[8] !== e.open || t[9] !== n ? (l = /* @__PURE__ */ i(g, { ...e.dialogProps, open: e.open, onOpenChange: e.onOpenChange, children: n }), t[6] = e.dialogProps, t[7] = e.onOpenChange, t[8] = e.open, t[9] = n, t[10] = l) : l = t[10], l;
-}, X = (e) => {
+}, ot = (e) => {
   const t = c.c(4);
   let m;
   t[0] !== e ? (m = r("command__list", e), t[0] = e, t[1] = m) : m = t[1];
   const o = m;
   let n;
   return t[2] !== o ? (n = /* @__PURE__ */ i(a.List, { ...o }), t[2] = o, t[3] = n) : n = t[3], n;
-}, Y = (e) => {
+}, it = (e) => {
   const t = c.c(10);
   let m;
   t[0] !== e.value ? (m = e.value?.toString(), t[0] = e.value, t[1] = m) : m = t[1];
@@ -73,35 +81,35 @@ const P = (e) => {
   t[4] !== e ? (n = /* @__PURE__ */ i($, { className: "command__input", ...e }), t[4] = e, t[5] = n) : n = t[5];
   let l;
   return t[6] !== m || t[7] !== o || t[8] !== n ? (l = /* @__PURE__ */ i(a.Input, { value: m, onValueChange: o, asChild: !0, children: n }), t[6] = m, t[7] = o, t[8] = n, t[9] = l) : l = t[9], l;
-}, Z = (e) => {
+}, lt = (e) => {
   const t = c.c(4);
   let m;
   t[0] !== e ? (m = r("command__empty", e), t[0] = e, t[1] = m) : m = t[1];
   const o = m;
   let n;
   return t[2] !== o ? (n = /* @__PURE__ */ i(a.Empty, { ...o }), t[2] = o, t[3] = n) : n = t[3], n;
-}, p = (e) => {
+}, ct = (e) => {
   const t = c.c(4);
   let m;
   t[0] !== e ? (m = r("command__group", e), t[0] = e, t[1] = m) : m = t[1];
   const o = m;
   let n;
   return t[2] !== o ? (n = /* @__PURE__ */ i(a.Group, { ...o }), t[2] = o, t[3] = n) : n = t[3], n;
-}, tt = (e) => {
+}, at = (e) => {
   const t = c.c(4);
   let m;
   t[0] !== e ? (m = r("command__item", e), t[0] = e, t[1] = m) : m = t[1];
   const o = m;
   let n;
   return t[2] !== o ? (n = /* @__PURE__ */ i(a.Item, { ...o }), t[2] = o, t[3] = n) : n = t[3], n;
-}, et = (e) => {
+}, rt = (e) => {
   const t = c.c(4);
   let m;
   t[0] !== e ? (m = r("command__separator", e), t[0] = e, t[1] = m) : m = t[1];
   const o = m;
   let n;
   return t[2] !== o ? (n = /* @__PURE__ */ i(a.Separator, { ...o }), t[2] = o, t[3] = n) : n = t[3], n;
-}, nt = (e) => {
+}, dt = (e) => {
   const t = c.c(5);
   let m;
   t[0] !== e ? (m = r("command__shortcut", e), t[0] = e, t[1] = m) : m = t[1];
@@ -111,12 +119,12 @@ const P = (e) => {
 };
 export {
   P as Command,
-  W as CommandDialog,
-  Z as CommandEmpty,
-  p as CommandGroup,
-  Y as CommandInput,
-  tt as CommandItem,
-  X as CommandList,
-  et as CommandSeparator,
-  nt as CommandShortcut
+  mt as CommandDialog,
+  lt as CommandEmpty,
+  ct as CommandGroup,
+  it as CommandInput,
+  at as CommandItem,
+  ot as CommandList,
+  rt as CommandSeparator,
+  dt as CommandShortcut
 };

package/dist/components/dialog/Dialog.js

@@ -53,7 +53,7 @@ const j = (i) => {
   let e;
   t[2] !== i.showCloseButton || t[3] !== i.title ? (e = i.showCloseButton && /* @__PURE__ */ f(d, { align: "center", justify: "space-between", children: [
     /* @__PURE__ */ n(_, { hierarchy: "primary", size: "xl", children: i.title }),
-    /* @__PURE__ */ n(u, { asChild: !0, children: /* @__PURE__ */ n(m, { children: /* @__PURE__ */ n(g, { size: 16 }) }) })
+    /* @__PURE__ */ n(u, { asChild: !0, children: /* @__PURE__ */ n(m, { variant: "none", color: "tertiary", children: /* @__PURE__ */ n(g, { size: 16 }) }) })
   ] }), t[2] = i.showCloseButton, t[3] = i.title, t[4] = e) : e = t[4];
   let a;
   return t[5] !== i.children || t[6] !== o || t[7] !== e ? (a = /* @__PURE__ */ f(s.Content, { ...o, children: [

package/dist/components/form/DateInput.d.ts

@@ -0,0 +1,37 @@
+import { DateInput as ArkDateInput, DatePicker, DateValue } from '@ark-ui/react';
+import { ComponentProps } from '../../utils';
+import { default as React } from 'react';
+import { InputWrapperProps } from './InputWrapper';
+import { MenuContentProps, MenuTriggerProps } from '../menu/Menu';
+type DateGranularity = "day" | "hour" | "minute" | "second";
+interface ValueChangeDetails {
+    value: DateValue[];
+    valueAsString: string[];
+}
+export type DateProps = InputWrapperProps & {
+    granularity?: DateGranularity;
+    closeOnSelect?: boolean;
+    name?: string;
+    disabled?: boolean;
+    readOnly?: boolean;
+    locale?: string;
+    placeholderValue?: DateValue;
+    onValueChange?: (details: ValueChangeDetails) => void;
+    children?: React.ReactNode;
+};
+export type DateInputControlProps = ComponentProps & ArkDateInput.ControlProps;
+export type DateInputFieldProps = ComponentProps & ArkDateInput.SegmentGroupProps;
+export type DateInputTriggerProps = ComponentProps & MenuTriggerProps;
+export type DateInputContentProps = ComponentProps & MenuContentProps & {
+    withTime?: boolean;
+};
+export type DateInputPrevTriggerProps = ComponentProps & DatePicker.PrevTriggerProps;
+export type DateInputNextTriggerProps = ComponentProps & DatePicker.NextTriggerProps;
+export declare const DateInput: React.FC<DateProps>;
+export declare const DateInputControl: React.FC<DateInputControlProps>;
+export declare const DateInputField: React.FC<DateInputFieldProps>;
+export declare const DateInputTrigger: React.FC<DateInputTriggerProps>;
+export declare const DateInputPrevTrigger: React.FC<DateInputPrevTriggerProps>;
+export declare const DateInputNextTrigger: React.FC<DateInputNextTriggerProps>;
+export declare const DateInputContent: React.FC<DateInputContentProps>;
+export {};

package/dist/components/form/DateInput.js

@@ -0,0 +1,285 @@
+import { jsx as n, jsxs as b, Fragment as H } from "react/jsx-runtime";
+import { c as T } from "../../_virtual/compiler-runtime.js";
+import { DatePicker as a, DateInput as C } from "@ark-ui/react";
+import { toZoned as J, getLocalTimeZone as q, fromDate as K } from "@internationalized/date";
+import { IconChevronDown as Q } from "@tabler/icons-react";
+import "../../utils/contextStore.js";
+import F from "react";
+import { mergeComponentProps as S } from "../../utils/component.js";
+import "js-md5";
+import { InputWrapper as X } from "./InputWrapper.js";
+import { Flex as ee } from "../flex/Flex.js";
+import { MenuTrigger as te, Menu as ne, MenuPortal as le, MenuContent as re } from "../menu/Menu.js";
+import { SelectPortal as ie, SelectContent as ae, SelectViewport as ce, SelectItem as oe, SelectItemText as se, SelectValue as ue, SelectTrigger as me, SelectInput as de } from "./SelectInput.js";
+import '../../assets/components/form/DateInput.style.css';/* empty css                     */
+import { Button as fe } from "../button/Button.js";
+const he = (t) => K(new Date(t * 1e3), q()), _e = (t) => Math.floor(J(t, q()).toDate().getTime() / 1e3), Y = (t) => {
+  const e = Array.isArray(t) ? t : [t], l = [];
+  for (const r of e)
+    r == null || r === "" || (typeof r == "number" ? Number.isNaN(r) || l.push(he(r)) : l.push(r));
+  return l;
+}, qe = (t) => {
+  const e = T.c(43), {
+    title: l,
+    description: r,
+    left: i,
+    leftType: c,
+    rightType: o,
+    right: s,
+    formValidation: u,
+    initialValue: m,
+    defaultValue: h,
+    value: d,
+    granularity: f,
+    closeOnSelect: _,
+    name: p,
+    disabled: g,
+    readOnly: k,
+    locale: v,
+    placeholderValue: A,
+    onValueChange: G,
+    children: z
+  } = t;
+  let $;
+  e[0] !== h || e[1] !== m || e[2] !== d ? ($ = () => Y(d ?? m ?? h), e[0] = h, e[1] = m, e[2] = d, e[3] = $) : $ = e[3];
+  const [w, L] = F.useState($);
+  let R, M;
+  e[4] !== d ? (R = () => {
+    d !== void 0 && L(Y(d));
+  }, M = [d], e[4] = d, e[5] = R, e[6] = M) : (R = e[5], M = e[6]), F.useEffect(R, M);
+  const [y, W] = F.useState(!1);
+  let O;
+  e[7] !== u || e[8] !== G ? (O = (I) => {
+    L(I.value), u?.setValue?.(I.value[0] ? _e(I.value[0]) : null), G?.(I);
+  }, e[7] = u, e[8] = G, e[9] = O) : O = e[9];
+  const N = O;
+  let P;
+  e[10] !== w || e[11] !== g || e[12] !== f || e[13] !== N || e[14] !== v || e[15] !== p || e[16] !== A || e[17] !== k ? (P = S("date-input", {
+    value: w,
+    onValueChange: N,
+    granularity: f,
+    name: p,
+    disabled: g,
+    readOnly: k,
+    locale: v,
+    placeholderValue: A
+  }), e[10] = w, e[11] = g, e[12] = f, e[13] = N, e[14] = v, e[15] = p, e[16] = A, e[17] = k, e[18] = P) : P = e[18];
+  const E = P;
+  let j;
+  e[19] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (j = (I) => W(I.open), e[19] = j) : j = e[19];
+  let V;
+  e[20] !== z || e[21] !== r || e[22] !== u || e[23] !== i || e[24] !== c || e[25] !== s || e[26] !== o || e[27] !== l ? (V = /* @__PURE__ */ n(X, { title: l, description: r, left: i, leftType: c, right: s, rightType: o, formValidation: u, children: z }), e[20] = z, e[21] = r, e[22] = u, e[23] = i, e[24] = c, e[25] = s, e[26] = o, e[27] = l, e[28] = V) : V = e[28];
+  let x;
+  e[29] !== y || e[30] !== V ? (x = /* @__PURE__ */ n(ne, { open: y, onOpenChange: W, children: V }), e[29] = y, e[30] = V, e[31] = x) : x = e[31];
+  let D;
+  e[32] !== _ || e[33] !== w || e[34] !== g || e[35] !== N || e[36] !== v || e[37] !== y || e[38] !== x ? (D = /* @__PURE__ */ n(a.Root, { value: w, onValueChange: N, open: y, onOpenChange: j, closeOnSelect: _, disabled: g, locale: v, children: x }), e[32] = _, e[33] = w, e[34] = g, e[35] = N, e[36] = v, e[37] = y, e[38] = x, e[39] = D) : D = e[39];
+  let B;
+  return e[40] !== E || e[41] !== D ? (B = /* @__PURE__ */ n(C.Root, { ...E, children: D }), e[40] = E, e[41] = D, e[42] = B) : B = e[42], B;
+}, Je = (t) => {
+  const e = T.c(4);
+  let l;
+  e[0] !== t ? (l = S("date-input__control", t), e[0] = t, e[1] = l) : l = e[1];
+  const r = l;
+  let i;
+  return e[2] !== r ? (i = /* @__PURE__ */ n(C.Control, { ...r }), e[2] = r, e[3] = i) : i = e[3], i;
+}, Ke = (t) => {
+  const e = T.c(8);
+  let l;
+  e[0] !== t ? (l = S("date-input__segment-group", t), e[0] = t, e[1] = l) : l = e[1];
+  const r = l;
+  let i;
+  e[2] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (i = /* @__PURE__ */ n(C.Context, { children: Ce }), e[2] = i) : i = e[2];
+  let c;
+  e[3] !== r ? (c = /* @__PURE__ */ n(C.SegmentGroup, { ...r, children: i }), e[3] = r, e[4] = c) : c = e[4];
+  let o;
+  e[5] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (o = /* @__PURE__ */ n(C.HiddenInput, {}), e[5] = o) : o = e[5];
+  let s;
+  return e[6] !== c ? (s = /* @__PURE__ */ b(H, { children: [
+    c,
+    o
+  ] }), e[6] = c, e[7] = s) : s = e[7], s;
+}, Qe = (t) => {
+  const e = T.c(4);
+  let l;
+  e[0] !== t ? (l = S("date-input__trigger", t), e[0] = t, e[1] = l) : l = e[1];
+  const r = l;
+  let i;
+  return e[2] !== r ? (i = /* @__PURE__ */ n(te, { ...r }), e[2] = r, e[3] = i) : i = e[3], i;
+}, pe = (t) => {
+  const e = T.c(4);
+  let l;
+  e[0] !== t ? (l = S("date-input__prev-trigger", t), e[0] = t, e[1] = l) : l = e[1];
+  const r = l;
+  let i;
+  return e[2] !== r ? (i = /* @__PURE__ */ n(a.PrevTrigger, { ...r }), e[2] = r, e[3] = i) : i = e[3], i;
+}, ge = (t) => {
+  const e = T.c(4);
+  let l;
+  e[0] !== t ? (l = S("date-input__next-trigger", t), e[0] = t, e[1] = l) : l = e[1];
+  const r = l;
+  let i;
+  return e[2] !== r ? (i = /* @__PURE__ */ n(a.NextTrigger, { ...r }), e[2] = r, e[3] = i) : i = e[3], i;
+}, Z = () => {
+  const t = T.c(2);
+  let e;
+  t[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (e = /* @__PURE__ */ n(pe, { children: "‹" }), t[0] = e) : e = t[0];
+  let l;
+  return t[1] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (l = /* @__PURE__ */ b(a.ViewControl, { className: "date-input__view-control", children: [
+    e,
+    /* @__PURE__ */ n(a.ViewTrigger, { className: "date-input__view-trigger", children: /* @__PURE__ */ n(a.RangeText, { className: "date-input__range-text" }) }),
+    /* @__PURE__ */ n(ge, { children: "›" })
+  ] }), t[1] = l) : l = t[1], l;
+}, Xe = (t) => {
+  const e = T.c(20);
+  let l, r, i, c, o, s;
+  if (e[0] !== t) {
+    const {
+      withTime: p,
+      ...g
+    } = t;
+    s = p, r = le, l = re, c = "end", o = 8, i = S("date-input__content", g), e[0] = t, e[1] = l, e[2] = r, e[3] = i, e[4] = c, e[5] = o, e[6] = s;
+  } else
+    l = e[1], r = e[2], i = e[3], c = e[4], o = e[5], s = e[6];
+  const u = i;
+  let m;
+  e[7] !== s ? (m = /* @__PURE__ */ n(a.View, { view: "day", className: "date-input__view", children: /* @__PURE__ */ n(a.Context, { children: (p) => /* @__PURE__ */ b(H, { children: [
+    /* @__PURE__ */ n(Z, {}),
+    /* @__PURE__ */ b(a.Table, { className: "date-input__table", children: [
+      /* @__PURE__ */ n(a.TableHead, { children: /* @__PURE__ */ n(a.TableRow, { children: p.weekDays.map(Se) }) }),
+      /* @__PURE__ */ n(a.TableBody, { children: p.weeks.map(we) })
+    ] }),
+    s && /* @__PURE__ */ n(be, {})
+  ] }) }) }), e[7] = s, e[8] = m) : m = e[8];
+  let h;
+  e[9] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (h = /* @__PURE__ */ n(a.View, { view: "month", className: "date-input__view", children: /* @__PURE__ */ n(a.Context, { children: Ve }) }), e[9] = h) : h = e[9];
+  let d;
+  e[10] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (d = /* @__PURE__ */ n(a.View, { view: "year", className: "date-input__view", children: /* @__PURE__ */ n(a.Context, { children: Ie }) }), e[10] = d) : d = e[10];
+  let f;
+  e[11] !== l || e[12] !== c || e[13] !== o || e[14] !== u || e[15] !== m ? (f = /* @__PURE__ */ b(l, { align: c, sideOffset: o, ...u, children: [
+    m,
+    h,
+    d
+  ] }), e[11] = l, e[12] = c, e[13] = o, e[14] = u, e[15] = m, e[16] = f) : f = e[16];
+  let _;
+  return e[17] !== r || e[18] !== f ? (_ = /* @__PURE__ */ n(r, { children: f }), e[17] = r, e[18] = f, e[19] = _) : _ = e[19], _;
+}, be = () => {
+  const t = T.c(1);
+  let e;
+  return t[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (e = /* @__PURE__ */ n(C.Context, { children: Me }), t[0] = e) : e = t[0], e;
+}, U = (t) => {
+  const e = T.c(16), {
+    label: l,
+    value: r,
+    count: i,
+    disabled: c,
+    onValueChange: o
+  } = t, s = String(r);
+  let u;
+  e[0] !== o ? (u = (g) => o(Number(g)), e[0] = o, e[1] = u) : u = e[1];
+  let m;
+  e[2] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (m = {
+    className: "date-input__time-select"
+  }, e[2] = m) : m = e[2];
+  let h;
+  e[3] !== l ? (h = /* @__PURE__ */ n(ue, { "aria-label": l }), e[3] = l, e[4] = h) : h = e[4];
+  let d;
+  e[5] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (d = /* @__PURE__ */ n(Q, { size: 13 }), e[5] = d) : d = e[5];
+  let f;
+  e[6] !== h ? (f = /* @__PURE__ */ n(me, { asChild: !0, children: /* @__PURE__ */ n(fe, { paddingSize: "xxs", justify: "start", children: /* @__PURE__ */ b(ee, { justify: "space-between", w: "100%", align: "center", children: [
+    h,
+    d
+  ] }) }) }), e[6] = h, e[7] = f) : f = e[7];
+  let _;
+  e[8] !== i ? (_ = /* @__PURE__ */ n(ie, { children: /* @__PURE__ */ n(ae, { position: "item-aligned", children: /* @__PURE__ */ n(ce, { children: Array.from({
+    length: i
+  }, Oe) }) }) }), e[8] = i, e[9] = _) : _ = e[9];
+  let p;
+  return e[10] !== c || e[11] !== s || e[12] !== u || e[13] !== f || e[14] !== _ ? (p = /* @__PURE__ */ b(de, { value: s, disabled: c, onValueChange: u, wrapperComponent: m, children: [
+    f,
+    _
+  ] }), e[10] = c, e[11] = s, e[12] = u, e[13] = f, e[14] = _, e[15] = p) : p = e[15], p;
+};
+function Te(t, e) {
+  return /* @__PURE__ */ n(C.Segment, { segment: t, className: "date-input__segment" }, e);
+}
+function Ce(t) {
+  return t.getSegments().map(Te);
+}
+function Se(t, e) {
+  return /* @__PURE__ */ n(a.TableHeader, { className: "date-input__table-header", children: t.narrow }, e);
+}
+function ve(t, e) {
+  return /* @__PURE__ */ n(a.TableCell, { value: t, children: /* @__PURE__ */ n(a.TableCellTrigger, { className: "date-input__cell", children: t.day }) }, e);
+}
+function we(t, e) {
+  return /* @__PURE__ */ n(a.TableRow, { children: t.map(ve) }, e);
+}
+function ye(t, e) {
+  return /* @__PURE__ */ n(a.TableCell, { value: t.value, children: /* @__PURE__ */ n(a.TableCellTrigger, { className: "date-input__cell", children: t.label }) }, e);
+}
+function Ne(t, e) {
+  return /* @__PURE__ */ n(a.TableRow, { children: t.map(ye) }, e);
+}
+function Ve(t) {
+  return /* @__PURE__ */ b(H, { children: [
+    /* @__PURE__ */ n(Z, {}),
+    /* @__PURE__ */ n(a.Table, { className: "date-input__table", children: /* @__PURE__ */ n(a.TableBody, { children: t.getMonthsGrid({
+      columns: 4,
+      format: "short"
+    }).map(Ne) }) })
+  ] });
+}
+function xe(t, e) {
+  return /* @__PURE__ */ n(a.TableCell, { value: t.value, children: /* @__PURE__ */ n(a.TableCellTrigger, { className: "date-input__cell", children: t.label }) }, e);
+}
+function De(t, e) {
+  return /* @__PURE__ */ n(a.TableRow, { children: t.map(xe) }, e);
+}
+function Ie(t) {
+  return /* @__PURE__ */ b(H, { children: [
+    /* @__PURE__ */ n(Z, {}),
+    /* @__PURE__ */ n(a.Table, { className: "date-input__table", children: /* @__PURE__ */ n(a.TableBody, { children: t.getYearsGrid({
+      columns: 4
+    }).map(De) }) })
+  ] });
+}
+function $e(t) {
+  return t.type;
+}
+function Re(t, e) {
+  return /* @__PURE__ */ b(F.Fragment, { children: [
+    e > 0 && /* @__PURE__ */ n("span", { className: "date-input__time-separator", children: ":" }),
+    t
+  ] }, e);
+}
+function Me(t) {
+  const e = new Set(t.getSegments().map($e));
+  return /* @__PURE__ */ n(a.Context, { children: (l) => {
+    const r = l.value[0], i = r?.hour ?? 0, c = r?.minute ?? 0, o = r?.second ?? 0, s = l.value.length === 0, u = [];
+    return e.has("hour") && u.push(/* @__PURE__ */ n(U, { label: "Hour", value: i, count: 24, disabled: s, onValueChange: (m) => l.setTime({
+      hour: m,
+      minute: c,
+      second: o
+    }) }, "hour")), e.has("minute") && u.push(/* @__PURE__ */ n(U, { label: "Minute", value: c, count: 60, disabled: s, onValueChange: (m) => l.setTime({
+      hour: i,
+      minute: m,
+      second: o
+    }) }, "minute")), e.has("second") && u.push(/* @__PURE__ */ n(U, { label: "Second", value: o, count: 60, disabled: s, onValueChange: (m) => l.setTime({
+      hour: i,
+      minute: c,
+      second: m
+    }) }, "second")), /* @__PURE__ */ n("div", { className: "date-input__time", children: u.map(Re) });
+  } });
+}
+function Oe(t, e) {
+  return /* @__PURE__ */ n(oe, { value: String(e), children: /* @__PURE__ */ n(se, { children: String(e).padStart(2, "0") }) }, e);
+}
+export {
+  qe as DateInput,
+  Xe as DateInputContent,
+  Je as DateInputControl,
+  Ke as DateInputField,
+  ge as DateInputNextTrigger,
+  pe as DateInputPrevTrigger,
+  Qe as DateInputTrigger
+};

package/dist/components/form/index.d.ts

@@ -1,4 +1,5 @@
 export * from './CheckboxInput';
+export * from './DateInput';
 export * from './EditorInput';
 export * from './EmailInput';
 export * from './FileInput';

package/dist/components/form/index.js

@@ -1,65 +1,73 @@
-import { CheckboxInput as o } from "./CheckboxInput.js";
-import { EditorInput as p } from "./EditorInput.js";
-import { EmailInput as u, emailValidation as I } from "./EmailInput.js";
-import { FileInput as m, FileInputContext as l, FileInputDropzone as x, FileInputHiddenInput as f, FileInputItem as a, FileInputItemDeleteTrigger as F, FileInputItemGroup as d, FileInputItemName as S, FileInputItemPreview as g, FileInputItemPreviewImage as c, FileInputItemSizeText as s, FileInputTrigger as P } from "./FileInput.js";
-import { Input as w } from "./Input.js";
-import { InputDescription as b } from "./InputDescription.js";
-import { InputLabel as V } from "./InputLabel.js";
-import { InputMessage as h } from "./InputMessage.js";
-import { InputSuggestionMenuContent as z, InputSuggestionMenuContentItems as E } from "./InputSuggestion.js";
-import { NumberInput as H } from "./NumberInput.js";
-import { PasswordInput as R, passwordValidation as k } from "./PasswordInput.js";
-import { PinInput as A, PinInputField as L, PinInputHiddenField as j } from "./PinInput.js";
-import { RadioGroup as B } from "./RadioGroup.js";
-import { RadioInput as K } from "./RadioInput.js";
-import { SelectContent as Q, SelectInput as U, SelectItem as W, SelectItemText as X, SelectPortal as Y, SelectTrigger as Z, SelectValue as _, SelectViewport as $ } from "./SelectInput.js";
-import { SwitchInput as te } from "./SwitchInput.js";
-import { TextAreaInput as re } from "./TextAreaInput.js";
-import { TextInput as ne } from "./TextInput.js";
-import { useForm as Ie } from "./useForm.js";
-import { buildDefaultSyntax as me } from "./Input.syntax.hook.js";
+import { CheckboxInput as r } from "./CheckboxInput.js";
+import { DateInput as p, DateInputContent as n, DateInputControl as u, DateInputField as I, DateInputNextTrigger as i, DateInputPrevTrigger as m, DateInputTrigger as l } from "./DateInput.js";
+import { EditorInput as a } from "./EditorInput.js";
+import { EmailInput as g, emailValidation as F } from "./EmailInput.js";
+import { FileInput as S, FileInputContext as c, FileInputDropzone as s, FileInputHiddenInput as D, FileInputItem as T, FileInputItemDeleteTrigger as P, FileInputItemGroup as C, FileInputItemName as w, FileInputItemPreview as b, FileInputItemPreviewImage as V, FileInputItemSizeText as v, FileInputTrigger as M } from "./FileInput.js";
+import { Input as h } from "./Input.js";
+import { InputDescription as E } from "./InputDescription.js";
+import { InputLabel as H } from "./InputLabel.js";
+import { InputMessage as k } from "./InputMessage.js";
+import { InputSuggestionMenuContent as A, InputSuggestionMenuContentItems as L } from "./InputSuggestion.js";
+import { NumberInput as q } from "./NumberInput.js";
+import { PasswordInput as J, passwordValidation as K } from "./PasswordInput.js";
+import { PinInput as Q, PinInputField as U, PinInputHiddenField as W } from "./PinInput.js";
+import { RadioGroup as Y } from "./RadioGroup.js";
+import { RadioInput as _ } from "./RadioInput.js";
+import { SelectContent as ee, SelectInput as te, SelectItem as re, SelectItemText as oe, SelectPortal as pe, SelectTrigger as ne, SelectValue as ue, SelectViewport as Ie } from "./SelectInput.js";
+import { SwitchInput as me } from "./SwitchInput.js";
+import { TextAreaInput as xe } from "./TextAreaInput.js";
+import { TextInput as fe } from "./TextInput.js";
+import { useForm as Fe } from "./useForm.js";
+import { buildDefaultSyntax as Se } from "./Input.syntax.hook.js";
 export {
-  o as CheckboxInput,
-  p as EditorInput,
-  u as EmailInput,
-  m as FileInput,
-  l as FileInputContext,
-  x as FileInputDropzone,
-  f as FileInputHiddenInput,
-  a as FileInputItem,
-  F as FileInputItemDeleteTrigger,
-  d as FileInputItemGroup,
-  S as FileInputItemName,
-  g as FileInputItemPreview,
-  c as FileInputItemPreviewImage,
-  s as FileInputItemSizeText,
-  P as FileInputTrigger,
-  w as Input,
-  b as InputDescription,
-  V as InputLabel,
-  h as InputMessage,
-  z as InputSuggestionMenuContent,
-  E as InputSuggestionMenuContentItems,
-  H as NumberInput,
-  R as PasswordInput,
-  A as PinInput,
-  L as PinInputField,
-  j as PinInputHiddenField,
-  B as RadioGroup,
-  K as RadioInput,
-  Q as SelectContent,
-  U as SelectInput,
-  W as SelectItem,
-  X as SelectItemText,
-  Y as SelectPortal,
-  Z as SelectTrigger,
-  _ as SelectValue,
-  $ as SelectViewport,
-  te as SwitchInput,
-  re as TextAreaInput,
-  ne as TextInput,
-  me as buildDefaultSyntax,
-  I as emailValidation,
-  k as passwordValidation,
-  Ie as useForm
+  r as CheckboxInput,
+  p as DateInput,
+  n as DateInputContent,
+  u as DateInputControl,
+  I as DateInputField,
+  i as DateInputNextTrigger,
+  m as DateInputPrevTrigger,
+  l as DateInputTrigger,
+  a as EditorInput,
+  g as EmailInput,
+  S as FileInput,
+  c as FileInputContext,
+  s as FileInputDropzone,
+  D as FileInputHiddenInput,
+  T as FileInputItem,
+  P as FileInputItemDeleteTrigger,
+  C as FileInputItemGroup,
+  w as FileInputItemName,
+  b as FileInputItemPreview,
+  V as FileInputItemPreviewImage,
+  v as FileInputItemSizeText,
+  M as FileInputTrigger,
+  h as Input,
+  E as InputDescription,
+  H as InputLabel,
+  k as InputMessage,
+  A as InputSuggestionMenuContent,
+  L as InputSuggestionMenuContentItems,
+  q as NumberInput,
+  J as PasswordInput,
+  Q as PinInput,
+  U as PinInputField,
+  W as PinInputHiddenField,
+  Y as RadioGroup,
+  _ as RadioInput,
+  ee as SelectContent,
+  te as SelectInput,
+  re as SelectItem,
+  oe as SelectItemText,
+  pe as SelectPortal,
+  ne as SelectTrigger,
+  ue as SelectValue,
+  Ie as SelectViewport,
+  me as SwitchInput,
+  xe as TextAreaInput,
+  fe as TextInput,
+  Se as buildDefaultSyntax,
+  F as emailValidation,
+  K as passwordValidation,
+  Fe as useForm
 };