@harnessio/ui 1.0.0 → 1.0.2

package/dist/components.d.ts

@@ -13,6 +13,7 @@ import { CheckboxTreeGroupProps as CheckboxTreeGroupProps_2 } from './checkbox-t
 import { CheckboxTreeItemProps as CheckboxTreeItemProps_2 } from './checkbox-tree-types';
 import { CheckboxTreeRootProps as CheckboxTreeRootProps_2 } from './checkbox-tree-types';
 import { ClassAttributes } from 'react';
+import { ClassNames } from 'react-day-picker';
 import { ClassProp } from 'class-variance-authority/types';
 import { ClipboardEventHandler } from 'react';
 import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
@@ -28,6 +29,7 @@ import { Context } from 'react';
 import { CSSProperties } from 'react';
 import { DateRange } from 'react-day-picker';
 import { DayPicker } from 'react-day-picker';
+import { DayPickerRangeProps } from 'react-day-picker';
 import { default as default_2 } from 'react';
 import { default as default_3 } from 'embla-carousel-react';
 import { DetailedHTMLProps } from 'react';
@@ -1392,11 +1394,15 @@ export declare interface DataTableProps<TData> {
     /* Excluded from this release type: _enableColumnResizing */
 }
 
+export declare type DateRangeCalendarProps = Omit<DayPickerRangeProps, 'mode' | 'numberOfMonths' | 'selected' | 'onSelect' | 'month' | 'onMonthChange' | 'classNames'>;
+
 export declare interface DateRangeFilterOptionConfig<T extends string = string> extends FilterOptionConfigBase<T, DateRangeValue> {
     type: FilterFieldTypes.DateRange;
     filterFieldConfig?: {
         presets?: DateRangePreset[];
         showCustomRange?: boolean;
+        calendarProps?: DateRangeCalendarProps;
+        calendarClassNames?: ClassNames;
     };
 }
 

package/dist/components.js

@@ -1,6 +1,6 @@
 import { A as e, B as t, j as o, E as r, k as i, r as n, L as l, S as b, s as p, t as c, c as g } from "./index-D5R6ImST.js";
 import { B as m, x as d, I as S, y as T, r as C, z as I, T as h, v as F, h as y, E as V, F as D, w as P } from "./button-Cp3s42Ug.js";
