@oneplatformdev/ui 0.1.99-beta.214 → 0.1.99-beta.215

package/ScrollArea/ScrollArea.js

@@ -1,33 +1,39 @@
-import { jsxs as s, jsx as l } from "react/jsx-runtime";
+import { jsxs as i, jsx as l } from "react/jsx-runtime";
 import * as o from "@radix-ui/react-scroll-area";
-import { cn as t } from "@oneplatformdev/utils";
-function u({
-  className: e,
-  children: r,
-  ...a
-}) {
-  return /* @__PURE__ */ s(
+import { cn as s } from "@oneplatformdev/utils";
+function m(e) {
+  const {
+    className: r,
+    children: a,
+    slotProps: t,
+    ...c
+  } = e;
+  return /* @__PURE__ */ i(
     o.Root,
     {
       "data-slot": "scroll-area",
-      className: t("relative", e),
-      ...a,
+      className: s("relative", r),
+      ...c,
       children: [
         /* @__PURE__ */ l(
           o.Viewport,
           {
+            ...t?.viewport || {},
             "data-slot": "scroll-area-viewport",
-            className: "focus-visible:ring-ring/50 size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:outline-1",
-            children: r
+            className: s(
+              "focus-visible:ring-ring/50 size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:outline-1",
+              t?.viewport?.className
+            ),
+            children: a
           }
         ),
-        /* @__PURE__ */ l(i, {}),
+        /* @__PURE__ */ l(n, {}),
         /* @__PURE__ */ l(o.Corner, {})
       ]
     }
   );
 }
-function i({
+function n({
   className: e,
   orientation: r = "vertical",
   ...a
@@ -37,7 +43,7 @@ function i({
     {
       "data-slot": "scroll-area-scrollbar",
       orientation: r,
-      className: t(
+      className: s(
         "flex touch-none p-px transition-colors select-none",
         r === "vertical" && "h-full w-2.5 border-l border-l-transparent",
         r === "horizontal" && "h-2.5 flex-col border-t border-t-transparent",
@@ -55,8 +61,8 @@ function i({
   );
 }
 export {
-  u as ScrollArea,
+  m as ScrollArea,
   o as ScrollAreaPrimitive,
-  i as ScrollBar
+  n as ScrollBar
 };
 //# sourceMappingURL=ScrollArea.js.map

package/ScrollArea/ScrollArea.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollArea.js","sources":["../../src/ScrollArea/ScrollArea.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport * as ScrollAreaPrimitive from \"@radix-ui/react-scroll-area\"\n\nimport { cn } from \"@oneplatformdev/utils\"\n\nfunction ScrollArea({\n                      className,\n                      children,\n                      ...props\n                    }: React.ComponentProps<typeof ScrollAreaPrimitive.Root>) {\n  return (\n    <ScrollAreaPrimitive.Root\n      data-slot=\"scroll-area\"\n      className={cn(\"relative\", className)}\n      {...props}\n    >\n      <ScrollAreaPrimitive.Viewport\n        data-slot=\"scroll-area-viewport\"\n        className=\"focus-visible:ring-ring/50 size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:outline-1\"\n      >\n        {children}\n      </ScrollAreaPrimitive.Viewport>\n      <ScrollBar />\n      <ScrollAreaPrimitive.Corner />\n    </ScrollAreaPrimitive.Root>\n  )\n}\n\nfunction ScrollBar({\n                     className,\n                     orientation = \"vertical\",\n                     ...props\n                   }: React.ComponentProps<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>) {\n  return (\n    <ScrollAreaPrimitive.ScrollAreaScrollbar\n      data-slot=\"scroll-area-scrollbar\"\n      orientation={orientation}\n      className={cn(\n        \"flex touch-none p-px transition-colors select-none\",\n        orientation === \"vertical\" &&\n        \"h-full w-2.5 border-l border-l-transparent\",\n        orientation === \"horizontal\" &&\n        \"h-2.5 flex-col border-t border-t-transparent\",\n        className\n      )}\n      {...props}\n    >\n      <ScrollAreaPrimitive.ScrollAreaThumb\n        data-slot=\"scroll-area-thumb\"\n        className=\"bg-border relative flex-1 rounded-full\"\n      />\n    </ScrollAreaPrimitive.ScrollAreaScrollbar>\n  )\n}\n\nexport { ScrollArea, ScrollBar, ScrollAreaPrimitive }\n"],"names":["ScrollArea","className","children","props","jsxs","ScrollAreaPrimitive","cn","jsx","ScrollBar","orientation"],"mappings":";;;AAOA,SAASA,EAAW;AAAA,EACE,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,GAA0D;AAC5E,SACE,gBAAAC;AAAA,IAACC,EAAoB;AAAA,IAApB;AAAA,MACC,aAAU;AAAA,MACV,WAAWC,EAAG,YAAYL,CAAS;AAAA,MAClC,GAAGE;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAI;AAAA,UAACF,EAAoB;AAAA,UAApB;AAAA,YACC,aAAU;AAAA,YACV,WAAU;AAAA,YAET,UAAAH;AAAA,UAAA;AAAA,QAAA;AAAA,0BAEFM,GAAA,EAAU;AAAA,QACX,gBAAAD,EAACF,EAAoB,QAApB,CAAA,CAA2B;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGlC;AAEA,SAASG,EAAU;AAAA,EACE,WAAAP;AAAA,EACA,aAAAQ,IAAc;AAAA,EACd,GAAGN;AACL,GAAyE;AAC1F,SACE,gBAAAI;AAAA,IAACF,EAAoB;AAAA,IAApB;AAAA,MACC,aAAU;AAAA,MACV,aAAAI;AAAA,MACA,WAAWH;AAAA,QACT;AAAA,QACAG,MAAgB,cAChB;AAAA,QACAA,MAAgB,gBAChB;AAAA,QACAR;AAAA,MAAA;AAAA,MAED,GAAGE;AAAA,MAEJ,UAAA,gBAAAI;AAAA,QAACF,EAAoB;AAAA,QAApB;AAAA,UACC,aAAU;AAAA,UACV,WAAU;AAAA,QAAA;AAAA,MAAA;AAAA,IACZ;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"ScrollArea.js","sources":["../../src/ScrollArea/ScrollArea.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport * as ScrollAreaPrimitive from \"@radix-ui/react-scroll-area\"\n\nimport { cn } from \"@oneplatformdev/utils\"\n\nfunction ScrollArea(\n  props: React.ComponentProps<typeof ScrollAreaPrimitive.Root> & {\n    slotProps?: {\n      viewport?: React.ComponentProps<typeof ScrollAreaPrimitive.Viewport>;\n    }\n  }\n) {\n  const {\n    className,\n    children,\n    slotProps,\n    ...rest\n  } = props;\n  return (\n    <ScrollAreaPrimitive.Root\n      data-slot=\"scroll-area\"\n      className={cn(\"relative\", className)}\n      {...rest}\n    >\n      <ScrollAreaPrimitive.Viewport\n        {...slotProps?.viewport || {}}\n        data-slot=\"scroll-area-viewport\"\n        className={cn(\n          \"focus-visible:ring-ring/50 size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:outline-1\",\n          slotProps?.viewport?.className\n        )}\n      >\n        {children}\n      </ScrollAreaPrimitive.Viewport>\n      <ScrollBar />\n      <ScrollAreaPrimitive.Corner />\n    </ScrollAreaPrimitive.Root>\n  )\n}\n\nfunction ScrollBar({\n                     className,\n                     orientation = \"vertical\",\n                     ...props\n                   }: React.ComponentProps<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>) {\n  return (\n    <ScrollAreaPrimitive.ScrollAreaScrollbar\n      data-slot=\"scroll-area-scrollbar\"\n      orientation={orientation}\n      className={cn(\n        \"flex touch-none p-px transition-colors select-none\",\n        orientation === \"vertical\" &&\n        \"h-full w-2.5 border-l border-l-transparent\",\n        orientation === \"horizontal\" &&\n        \"h-2.5 flex-col border-t border-t-transparent\",\n        className\n      )}\n      {...props}\n    >\n      <ScrollAreaPrimitive.ScrollAreaThumb\n        data-slot=\"scroll-area-thumb\"\n        className=\"bg-border relative flex-1 rounded-full\"\n      />\n    </ScrollAreaPrimitive.ScrollAreaScrollbar>\n  )\n}\n\nexport { ScrollArea, ScrollBar, ScrollAreaPrimitive }\n"],"names":["ScrollArea","props","className","children","slotProps","rest","jsxs","ScrollAreaPrimitive","cn","jsx","ScrollBar","orientation"],"mappings":";;;AAOA,SAASA,EACPC,GAKA;AACA,QAAM;AAAA,IACJ,WAAAC;AAAA,IACA,UAAAC;AAAA,IACA,WAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDJ;AACJ,SACE,gBAAAK;AAAA,IAACC,EAAoB;AAAA,IAApB;AAAA,MACC,aAAU;AAAA,MACV,WAAWC,EAAG,YAAYN,CAAS;AAAA,MAClC,GAAGG;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAI;AAAA,UAACF,EAAoB;AAAA,UAApB;AAAA,YACE,GAAGH,GAAW,YAAY,CAAA;AAAA,YAC3B,aAAU;AAAA,YACV,WAAWI;AAAA,cACT;AAAA,cACAJ,GAAW,UAAU;AAAA,YAAA;AAAA,YAGtB,UAAAD;AAAA,UAAA;AAAA,QAAA;AAAA,0BAEFO,GAAA,EAAU;AAAA,QACX,gBAAAD,EAACF,EAAoB,QAApB,CAAA,CAA2B;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGlC;AAEA,SAASG,EAAU;AAAA,EACE,WAAAR;AAAA,EACA,aAAAS,IAAc;AAAA,EACd,GAAGV;AACL,GAAyE;AAC1F,SACE,gBAAAQ;AAAA,IAACF,EAAoB;AAAA,IAApB;AAAA,MACC,aAAU;AAAA,MACV,aAAAI;AAAA,MACA,WAAWH;AAAA,QACT;AAAA,QACAG,MAAgB,cAChB;AAAA,QACAA,MAAgB,gBAChB;AAAA,QACAT;AAAA,MAAA;AAAA,MAED,GAAGD;AAAA,MAEJ,UAAA,gBAAAQ;AAAA,QAACF,EAAoB;AAAA,QAApB;AAAA,UACC,aAAU;AAAA,UACV,WAAU;AAAA,QAAA;AAAA,MAAA;AAAA,IACZ;AAAA,EAAA;AAGN;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oneplatformdev/ui",
-  "version": "0.1.99-beta.214",
+  "version": "0.1.99-beta.215",
   "description": "UI component library for OnePlatform",
   "author": "One Platform Development Team",
   "keywords": [
@@ -106,9 +106,9 @@
     "recharts": "^3.2.0",
     "sonner": "^2.0.7",
     "vaul": "^1.1.2",
-    "@oneplatformdev/tokens": "^0.1.99-beta.214",
-    "@oneplatformdev/utils": "^0.1.99-beta.214",
-    "@oneplatformdev/hooks": "^0.1.99-beta.214"
+    "@oneplatformdev/tokens": "^0.1.99-beta.215",
+    "@oneplatformdev/hooks": "^0.1.99-beta.215",
+    "@oneplatformdev/utils": "^0.1.99-beta.215"
   },
   "scripts": {
     "chromatic": "chromatic"

package/Combobox/ComboboxOptions.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ComboboxOptions.d.ts","sourceRoot":"","sources":["../../src/Combobox/ComboboxOptions.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,yBAAyB,EACzB,qBAAqB,EACtB,MAAM,kBAAkB,CAAC;AAY1B,eAAO,MAAM,mBAAmB,GAAI,IAAI,SAAS,MAAM,EAAE,OAAO,yBAAyB,CAAC,IAAI,CAAC,4CAyE9F,CAAA;AAED,eAAO,MAAM,eAAe,GAAI,IAAI,SAAS,MAAM,EAAE,OAAO,qBAAqB,CAAC,IAAI,CAAC,4CAStF,CAAA"}

package/Combobox/ComboboxOptions.js

@@ -1,75 +0,0 @@
-import { jsx as e, jsxs as u } from "react/jsx-runtime";
-import { useState as b } from "react";
-import { Collapsible as g, CollapsibleTrigger as h, CollapsibleContent as x } from "../Collapsible/Collapsible.js";
-import { ComboboxOptionItem as p } from "./ComboboxOptionItem.js";
-import { ChevronRightIcon as C } from "lucide-react";
-import { cn as s } from "@oneplatformdev/utils";
-import { ButtonIcon as v } from "../ButtonIcon/ButtonIcon.js";
-import "../ButtonIcon/buttonIconVariants.js";
-const m = (n) => {
-  const { option: r, deep: o = 0, defaultNodeOpen: a, defaultNodeDisabled: i, searchTerm: d } = n, [l, c] = b(() => typeof a == "function" ? a(r, o) : a ?? (!!d || !o));
-  return r?.items?.length ? /* @__PURE__ */ u(
-    g,
-    {
-      open: l,
-      onOpenChange: c,
-      "data-opened": l,
-      className: s("group/collapsible"),
-      disabled: typeof i == "function" ? i(r, o) : i ?? !1,
-      children: [
-        /* @__PURE__ */ e(p, { ...n, onCollapseToggle: () => c((t) => !t), children: /* @__PURE__ */ e(h, { asChild: !0, children: /* @__PURE__ */ e(
-          "div",
-          {
-            className: s(
-              "flex items-center justify-end",
-              "inset-0 absolute top-0",
-              !o && "right-2"
-            ),
-            children: /* @__PURE__ */ e(
-              v,
-              {
-                onClick: (t) => {
-                  t?.preventDefault(), t?.stopPropagation(), c((f) => !f);
-                },
-                type: "button",
-                variant: "ghost",
-                color: "secondary",
-                className: s(
-                  "bg-transparent hover:bg-transparent active:bg-transparent focus:bg-transparent"
-                ),
-                icon: /* @__PURE__ */ e(
-                  C,
-                  {
-                    strokeWidth: 2,
-                    className: s(
-                      "text-[#06080D]",
-                      "transition-transform",
-                      l && "rotate-90"
-                    )
-                  }
-                )
-              }
-            )
-          }
-        ) }) }),
-        /* @__PURE__ */ e(x, { children: /* @__PURE__ */ e("div", { className: "flex flex-col gap-0", children: r?.items.map((t) => /* @__PURE__ */ e(
-          m,
-          {
-            ...n,
-            deep: o + 1,
-            option: t
-          },
-          t.value
-        )) }) })
-      ]
-    }
-  ) : /* @__PURE__ */ e(p, { ...n });
-}, B = (n) => {
-  const { options: r = [], ...o } = n;
-  return /* @__PURE__ */ e("div", { className: "flex flex-col gap-0", children: r.map((a) => /* @__PURE__ */ e(m, { ...o, option: a }, a.value)) });
-};
-export {
-  B as ComboboxOptions,
-  m as ComboboxOptionsNode
-};
-//# sourceMappingURL=ComboboxOptions.js.map

package/Combobox/ComboboxOptions.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ComboboxOptions.js","sources":["../../src/Combobox/ComboboxOptions.tsx"],"sourcesContent":["import {\n  IComboboxOptionsNodeProps,\n  IComboboxOptionsProps,\n} from './Combobox.types';\nimport { useState } from 'react';\nimport {\n  Collapsible,\n  CollapsibleContent,\n  CollapsibleTrigger,\n} from '../Collapsible';\nimport { ComboboxOptionItem } from './ComboboxOptionItem';\nimport { ChevronRightIcon } from 'lucide-react';\nimport { cn } from '@oneplatformdev/utils';\nimport { ButtonIcon } from \"../ButtonIcon\";\n\nexport const ComboboxOptionsNode = <Data extends object>(props: IComboboxOptionsNodeProps<Data>) => {\n  const { option, deep = 0, defaultNodeOpen, defaultNodeDisabled, searchTerm } = props;\n\n  const [open, onOpenChange] = useState(() => {\n    const def = !!searchTerm || !deep;\n    return typeof defaultNodeOpen === \"function\"\n      ? defaultNodeOpen(option, deep)\n      : defaultNodeOpen ?? def\n  });\n\n  if (!option?.items?.length) return <ComboboxOptionItem {...props} />;\n  return (\n    <Collapsible\n      open={open}\n      onOpenChange={onOpenChange}\n      data-opened={open}\n      className={cn('group/collapsible')}\n      disabled={typeof defaultNodeDisabled === \"function\"\n        ? defaultNodeDisabled(option, deep)\n        : defaultNodeDisabled ?? false}\n    >\n      <ComboboxOptionItem {...props} onCollapseToggle={() => onOpenChange(prev => !prev)}>\n        <CollapsibleTrigger asChild>\n          <div\n            className={cn(\n              'flex items-center justify-end',\n              'inset-0 absolute top-0',\n              !deep && 'right-2',\n            )}\n          >\n            <ButtonIcon\n              onClick={(e) => {\n                e?.preventDefault();\n                e?.stopPropagation();\n                onOpenChange((prev) => !prev);\n              }}\n              type=\"button\"\n              variant=\"ghost\"\n              color='secondary'\n              className={cn(\n                'bg-transparent hover:bg-transparent active:bg-transparent focus:bg-transparent'\n              )}\n              icon={(\n                <ChevronRightIcon\n                  strokeWidth={2}\n                  className={cn(\n                    'text-[#06080D]',\n                    'transition-transform',\n                    open && 'rotate-90'\n                  )}\n                />\n              )}\n            />\n          </div>\n        </CollapsibleTrigger>\n      </ComboboxOptionItem>\n\n      <CollapsibleContent>\n        <div className=\"flex flex-col gap-0\">\n          {option?.items.map((opt) => {\n            return (\n              <ComboboxOptionsNode\n                key={opt.value}\n                {...props}\n                deep={deep + 1}\n                option={opt}\n              />\n            );\n          })}\n        </div>\n      </CollapsibleContent>\n    </Collapsible>\n  );\n}\n\nexport const ComboboxOptions = <Data extends object>(props: IComboboxOptionsProps<Data>) => {\n  const { options = [], ...rest } = props;\n  return (\n    <div className=\"flex flex-col gap-0\">\n      {options.map((option) => (\n        <ComboboxOptionsNode key={option.value} {...rest} option={option} />\n      ))}\n    </div>\n  );\n}\n"],"names":["ComboboxOptionsNode","props","option","deep","defaultNodeOpen","defaultNodeDisabled","searchTerm","open","onOpenChange","useState","jsxs","Collapsible","cn","jsx","ComboboxOptionItem","prev","CollapsibleTrigger","ButtonIcon","e","ChevronRightIcon","CollapsibleContent","opt","ComboboxOptions","options","rest"],"mappings":";;;;;;;;AAeO,MAAMA,IAAsB,CAAsBC,MAA2C;AAClG,QAAM,EAAE,QAAAC,GAAQ,MAAAC,IAAO,GAAG,iBAAAC,GAAiB,qBAAAC,GAAqB,YAAAC,MAAeL,GAEzE,CAACM,GAAMC,CAAY,IAAIC,EAAS,MAE7B,OAAOL,KAAoB,aAC9BA,EAAgBF,GAAQC,CAAI,IAC5BC,MAHQ,CAAC,CAACE,KAAc,CAACH,EAI9B;AAED,SAAKD,GAAQ,OAAO,SAElB,gBAAAQ;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAJ;AAAA,MACA,cAAAC;AAAA,MACA,eAAaD;AAAA,MACb,WAAWK,EAAG,mBAAmB;AAAA,MACjC,UAAU,OAAOP,KAAwB,aACrCA,EAAoBH,GAAQC,CAAI,IAChCE,KAAuB;AAAA,MAE3B,UAAA;AAAA,QAAA,gBAAAQ,EAACC,GAAA,EAAoB,GAAGb,GAAO,kBAAkB,MAAMO,EAAa,CAAAO,MAAQ,CAACA,CAAI,GAC/E,UAAA,gBAAAF,EAACG,GAAA,EAAmB,SAAO,IACzB,UAAA,gBAAAH;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWD;AAAA,cACT;AAAA,cACA;AAAA,cACA,CAACT,KAAQ;AAAA,YAAA;AAAA,YAGX,UAAA,gBAAAU;AAAA,cAACI;AAAA,cAAA;AAAA,gBACC,SAAS,CAACC,MAAM;AACd,kBAAAA,GAAG,eAAA,GACHA,GAAG,gBAAA,GACHV,EAAa,CAACO,MAAS,CAACA,CAAI;AAAA,gBAC9B;AAAA,gBACA,MAAK;AAAA,gBACL,SAAQ;AAAA,gBACR,OAAM;AAAA,gBACN,WAAWH;AAAA,kBACT;AAAA,gBAAA;AAAA,gBAEF,MACE,gBAAAC;AAAA,kBAACM;AAAA,kBAAA;AAAA,oBACC,aAAa;AAAA,oBACb,WAAWP;AAAA,sBACT;AAAA,sBACA;AAAA,sBACAL,KAAQ;AAAA,oBAAA;AAAA,kBACV;AAAA,gBAAA;AAAA,cACF;AAAA,YAAA;AAAA,UAEJ;AAAA,QAAA,GAEJ,EAAA,CACF;AAAA,QAEA,gBAAAM,EAACO,GAAA,EACC,UAAA,gBAAAP,EAAC,OAAA,EAAI,WAAU,uBACZ,UAAAX,GAAQ,MAAM,IAAI,CAACmB,MAEhB,gBAAAR;AAAA,UAACb;AAAA,UAAA;AAAA,YAEE,GAAGC;AAAA,YACJ,MAAME,IAAO;AAAA,YACb,QAAQkB;AAAA,UAAA;AAAA,UAHHA,EAAI;AAAA,QAAA,CAMd,GACH,EAAA,CACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,IA5D+B,gBAAAR,EAACC,GAAA,EAAoB,GAAGb,GAAO;AA+DpE,GAEaqB,IAAkB,CAAsBrB,MAAuC;AAC1F,QAAM,EAAE,SAAAsB,IAAU,CAAA,GAAI,GAAGC,MAASvB;AAClC,2BACG,OAAA,EAAI,WAAU,uBACZ,UAAAsB,EAAQ,IAAI,CAACrB,MACZ,gBAAAW,EAACb,GAAA,EAAwC,GAAGwB,GAAM,QAAAtB,EAAA,GAAxBA,EAAO,KAAiC,CACnE,GACH;AAEJ;"}