@oneplatformdev/ui 0.1.99-beta.272 → 0.1.99-beta.274

package/Combobox/ComboboxRenderTrigger.js

@@ -1,25 +1,25 @@
-import { jsx as r, jsxs as p, Fragment as b } from "react/jsx-runtime";
-import { DEFAULT_COMBOBOX_TYPE as h } from "./Combobox.types.js";
-import { cn as d } from "@oneplatformdev/utils";
+import { jsx as r, jsxs as p, Fragment as h } from "react/jsx-runtime";
+import { DEFAULT_COMBOBOX_TYPE as g } from "./Combobox.types.js";
+import { cn as u } from "@oneplatformdev/utils";
 import { XIcon as f, ChevronDown as v } from "lucide-react";
 import { useMemo as w } from "react";
 import { PopoverTrigger as x } from "../Popover/Popover.js";
 import { Button as y } from "../Button/Button.js";
 import { LoadingMask as C } from "../LoadingMask/LoadingMask.js";
-import { ScrollArea as N } from "../ScrollArea/ScrollArea.js";
-const g = (o) => {
+import { ScrollArea as F } from "../ScrollArea/ScrollArea.js";
+const b = (o) => {
   const { value: n, flattenOptions: a = [], selectedOptions: t = /* @__PURE__ */ new Map() } = o;
   return w(() => {
     if (!n) return [];
-    const c = Array.from(t.values()), l = Array.isArray(n) ? n : [n], u = [...a.filter((i) => l.find((s) => String(s).toLowerCase() === String(i.value).toLowerCase())), ...c].reduce((i, s) => (!s || i.has(s.value) || i.set(s.value, { ...s, label: s.label || s.value }), i), /* @__PURE__ */ new Map());
-    return u.size ? Array.from(u.values()) : l.map((i) => ({ value: i, label: String(i) }));
+    const c = Array.from(t.values()), l = Array.isArray(n) ? n : [n], d = [...a.filter((i) => l.find((s) => String(s).toLowerCase() === String(i.value).toLowerCase())), ...c].reduce((i, s) => (!s || i.has(s.value) || i.set(s.value, { ...s, label: s.label || s.value }), i), /* @__PURE__ */ new Map());
+    return d.size ? Array.from(d.values()) : l.map((i) => ({ value: i, label: String(i) }));
   }, [n, a, t]);
-}, k = (o) => {
-  const { type: n = h, placeholder: a, onSelect: t, open: c } = o, l = g(o);
+}, N = (o) => {
+  const { type: n = g, placeholder: a, onSelect: t, open: c } = o, l = b(o);
   return l.length ? n === "single" ? /* @__PURE__ */ r("span", { className: "truncate overflow-hidden whitespace-nowrap break-words line-clamp-1 pr-8", children: l[0].label }) : n === "multi" ? /* @__PURE__ */ r(
-    N,
+    F,
     {
-      className: d(
+      className: u(
         "w-full h-auto min-h-5 max-h-20.25",
         "overflow-y-auto overflow-x-hidden"
       ),
@@ -31,7 +31,7 @@ const g = (o) => {
       children: /* @__PURE__ */ r("div", { className: "p-0 gap-1 flex flex-wrap w-full pr-11", children: l.map((e) => e ? /* @__PURE__ */ p(
         "div",
         {
-          className: d(
+          className: u(
             "flex items-center justify-center",
             "py-1 px-2 min-h-5 w-fit gap-1",
             "bg-[#9368FF] rounded-sm",
@@ -39,8 +39,8 @@ const g = (o) => {
             "cursor-pointer",
             "truncate"
           ),
-          onClick: (u) => {
-            c && (u.preventDefault(), u.stopPropagation(), t?.(e));
+          onClick: (d) => {
+            c && (d.preventDefault(), d.stopPropagation(), t?.(e));
           },
           children: [
             /* @__PURE__ */ r("span", { className: "whitespace-pre-wrap wrap-break-word line-clamp-1", children: e.label }),
@@ -57,7 +57,7 @@ const g = (o) => {
     "div",
     {
       ...l,
-      className: d(
+      className: u(
         "absolute top-1/2 -translate-y-1/2 right-1",
         "flex items-center justify-center",
         "w-10 h-10 [&_svg]:size-5!",
@@ -71,8 +71,8 @@ const g = (o) => {
       children: n
     }
   );
-}, A = (o) => {
-  const { open: n, onClearSelections: a } = o, t = g(o);
+}, k = (o) => {
+  const { open: n, onClearSelections: a } = o, t = b(o);
   return n ? t.length ? /* @__PURE__ */ r(m, { onClick: () => a?.(), children: /* @__PURE__ */ r(f, {}) }) : null : /* @__PURE__ */ r(m, { prevented: !1, children: /* @__PURE__ */ r(v, {}) });
 }, E = (o) => {
   const {
@@ -90,13 +90,13 @@ const g = (o) => {
       color: "secondary",
       role: "combobox",
       "aria-expanded": a,
-      className: d(
+      className: u(
         "relative w-full justify-between bg-transparent",
         !e && "font-normal text-sm",
         "border border-border",
-        a && "border-1 outline-hidden ring-1 ring-ring",
+        a && "border-1 border-[#9368FF] outline-hidden ring-0 hover:border-[#9368FF] hover:bg-transparent",
         n === "multi" && "pr-0",
-        "focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring",
+        "focus-visible:outline-hidden focus-visible:ring-0 focus-visible:border-[#9368FF]",
         e && "p-0",
         e && a && "p-0 border-1 ring-0 ring-transparent"
       ),
@@ -104,9 +104,9 @@ const g = (o) => {
       children: [
         t && /* @__PURE__ */ r(C, { fullWidth: !0 }),
         !t && e && e(c),
-        !t && !e && /* @__PURE__ */ p(b, { children: [
-          /* @__PURE__ */ r(k, { ...o }),
-          /* @__PURE__ */ r(A, { ...o })
+        !t && !e && /* @__PURE__ */ p(h, { children: [
+          /* @__PURE__ */ r(N, { ...o }),
+          /* @__PURE__ */ r(k, { ...o })
         ] })
       ]
     }

package/Combobox/ComboboxRenderTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxRenderTrigger.js","sources":["../../src/Combobox/ComboboxRenderTrigger.tsx"],"sourcesContent":["import {\r\n  ComboboxCallbackStateParamsRenderHandler,\r\n  ComboboxCallbackStateParamsUnion,\r\n  ComboboxOption,\r\n  ComboboxProps, ComboboxSelectedType,\r\n  DEFAULT_COMBOBOX_TYPE\r\n} from \"./Combobox.types\";\r\nimport { Button } from \"../Button\";\r\nimport { cn } from \"@oneplatformdev/utils\";\r\nimport { LoadingMask } from \"../LoadingMask\";\r\nimport { ChevronDown, XIcon } from \"lucide-react\";\r\nimport { PopoverTrigger } from \"../Popover\";\r\nimport { HTMLAttributes, useMemo } from \"react\";\r\nimport { ScrollArea } from \"../ScrollArea\";\r\n\r\ntype ComboboxRenderTriggerProps<Data extends object = object> = {\r\n  type: ComboboxSelectedType,\r\n  value: ComboboxProps<Data, 'single'>['value'] | ComboboxProps<Data, 'multi'>['value'];\r\n  open: boolean;\r\n  initialLoading: boolean;\r\n  flattenOptions: ComboboxOption<Data>[];\r\n  selectedOptions?: Map<ComboboxOption<Data>['value'], ComboboxOption<Data>>;\r\n  onSelect?: (option: ComboboxOption<Data>) => void;\r\n  onClearSelections?: () => void;\r\n\r\n  callbackStateParams: ComboboxCallbackStateParamsUnion<Data>;\r\n  renderTrigger?: ComboboxCallbackStateParamsRenderHandler<Data>;\r\n\r\n  placeholder?: string;\r\n  disabled?: boolean;\r\n}\r\n\r\nconst useValues = <Data extends object>(\r\n  props: ComboboxRenderTriggerProps<Data>\r\n): ComboboxOption<Data>[] => {\r\n  const { value, flattenOptions = [], selectedOptions = new Map() } = props;\r\n  return useMemo(() => {\r\n    if (!value) return [];\r\n    const selectedOption = Array.from(selectedOptions.values());\r\n    const vls = Array.isArray(value) ? value : [ value ];\r\n    const flattenedOptionValues = flattenOptions.filter(o => {\r\n      return vls.find(v => String(v).toLowerCase() === String(o.value).toLowerCase())\r\n    });\r\n\r\n    const labels = [ ...flattenedOptionValues, ...selectedOption ]\r\n      .reduce<Map<ComboboxOption<Data>['value'], ComboboxOption<Data>>>((acc, o) => {\r\n        if (!o) return acc;\r\n        if (acc.has(o.value)) return acc;\r\n        acc.set(o.value, { ...o, label: o.label || o.value });\r\n        return acc;\r\n      }, new Map())\r\n    if (!labels.size) return vls.map(v => ({ value: v, label: String(v) }));\r\n    return Array.from(labels.values());\r\n  }, [ value, flattenOptions, selectedOptions ])\r\n}\r\n\r\nconst ComboboxRenderTriggerLabel = <Data extends object = object>(\r\n  props: ComboboxRenderTriggerProps<Data>\r\n) => {\r\n  const { type = DEFAULT_COMBOBOX_TYPE, placeholder, onSelect, open } = props;\r\n  const values = useValues(props);\r\n\r\n  if (!values.length) {\r\n    return (\r\n      <span className=\"text-gray-400 whitespace-pre-wrap break-words line-clamp-1 pr-11\">\r\n        {placeholder}\r\n      </span>\r\n    )\r\n  }\r\n\r\n  if (type === 'single') {\r\n    return (\r\n      <span className=\"truncate overflow-hidden whitespace-nowrap break-words line-clamp-1 pr-8\">\r\n        {values[0].label}\r\n      </span>\r\n    )\r\n  }\r\n\r\n  if (type === 'multi') {\r\n    return (\r\n      <ScrollArea\r\n        className={cn(\r\n          \"w-full h-auto min-h-5 max-h-20.25\",\r\n          'overflow-y-auto overflow-x-hidden',\r\n        )}\r\n        slotProps={{\r\n          viewport: {\r\n            className: '[&>div]:block!',\r\n          }\r\n        }}\r\n      >\r\n        <div className=\"p-0 gap-1 flex flex-wrap w-full pr-11\">\r\n          {values.map((item) => {\r\n            if (!item) return null;\r\n            return (\r\n              <div\r\n                key={item.value}\r\n                className={cn(\r\n                  'flex items-center justify-center',\r\n                  'py-1 px-2 min-h-5 w-fit gap-1',\r\n                  'bg-[#9368FF] rounded-sm',\r\n                  'text-[#FCFCFC] leading-none text-xs font-semibold',\r\n                  'cursor-pointer',\r\n                  'truncate',\r\n                )}\r\n                onClick={(e) => {\r\n                  if(!open) return;\r\n                  e.preventDefault();\r\n                  e.stopPropagation();\r\n                  onSelect?.(item)\r\n                }}\r\n              >\r\n                <span className='whitespace-pre-wrap wrap-break-word line-clamp-1'>\r\n                  {item.label}\r\n                </span>\r\n                <XIcon className='size-3! shrink-0 text-white!'/>\r\n              </div>\r\n            );\r\n          })}\r\n        </div>\r\n      </ScrollArea>\r\n    )\r\n  }\r\n\r\n  return 'No supported to render'\r\n}\r\n\r\nconst EndAdornmentWrapper = (\r\n  props: HTMLAttributes<HTMLDivElement> & {\r\n    prevented?: boolean;\r\n  }\r\n) => {\r\n  const { children, prevented = true, onClick, className, ...rest } = props;\r\n  return (\r\n    <div\r\n      {...rest}\r\n      className={cn(\r\n        'absolute top-1/2 -translate-y-1/2 right-1',\r\n        'flex items-center justify-center',\r\n        'w-10 h-10 [&_svg]:size-5!',\r\n        'opacity-50 cursor-pointer hover:opacity-100',\r\n        className,\r\n      )}\r\n      onClick={(e) => {\r\n        if (!prevented) return onClick?.(e);\r\n        e.stopPropagation();\r\n        e.preventDefault();\r\n        onClick?.(e);\r\n      }}\r\n    >\r\n      {children}\r\n    </div>\r\n  )\r\n}\r\nconst ComboboxRenderTriggerEndAdornment = <Data extends object = object>(\r\n  props: ComboboxRenderTriggerProps<Data>\r\n) => {\r\n  const { open, onClearSelections } = props;\r\n  const values = useValues(props);\r\n\r\n  if (!open) {\r\n    return (\r\n      <EndAdornmentWrapper prevented={false}>\r\n        <ChevronDown/>\r\n      </EndAdornmentWrapper>\r\n    )\r\n  }\r\n\r\n  if (!values.length) return null\r\n\r\n  return (\r\n    <EndAdornmentWrapper onClick={() => onClearSelections?.()}>\r\n      <XIcon/>\r\n    </EndAdornmentWrapper>\r\n  )\r\n}\r\n\r\nexport const ComboboxRenderTrigger = <Data extends object>(\r\n  props: ComboboxRenderTriggerProps<Data>\r\n) => {\r\n  const {\r\n    type,\r\n    open,\r\n    initialLoading,\r\n    callbackStateParams,\r\n    disabled,\r\n    renderTrigger,\r\n  } = props;\r\n\r\n  return (\r\n    <PopoverTrigger asChild className=\"border-input\">\r\n      <Button\r\n        variant={renderTrigger ? 'none' : 'contained'}\r\n        color='secondary'\r\n        role=\"combobox\"\r\n        aria-expanded={open}\r\n        className={cn(\r\n          'relative w-full justify-between bg-transparent',\r\n          !renderTrigger && 'font-normal text-sm',\r\n          'border border-border',\r\n          open && 'border-1 outline-hidden ring-1 ring-ring',\r\n          type === 'multi' && 'pr-0',\r\n          'focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring',\r\n          renderTrigger && 'p-0',\r\n          renderTrigger && open && 'p-0 border-1 ring-0 ring-transparent',\r\n        )}\r\n        disabled={disabled || initialLoading}\r\n      >\r\n        {initialLoading && <LoadingMask fullWidth/>}\r\n        {!initialLoading && renderTrigger && renderTrigger(callbackStateParams)}\r\n        {!initialLoading && !renderTrigger && (\r\n          <>\r\n            <ComboboxRenderTriggerLabel {...props} />\r\n            <ComboboxRenderTriggerEndAdornment {...props} />\r\n          </>\r\n        )}\r\n      </Button>\r\n    </PopoverTrigger>\r\n  )\r\n}\r\n"],"names":["useValues","props","value","flattenOptions","selectedOptions","useMemo","selectedOption","vls","labels","o","v","acc","ComboboxRenderTriggerLabel","type","DEFAULT_COMBOBOX_TYPE","placeholder","onSelect","open","values","jsx","ScrollArea","cn","item","jsxs","e","XIcon","EndAdornmentWrapper","children","prevented","onClick","className","rest","ComboboxRenderTriggerEndAdornment","onClearSelections","ChevronDown","ComboboxRenderTrigger","initialLoading","callbackStateParams","disabled","renderTrigger","PopoverTrigger","Button","LoadingMask","Fragment"],"mappings":"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"}
+{"version":3,"file":"ComboboxRenderTrigger.js","sources":["../../src/Combobox/ComboboxRenderTrigger.tsx"],"sourcesContent":["import {\r\n  ComboboxCallbackStateParamsRenderHandler,\r\n  ComboboxCallbackStateParamsUnion,\r\n  ComboboxOption,\r\n  ComboboxProps, ComboboxSelectedType,\r\n  DEFAULT_COMBOBOX_TYPE\r\n} from \"./Combobox.types\";\r\nimport { Button } from \"../Button\";\r\nimport { cn } from \"@oneplatformdev/utils\";\r\nimport { LoadingMask } from \"../LoadingMask\";\r\nimport { ChevronDown, XIcon } from \"lucide-react\";\r\nimport { PopoverTrigger } from \"../Popover\";\r\nimport { HTMLAttributes, useMemo } from \"react\";\r\nimport { ScrollArea } from \"../ScrollArea\";\r\n\r\ntype ComboboxRenderTriggerProps<Data extends object = object> = {\r\n  type: ComboboxSelectedType,\r\n  value: ComboboxProps<Data, 'single'>['value'] | ComboboxProps<Data, 'multi'>['value'];\r\n  open: boolean;\r\n  initialLoading: boolean;\r\n  flattenOptions: ComboboxOption<Data>[];\r\n  selectedOptions?: Map<ComboboxOption<Data>['value'], ComboboxOption<Data>>;\r\n  onSelect?: (option: ComboboxOption<Data>) => void;\r\n  onClearSelections?: () => void;\r\n\r\n  callbackStateParams: ComboboxCallbackStateParamsUnion<Data>;\r\n  renderTrigger?: ComboboxCallbackStateParamsRenderHandler<Data>;\r\n\r\n  placeholder?: string;\r\n  disabled?: boolean;\r\n}\r\n\r\nconst useValues = <Data extends object>(\r\n  props: ComboboxRenderTriggerProps<Data>\r\n): ComboboxOption<Data>[] => {\r\n  const { value, flattenOptions = [], selectedOptions = new Map() } = props;\r\n  return useMemo(() => {\r\n    if (!value) return [];\r\n    const selectedOption = Array.from(selectedOptions.values());\r\n    const vls = Array.isArray(value) ? value : [ value ];\r\n    const flattenedOptionValues = flattenOptions.filter(o => {\r\n      return vls.find(v => String(v).toLowerCase() === String(o.value).toLowerCase())\r\n    });\r\n\r\n    const labels = [ ...flattenedOptionValues, ...selectedOption ]\r\n      .reduce<Map<ComboboxOption<Data>['value'], ComboboxOption<Data>>>((acc, o) => {\r\n        if (!o) return acc;\r\n        if (acc.has(o.value)) return acc;\r\n        acc.set(o.value, { ...o, label: o.label || o.value });\r\n        return acc;\r\n      }, new Map())\r\n    if (!labels.size) return vls.map(v => ({ value: v, label: String(v) }));\r\n    return Array.from(labels.values());\r\n  }, [ value, flattenOptions, selectedOptions ])\r\n}\r\n\r\nconst ComboboxRenderTriggerLabel = <Data extends object = object>(\r\n  props: ComboboxRenderTriggerProps<Data>\r\n) => {\r\n  const { type = DEFAULT_COMBOBOX_TYPE, placeholder, onSelect, open } = props;\r\n  const values = useValues(props);\r\n\r\n  if (!values.length) {\r\n    return (\r\n      <span className=\"text-gray-400 whitespace-pre-wrap break-words line-clamp-1 pr-11\">\r\n        {placeholder}\r\n      </span>\r\n    )\r\n  }\r\n\r\n  if (type === 'single') {\r\n    return (\r\n      <span className=\"truncate overflow-hidden whitespace-nowrap break-words line-clamp-1 pr-8\">\r\n        {values[0].label}\r\n      </span>\r\n    )\r\n  }\r\n\r\n  if (type === 'multi') {\r\n    return (\r\n      <ScrollArea\r\n        className={cn(\r\n          \"w-full h-auto min-h-5 max-h-20.25\",\r\n          'overflow-y-auto overflow-x-hidden',\r\n        )}\r\n        slotProps={{\r\n          viewport: {\r\n            className: '[&>div]:block!',\r\n          }\r\n        }}\r\n      >\r\n        <div className=\"p-0 gap-1 flex flex-wrap w-full pr-11\">\r\n          {values.map((item) => {\r\n            if (!item) return null;\r\n            return (\r\n              <div\r\n                key={item.value}\r\n                className={cn(\r\n                  'flex items-center justify-center',\r\n                  'py-1 px-2 min-h-5 w-fit gap-1',\r\n                  'bg-[#9368FF] rounded-sm',\r\n                  'text-[#FCFCFC] leading-none text-xs font-semibold',\r\n                  'cursor-pointer',\r\n                  'truncate',\r\n                )}\r\n                onClick={(e) => {\r\n                  if(!open) return;\r\n                  e.preventDefault();\r\n                  e.stopPropagation();\r\n                  onSelect?.(item)\r\n                }}\r\n              >\r\n                <span className='whitespace-pre-wrap wrap-break-word line-clamp-1'>\r\n                  {item.label}\r\n                </span>\r\n                <XIcon className='size-3! shrink-0 text-white!'/>\r\n              </div>\r\n            );\r\n          })}\r\n        </div>\r\n      </ScrollArea>\r\n    )\r\n  }\r\n\r\n  return 'No supported to render'\r\n}\r\n\r\nconst EndAdornmentWrapper = (\r\n  props: HTMLAttributes<HTMLDivElement> & {\r\n    prevented?: boolean;\r\n  }\r\n) => {\r\n  const { children, prevented = true, onClick, className, ...rest } = props;\r\n  return (\r\n    <div\r\n      {...rest}\r\n      className={cn(\r\n        'absolute top-1/2 -translate-y-1/2 right-1',\r\n        'flex items-center justify-center',\r\n        'w-10 h-10 [&_svg]:size-5!',\r\n        'opacity-50 cursor-pointer hover:opacity-100',\r\n        className,\r\n      )}\r\n      onClick={(e) => {\r\n        if (!prevented) return onClick?.(e);\r\n        e.stopPropagation();\r\n        e.preventDefault();\r\n        onClick?.(e);\r\n      }}\r\n    >\r\n      {children}\r\n    </div>\r\n  )\r\n}\r\nconst ComboboxRenderTriggerEndAdornment = <Data extends object = object>(\r\n  props: ComboboxRenderTriggerProps<Data>\r\n) => {\r\n  const { open, onClearSelections } = props;\r\n  const values = useValues(props);\r\n\r\n  if (!open) {\r\n    return (\r\n      <EndAdornmentWrapper prevented={false}>\r\n        <ChevronDown/>\r\n      </EndAdornmentWrapper>\r\n    )\r\n  }\r\n\r\n  if (!values.length) return null\r\n\r\n  return (\r\n    <EndAdornmentWrapper onClick={() => onClearSelections?.()}>\r\n      <XIcon/>\r\n    </EndAdornmentWrapper>\r\n  )\r\n}\r\n\r\nexport const ComboboxRenderTrigger = <Data extends object>(\r\n  props: ComboboxRenderTriggerProps<Data>\r\n) => {\r\n  const {\r\n    type,\r\n    open,\r\n    initialLoading,\r\n    callbackStateParams,\r\n    disabled,\r\n    renderTrigger,\r\n  } = props;\r\n\r\n  return (\r\n    <PopoverTrigger asChild className=\"border-input\">\r\n      <Button\r\n        variant={renderTrigger ? 'none' : 'contained'}\r\n        color='secondary'\r\n        role=\"combobox\"\r\n        aria-expanded={open}\r\n        className={cn(\r\n          'relative w-full justify-between bg-transparent',\r\n          !renderTrigger && 'font-normal text-sm',\r\n          'border border-border',\r\n          open && 'border-1 border-[#9368FF] outline-hidden ring-0 hover:border-[#9368FF] hover:bg-transparent',\r\n          type === 'multi' && 'pr-0',\r\n          'focus-visible:outline-hidden focus-visible:ring-0 focus-visible:border-[#9368FF]',\r\n          renderTrigger && 'p-0',\r\n          renderTrigger && open && 'p-0 border-1 ring-0 ring-transparent',\r\n        )}\r\n        disabled={disabled || initialLoading}\r\n      >\r\n        {initialLoading && <LoadingMask fullWidth/>}\r\n        {!initialLoading && renderTrigger && renderTrigger(callbackStateParams)}\r\n        {!initialLoading && !renderTrigger && (\r\n          <>\r\n            <ComboboxRenderTriggerLabel {...props} />\r\n            <ComboboxRenderTriggerEndAdornment {...props} />\r\n          </>\r\n        )}\r\n      </Button>\r\n    </PopoverTrigger>\r\n  )\r\n}\r\n"],"names":["useValues","props","value","flattenOptions","selectedOptions","useMemo","selectedOption","vls","labels","o","v","acc","ComboboxRenderTriggerLabel","type","DEFAULT_COMBOBOX_TYPE","placeholder","onSelect","open","values","jsx","ScrollArea","cn","item","jsxs","e","XIcon","EndAdornmentWrapper","children","prevented","onClick","className","rest","ComboboxRenderTriggerEndAdornment","onClearSelections","ChevronDown","ComboboxRenderTrigger","initialLoading","callbackStateParams","disabled","renderTrigger","PopoverTrigger","Button","LoadingMask","Fragment"],"mappings":"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"}

package/DatePicker/DatePicker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../src/DatePicker/DatePicker.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAErD,eAAO,MAAM,UAAU,2FAyCtB,CAAC"}
+{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../src/DatePicker/DatePicker.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAErD,eAAO,MAAM,UAAU,2FA4CtB,CAAC"}

package/DatePicker/DatePicker.js

@@ -1,53 +1,55 @@
-import { jsxs as o, jsx as r } from "react/jsx-runtime";
-import * as i from "react";
-import { format as d } from "date-fns";
-import { Calendar as s } from "lucide-react";
-import { cn as c } from "@oneplatformdev/utils";
-import { uk as t } from "date-fns/locale";
-import { Button as f } from "../Button/Button.js";
-import { Calendar as p } from "../Calendar/Calendar.js";
-import { Popover as u, PopoverTrigger as h, PopoverContent as y } from "../Popover/Popover.js";
-const g = i.forwardRef(
-  (a, l) => {
+import { jsxs as t, jsx as e } from "react/jsx-runtime";
+import * as a from "react";
+import { format as c } from "date-fns";
+import { Calendar as f } from "lucide-react";
+import { cn as p } from "@oneplatformdev/utils";
+import { uk as n } from "date-fns/locale";
+import { Button as u } from "../Button/Button.js";
+import { Calendar as h } from "../Calendar/Calendar.js";
+import { Popover as g, PopoverTrigger as b, PopoverContent as y } from "../Popover/Popover.js";
+const v = a.forwardRef(
+  (i, l) => {
     const {
-      selectedDate: e,
-      onDateChange: m,
-      disabled: n = !1
-    } = a;
-    return /* @__PURE__ */ o(u, { children: [
-      /* @__PURE__ */ r(h, { asChild: !0, children: /* @__PURE__ */ o(
-        f,
+      selectedDate: o,
+      onDateChange: s,
+      disabled: d = !1
+    } = i, [r, m] = a.useState(!1);
+    return /* @__PURE__ */ t(g, { open: r, onOpenChange: m, children: [
+      /* @__PURE__ */ e(b, { asChild: !0, children: /* @__PURE__ */ t(
+        u,
         {
           ref: l,
-          disabled: n,
+          disabled: d,
           variant: "outline-solid",
-          className: c(
+          className: p(
             "w-full justify-start text-left font-normal border h-10",
-            !e && "text-muted-foreground"
+            !o && "text-muted-foreground",
+            "focus-visible:outline-hidden focus-visible:ring-0 focus-visible:border-[#9368FF]",
+            r && "outline-hidden ring-0 border-[#9368FF]"
           ),
           children: [
-            e ? d(e, "LLL dd, y", { locale: t }) : /* @__PURE__ */ r("span", { children: "dd/mm/yyyy" }),
-            /* @__PURE__ */ r(s, { className: "mr-2 h-4 w-4 ml-auto" })
+            o ? c(o, "LLL dd, y", { locale: n }) : /* @__PURE__ */ e("span", { children: "dd/mm/yyyy" }),
+            /* @__PURE__ */ e(f, { className: "mr-2 h-4 w-4 ml-auto" })
           ]
         }
       ) }),
-      /* @__PURE__ */ r(y, { align: "start", className: "w-auto p-0", children: /* @__PURE__ */ r(
-        p,
+      /* @__PURE__ */ e(y, { align: "start", className: "w-auto p-0", children: /* @__PURE__ */ e(
+        h,
         {
           mode: "single",
           captionLayout: "dropdown-buttons",
-          selected: e,
-          onSelect: m,
+          selected: o,
+          onSelect: s,
           fromYear: 1960,
           toYear: 2030,
-          locale: t
+          locale: n
         }
       ) })
     ] });
   }
 );
-g.displayName = "DatePicker";
+v.displayName = "DatePicker";
 export {
-  g as DatePicker
+  v as DatePicker
 };
 //# sourceMappingURL=DatePicker.js.map

package/DatePicker/DatePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.js","sources":["../../src/DatePicker/DatePicker.tsx"],"sourcesContent":["'use client';\r\n\r\nimport * as React from 'react';\r\nimport { format } from 'date-fns';\r\nimport { Calendar as CalendarIcon } from 'lucide-react';\r\nimport { cn } from '@oneplatformdev/utils';\r\nimport { Button } from '../Button';\r\nimport { Calendar } from '../Calendar';\r\nimport { Popover, PopoverContent, PopoverTrigger } from '../Popover';\r\nimport { uk } from 'date-fns/locale';\r\nimport { DatePickerProps } from './DatePicker.types';\r\n\r\nexport const DatePicker = React.forwardRef<HTMLButtonElement, DatePickerProps>(\r\n  (props, ref) => {\r\n    const {\r\n      selectedDate,\r\n      onDateChange,\r\n      disabled = false\r\n    } = props;\r\n    return (\r\n      <Popover>\r\n        <PopoverTrigger asChild>\r\n          <Button\r\n            ref={ref}\r\n            disabled={disabled}\r\n            variant={'outline-solid'}\r\n            className={cn(\r\n              'w-full justify-start text-left font-normal border h-10',\r\n              !selectedDate && 'text-muted-foreground'\r\n            )}\r\n          >\r\n            {selectedDate ? (\r\n              format(selectedDate, 'LLL dd, y', { locale: uk })\r\n            ) : (\r\n              <span>dd/mm/yyyy</span>\r\n            )}\r\n            <CalendarIcon className=\"mr-2 h-4 w-4 ml-auto\" />\r\n          </Button>\r\n        </PopoverTrigger>\r\n        <PopoverContent align=\"start\" className=\"w-auto p-0\">\r\n          <Calendar\r\n            mode=\"single\"\r\n            captionLayout=\"dropdown-buttons\"\r\n            selected={selectedDate}\r\n            onSelect={onDateChange}\r\n            fromYear={1960}\r\n            toYear={2030}\r\n            locale={uk}\r\n          />\r\n        </PopoverContent>\r\n      </Popover>\r\n    );\r\n  }\r\n);\r\n\r\nDatePicker.displayName = 'DatePicker';\r\n"],"names":["DatePicker","React","props","ref","selectedDate","onDateChange","disabled","Popover","jsx","PopoverTrigger","jsxs","Button","cn","format","uk","CalendarIcon","PopoverContent","Calendar"],"mappings":";;;;;;;;;AAYO,MAAMA,IAAaC,EAAM;AAAA,EAC9B,CAACC,GAAOC,MAAQ;AACd,UAAM;AAAA,MACJ,cAAAC;AAAA,MACA,cAAAC;AAAA,MACA,UAAAC,IAAW;AAAA,IAAA,IACTJ;AACJ,6BACGK,GAAA,EACC,UAAA;AAAA,MAAA,gBAAAC,EAACC,GAAA,EAAe,SAAO,IACrB,UAAA,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,KAAAR;AAAA,UACA,UAAAG;AAAA,UACA,SAAS;AAAA,UACT,WAAWM;AAAA,YACT;AAAA,YACA,CAACR,KAAgB;AAAA,UAAA;AAAA,UAGlB,UAAA;AAAA,YAAAA,IACCS,EAAOT,GAAc,aAAa,EAAE,QAAQU,GAAI,IAEhD,gBAAAN,EAAC,QAAA,EAAK,UAAA,aAAA,CAAU;AAAA,YAElB,gBAAAA,EAACO,GAAA,EAAa,WAAU,uBAAA,CAAuB;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA,GAEnD;AAAA,MACA,gBAAAP,EAACQ,GAAA,EAAe,OAAM,SAAQ,WAAU,cACtC,UAAA,gBAAAR;AAAA,QAACS;AAAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,eAAc;AAAA,UACd,UAAUb;AAAA,UACV,UAAUC;AAAA,UACV,UAAU;AAAA,UACV,QAAQ;AAAA,UACR,QAAQS;AAAA,QAAA;AAAA,MAAA,EACV,CACF;AAAA,IAAA,GACF;AAAA,EAEJ;AACF;AAEAd,EAAW,cAAc;"}
+{"version":3,"file":"DatePicker.js","sources":["../../src/DatePicker/DatePicker.tsx"],"sourcesContent":["'use client';\r\n\r\nimport * as React from 'react';\r\nimport { format } from 'date-fns';\r\nimport { Calendar as CalendarIcon } from 'lucide-react';\r\nimport { cn } from '@oneplatformdev/utils';\r\nimport { Button } from '../Button';\r\nimport { Calendar } from '../Calendar';\r\nimport { Popover, PopoverContent, PopoverTrigger } from '../Popover';\r\nimport { uk } from 'date-fns/locale';\r\nimport { DatePickerProps } from './DatePicker.types';\r\n\r\nexport const DatePicker = React.forwardRef<HTMLButtonElement, DatePickerProps>(\r\n  (props, ref) => {\r\n    const {\r\n      selectedDate,\r\n      onDateChange,\r\n      disabled = false\r\n    } = props;\r\n    const [open, setOpen] = React.useState(false);\r\n    return (\r\n      <Popover open={open} onOpenChange={setOpen}>\r\n        <PopoverTrigger asChild>\r\n          <Button\r\n            ref={ref}\r\n            disabled={disabled}\r\n            variant={'outline-solid'}\r\n            className={cn(\r\n              'w-full justify-start text-left font-normal border h-10',\r\n              !selectedDate && 'text-muted-foreground',\r\n              'focus-visible:outline-hidden focus-visible:ring-0 focus-visible:border-[#9368FF]',\r\n              open && 'outline-hidden ring-0 border-[#9368FF]'\r\n            )}\r\n          >\r\n            {selectedDate ? (\r\n              format(selectedDate, 'LLL dd, y', { locale: uk })\r\n            ) : (\r\n              <span>dd/mm/yyyy</span>\r\n            )}\r\n            <CalendarIcon className=\"mr-2 h-4 w-4 ml-auto\" />\r\n          </Button>\r\n        </PopoverTrigger>\r\n        <PopoverContent align=\"start\" className=\"w-auto p-0\">\r\n          <Calendar\r\n            mode=\"single\"\r\n            captionLayout=\"dropdown-buttons\"\r\n            selected={selectedDate}\r\n            onSelect={onDateChange}\r\n            fromYear={1960}\r\n            toYear={2030}\r\n            locale={uk}\r\n          />\r\n        </PopoverContent>\r\n      </Popover>\r\n    );\r\n  }\r\n);\r\n\r\nDatePicker.displayName = 'DatePicker';\r\n\r\n"],"names":["DatePicker","React","props","ref","selectedDate","onDateChange","disabled","open","setOpen","jsxs","Popover","jsx","PopoverTrigger","Button","cn","format","uk","CalendarIcon","PopoverContent","Calendar"],"mappings":";;;;;;;;;AAYO,MAAMA,IAAaC,EAAM;AAAA,EAC9B,CAACC,GAAOC,MAAQ;AACd,UAAM;AAAA,MACJ,cAAAC;AAAA,MACA,cAAAC;AAAA,MACA,UAAAC,IAAW;AAAA,IAAA,IACTJ,GACE,CAACK,GAAMC,CAAO,IAAIP,EAAM,SAAS,EAAK;AAC5C,WACE,gBAAAQ,EAACC,GAAA,EAAQ,MAAAH,GAAY,cAAcC,GACjC,UAAA;AAAA,MAAA,gBAAAG,EAACC,GAAA,EAAe,SAAO,IACrB,UAAA,gBAAAH;AAAA,QAACI;AAAA,QAAA;AAAA,UACC,KAAAV;AAAA,UACA,UAAAG;AAAA,UACA,SAAS;AAAA,UACT,WAAWQ;AAAA,YACT;AAAA,YACA,CAACV,KAAgB;AAAA,YACjB;AAAA,YACAG,KAAQ;AAAA,UAAA;AAAA,UAGT,UAAA;AAAA,YAAAH,IACCW,EAAOX,GAAc,aAAa,EAAE,QAAQY,GAAI,IAEhD,gBAAAL,EAAC,QAAA,EAAK,UAAA,aAAA,CAAU;AAAA,YAElB,gBAAAA,EAACM,GAAA,EAAa,WAAU,uBAAA,CAAuB;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA,GAEnD;AAAA,MACA,gBAAAN,EAACO,GAAA,EAAe,OAAM,SAAQ,WAAU,cACtC,UAAA,gBAAAP;AAAA,QAACQ;AAAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,eAAc;AAAA,UACd,UAAUf;AAAA,UACV,UAAUC;AAAA,UACV,UAAU;AAAA,UACV,QAAQ;AAAA,UACR,QAAQW;AAAA,QAAA;AAAA,MAAA,EACV,CACF;AAAA,IAAA,GACF;AAAA,EAEJ;AACF;AAEAhB,EAAW,cAAc;"}