-import { bJ as A, G as B, A as M, t as x, v as w, o as f, p as v, bg as k, I as N, bs as E, ad as W, c8 as R, Y as G, V as H, bm as O, an as _, aP as U, aQ as z, aS as K, aR as j, c2 as X, aa as q, ab as J, b5 as Q, z as Y, q as Z, F as $, am as aa, al as sa, C as ea, Z as ta, ah as oa, bd as ra, g as ia, bp as na, at as la, Q as ba, O as pa, bj as ca, bq as ga, br as ua, aJ as ma, D as da, j as Sa, cd as Ta, bk as Ca, bT as Ia, _ as ha, b4 as Fa, af as ya, f as Va, ai as Da, c9 as Pa, ae as La, aB as Aa, aA as Ba, aC as Ma, az as xa, b3 as wa, bf as fa, a7 as va, bS as ka, a2 as Na, a4 as Ea, a3 as Wa, ak as Ra, bK as Ga, H as Ha, E as Oa, bb as _a, aq as Ua, a9 as za, ca as Ka, X as ja, $ as Xa, bN as qa, bO as Ja, bM as Qa, a0 as Ya, l as Za, L as $a, M as as, ap as ss, cb as es, r as ts, a1 as os, aT as rs, a6 as is, ay as ns, ax as ls, aF as bs, bl as ps, N as cs, aO as gs, n as us, bQ as ms, c7 as ds, P as Ss, R as Ts, b_ as Cs, k as Is, aN as hs, as as Fs, a$ as ys, a_ as Vs, aU as Ds, aZ as Ps, aV as Ls, aW as As, aX as Bs, aY as Ms, ac as xs, b0 as ws, be as fs, b6 as vs, bZ as ks, aL as Ns, aK as Es, c5 as Ws, bW as Rs, B as Gs, bR as Hs, w as Os, c6 as _s, a8 as Us, aM as zs, aw as Ks, b as js, bE as Xs, bx as qs, c3 as Js, aH as Qs, c4 as Ys, y as Zs, bi as $s, S as ae, J as se, K as ee, av as te, bh as oe, c as re, aG as ie, bA as ne, bv as le, d as be, cc as pe, bB as ce, bC as ge, au as ue, a as me, bo as de, T as Se, bc as Te, bP as Ce, a5 as Ie, bH as he, b9 as Fe, b8 as ye, ba as Ve, c1 as De, ar as Pe, b2 as Le, bF as Ae, U as Be, bu as Me, bt as xe, bG as we, bw as fe, m as ve, W as ke, h as Ne, aj as Ee, bX as We, ao as Re, bI as Ge, bV as He, bY as Oe, bL as _e, b$ as Ue, aE as ze, aD as Ke, bU as je, bD as Xe, bz as qe, by as Je, e as Qe, s as Ye, bn as Ze, c0 as $e, ag as at, ce as st, b7 as et, b1 as tt, x as ot, u as rt, aI as it } from "./index-BbncWvla.js";
+import { bJ as A, G as B, A as M, t as x, v as w, o as f, p as v, bg as k, I as N, bs as E, ad as W, c8 as R, Y as G, V as H, bm as O, an as _, aP as U, aQ as z, aS as K, aR as j, c2 as X, aa as q, ab as J, b5 as Q, z as Y, q as Z, F as $, am as aa, al as sa, C as ea, Z as ta, ah as oa, bd as ra, g as ia, bp as na, at as la, Q as ba, O as pa, bj as ca, bq as ga, br as ua, aJ as ma, D as da, j as Sa, cd as Ta, bk as Ca, bT as Ia, _ as ha, b4 as Fa, af as ya, f as Va, ai as Da, c9 as Pa, ae as La, aB as Aa, aA as Ba, aC as Ma, az as xa, b3 as wa, bf as fa, a7 as va, bS as ka, a2 as Na, a4 as Ea, a3 as Wa, ak as Ra, bK as Ga, H as Ha, E as Oa, bb as _a, aq as Ua, a9 as za, ca as Ka, X as ja, $ as Xa, bN as qa, bO as Ja, bM as Qa, a0 as Ya, l as Za, L as $a, M as as, ap as ss, cb as es, r as ts, a1 as os, aT as rs, a6 as is, ay as ns, ax as ls, aF as bs, bl as ps, N as cs, aO as gs, n as us, bQ as ms, c7 as ds, P as Ss, R as Ts, b_ as Cs, k as Is, aN as hs, as as Fs, a$ as ys, a_ as Vs, aU as Ds, aZ as Ps, aV as Ls, aW as As, aX as Bs, aY as Ms, ac as xs, b0 as ws, be as fs, b6 as vs, bZ as ks, aL as Ns, aK as Es, c5 as Ws, bW as Rs, B as Gs, bR as Hs, w as Os, c6 as _s, a8 as Us, aM as zs, aw as Ks, b as js, bE as Xs, bx as qs, c3 as Js, aH as Qs, c4 as Ys, y as Zs, bi as $s, S as ae, J as se, K as ee, av as te, bh as oe, c as re, aG as ie, bA as ne, bv as le, d as be, cc as pe, bB as ce, bC as ge, au as ue, a as me, bo as de, T as Se, bc as Te, bP as Ce, a5 as Ie, bH as he, b9 as Fe, b8 as ye, ba as Ve, c1 as De, ar as Pe, b2 as Le, bF as Ae, U as Be, bu as Me, bt as xe, bG as we, bw as fe, m as ve, W as ke, h as Ne, aj as Ee, bX as We, ao as Re, bI as Ge, bV as He, bY as Oe, bL as _e, b$ as Ue, aE as ze, aD as Ke, bU as je, bD as Xe, bz as qe, by as Je, e as Qe, s as Ye, bn as Ze, c0 as $e, ag as at, ce as st, b7 as et, b1 as tt, x as ot, u as rt, aI as it } from "./index-D6QR6swS.js";
 import { L as lt, T as bt, b as pt, d as ct, e as gt, f as ut, t as mt } from "./toggle-group-XLnJ7UgK.js";
 export {
   A as AccentColor,

package/dist/{index-BbncWvla.js → index-D6QR6swS.js}

@@ -5256,7 +5256,7 @@ const x5 = ge(
     return /* @__PURE__ */ U("div", { className: q("cn-drawer-header", e), ref: o, ...i, children: [
       (!!l.length || !!s) && /* @__PURE__ */ U("div", { className: "cn-drawer-header-top gap-cn-xs flex items-center", children: [
         s,
-        /* @__PURE__ */ _("div", { className: "cn-drawer-header-title flex-1", children: l }),
+        /* @__PURE__ */ _("div", { className: "cn-drawer-header-title flex-1 overflow-hidden", children: l }),
         !a && /* @__PURE__ */ _(Er.Close, { asChild: !0, children: /* @__PURE__ */ _(Je, { className: "cn-drawer-close-button", variant: "ghost", iconOnly: !0, ignoreIconOnlyTooltip: !0, children: /* @__PURE__ */ _(pe, { className: "cn-drawer-close-button-icon", name: "xmark", skipSize: !0 }) }) })
       ] }),
       c
@@ -170741,26 +170741,34 @@ const _T = (e, t) => {
       );
     }) })
   ] })
