@fluidattacks/design 3.1.11 → 3.1.13

package/dist/components/icon/index.js

@@ -1,10 +1,108 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),o=require("react"),e=require("styled-components"),r=require("../../styles-C2CoGJl7.js"),i={xl:"96px",lg:"64px",md:"32px",sm:"24px",xs:"16px",xxs:"12px",xxss:"10px"},s=e.styled(r.BaseSpanComponent)`
-  ${({$clickable:n,$color:o="inherit",$disabled:e=!1,$hoverColor:r,$rotation:s,$size:t,$secondaryColor:a})=>`\n      color: ${o};\n      cursor: ${n?"pointer":"inherit"};\n      font-size: ${i[t]};\n      line-height: 0;\n      vertical-align: middle;\n      pointer-events: inherit;\n      opacity: ${e?"0.5":"1"};\n\n      > svg {\n        --fa-secondary-color: ${a};\n        transform: ${void 0===s?"":`rotate(${s}deg)`};\n      }\n\n      .fill-gradient-01 path {\n        fill: url(/gradients.svg#gradient-01);\n        fill: url(#gradient-01);\n      }\n      .fill-gradient-02 path {\n        fill: url(/gradients.svg#gradient-02);\n        fill: url(#gradient-02);\n      }\n\n      ${n?`&:hover {\n              filter: ${r?"":"brightness(50%)"};\n              color: ${r??""};\n            }`:""}\n    `}
-`;e.styled.div`
+import { jsx as $ } from "react/jsx-runtime";
+import { forwardRef as v } from "react";
+import { styled as c } from "styled-components";
+import { c as b } from "../../styles-CplEd2kw.mjs";
+const y = {
+  xl: "96px",
+  lg: "64px",
+  md: "32px",
+  sm: "24px",
+  xs: "16px",
+  xxs: "12px",
+  xxss: "10px"
+}, z = c(b)`
+  ${({
+  $clickable: i,
+  $color: o = "inherit",
+  $disabled: a = !1,
+  $hoverColor: e,
+  $rotation: r,
+  $size: n,
+  $secondaryColor: s
+}) => {
+  const t = e ? "" : "brightness(50%)", l = e ?? "";
+  return `
+      color: ${o};
+      cursor: ${i ? "pointer" : "inherit"};
+      font-size: ${y[n]};
+      line-height: 0;
+      vertical-align: middle;
+      pointer-events: inherit;
+      opacity: ${a ? "0.5" : "1"};
+
+      > svg {
+        --fa-secondary-color: ${s};
+        transform: ${r === void 0 ? "" : `rotate(${r}deg)`};
+      }
+
+      .fill-gradient-01 path {
+        fill: url(/gradients.svg#gradient-01);
+        fill: url(#gradient-01);
+      }
+      .fill-gradient-02 path {
+        fill: url(/gradients.svg#gradient-02);
+        fill: url(#gradient-02);
+      }
+
+      ${i ? `&:hover {
+              filter: ${t};
+              color: ${l};
+            }` : ""}
+    `;
+}}
+`;
+c.div`
   cursor: pointer;
   transition: all 0.2s ease-in-out;
 
   &:hover:not([disabled]) {
     transform: scale(1.2);
   }
-`;const t=o.forwardRef((function({clickable:o,disabled:e,hoverColor:r,icon:i,iconClass:t="",iconColor:a,iconMask:l,iconSize:c,iconTransform:d,iconType:$="fa-solid",onClick:f,rotation:p,spanClass:g,secondaryColor:x,...u},v){return n.jsx(s,{$clickable:o,$color:a,$disabled:e,$hoverColor:r,$rotation:p,$secondaryColor:x,$size:c,className:g,"data-testid":`${i}-icon`,onClick:f,ref:v,...u,children:n.jsx("i",{className:`${$} fa-${i} ${t}`,...void 0!==l?{"data-fa-mask":l}:{},...void 0!==d?{"data-fa-transform":d}:{}})},`${$}-${i}`)}));exports.Icon=t;
+`;
+const w = v(function({
+  clickable: o,
+  disabled: a,
+  hoverColor: e,
+  icon: r,
+  iconClass: n = "",
+  iconColor: s,
+  iconMask: t,
+  iconSize: l,
+  iconTransform: d,
+  iconType: f = "fa-solid",
+  onClick: p,
+  rotation: m,
+  spanClass: g,
+  secondaryColor: x,
+  ...h
+}, u) {
+  return /* @__PURE__ */ $(
+    z,
+    {
+      $clickable: o,
+      $color: s,
+      $disabled: a,
+      $hoverColor: e,
+      $rotation: m,
+      $secondaryColor: x,
+      $size: l,
+      className: g,
+      "data-testid": `${r}-icon`,
+      onClick: p,
+      ref: u,
+      ...h,
+      children: /* @__PURE__ */ $(
+        "i",
+        {
+          className: `${f} fa-${r} ${n}`,
+          ...t !== void 0 ? { "data-fa-mask": t } : {},
+          ...d !== void 0 ? { "data-fa-transform": d } : {}
+        }
+      )
+    },
+    `${f}-${r}`
+  );
+});
+export {
+  w as Icon
+};

package/dist/components/icon-button/index.js

@@ -1,3 +1,76 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("react"),n=require("styled-components"),r=require("../../styles--Elze-LV.js"),t=require("../icon/index.js"),o=require("../../index-CmylnDrF.js"),a=n.styled(r.StyledButton)`
-  ${({theme:e,$borderRadius:i="4px",$px:n=.5,$py:r=.5})=>`\n    --btn-spacing: ${i};\n    --btn-padding-x: ${e.spacing[n]};\n    --btn-padding-y: ${e.spacing[r]};\n\n    align-items: center;\n    line-height: 0;\n    text-align: center;\n\n    > span {\n      margin: 0 !important;\n    }\n  `}
-`,c=i.forwardRef((function({borderRadius:i,disabled:n,icon:r,iconColor:c,iconSize:s="xxs",iconTransform:d,iconType:l,id:p,justify:u="center",onClick:y,px:x,py:b,type:$="button",tooltip:g,tooltipPlace:j,value:m,variant:f="primary",...q},v){const T=e.jsx(a,{$borderRadius:i,$px:x,$py:b,$variant:f,"aria-disabled":n,"aria-label":p,borderRadius:i,disabled:n,id:p,justify:u,onClick:y,ref:v,type:$,value:m,...q,children:e.jsx(t.Icon,{clickable:!1,icon:r,iconColor:c,iconSize:s,iconTransform:d,iconType:l})}),h=($+(f??"")+(p??r)).replace(/ /u,"_");return void 0===g?T:e.jsx(o.Tooltip,{id:`${h}-tooltip`,place:j,tip:g,children:T})}));exports.IconButton=c;
+import { jsx as i } from "react/jsx-runtime";
+import { forwardRef as S } from "react";
+import { styled as T } from "styled-components";
+import { S as j } from "../../styles-B2N0JLw1.mjs";
+import { Icon as k } from "../icon/index.js";
+import { T as w } from "../../index-DwznImvK.mjs";
+const R = T(j)`
+  ${({ theme: r, $borderRadius: t = "4px", $px: n = 0.5, $py: o = 0.5 }) => `
+    --btn-spacing: ${t};
+    --btn-padding-x: ${r.spacing[n]};
+    --btn-padding-y: ${r.spacing[o]};
+
+    align-items: center;
+    line-height: 0;
+    text-align: center;
+
+    > span {
+      margin: 0 !important;
+    }
+  `}
+`, E = S(function({
+  borderRadius: t,
+  disabled: n,
+  icon: o,
+  iconColor: m,
+  iconSize: s = "xxs",
+  iconTransform: f,
+  iconType: d,
+  id: a,
+  justify: g = "center",
+  onClick: u,
+  px: $,
+  py: x,
+  type: e = "button",
+  tooltip: c,
+  tooltipPlace: b,
+  value: y,
+  variant: p = "primary",
+  ...B
+}, I) {
+  const l = /* @__PURE__ */ i(
+    R,
+    {
+      $borderRadius: t,
+      $px: $,
+      $py: x,
+      $variant: p,
+      "aria-disabled": n,
+      "aria-label": a,
+      borderRadius: t,
+      disabled: n,
+      id: a,
+      justify: g,
+      onClick: u,
+      ref: I,
+      type: e,
+      value: y,
+      ...B,
+      children: /* @__PURE__ */ i(
+        k,
+        {
+          clickable: !1,
+          icon: o,
+          iconColor: m,
+          iconSize: s,
+          iconTransform: f,
+          iconType: d
+        }
+      )
+    }
+  ), h = (e + (p ?? "") + (a ?? o)).replace(/ /u, "_");
+  return c === void 0 ? l : /* @__PURE__ */ i(w, { id: `${h}-tooltip`, place: b, tip: c, children: l });
+});
+export {
+  E as IconButton
+};

package/dist/components/indicator-card/index.js

@@ -1 +1,74 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("lodash"),t=require("styled-components"),r=require("../container/index.js"),n=require("../../index-CmylnDrF.js"),d=require("../typography/heading/index.js");require("../typography/span/index.js");const o=require("../typography/text/index.js");exports.IndicatorCard=({description:s,height:a="auto",leftIconName:l,children:p,rightIconName:c,title:x,tooltipId:g,tooltipTip:h,tooltipPlace:y="bottom",variant:u="centered",width:f="318px"})=>{const j=t.useTheme(),m="centered"===u,v=e.jsx(n.Tooltip,{icon:c??l,iconColor:j.palette.gray[800],id:g,place:y,tip:h});return e.jsxs(r.Container,{alignItems:m?"center":"flex-start",bgColor:j.palette.gray[50],border:`1px solid ${j.palette.gray[200]}`,borderRadius:"4px",display:"inline-flex",flexDirection:m?"column":"column-reverse",gap:.5,height:a,justify:"center",padding:[1.25,1.25,1.25,1.25],width:f,children:[e.jsxs(r.Container,{alignItems:"center",display:"flex",gap:.5,children:[m||i.isUndefined(l)?void 0:v,e.jsx(o.Text,{color:m?j.palette.gray[800]:j.palette.gray[400],size:"md",textAlign:m?"center":"start",children:s}),m||i.isUndefined(c)?void 0:v]}),e.jsxs(r.Container,{alignItems:"center",display:"flex",gap:.5,my:.5,children:[m&&!i.isUndefined(l)?v:void 0,e.jsxs("div",{style:{display:"flex",gap:"12px"},children:[i.isUndefined(x)?void 0:e.jsx(d.Heading,{fontWeight:"bold",size:"md",children:x}),p]}),m&&!i.isUndefined(c)?v:void 0]})]})};
+import { jsx as l, jsxs as n } from "react/jsx-runtime";
+import { isUndefined as r } from "lodash";
+import { useTheme as h } from "styled-components";
+import { Container as p } from "../container/index.js";
+import { T as b } from "../../index-DwznImvK.mjs";
+import { Heading as C } from "../typography/heading/index.js";
+import "../typography/span/index.js";
+import { Text as T } from "../typography/text/index.js";
+const W = ({
+  description: s,
+  height: m = "auto",
+  leftIconName: o,
+  children: c,
+  rightIconName: d,
+  title: a,
+  tooltipId: f,
+  tooltipTip: g,
+  tooltipPlace: x = "bottom",
+  variant: u = "centered",
+  width: y = "318px"
+}) => {
+  const t = h(), e = u === "centered", i = /* @__PURE__ */ l(
+    b,
+    {
+      icon: d ?? o,
+      iconColor: t.palette.gray[800],
+      id: f,
+      place: x,
+      tip: g
+    }
+  );
+  return /* @__PURE__ */ n(
+    p,
+    {
+      alignItems: e ? "center" : "flex-start",
+      bgColor: t.palette.gray[50],
+      border: `1px solid ${t.palette.gray[200]}`,
+      borderRadius: "4px",
+      display: "inline-flex",
+      flexDirection: e ? "column" : "column-reverse",
+      gap: 0.5,
+      height: m,
+      justify: "center",
+      padding: [1.25, 1.25, 1.25, 1.25],
+      width: y,
+      children: [
+        /* @__PURE__ */ n(p, { alignItems: "center", display: "flex", gap: 0.5, children: [
+          e || r(o) ? void 0 : i,
+          /* @__PURE__ */ l(
+            T,
+            {
+              color: e ? t.palette.gray[800] : t.palette.gray[400],
+              size: "md",
+              textAlign: e ? "center" : "start",
+              children: s
+            }
+          ),
+          e || r(d) ? void 0 : i
+        ] }),
+        /* @__PURE__ */ n(p, { alignItems: "center", display: "flex", gap: 0.5, my: 0.5, children: [
+          e && !r(o) ? i : void 0,
+          /* @__PURE__ */ n("div", { style: { display: "flex", gap: "12px" }, children: [
+            r(a) ? void 0 : /* @__PURE__ */ l(C, { fontWeight: "bold", size: "md", children: a }),
+            c
+          ] }),
+          e && !r(d) ? i : void 0
+        ] })
+      ]
+    }
+  );
+};
+export {
+  W as IndicatorCard
+};

package/dist/components/info-sidebar/index.js

@@ -1 +1,116 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("styled-components"),i=require("../button/index.js"),n=require("../container/index.js"),r=require("../icon-button/index.js"),l=require("../tabs/index.js");require("../typography/heading/index.js"),require("../typography/span/index.js");const o=require("../typography/text/index.js");exports.InfoSidebar=({actions:a,children:s,header:p,title:x,tabs:c,footer:d})=>{const y=t.useTheme();return e.jsxs(n.Container,{alignItems:"flex-start",bgColor:y.palette.white,borderLeft:`1px solid ${y.palette.gray[300]}`,display:"flex",flexDirection:"column",maxHeight:"750px",width:"480px",children:[e.jsxs(n.Container,{alignItems:"flex-start",alignSelf:"stretch",borderBottom:`1px solid ${y.palette.gray[300]}`,display:"flex",gap:.25,justify:"space-between",px:1.25,py:1,children:[e.jsxs(n.Container,{display:"flex",flexDirection:"column",gap:.25,children:[e.jsx(o.Text,{color:y.palette.gray[800],fontWeight:"bold",lineSpacing:1.75,size:"xl",children:x}),p]}),a&&e.jsx(n.Container,{display:"flex",gap:.25,children:a.map((({icon:t,onClick:i},n)=>e.jsx(r.IconButton,{icon:t??"paper-plane",iconColor:y.palette.gray[400],iconSize:"xxs",iconType:"fa-light",onClick:i,variant:"ghost"},`${n}-${t}`)))})]}),e.jsx(n.Container,{display:"flex",pt:.25,width:"100%",children:e.jsx(l.Tabs,{items:c})}),e.jsx(n.Container,{alignSelf:"stretch",display:"flex",flexDirection:"column",px:1.25,py:1,scroll:"y",children:s}),d&&e.jsx(n.Container,{alignSelf:"stretch",borderTop:`1px solid ${y.palette.gray[300]}`,display:"flex",gap:.5,justify:"end",px:1.25,py:1,children:d.map((({icon:t,text:n,onClick:r},l)=>e.jsx(i.Button,{icon:t,onClick:r,variant:0===l?"primary":"tertiary",width:"100%",children:n},`${l}-${n}`)))})]})};
+import { jsxs as p, jsx as e } from "react/jsx-runtime";
+import { useTheme as x } from "styled-components";
+import { Button as h } from "../button/index.js";
+import { Container as t } from "../container/index.js";
+import { IconButton as y } from "../icon-button/index.js";
+import { Tabs as g } from "../tabs/index.js";
+import "../typography/heading/index.js";
+import "../typography/span/index.js";
+import { Text as u } from "../typography/text/index.js";
+const D = ({
+  actions: a,
+  children: m,
+  header: f,
+  title: c,
+  tabs: d,
+  footer: n
+}) => {
+  const i = x();
+  return /* @__PURE__ */ p(
+    t,
+    {
+      alignItems: "flex-start",
+      bgColor: i.palette.white,
+      borderLeft: `1px solid ${i.palette.gray[300]}`,
+      display: "flex",
+      flexDirection: "column",
+      maxHeight: "750px",
+      width: "480px",
+      children: [
+        /* @__PURE__ */ p(
+          t,
+          {
+            alignItems: "flex-start",
+            alignSelf: "stretch",
+            borderBottom: `1px solid ${i.palette.gray[300]}`,
+            display: "flex",
+            gap: 0.25,
+            justify: "space-between",
+            px: 1.25,
+            py: 1,
+            children: [
+              /* @__PURE__ */ p(t, { display: "flex", flexDirection: "column", gap: 0.25, children: [
+                /* @__PURE__ */ e(
+                  u,
+                  {
+                    color: i.palette.gray[800],
+                    fontWeight: "bold",
+                    lineSpacing: 1.75,
+                    size: "xl",
+                    children: c
+                  }
+                ),
+                f
+              ] }),
+              a && /* @__PURE__ */ e(t, { display: "flex", gap: 0.25, children: a.map(
+                ({ icon: r, onClick: l }, o) => /* @__PURE__ */ e(
+                  y,
+                  {
+                    icon: r ?? "paper-plane",
+                    iconColor: i.palette.gray[400],
+                    iconSize: "xxs",
+                    iconType: "fa-light",
+                    onClick: l,
+                    variant: "ghost"
+                  },
+                  `${o}-${r}`
+                )
+              ) })
+            ]
+          }
+        ),
+        /* @__PURE__ */ e(t, { display: "flex", pt: 0.25, width: "100%", children: /* @__PURE__ */ e(g, { items: d }) }),
+        /* @__PURE__ */ e(
+          t,
+          {
+            alignSelf: "stretch",
+            display: "flex",
+            flexDirection: "column",
+            px: 1.25,
+            py: 1,
+            scroll: "y",
+            children: m
+          }
+        ),
+        n && /* @__PURE__ */ e(
+          t,
+          {
+            alignSelf: "stretch",
+            borderTop: `1px solid ${i.palette.gray[300]}`,
+            display: "flex",
+            gap: 0.5,
+            justify: "end",
+            px: 1.25,
+            py: 1,
+            children: n.map(
+              ({ icon: r, text: l, onClick: o }, s) => /* @__PURE__ */ e(
+                h,
+                {
+                  icon: r,
+                  onClick: o,
+                  variant: s === 0 ? "primary" : "tertiary",
+                  width: "100%",
+                  children: l
+                },
+                `${s}-${l}`
+              )
+            )
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  D as InfoSidebar
+};

package/dist/components/inputs/fields/combobox/index.js

@@ -1 +1,146 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("react"),o=require("react-aria"),n=require("react-stately"),r=require("styled-components"),i=require("../../../../index-DpQYiwGu.js"),l=require("../../outline-container/index.js"),s=require("../../../../styles-Bl-CstrT.js"),a=require("../../utils/popover/index.js"),u=require("../../../icon/index.js"),c=require("../../../icon-button/index.js"),p=t.forwardRef((function({disabled:p=!1,error:d,helpLink:x,helpLinkText:m,helpText:f,label:h,name:b,items:j,onChange:v,required:C,tooltip:g,value:q,weight:y,...S},R){const B=r.useTheme(),[T,w]=t.useState(q??""),[P,k]=t.useState(q),[O,I]=t.useState(j),{contains:L}=o.useFilter({sensitivity:"base"}),z=t.useRef(null),N=t.useRef(null),F=t.useRef(null),M=t.useRef(null),V=t.useMemo((()=>j.map((t=>L(t.name,T)?e.jsx(n.Item,{children:t.name},t.value):null))),[L,T,j]),$=t.useCallback((e=>{w(e),k((t=>{const o=""===e?"":t;return null==v||v(o),o})),I(j.filter((t=>L(t.name,e))))}),[L,j,v]),D=t.useCallback((e=>{var t;e&&(w((null==(t=j.find((t=>t.value===e)))?void 0:t.name)??""),k(String(e)),null==v||v(e),I(j))}),[v,j]),E=n.useComboBoxState({allowsEmptyCollection:!0,inputValue:T,items:O,shouldCloseOnBlur:!0,selectedKey:P,onInputChange:$,onSelectionChange:D,children:V}),{buttonProps:K,inputProps:A,listBoxProps:G}=o.useComboBox({inputValue:T,items:O,buttonRef:z,id:b,inputRef:R,label:h,listBoxRef:N,name:b,popoverRef:M},E),{listBoxProps:H}=o.useListBox(G,E,N),{buttonProps:J}=o.useButton(K,z);return e.jsxs(l.OutlineContainer,{error:d,helpLink:x,helpLinkText:m,helpText:f,htmlFor:b,label:h,required:C,tooltip:g,weight:y,children:[e.jsxs(s.StyledTextInputContainer,{className:`${p?"disabled":""} ${d?"error":""}`,ref:F,children:[e.jsx("input",{...A,...S,"aria-invalid":d?"true":"false",ref:R}),d?e.jsx(u.Icon,{icon:"exclamation-circle",iconClass:"error-icon",iconColor:B.palette.error[500],iconSize:"xs"}):void 0,e.jsx(c.IconButton,{...J,className:"action",icon:E.isOpen?"chevron-up":"chevron-down",iconColor:B.palette.gray[400],iconSize:"xxs",iconType:"fa-light",px:.125,py:.125,ref:z,variant:"ghost"})]}),E.isOpen&&E.collection.size>0&&!p?e.jsx(a.Popover,{className:"dropdown",offset:4,placement:"bottom start",popoverRef:M,state:E,triggerRef:F,children:e.jsx(i.StyledDropdown,{...H,ref:N,children:O.map((t=>e.jsx(i.Option,{item:t,state:E},t.value)))})}):null]})}));exports.ComboBox=p;
+import { jsx as r, jsxs as O } from "react/jsx-runtime";
+import { forwardRef as J, useState as x, useRef as u, useMemo as Q, useCallback as C } from "react";
+import { useFilter as U, useComboBox as W, useListBox as X, useButton as Y } from "react-aria";
+import { Item as Z, useComboBoxState as _ } from "react-stately";
+import { useTheme as k } from "styled-components";
+import { S as g, O as oo } from "../../../../index-CUQBAqt_.mjs";
+import { OutlineContainer as to } from "../../outline-container/index.js";
+import { S as eo } from "../../../../styles-BXFVwnWT.mjs";
+import { Popover as no } from "../../utils/popover/index.js";
+import { Icon as ro } from "../../../icon/index.js";
+import { IconButton as so } from "../../../icon-button/index.js";
+const Io = J(function({
+  disabled: b = !1,
+  error: i,
+  helpLink: z,
+  helpLinkText: F,
+  helpText: N,
+  label: B,
+  name: m,
+  items: t,
+  onChange: e,
+  required: T,
+  tooltip: V,
+  value: S,
+  weight: j,
+  ...K
+}, I) {
+  const P = k(), [l, R] = x(S ?? ""), [L, v] = x(S), [a, h] = x(t), { contains: c } = U({ sensitivity: "base" }), f = u(null), d = u(null), w = u(null), y = u(null), $ = Q(() => t.map(
+    (o) => c(o.name, l) ? /* @__PURE__ */ r(Z, { children: o.name }, o.value) : null
+  ), [c, l, t]), D = C(
+    (o) => {
+      R(o), v((s) => {
+        const p = o === "" ? "" : s;
+        return e == null || e(p), p;
+      }), h(t.filter((s) => c(s.name, o)));
+    },
+    [c, t, e]
+  ), E = C(
+    (o) => {
+      var s;
+      o && (R(((s = t.find((p) => p.value === o)) == null ? void 0 : s.name) ?? ""), v(String(o)), e == null || e(o), h(t));
+    },
+    [e, t]
+  ), n = _({
+    allowsEmptyCollection: !0,
+    inputValue: l,
+    items: a,
+    shouldCloseOnBlur: !0,
+    selectedKey: L,
+    onInputChange: D,
+    onSelectionChange: E,
+    children: $
+  }), {
+    buttonProps: M,
+    inputProps: q,
+    listBoxProps: A
+  } = W(
+    {
+      inputValue: l,
+      items: a,
+      buttonRef: f,
+      id: m,
+      inputRef: I,
+      label: B,
+      listBoxRef: d,
+      name: m,
+      popoverRef: y
+    },
+    n
+  ), { listBoxProps: G } = X(A, n, d), { buttonProps: H } = Y(M, f);
+  return /* @__PURE__ */ O(
+    to,
+    {
+      error: i,
+      helpLink: z,
+      helpLinkText: F,
+      helpText: N,
+      htmlFor: m,
+      label: B,
+      required: T,
+      tooltip: V,
+      weight: j,
+      children: [
+        /* @__PURE__ */ O(
+          eo,
+          {
+            className: `${b ? "disabled" : ""} ${i ? "error" : ""}`,
+            ref: w,
+            children: [
+              /* @__PURE__ */ r(
+                "input",
+                {
+                  ...q,
+                  ...K,
+                  "aria-invalid": i ? "true" : "false",
+                  ref: I
+                }
+              ),
+              i ? /* @__PURE__ */ r(
+                ro,
+                {
+                  icon: "exclamation-circle",
+                  iconClass: "error-icon",
+                  iconColor: P.palette.error[500],
+                  iconSize: "xs"
+                }
+              ) : void 0,
+              /* @__PURE__ */ r(
+                so,
+                {
+                  ...H,
+                  className: "action",
+                  icon: n.isOpen ? "chevron-up" : "chevron-down",
+                  iconColor: P.palette.gray[400],
+                  iconSize: "xxs",
+                  iconType: "fa-light",
+                  px: 0.125,
+                  py: 0.125,
+                  ref: f,
+                  variant: "ghost"
+                }
+              )
+            ]
+          }
+        ),
+        n.isOpen && n.collection.size > 0 && !b ? /* @__PURE__ */ r(
+          no,
+          {
+            className: "dropdown",
+            offset: 4,
+            placement: "bottom start",
+            popoverRef: y,
+            state: n,
+            triggerRef: w,
+            children: /* @__PURE__ */ r(g, { ...G, ref: d, children: a.map(
+              (o) => /* @__PURE__ */ r(oo, { item: o, state: n }, o.value)
+            ) })
+          }
+        ) : null
+      ]
+    }
+  );
+});
+export {
+  Io as ComboBox
+};

package/dist/components/inputs/fields/combobox/option/index.js

@@ -1 +1,8 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"}),require("react/jsx-runtime"),require("react"),require("react-aria");const e=require("../../../../../index-DpQYiwGu.js");require("../../../../icon/index.js"),exports.Option=e.Option;
+import "react/jsx-runtime";
+import "react";
+import "react-aria";
+import { O } from "../../../../../index-CUQBAqt_.mjs";
+import "../../../../icon/index.js";
+export {
+  O as Option
+};

package/dist/components/inputs/fields/date/calendar/cell/index.js

@@ -1 +1,27 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("@internationalized/date"),t=require("lodash"),a=require("react"),r=require("react-aria"),l=require("../../../../../../styles-DYoftbd3.js"),s=require("../../../../../icon/index.js");exports.CalendarCell=({state:n,date:d})=>{const o=a.useRef(null),c=i.isToday(d,i.getLocalTimeZone()),{cellProps:g,buttonProps:h,isSelected:u,isDisabled:x,formattedDate:j}=r.useCalendarCell({date:d},n,o),m="highlightedRange"in n&&!t.isNull(n.highlightedRange)?i.isSameDay(d,n.highlightedRange.start):u,y="highlightedRange"in n&&!t.isNull(n.highlightedRange)?i.isSameDay(d,n.highlightedRange.end):u,q=!u||x||m||y?"":"range";return e.jsx(l.DayItemTd,{id:q,...g,children:e.jsxs("div",{...h,className:`cell ${m||y?"selected":""}\n          ${x?"disabled":""} ${c?"today":""}\n          ${n.isFocused||c?"":"focused"} ${q}`,ref:o,children:[j,c?e.jsx(l.DotIconContainer,{children:e.jsx(s.Icon,{clickable:!1,icon:"circle",iconSize:"xxs"})}):void 0]})})};
+import { jsx as n, jsxs as p } from "react/jsx-runtime";
+import { isToday as u, getLocalTimeZone as R, isSameDay as a } from "@internationalized/date";
+import { isNull as g } from "lodash";
+import { useRef as S } from "react";
+import { useCalendarCell as b } from "react-aria";
+import { a as x, b as y } from "../../../../../../styles-BlHspTrz.mjs";
+import { Icon as C } from "../../../../../icon/index.js";
+const k = ({ state: e, date: i }) => {
+  const r = S(null), o = u(i, R()), { cellProps: h, buttonProps: m, isSelected: l, isDisabled: c, formattedDate: f } = b({ date: i }, e, r), s = "highlightedRange" in e && !g(e.highlightedRange) ? a(i, e.highlightedRange.start) : l, d = "highlightedRange" in e && !g(e.highlightedRange) ? a(i, e.highlightedRange.end) : l, t = l && !c && !(s || d) ? "range" : "";
+  return /* @__PURE__ */ n(x, { id: t, ...h, children: /* @__PURE__ */ p(
+    "div",
+    {
+      ...m,
+      className: `cell ${s || d ? "selected" : ""}
+          ${c ? "disabled" : ""} ${o ? "today" : ""}
+          ${!e.isFocused && !o ? "focused" : ""} ${t}`,
+      ref: r,
+      children: [
+        f,
+        o ? /* @__PURE__ */ n(y, { children: /* @__PURE__ */ n(C, { clickable: !1, icon: "circle", iconSize: "xxs" }) }) : void 0
+      ]
+    }
+  ) });
+};
+export {
+  k as CalendarCell
+};

package/dist/components/inputs/fields/date/calendar/grid/index.js

@@ -1 +1,26 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("@internationalized/date"),t=require("react-aria"),a=require("../cell/index.js"),s=require("../../../../../../styles-DYoftbd3.js");exports.CalendarGrid=({state:n,...i})=>{const{locale:l}=t.useLocale(),{weekDays:d}=t.useCalendarGrid(i,n),c=r.getWeeksInMonth(n.visibleRange.start,l);return e.jsxs("table",{children:[e.jsx("thead",{children:e.jsx(s.WeekDaysTr,{children:d.map(((r,t)=>{const a=`key_${t}`;return e.jsx(s.DayHeaderTh,{children:r},a)}))})}),e.jsx("tbody",{children:[...new Array(c).keys()].map((r=>e.jsx(s.WeekDaysTr,{children:n.getDatesInWeek(r).map(((r,t)=>{const s=`key_${t}`;return r?e.jsx(a.CalendarCell,{date:r,state:n},s):e.jsx("td",{},s)}))},r)))})]})};
+import { jsxs as m, jsx as e } from "react/jsx-runtime";
+import { getWeeksInMonth as h } from "@internationalized/date";
+import { useLocale as k, useCalendarGrid as p } from "react-aria";
+import { CalendarCell as y } from "../cell/index.js";
+import { W as s, D as f } from "../../../../../../styles-BlHspTrz.mjs";
+const g = ({
+  state: r,
+  ...l
+}) => {
+  const { locale: d } = k(), { weekDays: i } = p(l, r), c = h(r.visibleRange.start, d);
+  return /* @__PURE__ */ m("table", { children: [
+    /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ e(s, { children: i.map((n, o) => {
+      const a = `key_${o}`;
+      return /* @__PURE__ */ e(f, { children: n }, a);
+    }) }) }),
+    /* @__PURE__ */ e("tbody", { children: [...new Array(c).keys()].map(
+      (n) => /* @__PURE__ */ e(s, { children: r.getDatesInWeek(n).map((o, a) => {
+        const t = `key_${a}`;
+        return o ? /* @__PURE__ */ e(y, { date: o, state: r }, t) : /* @__PURE__ */ e("td", {}, t);
+      }) }, n)
+    ) })
+  ] });
+};
+export {
+  g as CalendarGrid
+};

package/dist/components/inputs/fields/date/calendar/header/index.js

@@ -1 +1,38 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("react"),s=require("../../../../../../styles-DYoftbd3.js"),r=require("../../../../../icon/index.js"),o=require("../../../../utils/calendar-button/index.js");exports.Header=({state:a,prevButtonProps:n,nextButtonProps:i,title:c})=>{const l=a.focusedDate,u=t.useCallback((()=>{a.setFocusedDate(l.add({years:1}))}),[l,a]),x=t.useCallback((()=>{a.setFocusedDate(l.subtract({years:1}))}),[l,a]);return e.jsxs("div",{className:"header flex items-start",children:[e.jsx(o.Button,{icon:"chevron-left",props:n}),e.jsxs(s.TitleContainer,{children:[c,e.jsxs(s.YearSwitch,{children:[e.jsx(s.CaretButton,{"aria-label":"top",onClick:u,children:e.jsx(r.Icon,{icon:"caret-up",iconClass:"fa-sharp",iconSize:"xxss"})}),e.jsx(s.CaretButton,{"aria-label":"bottom",onClick:x,children:e.jsx(r.Icon,{icon:"caret-down",iconClass:"fa-sharp",iconSize:"xxss"})})]})]}),e.jsx(o.Button,{icon:"chevron-right",props:i})]})};
+import { jsxs as a, jsx as o } from "react/jsx-runtime";
+import { useCallback as c } from "react";
+import { T as m, Y as u, C as i } from "../../../../../../styles-BlHspTrz.mjs";
+import { Icon as s } from "../../../../../icon/index.js";
+import { Button as t } from "../../../../utils/calendar-button/index.js";
+const v = ({
+  state: r,
+  prevButtonProps: n,
+  nextButtonProps: l,
+  title: d
+}) => {
+  const e = r.focusedDate, h = c(() => {
+    r.setFocusedDate(e.add({ years: 1 }));
+  }, [e, r]), p = c(() => {
+    r.setFocusedDate(e.subtract({ years: 1 }));
+  }, [e, r]);
+  return /* @__PURE__ */ a("div", { className: "header flex items-start", children: [
+    /* @__PURE__ */ o(t, { icon: "chevron-left", props: n }),
+    /* @__PURE__ */ a(m, { children: [
+      d,
+      /* @__PURE__ */ a(u, { children: [
+        /* @__PURE__ */ o(i, { "aria-label": "top", onClick: h, children: /* @__PURE__ */ o(s, { icon: "caret-up", iconClass: "fa-sharp", iconSize: "xxss" }) }),
+        /* @__PURE__ */ o(i, { "aria-label": "bottom", onClick: p, children: /* @__PURE__ */ o(
+          s,
+          {
+            icon: "caret-down",
+            iconClass: "fa-sharp",
+            iconSize: "xxss"
+          }
+        ) })
+      ] })
+    ] }),
+    /* @__PURE__ */ o(t, { icon: "chevron-right", props: l })
+  ] });
+};
+export {
+  v as Header
+};