-] }), Dke = ({ filter: e, presets: t, showCustomRange: n = !0, onUpdateFilter: r }) => {
-  const [a, i] = he(
+] }), Dke = ({
+  filter: e,
+  presets: t,
+  showCustomRange: n = !0,
+  onUpdateFilter: r,
+  calendarProps: a,
+  calendarClassNames: i
+}) => {
+  const [o, s] = he(
     e.value ? { from: new Date(e.value.from), to: new Date(e.value.to) } : void 0
-  ), [o, s] = he(e.value ? new Date(e.value.from) : /* @__PURE__ */ new Date());
+  ), [l, c] = he(e.value ? new Date(e.value.from) : /* @__PURE__ */ new Date());
   be(() => {
-    e.value ? (i({ from: new Date(e.value.from), to: new Date(e.value.to) }), s(new Date(e.value.from))) : (i(void 0), s(/* @__PURE__ */ new Date()));
+    e.value ? (s({ from: new Date(e.value.from), to: new Date(e.value.to) }), c(new Date(e.value.from))) : (s(void 0), c(/* @__PURE__ */ new Date()));
   }, [e.value]);
-  const l = t ?? Ike(), c = l.filter((f) => f.group === "recommended"), u = l.filter((f) => f.group === "relative"), d = l.filter((f) => f.group === "calendar"), p = (f) => {
-    const E = f.getRange();
-    i({ from: E.from, to: E.to }), r({ from: E.from, to: E.to, preset: f.value });
-  }, g = /* @__PURE__ */ _(
+  const u = t ?? Ike(), d = u.filter((h) => h.group === "recommended"), p = u.filter((h) => h.group === "relative"), m = u.filter((h) => h.group === "calendar"), g = (h) => {
+    const b = h.getRange();
+    s({ from: b.from, to: b.to }), r({ from: b.from, to: b.to, preset: h.value });
+  }, E = /* @__PURE__ */ _(
     gp,
     {
+      ...a,
       mode: "range",
       numberOfMonths: 2,
-      selected: a,
-      month: o,
-      onMonthChange: s,
-      onSelect: (f) => {
-        i(f), f != null && f.from && (f != null && f.to) && r({ from: f.from, to: f.to, preset: "CUSTOM" });
+      selected: o,
+      month: l,
+      onMonthChange: c,
+      onSelect: (h) => {
+        s(h), h != null && h.from && (h != null && h.to) && r({ from: h.from, to: h.to, preset: "CUSTOM" });
       },
       classNames: {
         months: "flex flex-row space-x-cn-md",
@@ -170769,19 +170777,20 @@ const _T = (e, t) => {
           "[&:has(>.day-range-end)]:rounded-r-cn-3 [&:has(>.day-range-start)]:rounded-l-cn-3 first:[&:has([aria-selected])]:rounded-l-cn-3 last:[&:has([aria-selected])]:rounded-r-cn-3",
           "[&:has([aria-selected])]:bg-cn-brand-primary/10 [&:has([aria-selected].day-outside)]:bg-cn-brand-primary/5 [&:has([aria-selected].day-range-end)]:rounded-r-cn-3"
         ),
-        day_range_middle: "aria-selected:bg-transparent aria-selected:text-cn-1"
+        day_range_middle: "aria-selected:bg-transparent aria-selected:text-cn-1",
+        ...i
       }
     }
   );
   return /* @__PURE__ */ _(
     Oke,
     {
-      recommendedPresets: c,
-      relativePresets: u,
-      calendarPresets: d,
+      recommendedPresets: d,
+      relativePresets: p,
+      calendarPresets: m,
       showCustomRange: n,
-      onPresetSelect: p,
-      calendarContent: g
+      onPresetSelect: g,
+      calendarContent: E
     }
   );
 }, wke = xt("cn-multi-select-container", {
@@ -171110,7 +171119,7 @@ const Mke = (e, t) => {
   onUpdateFilter: n,
   setIsOpen: r
 }) => {
-  var i, o, s, l;
+  var i, o, s, l, c, u;
   const a = Ae(() => `filter-${Math.random().toString(36).slice(2, 11)}`, []);
   if (!n) return null;
   switch (t.type) {
@@ -171119,8 +171128,8 @@ const Mke = (e, t) => {
         yke,
         {
           filter: e,
-          onUpdateFilter: (u) => {
-            n(u), u && r(!1);
+          onUpdateFilter: (p) => {
+            n(p), p && r(!1);
           }
         }
       );
@@ -171131,8 +171140,10 @@ const Mke = (e, t) => {
           filter: e,
           presets: (i = t.filterFieldConfig) == null ? void 0 : i.presets,
           showCustomRange: (o = t.filterFieldConfig) == null ? void 0 : o.showCustomRange,
-          onUpdateFilter: (u) => {
-            n(u), u && r(!1);
+          calendarProps: (s = t.filterFieldConfig) == null ? void 0 : s.calendarProps,
+          calendarClassNames: (l = t.filterFieldConfig) == null ? void 0 : l.calendarClassNames,
+          onUpdateFilter: (p) => {
+            n(p), p && r(!1);
           }
         }
       );
@@ -171141,7 +171152,7 @@ const Mke = (e, t) => {
         Lke,
         {
           filter: e,
-          onUpdateFilter: (u) => n(u),
+          onUpdateFilter: (p) => n(p),
           handleEnter: () => r(!1)
         }
       );
@@ -171151,49 +171162,49 @@ const Mke = (e, t) => {
         {
           filterValue: e.value,
           ...t.filterFieldConfig,
-          onUpdateFilter: (u) => {
-            n(u);
+          onUpdateFilter: (p) => {
+            n(p);
           }
         }
       );
     case zn.MultiSelect: {
-      const c = e;
+      const d = e;
       return /* @__PURE__ */ _(
         Rke,
         {
           ...t.filterFieldConfig,
-          filter: c.value || [],
-          filterOption: ((s = t.filterFieldConfig) == null ? void 0 : s.options) || [],
-          onUpdateFilter: (u) => n(u)
+          filter: d.value || [],
+          filterOption: ((c = t.filterFieldConfig) == null ? void 0 : c.options) || [],
+          onUpdateFilter: (p) => n(p)
         }
       );
     }
     case zn.Custom: {
-      const c = e;
+      const d = e;
       return t.filterFieldConfig.renderCustomComponent({
-        value: c.value,
-        onChange: (u) => n(u)
+        value: d.value,
+        onChange: (p) => n(p)
       });
     }
     case zn.Checkbox: {
-      const c = e, u = `checkbox-${a}`;
+      const d = e, p = `checkbox-${a}`;
       return /* @__PURE__ */ U(
         Sr,
         {
           optional: !0,
           className: "rounded-cn-3 bg-cn-gray-secondary border-cn-gray-outline cursor-pointer border px-cn-md py-cn-xs [&>.cn-label-text]:flex [&>.cn-label-text]:items-center [&>.cn-label-text]:gap-x-cn-2xs",
-          htmlFor: u,
+          htmlFor: p,
           children: [
             /* @__PURE__ */ _(
               ji,
               {
-                id: u,
-                checked: c.value,
-                onCheckedChange: (d) => n(d),
+                id: p,
+                checked: d.value,
+                onCheckedChange: (m) => n(m),
                 className: "relative z-[1]"
               }
             ),
-            (l = t.filterFieldConfig) == null ? void 0 : l.label
+            (u = t.filterFieldConfig) == null ? void 0 : u.label
           ]
         }
       );
@@ -171203,7 +171214,7 @@ const Mke = (e, t) => {
         xke,
         {
           filter: e.value || [],
-          onUpdateFilter: (u) => n(u),
+          onUpdateFilter: (p) => n(p),
           filterFieldConfig: t.filterFieldConfig
         }
       );
@@ -181667,4 +181678,4 @@ export {
   zle as y,
   ea as z
 };
-//# sourceMappingURL=index-BbncWvla.js.map
+//# sourceMappingURL=index-D6QR6swS.js.map