@atom-learning/components 6.4.2 → 6.5.1

package/dist/components/select/Select.js

@@ -1,2 +1,96 @@
-import*as r from"react";import{styled as p}from"../../styled.js";const c=p("select",{base:["bg-(image:--bg-chevron)","appearance-none","[background-repeat:no-repeat,repeat-x]","rounded-md","text-grey-1000","block","font-body","font-normal","leading-[1.4]","w-full","hover:cursor-pointer","-ms-expand:hidden","disabled:opacity-30","disabled:cursor-not-allowed","*[[disabled]]:opacity-30","*[[disabled]]:cursor-not-allowed"],variants:{size:{sm:["bg-position-[right_--spacing(2)_top_50%,0_0]","bg-size-[18px_auto,100%]","text-sm","h-8","pl-2","pr-8"],md:["bg-position-[right_--spacing(3)_top_50%,0_0]","bg-size-[20px_auto,100%]","text-md","h-10","pl-3","pr-10"],lg:["bg-position-[right_--spacing(3)_top_50%,0_0]","bg-size-[20px_auto,100%]","text-md","h-12","pl-3","pr-10"]},state:{error:[]},appearance:{standard:["bg-white","border","border-grey-700","focus:border-primary-800","focus:outline-none"],modern:["bg-grey-100","border-none","focus:outline-2","focus:outline-blue-800","focus:outline-offset-1","focus:outline-solid","focus:z-1"]}},compoundVariants:[{state:"error",appearance:"standard",class:["border-danger"]},{state:"error",appearance:"modern",class:["bg-danger-light","focus:outline-danger"]}]},{enabledResponsiveVariants:!0}),t=r.forwardRef(({placeholder:a,children:n,size:s="md",appearance:d="standard",...e},i)=>{const o={size:s,appearance:d,ref:i,...e};return[e.value,e.defaultValue].every(l=>l===void 0)&&(o.defaultValue=""),r.createElement(c,{...o},a&&r.createElement("option",{disabled:!0,hidden:!0,value:""},a),n)});t.displayName="Select";export{t as Select};
-//# sourceMappingURL=Select.js.map
+import { styled as e } from "../../styled.js";
+import * as t from "react";
+//#region src/components/select/Select.tsx
+var n = e("select", {
+	base: [
+		"bg-(image:--bg-chevron)",
+		"appearance-none",
+		"[background-repeat:no-repeat,repeat-x]",
+		"rounded-md",
+		"text-grey-1000",
+		"block",
+		"font-body",
+		"font-normal",
+		"leading-[1.4]",
+		"w-full",
+		"hover:cursor-pointer",
+		"-ms-expand:hidden",
+		"disabled:opacity-30",
+		"disabled:cursor-not-allowed",
+		"*[[disabled]]:opacity-30",
+		"*[[disabled]]:cursor-not-allowed"
+	],
+	variants: {
+		size: {
+			sm: [
+				"bg-position-[right_--spacing(2)_top_50%,0_0]",
+				"bg-size-[18px_auto,100%]",
+				"text-sm",
+				"h-8",
+				"pl-2",
+				"pr-8"
+			],
+			md: [
+				"bg-position-[right_--spacing(3)_top_50%,0_0]",
+				"bg-size-[20px_auto,100%]",
+				"text-md",
+				"h-10",
+				"pl-3",
+				"pr-10"
+			],
+			lg: [
+				"bg-position-[right_--spacing(3)_top_50%,0_0]",
+				"bg-size-[20px_auto,100%]",
+				"text-md",
+				"h-12",
+				"pl-3",
+				"pr-10"
+			]
+		},
+		state: { error: [] },
+		appearance: {
+			standard: [
+				"bg-white",
+				"border",
+				"border-grey-700",
+				"focus:border-primary-800",
+				"focus:outline-none"
+			],
+			modern: [
+				"bg-grey-100",
+				"border-none",
+				"focus:outline-2",
+				"focus:outline-blue-800",
+				"focus:outline-offset-1",
+				"focus:outline-solid",
+				"focus:z-1"
+			]
+		}
+	},
+	compoundVariants: [{
+		state: "error",
+		appearance: "standard",
+		class: ["border-danger"]
+	}, {
+		state: "error",
+		appearance: "modern",
+		class: ["bg-danger-light", "focus:outline-danger"]
+	}]
+}, { enabledResponsiveVariants: !0 }), r = t.forwardRef(({ placeholder: e, children: r, size: i = "md", appearance: a = "standard", ...o }, s) => {
+	let c = {
+		size: i,
+		appearance: a,
+		ref: s,
+		...o
+	};
+	return [o.value, o.defaultValue].every((e) => e === void 0) && (c.defaultValue = ""), /* @__PURE__ */ t.createElement(n, c, e && /* @__PURE__ */ t.createElement("option", {
+		disabled: !0,
+		hidden: !0,
+		value: ""
+	}, e), r);
+});
+r.displayName = "Select";
+//#endregion
+export { r as Select };
+
+//# sourceMappingURL=Select.js.map

package/dist/components/select/Select.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select.js","sources":["../../../src/components/select/Select.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { Override } from '~/utilities/types'\n\nconst StyledSelect = styled(\n  'select',\n  {\n    base: [\n      'bg-(image:--bg-chevron)',\n      'appearance-none',\n      '[background-repeat:no-repeat,repeat-x]',\n      'rounded-md',\n      'text-grey-1000',\n      'block',\n      'font-body',\n      'font-normal',\n      'leading-[1.4]',\n      'w-full',\n      'hover:cursor-pointer',\n      '-ms-expand:hidden',\n      'disabled:opacity-30',\n      'disabled:cursor-not-allowed',\n      '*[[disabled]]:opacity-30',\n      '*[[disabled]]:cursor-not-allowed'\n    ],\n    variants: {\n      size: {\n        sm: [\n          'bg-position-[right_--spacing(2)_top_50%,0_0]',\n          'bg-size-[18px_auto,100%]',\n          'text-sm',\n          'h-8',\n          'pl-2',\n          'pr-8'\n        ],\n        md: [\n          'bg-position-[right_--spacing(3)_top_50%,0_0]',\n          'bg-size-[20px_auto,100%]',\n          'text-md',\n          'h-10',\n          'pl-3',\n          'pr-10'\n        ],\n        lg: [\n          'bg-position-[right_--spacing(3)_top_50%,0_0]',\n          'bg-size-[20px_auto,100%]',\n          'text-md',\n          'h-12',\n          'pl-3',\n          'pr-10'\n        ]\n      },\n      state: {\n        error: []\n      },\n      appearance: {\n        standard: [\n          'bg-white',\n          'border',\n          'border-grey-700',\n          'focus:border-primary-800',\n          'focus:outline-none'\n        ],\n        modern: [\n          'bg-grey-100',\n          'border-none',\n          'focus:outline-2',\n          'focus:outline-blue-800',\n          'focus:outline-offset-1',\n          'focus:outline-solid',\n          'focus:z-1'\n        ]\n      }\n    },\n    compoundVariants: [\n      {\n        state: 'error',\n        appearance: 'standard',\n        class: ['border-danger']\n      },\n      {\n        state: 'error',\n        appearance: 'modern',\n        class: ['bg-danger-light', 'focus:outline-danger']\n      }\n    ]\n  },\n  { enabledResponsiveVariants: true }\n)\n\nexport type SelectProps = Override<\n  React.ComponentProps<typeof StyledSelect>,\n  {\n    as?: never\n    placeholder?: string\n  }\n  // TODO: figure out why uncommenting this causes TS errors in\n  // component declaration\n  // & (\n  //   | { id: string; 'aria-label'?: string }\n  //   | { 'aria-label': string; id?: string }\n  // )\n>\n\nexport const Select = React.forwardRef<HTMLSelectElement, SelectProps>(\n  (\n    {\n      placeholder,\n      children,\n      size = 'md',\n      appearance = 'standard',\n      ...remainingProps\n    },\n    ref\n  ) => {\n    // Type assertion needed due to responsive variant size prop compatibility\n    const props: React.ComponentProps<typeof StyledSelect> = {\n      size,\n      appearance,\n      ref,\n      ...remainingProps\n    }\n\n    if (\n      [remainingProps.value, remainingProps.defaultValue].every(\n        (value) => value === undefined\n      )\n    ) {\n      props.defaultValue = ''\n    }\n\n    return (\n      <StyledSelect {...props}>\n        {placeholder && (\n          <option disabled hidden value=\"\">\n            {placeholder}\n          </option>\n        )}\n        {children}\n      </StyledSelect>\n    )\n  }\n)\n\nSelect.displayName = 'Select'\n"],"names":["StyledSelect","styled","Select","React","placeholder","children","size","appearance","remainingProps","ref","props","value"],"mappings":"iEAKA,MAAMA,EAAeC,EACnB,SACA,CACE,KAAM,CACJ,0BACA,kBACA,yCACA,aACA,iBACA,QACA,YACA,cACA,gBACA,SACA,uBACA,oBACA,sBACA,8BACA,2BACA,kCACF,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CACF,+CACA,2BACA,UACA,MACA,OACA,MACF,EACA,GAAI,CACF,+CACA,2BACA,UACA,OACA,OACA,OACF,EACA,GAAI,CACF,+CACA,2BACA,UACA,OACA,OACA,OACF,CACF,EACA,MAAO,CACL,MAAO,CAAA,CACT,EACA,WAAY,CACV,SAAU,CACR,WACA,SACA,kBACA,2BACA,oBACF,EACA,OAAQ,CACN,cACA,cACA,kBACA,yBACA,yBACA,sBACA,WACF,CACF,CACF,EACA,iBAAkB,CAChB,CACE,MAAO,QACP,WAAY,WACZ,MAAO,CAAC,eAAe,CACzB,EACA,CACE,MAAO,QACP,WAAY,SACZ,MAAO,CAAC,kBAAmB,sBAAsB,CACnD,CACF,CACF,EACA,CAAE,0BAA2B,EAAK,CACpC,EAgBaC,EAASC,EAAM,WAC1B,CACE,CACE,YAAAC,EACA,SAAAC,EACA,KAAAC,EAAO,KACP,WAAAC,EAAa,WACb,GAAGC,CACL,EACAC,IACG,CAEH,MAAMC,EAAmD,CACvD,KAAAJ,EACA,WAAAC,EACA,IAAAE,EACA,GAAGD,CACL,EAEA,MACE,CAACA,EAAe,MAAOA,EAAe,YAAY,EAAE,MACjDG,GAAUA,IAAU,MACvB,IAEAD,EAAM,aAAe,IAIrBP,EAAA,cAACH,EAAA,CAAc,GAAGU,CAAAA,EACfN,GACCD,EAAA,cAAC,UAAO,SAAQ,GAAC,OAAM,GAAC,MAAM,IAC3BC,CACH,EAEDC,CACH,CAEJ,CACF,EAEAH,EAAO,YAAc"}
+{"version":3,"file":"Select.js","names":[],"sources":["../../../src/components/select/Select.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { Override } from '~/utilities/types'\n\nconst StyledSelect = styled(\n  'select',\n  {\n    base: [\n      'bg-(image:--bg-chevron)',\n      'appearance-none',\n      '[background-repeat:no-repeat,repeat-x]',\n      'rounded-md',\n      'text-grey-1000',\n      'block',\n      'font-body',\n      'font-normal',\n      'leading-[1.4]',\n      'w-full',\n      'hover:cursor-pointer',\n      '-ms-expand:hidden',\n      'disabled:opacity-30',\n      'disabled:cursor-not-allowed',\n      '*[[disabled]]:opacity-30',\n      '*[[disabled]]:cursor-not-allowed'\n    ],\n    variants: {\n      size: {\n        sm: [\n          'bg-position-[right_--spacing(2)_top_50%,0_0]',\n          'bg-size-[18px_auto,100%]',\n          'text-sm',\n          'h-8',\n          'pl-2',\n          'pr-8'\n        ],\n        md: [\n          'bg-position-[right_--spacing(3)_top_50%,0_0]',\n          'bg-size-[20px_auto,100%]',\n          'text-md',\n          'h-10',\n          'pl-3',\n          'pr-10'\n        ],\n        lg: [\n          'bg-position-[right_--spacing(3)_top_50%,0_0]',\n          'bg-size-[20px_auto,100%]',\n          'text-md',\n          'h-12',\n          'pl-3',\n          'pr-10'\n        ]\n      },\n      state: {\n        error: []\n      },\n      appearance: {\n        standard: [\n          'bg-white',\n          'border',\n          'border-grey-700',\n          'focus:border-primary-800',\n          'focus:outline-none'\n        ],\n        modern: [\n          'bg-grey-100',\n          'border-none',\n          'focus:outline-2',\n          'focus:outline-blue-800',\n          'focus:outline-offset-1',\n          'focus:outline-solid',\n          'focus:z-1'\n        ]\n      }\n    },\n    compoundVariants: [\n      {\n        state: 'error',\n        appearance: 'standard',\n        class: ['border-danger']\n      },\n      {\n        state: 'error',\n        appearance: 'modern',\n        class: ['bg-danger-light', 'focus:outline-danger']\n      }\n    ]\n  },\n  { enabledResponsiveVariants: true }\n)\n\nexport type SelectProps = Override<\n  React.ComponentProps<typeof StyledSelect>,\n  {\n    as?: never\n    placeholder?: string\n  }\n  // TODO: figure out why uncommenting this causes TS errors in\n  // component declaration\n  // & (\n  //   | { id: string; 'aria-label'?: string }\n  //   | { 'aria-label': string; id?: string }\n  // )\n>\n\nexport const Select = React.forwardRef<HTMLSelectElement, SelectProps>(\n  (\n    {\n      placeholder,\n      children,\n      size = 'md',\n      appearance = 'standard',\n      ...remainingProps\n    },\n    ref\n  ) => {\n    // Type assertion needed due to responsive variant size prop compatibility\n    const props: React.ComponentProps<typeof StyledSelect> = {\n      size,\n      appearance,\n      ref,\n      ...remainingProps\n    }\n\n    if (\n      [remainingProps.value, remainingProps.defaultValue].every(\n        (value) => value === undefined\n      )\n    ) {\n      props.defaultValue = ''\n    }\n\n    return (\n      <StyledSelect {...props}>\n        {placeholder && (\n          <option disabled hidden value=\"\">\n            {placeholder}\n          </option>\n        )}\n        {children}\n      </StyledSelect>\n    )\n  }\n)\n\nSelect.displayName = 'Select'\n"],"mappings":";;;AAKA,IAAM,IAAe,EACnB,UACA;CACE,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,MAAM;GACJ,IAAI;IACF;IACA;IACA;IACA;IACA;IACA;IACD;GACD,IAAI;IACF;IACA;IACA;IACA;IACA;IACA;IACD;GACD,IAAI;IACF;IACA;IACA;IACA;IACA;IACA;IACD;GACF;EACD,OAAO,EACL,OAAO,EAAE,EACV;EACD,YAAY;GACV,UAAU;IACR;IACA;IACA;IACA;IACA;IACD;GACD,QAAQ;IACN;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACF;EACF;CACD,kBAAkB,CAChB;EACE,OAAO;EACP,YAAY;EACZ,OAAO,CAAC,gBAAgB;EACzB,EACD;EACE,OAAO;EACP,YAAY;EACZ,OAAO,CAAC,mBAAmB,uBAAuB;EACnD,CACF;CACF,EACD,EAAE,2BAA2B,IAAM,CACpC,EAgBY,IAAS,EAAM,YAExB,EACE,gBACA,aACA,UAAO,MACP,gBAAa,YACb,GAAG,KAEL,MACG;CAEH,IAAM,IAAmD;EACvD;EACA;EACA;EACA,GAAG;EACJ;AAUD,QAPE,CAAC,EAAe,OAAO,EAAe,aAAa,CAAC,OACjD,MAAU,MAAU,KAAA,EACtB,KAED,EAAM,eAAe,KAIrB,kBAAA,cAAC,GAAiB,GACf,KACC,kBAAA,cAAC,UAAD;EAAQ,UAAA;EAAS,QAAA;EAAO,OAAM;EAErB,EADN,EACM,EAEV,EACY;EAGpB;AAED,EAAO,cAAc"}

package/dist/components/select-field/SelectField.js

@@ -1,2 +1,33 @@
-import*as l from"react";import{useFormContext as S}from"react-hook-form";import{FieldWrapper as h}from"../field-wrapper/FieldWrapper.js";import{useFieldError as x}from"../form/useFieldError.js";import{useFormCustomContext as C}from"../form/useFormCustomContext.js";import{Select as E}from"../select/Select.js";const p=({className:m,hideLabel:n,children:d,name:e,label:s,validation:r,prompt:c,description:u,appearance:f,...F})=>{const{register:a}=S(),o=C(),{error:t}=x(e),b=r?a(r):a,i=(o==null?void 0:o.appearance)||f;return l.createElement(h,{className:m,description:u,error:t,fieldId:e,hideLabel:n,label:s,prompt:c,required:!!(r!=null&&r.required),appearance:i},l.createElement(E,{name:e,id:e,appearance:i,...F,ref:b,...t&&{state:"error"}},d))};p.displayName="SelectField";export{p as SelectField};
-//# sourceMappingURL=SelectField.js.map
+import { useFieldError as e } from "../form/useFieldError.js";
+import { FieldWrapper as t } from "../field-wrapper/FieldWrapper.js";
+import { useFormCustomContext as n } from "../form/useFormCustomContext.js";
+import { Select as r } from "../select/Select.js";
+import * as i from "react";
+import { useFormContext as a } from "react-hook-form";
+//#region src/components/select-field/SelectField.tsx
+var o = ({ className: o, hideLabel: s, children: c, name: l, label: u, validation: d, prompt: f, description: p, appearance: m, ...h }) => {
+	let { register: g } = a(), _ = n(), { error: v } = e(l), y = d ? g(d) : g, b = _?.appearance || m;
+	return /* @__PURE__ */ i.createElement(t, {
+		className: o,
+		description: p,
+		error: v,
+		fieldId: l,
+		hideLabel: s,
+		label: u,
+		prompt: f,
+		required: !!d?.required,
+		appearance: b
+	}, /* @__PURE__ */ i.createElement(r, {
+		name: l,
+		id: l,
+		appearance: b,
+		...h,
+		ref: y,
+		...v && { state: "error" }
+	}, c));
+};
+o.displayName = "SelectField";
+//#endregion
+export { o as SelectField };
+
+//# sourceMappingURL=SelectField.js.map

package/dist/components/select-field/SelectField.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectField.js","sources":["../../../src/components/select-field/SelectField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper/FieldWrapper'\nimport { useFieldError } from '~/components/form/useFieldError'\nimport { useFormCustomContext } from '~/components/form/useFormCustomContext'\nimport { Select, SelectProps } from '~/components/select/Select'\n\ntype SelectFieldProps = SelectProps & FieldElementWrapperProps\n\nexport const SelectField = ({\n  className,\n  hideLabel,\n  children,\n  name,\n  label,\n  validation,\n  prompt,\n  description,\n  appearance,\n  ...remainingProps\n}: SelectFieldProps) => {\n  const { register } = useFormContext()\n  const context = useFormCustomContext()\n  const { error } = useFieldError(name)\n  const ref = validation ? register(validation) : register\n  const formAppearance = context?.appearance || appearance\n\n  return (\n    <FieldWrapper\n      className={className}\n      description={description}\n      error={error}\n      fieldId={name}\n      hideLabel={hideLabel}\n      label={label}\n      prompt={prompt}\n      required={Boolean(validation?.required)}\n      appearance={formAppearance}\n    >\n      <Select\n        name={name}\n        id={name}\n        appearance={formAppearance}\n        {...remainingProps}\n        ref={ref}\n        {...(error && { state: 'error' })}\n      >\n        {children}\n      </Select>\n    </FieldWrapper>\n  )\n}\n\nSelectField.displayName = 'SelectField'\n"],"names":["SelectField","className","hideLabel","children","name","label","validation","prompt","description","appearance","remainingProps","register","useFormContext","context","useFormCustomContext","error","useFieldError","ref","formAppearance","React","FieldWrapper","Select"],"mappings":"sTAaa,MAAAA,EAAc,CAAC,CAC1B,UAAAC,EACA,UAAAC,EACA,SAAAC,EACA,KAAAC,EACA,MAAAC,EACA,WAAAC,EACA,OAAAC,EACA,YAAAC,EACA,WAAAC,EACA,GAAGC,CACL,IAAwB,CACtB,KAAM,CAAE,SAAAC,CAAS,EAAIC,EAAe,EAC9BC,EAAUC,EACV,EAAA,CAAE,MAAAC,CAAM,EAAIC,EAAcZ,CAAI,EAC9Ba,EAAMX,EAAaK,EAASL,CAAU,EAAIK,EAC1CO,GAAiBL,GAAA,KAAA,OAAAA,EAAS,aAAcJ,EAE9C,OACEU,EAAA,cAACC,EAAA,CACC,UAAWnB,EACX,YAAaO,EACb,MAAOO,EACP,QAASX,EACT,UAAWF,EACX,MAAOG,EACP,OAAQE,EACR,SAAU,CAAQD,EAAAA,GAAA,MAAAA,EAAY,UAC9B,WAAYY,CAEZC,EAAAA,EAAA,cAACE,EAAA,CACC,KAAMjB,EACN,GAAIA,EACJ,WAAYc,EACX,GAAGR,EACJ,IAAKO,EACJ,GAAIF,GAAS,CAAE,MAAO,OAAQ,CAAA,EAE9BZ,CACH,CACF,CAEJ,EAEAH,EAAY,YAAc"}
+{"version":3,"file":"SelectField.js","names":[],"sources":["../../../src/components/select-field/SelectField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\n\nimport {\n  FieldElementWrapperProps,\n  FieldWrapper\n} from '~/components/field-wrapper/FieldWrapper'\nimport { useFieldError } from '~/components/form/useFieldError'\nimport { useFormCustomContext } from '~/components/form/useFormCustomContext'\nimport { Select, SelectProps } from '~/components/select/Select'\n\ntype SelectFieldProps = SelectProps & FieldElementWrapperProps\n\nexport const SelectField = ({\n  className,\n  hideLabel,\n  children,\n  name,\n  label,\n  validation,\n  prompt,\n  description,\n  appearance,\n  ...remainingProps\n}: SelectFieldProps) => {\n  const { register } = useFormContext()\n  const context = useFormCustomContext()\n  const { error } = useFieldError(name)\n  const ref = validation ? register(validation) : register\n  const formAppearance = context?.appearance || appearance\n\n  return (\n    <FieldWrapper\n      className={className}\n      description={description}\n      error={error}\n      fieldId={name}\n      hideLabel={hideLabel}\n      label={label}\n      prompt={prompt}\n      required={Boolean(validation?.required)}\n      appearance={formAppearance}\n    >\n      <Select\n        name={name}\n        id={name}\n        appearance={formAppearance}\n        {...remainingProps}\n        ref={ref}\n        {...(error && { state: 'error' })}\n      >\n        {children}\n      </Select>\n    </FieldWrapper>\n  )\n}\n\nSelectField.displayName = 'SelectField'\n"],"mappings":";;;;;;;AAaA,IAAa,KAAe,EAC1B,cACA,cACA,aACA,SACA,UACA,eACA,WACA,gBACA,eACA,GAAG,QACmB;CACtB,IAAM,EAAE,gBAAa,GAAgB,EAC/B,IAAU,GAAsB,EAChC,EAAE,aAAU,EAAc,EAAK,EAC/B,IAAM,IAAa,EAAS,EAAW,GAAG,GAC1C,IAAiB,GAAS,cAAc;AAE9C,QACE,kBAAA,cAAC,GAAD;EACa;EACE;EACN;EACP,SAAS;EACE;EACJ;EACC;EACR,UAAU,EAAQ,GAAY;EAC9B,YAAY;EAYC,EAVb,kBAAA,cAAC,GAAD;EACQ;EACN,IAAI;EACJ,YAAY;EACZ,GAAI;EACC;EACL,GAAK,KAAS,EAAE,OAAO,SAAS;EAGzB,EADN,EACM,CACI;;AAInB,EAAY,cAAc"}

package/dist/components/side-bar/SideBar.js

@@ -1,2 +1,97 @@
-import x from"clsx";import a from"react";import{useInteractOutside as v,useFocusWithin as B,useHover as y}from"react-aria";import{styled as i,Theme as g}from"../../styled.js";import{SideBarBrand as w,SideBarBrandLogo as E,SideBarBrandName as S,SideBarHeader as _,SideBarBody as H,SideBarFooter as N}from"./SideBarComponents.js";import{SideBarContext as k}from"./SideBarContext.js";const F={"--background":"white","--text":"var(--color-grey-800)","--border":"var(--color-grey-200)"},W=i("div",{base:["sticky","z-1"],variants:{type:{static:[],expandable:["w-22"]}}}),P=i("div",{base:["bg-(--background)","border-r","border-r-(--border)","shadow-[4px_0_4px_-2px_rgba(31,31,31,0)]","flex","flex-col","h-full","overflow-hidden","will-change-width","motion-safe:duration-125","motion-safe:ease-out","motion-safe:transition-[shadow,width]"],variants:{type:{static:[],expandable:[]},isExpanded:{true:["w-[16rem]"],false:["w-22"]}},compoundVariants:[{isExpanded:!0,type:"expandable",class:["shadow-[4px_0_4px_-2px_rgba(31,31,31,0.1)]"]}]}),T=i("div",{base:["bottom-0","left-0","absolute","right-0","top-0","transition-all"],variants:{isVisible:{true:["delay-0","visible"],false:["delay-50","invisible"]}}}),e=({theme:d,className:n,children:l,type:t="expandable",offset:p="0px",style:c,...m})=>{const[o,r]=a.useState(t==="static"),s=a.useRef(null);v({ref:s,onInteractOutside:()=>r(!1)});const{focusWithinProps:f}=B({onFocusWithin:()=>r(!0),onBlurWithin:()=>r(!1)}),{hoverProps:u,isHovered:b}=y({onHoverStart:()=>r(!0),onHoverEnd:()=>r(!1)}),h=t==="expandable"?{...f,...u,onTouchEnd:()=>r(!0),ref:s}:{};return a.createElement(k.Provider,{value:{isExpanded:o}},a.createElement(g,{theme:d||F},a.createElement(W,{...m,style:{...c,"--offset":p},type:t,className:x("h-[calc(100svh-var(--offset))]","top-(--offset)",n)},a.createElement(P,{...h,isExpanded:o,type:t},l,t==="expandable"&&a.createElement(T,{isVisible:!b&&!o})))))};e.Brand=w,e.BrandLogo=E,e.BrandName=S,e.Header=_,e.Body=H,e.Footer=N,e.displayName="SideBar";export{e as SideBar};
-//# sourceMappingURL=SideBar.js.map
+import { Theme as e, styled as t } from "../../styled.js";
+import { SideBarContext as n } from "./SideBarContext.js";
+import { SideBarBody as r, SideBarBrand as i, SideBarBrandLogo as a, SideBarBrandName as o, SideBarFooter as s, SideBarHeader as c } from "./SideBarComponents.js";
+import l from "clsx";
+import u from "react";
+import { useFocusWithin as d, useHover as f, useInteractOutside as p } from "react-aria";
+//#region src/components/side-bar/SideBar.tsx
+var m = {
+	"--background": "white",
+	"--text": "var(--color-grey-800)",
+	"--border": "var(--color-grey-200)"
+}, h = t("div", {
+	base: ["sticky", "z-1"],
+	variants: { type: {
+		static: [],
+		expandable: ["w-22"]
+	} }
+}), g = t("div", {
+	base: [
+		"bg-(--background)",
+		"border-r",
+		"border-r-(--border)",
+		"shadow-[4px_0_4px_-2px_rgba(31,31,31,0)]",
+		"flex",
+		"flex-col",
+		"h-full",
+		"overflow-hidden",
+		"will-change-width",
+		"motion-safe:duration-125",
+		"motion-safe:ease-out",
+		"motion-safe:transition-[shadow,width]"
+	],
+	variants: {
+		type: {
+			static: [],
+			expandable: []
+		},
+		isExpanded: {
+			true: ["w-[16rem]"],
+			false: ["w-22"]
+		}
+	},
+	compoundVariants: [{
+		isExpanded: !0,
+		type: "expandable",
+		class: ["shadow-[4px_0_4px_-2px_rgba(31,31,31,0.1)]"]
+	}]
+}), _ = t("div", {
+	base: [
+		"bottom-0",
+		"left-0",
+		"absolute",
+		"right-0",
+		"top-0",
+		"transition-all"
+	],
+	variants: { isVisible: {
+		true: ["delay-0", "visible"],
+		false: ["delay-50", "invisible"]
+	} }
+}), v = ({ theme: t, className: r, children: i, type: a = "expandable", offset: o = "0px", style: s, ...c }) => {
+	let [v, y] = u.useState(a === "static"), b = u.useRef(null);
+	p({
+		ref: b,
+		onInteractOutside: () => y(!1)
+	});
+	let { focusWithinProps: x } = d({
+		onFocusWithin: () => y(!0),
+		onBlurWithin: () => y(!1)
+	}), { hoverProps: S, isHovered: C } = f({
+		onHoverStart: () => y(!0),
+		onHoverEnd: () => y(!1)
+	}), w = { onTouchEnd: () => y(!0) }, T = a === "expandable" ? {
+		...x,
+		...S,
+		...w,
+		ref: b
+	} : {};
+	return /* @__PURE__ */ u.createElement(n.Provider, { value: { isExpanded: v } }, /* @__PURE__ */ u.createElement(e, { theme: t || m }, /* @__PURE__ */ u.createElement(h, {
+		...c,
+		style: {
+			...s,
+			"--offset": o
+		},
+		type: a,
+		className: l("h-[calc(100svh-var(--offset))]", "top-(--offset)", r)
+	}, /* @__PURE__ */ u.createElement(g, {
+		...T,
+		isExpanded: v,
+		type: a
+	}, i, a === "expandable" && /* @__PURE__ */ u.createElement(_, { isVisible: !C && !v })))));
+};
+v.Brand = i, v.BrandLogo = a, v.BrandName = o, v.Header = c, v.Body = r, v.Footer = s, v.displayName = "SideBar";
+//#endregion
+export { v as SideBar };
+
+//# sourceMappingURL=SideBar.js.map

package/dist/components/side-bar/SideBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"SideBar.js","sources":["../../../src/components/side-bar/SideBar.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport React from 'react'\nimport { useFocusWithin, useHover, useInteractOutside } from 'react-aria'\n\nimport { styled, Theme } from '~/styled'\n\nimport {\n  SideBarBody,\n  SideBarBrand,\n  SideBarBrandLogo,\n  SideBarBrandName,\n  SideBarFooter,\n  SideBarHeader\n} from './SideBarComponents'\nimport { SideBarContext } from './SideBarContext'\n\nconst light = {\n  '--background': 'white',\n  '--text': 'var(--color-grey-800)',\n  '--border': 'var(--color-grey-200)'\n}\n\nconst Root = styled('div', {\n  base: ['sticky', 'z-1'],\n  variants: {\n    type: {\n      static: [],\n      expandable: ['w-22']\n    }\n  }\n})\n\nconst Content = styled('div', {\n  base: [\n    'bg-(--background)',\n    'border-r',\n    'border-r-(--border)',\n    'shadow-[4px_0_4px_-2px_rgba(31,31,31,0)]',\n    'flex',\n    'flex-col',\n    'h-full',\n    'overflow-hidden',\n    'will-change-width',\n    'motion-safe:duration-125',\n    'motion-safe:ease-out',\n    'motion-safe:transition-[shadow,width]'\n  ],\n  variants: {\n    type: {\n      static: [],\n      expandable: []\n    },\n    isExpanded: {\n      true: ['w-[16rem]'],\n      false: ['w-22']\n    }\n  },\n  compoundVariants: [\n    {\n      isExpanded: true,\n      type: 'expandable',\n      class: ['shadow-[4px_0_4px_-2px_rgba(31,31,31,0.1)]']\n    }\n  ]\n})\n\nconst PointerBlocker = styled('div', {\n  base: [\n    'bottom-0',\n    'left-0',\n    'absolute',\n    'right-0',\n    'top-0',\n    'transition-all'\n  ],\n  variants: {\n    isVisible: {\n      true: ['delay-0', 'visible'],\n      false: ['delay-50', 'invisible']\n    }\n  }\n})\n\ntype SideBarProps = React.ComponentProps<typeof Root> & {\n  className?: string\n  offset?: number | string\n} & React.ComponentProps<typeof Theme>\n\nexport const SideBar = ({\n  theme,\n  className,\n  children,\n  type = 'expandable',\n  offset = '0px',\n  style,\n  ...rest\n}: SideBarProps) => {\n  const [isExpanded, setIsExpanded] = React.useState(type === 'static')\n  const ref = React.useRef<HTMLDivElement>(null)\n\n  useInteractOutside({\n    ref,\n    onInteractOutside: () => setIsExpanded(false)\n  })\n  const { focusWithinProps } = useFocusWithin({\n    onFocusWithin: () => setIsExpanded(true),\n    onBlurWithin: () => setIsExpanded(false)\n  })\n  const { hoverProps, isHovered } = useHover({\n    onHoverStart: () => setIsExpanded(true),\n    onHoverEnd: () => setIsExpanded(false)\n  })\n  const touchProps = {\n    onTouchEnd: () => setIsExpanded(true)\n  }\n\n  const expandableProps =\n    type === 'expandable'\n      ? {\n          ...focusWithinProps,\n          ...hoverProps,\n          ...touchProps,\n          ref\n        }\n      : {}\n\n  return (\n    <SideBarContext.Provider value={{ isExpanded }}>\n      <Theme theme={theme || light}>\n        <Root\n          {...rest}\n          style={{ ...style, '--offset': offset }}\n          type={type}\n          className={clsx(\n            'h-[calc(100svh-var(--offset))]',\n            'top-(--offset)',\n            className\n          )}\n        >\n          <Content {...expandableProps} isExpanded={isExpanded} type={type}>\n            {children}\n            {/**\n             * When the SideBar is collapsed, ensure that the initial tap event\n             * is used to expand the nav first before making the items available\n             */}\n            {type === 'expandable' && (\n              <PointerBlocker isVisible={!isHovered && !isExpanded} />\n            )}\n          </Content>\n        </Root>\n      </Theme>\n    </SideBarContext.Provider>\n  )\n}\n\nSideBar.Brand = SideBarBrand\nSideBar.BrandLogo = SideBarBrandLogo\nSideBar.BrandName = SideBarBrandName\nSideBar.Header = SideBarHeader\nSideBar.Body = SideBarBody\nSideBar.Footer = SideBarFooter\n\nSideBar.displayName = 'SideBar'\n"],"names":["light","Root","styled","Content","PointerBlocker","SideBar","theme","className","children","type","offset","style","rest","isExpanded","setIsExpanded","React","ref","useInteractOutside","focusWithinProps","useFocusWithin","hoverProps","isHovered","useHover","expandableProps","SideBarContext","Theme","clsx","SideBarBrand","SideBarBrandLogo","SideBarBrandName","SideBarHeader","SideBarBody","SideBarFooter"],"mappings":"6XAgBA,MAAMA,EAAQ,CACZ,eAAgB,QAChB,SAAU,wBACV,WAAY,uBACd,EAEMC,EAAOC,EAAO,MAAO,CACzB,KAAM,CAAC,SAAU,KAAK,EACtB,SAAU,CACR,KAAM,CACJ,OAAQ,CAAA,EACR,WAAY,CAAC,MAAM,CACrB,CACF,CACF,CAAC,EAEKC,EAAUD,EAAO,MAAO,CAC5B,KAAM,CACJ,oBACA,WACA,sBACA,2CACA,OACA,WACA,SACA,kBACA,oBACA,2BACA,uBACA,uCACF,EACA,SAAU,CACR,KAAM,CACJ,OAAQ,CACR,EAAA,WAAY,CACd,CAAA,EACA,WAAY,CACV,KAAM,CAAC,WAAW,EAClB,MAAO,CAAC,MAAM,CAChB,CACF,EACA,iBAAkB,CAChB,CACE,WAAY,GACZ,KAAM,aACN,MAAO,CAAC,4CAA4C,CACtD,CACF,CACF,CAAC,EAEKE,EAAiBF,EAAO,MAAO,CACnC,KAAM,CACJ,WACA,SACA,WACA,UACA,QACA,gBACF,EACA,SAAU,CACR,UAAW,CACT,KAAM,CAAC,UAAW,SAAS,EAC3B,MAAO,CAAC,WAAY,WAAW,CACjC,CACF,CACF,CAAC,EAOYG,EAAU,CAAC,CACtB,MAAAC,EACA,UAAAC,EACA,SAAAC,EACA,KAAAC,EAAO,aACP,OAAAC,EAAS,MACT,MAAAC,EACA,GAAGC,CACL,IAAoB,CAClB,KAAM,CAACC,EAAYC,CAAa,EAAIC,EAAM,SAASN,IAAS,QAAQ,EAC9DO,EAAMD,EAAM,OAAuB,IAAI,EAE7CE,EAAmB,CACjB,IAAAD,EACA,kBAAmB,IAAMF,EAAc,EAAK,CAC9C,CAAC,EACD,KAAM,CAAE,iBAAAI,CAAiB,EAAIC,EAAe,CAC1C,cAAe,IAAML,EAAc,EAAI,EACvC,aAAc,IAAMA,EAAc,EAAK,CACzC,CAAC,EACK,CAAE,WAAAM,EAAY,UAAAC,CAAU,EAAIC,EAAS,CACzC,aAAc,IAAMR,EAAc,EAAI,EACtC,WAAY,IAAMA,EAAc,EAAK,CACvC,CAAC,EAKKS,EACJd,IAAS,aACL,CACE,GAAGS,EACH,GAAGE,EAPT,WAAY,IAAMN,EAAc,EAAI,EAS9B,IAAAE,CACF,EACA,CAAA,EAEN,OACED,EAAA,cAACS,EAAe,SAAf,CAAwB,MAAO,CAAE,WAAAX,CAAW,CAAA,EAC3CE,EAAA,cAACU,EAAA,CAAM,MAAOnB,GAASN,GACrBe,EAAA,cAACd,EAAA,CACE,GAAGW,EACJ,MAAO,CAAE,GAAGD,EAAO,WAAYD,CAAO,EACtC,KAAMD,EACN,UAAWiB,EACT,iCACA,iBACAnB,CACF,CAEAQ,EAAAA,EAAA,cAACZ,EAAA,CAAS,GAAGoB,EAAiB,WAAYV,EAAY,KAAMJ,GACzDD,EAKAC,IAAS,cACRM,EAAA,cAACX,EAAA,CAAe,UAAW,CAACiB,GAAa,CAACR,CAAY,CAAA,CAE1D,CACF,CACF,CACF,CAEJ,EAEAR,EAAQ,MAAQsB,EAChBtB,EAAQ,UAAYuB,EACpBvB,EAAQ,UAAYwB,EACpBxB,EAAQ,OAASyB,EACjBzB,EAAQ,KAAO0B,EACf1B,EAAQ,OAAS2B,EAEjB3B,EAAQ,YAAc"}
+{"version":3,"file":"SideBar.js","names":[],"sources":["../../../src/components/side-bar/SideBar.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport React from 'react'\nimport { useFocusWithin, useHover, useInteractOutside } from 'react-aria'\n\nimport { styled, Theme } from '~/styled'\n\nimport {\n  SideBarBody,\n  SideBarBrand,\n  SideBarBrandLogo,\n  SideBarBrandName,\n  SideBarFooter,\n  SideBarHeader\n} from './SideBarComponents'\nimport { SideBarContext } from './SideBarContext'\n\nconst light = {\n  '--background': 'white',\n  '--text': 'var(--color-grey-800)',\n  '--border': 'var(--color-grey-200)'\n}\n\nconst Root = styled('div', {\n  base: ['sticky', 'z-1'],\n  variants: {\n    type: {\n      static: [],\n      expandable: ['w-22']\n    }\n  }\n})\n\nconst Content = styled('div', {\n  base: [\n    'bg-(--background)',\n    'border-r',\n    'border-r-(--border)',\n    'shadow-[4px_0_4px_-2px_rgba(31,31,31,0)]',\n    'flex',\n    'flex-col',\n    'h-full',\n    'overflow-hidden',\n    'will-change-width',\n    'motion-safe:duration-125',\n    'motion-safe:ease-out',\n    'motion-safe:transition-[shadow,width]'\n  ],\n  variants: {\n    type: {\n      static: [],\n      expandable: []\n    },\n    isExpanded: {\n      true: ['w-[16rem]'],\n      false: ['w-22']\n    }\n  },\n  compoundVariants: [\n    {\n      isExpanded: true,\n      type: 'expandable',\n      class: ['shadow-[4px_0_4px_-2px_rgba(31,31,31,0.1)]']\n    }\n  ]\n})\n\nconst PointerBlocker = styled('div', {\n  base: [\n    'bottom-0',\n    'left-0',\n    'absolute',\n    'right-0',\n    'top-0',\n    'transition-all'\n  ],\n  variants: {\n    isVisible: {\n      true: ['delay-0', 'visible'],\n      false: ['delay-50', 'invisible']\n    }\n  }\n})\n\ntype SideBarProps = React.ComponentProps<typeof Root> & {\n  className?: string\n  offset?: number | string\n} & React.ComponentProps<typeof Theme>\n\nexport const SideBar = ({\n  theme,\n  className,\n  children,\n  type = 'expandable',\n  offset = '0px',\n  style,\n  ...rest\n}: SideBarProps) => {\n  const [isExpanded, setIsExpanded] = React.useState(type === 'static')\n  const ref = React.useRef<HTMLDivElement>(null)\n\n  useInteractOutside({\n    ref,\n    onInteractOutside: () => setIsExpanded(false)\n  })\n  const { focusWithinProps } = useFocusWithin({\n    onFocusWithin: () => setIsExpanded(true),\n    onBlurWithin: () => setIsExpanded(false)\n  })\n  const { hoverProps, isHovered } = useHover({\n    onHoverStart: () => setIsExpanded(true),\n    onHoverEnd: () => setIsExpanded(false)\n  })\n  const touchProps = {\n    onTouchEnd: () => setIsExpanded(true)\n  }\n\n  const expandableProps =\n    type === 'expandable'\n      ? {\n          ...focusWithinProps,\n          ...hoverProps,\n          ...touchProps,\n          ref\n        }\n      : {}\n\n  return (\n    <SideBarContext.Provider value={{ isExpanded }}>\n      <Theme theme={theme || light}>\n        <Root\n          {...rest}\n          style={{ ...style, '--offset': offset }}\n          type={type}\n          className={clsx(\n            'h-[calc(100svh-var(--offset))]',\n            'top-(--offset)',\n            className\n          )}\n        >\n          <Content {...expandableProps} isExpanded={isExpanded} type={type}>\n            {children}\n            {/**\n             * When the SideBar is collapsed, ensure that the initial tap event\n             * is used to expand the nav first before making the items available\n             */}\n            {type === 'expandable' && (\n              <PointerBlocker isVisible={!isHovered && !isExpanded} />\n            )}\n          </Content>\n        </Root>\n      </Theme>\n    </SideBarContext.Provider>\n  )\n}\n\nSideBar.Brand = SideBarBrand\nSideBar.BrandLogo = SideBarBrandLogo\nSideBar.BrandName = SideBarBrandName\nSideBar.Header = SideBarHeader\nSideBar.Body = SideBarBody\nSideBar.Footer = SideBarFooter\n\nSideBar.displayName = 'SideBar'\n"],"mappings":";;;;;;;AAgBA,IAAM,IAAQ;CACZ,gBAAgB;CAChB,UAAU;CACV,YAAY;CACb,EAEK,IAAO,EAAO,OAAO;CACzB,MAAM,CAAC,UAAU,MAAM;CACvB,UAAU,EACR,MAAM;EACJ,QAAQ,EAAE;EACV,YAAY,CAAC,OAAO;EACrB,EACF;CACF,CAAC,EAEI,IAAU,EAAO,OAAO;CAC5B,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,MAAM;GACJ,QAAQ,EAAE;GACV,YAAY,EAAE;GACf;EACD,YAAY;GACV,MAAM,CAAC,YAAY;GACnB,OAAO,CAAC,OAAO;GAChB;EACF;CACD,kBAAkB,CAChB;EACE,YAAY;EACZ,MAAM;EACN,OAAO,CAAC,6CAA6C;EACtD,CACF;CACF,CAAC,EAEI,IAAiB,EAAO,OAAO;CACnC,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU,EACR,WAAW;EACT,MAAM,CAAC,WAAW,UAAU;EAC5B,OAAO,CAAC,YAAY,YAAY;EACjC,EACF;CACF,CAAC,EAOW,KAAW,EACtB,UACA,cACA,aACA,UAAO,cACP,YAAS,OACT,UACA,GAAG,QACe;CAClB,IAAM,CAAC,GAAY,KAAiB,EAAM,SAAS,MAAS,SAAS,EAC/D,IAAM,EAAM,OAAuB,KAAK;AAE9C,GAAmB;EACjB;EACA,yBAAyB,EAAc,GAAM;EAC9C,CAAC;CACF,IAAM,EAAE,wBAAqB,EAAe;EAC1C,qBAAqB,EAAc,GAAK;EACxC,oBAAoB,EAAc,GAAM;EACzC,CAAC,EACI,EAAE,eAAY,iBAAc,EAAS;EACzC,oBAAoB,EAAc,GAAK;EACvC,kBAAkB,EAAc,GAAM;EACvC,CAAC,EACI,IAAa,EACjB,kBAAkB,EAAc,GAAK,EACtC,EAEK,IACJ,MAAS,eACL;EACE,GAAG;EACH,GAAG;EACH,GAAG;EACH;EACD,GACD,EAAE;AAER,QACE,kBAAA,cAAC,EAAe,UAAhB,EAAyB,OAAO,EAAE,eAAY,EAwBpB,EAvBxB,kBAAA,cAAC,GAAD,EAAO,OAAO,KAAS,GAsBf,EArBN,kBAAA,cAAC,GAAD;EACE,GAAI;EACJ,OAAO;GAAE,GAAG;GAAO,YAAY;GAAQ;EACjC;EACN,WAAW,EACT,kCACA,kBACA,EACD;EAYI,EAVL,kBAAA,cAAC,GAAD;EAAS,GAAI;EAA6B;EAAkB;EASlD,EARP,GAKA,MAAS,gBACR,kBAAA,cAAC,GAAD,EAAgB,WAAW,CAAC,KAAa,CAAC,GAAc,CAAA,CAElD,CACL,CACD,CACgB;;AAI9B,EAAQ,QAAQ,GAChB,EAAQ,YAAY,GACpB,EAAQ,YAAY,GACpB,EAAQ,SAAS,GACjB,EAAQ,OAAO,GACf,EAAQ,SAAS,GAEjB,EAAQ,cAAc"}

package/dist/components/side-bar/SideBarComponents.js

@@ -1,2 +1,33 @@
-import{styled as e}from"../../styled.js";import{Image as r}from"../image/Image.js";import{Text as o}from"../text/Text.js";const d=e("div",{base:["border-b","border-b-(--border)","p-4","w-full"]}),t=e("div",{base:["grow","overflow-y-auto","overflow-x-hidden","p-4","w-full"]}),a=e("div",{base:["border-t","border-t-(--border)","p-4","w-full"]}),i=e("a",{base:["items-end","text-text","flex","gap-4","no-underline","hover:no-underline","focus:no-underline"]}),n=i,b=r,l=e(o,{base:["text-text","whitespace-nowrap"]});export{t as SideBarBody,n as SideBarBrand,b as SideBarBrandLogo,l as SideBarBrandName,a as SideBarFooter,d as SideBarHeader};
-//# sourceMappingURL=SideBarComponents.js.map
+import { styled as e } from "../../styled.js";
+import { Text as t } from "../text/Text.js";
+import { Image as n } from "../image/Image.js";
+//#region src/components/side-bar/SideBarComponents.tsx
+var r = e("div", { base: [
+	"border-b",
+	"border-b-(--border)",
+	"p-4",
+	"w-full"
+] }), i = e("div", { base: [
+	"grow",
+	"overflow-y-auto",
+	"overflow-x-hidden",
+	"p-4",
+	"w-full"
+] }), a = e("div", { base: [
+	"border-t",
+	"border-t-(--border)",
+	"p-4",
+	"w-full"
+] }), o = e("a", { base: [
+	"items-end",
+	"text-text",
+	"flex",
+	"gap-4",
+	"no-underline",
+	"hover:no-underline",
+	"focus:no-underline"
+] }), s = n, c = e(t, { base: ["text-text", "whitespace-nowrap"] });
+//#endregion
+export { i as SideBarBody, o as SideBarBrand, s as SideBarBrandLogo, c as SideBarBrandName, a as SideBarFooter, r as SideBarHeader };
+
+//# sourceMappingURL=SideBarComponents.js.map

package/dist/components/side-bar/SideBarComponents.js.map

@@ -1 +1 @@
-{"version":3,"file":"SideBarComponents.js","sources":["../../../src/components/side-bar/SideBarComponents.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Image } from '../image/Image'\nimport { Text } from '../text/Text'\n\nexport const SideBarHeader = styled('div', {\n  base: ['border-b', 'border-b-(--border)', 'p-4', 'w-full']\n})\n\nexport const SideBarBody = styled('div', {\n  base: ['grow', 'overflow-y-auto', 'overflow-x-hidden', 'p-4', 'w-full']\n})\n\nexport const SideBarFooter = styled('div', {\n  base: ['border-t', 'border-t-(--border)', 'p-4', 'w-full']\n})\n\nconst StyledSideBarBrand = styled('a', {\n  base: [\n    'items-end',\n    'text-text',\n    'flex',\n    'gap-4',\n    'no-underline',\n    'hover:no-underline',\n    'focus:no-underline'\n  ]\n})\n\nexport const SideBarBrand =\n  StyledSideBarBrand as React.ForwardRefExoticComponent<\n    React.ComponentPropsWithRef<'a'> & { as?: React.ElementType }\n  >\n\nexport const SideBarBrandLogo = Image\n\nexport const SideBarBrandName = styled(Text, {\n  base: ['text-text', 'whitespace-nowrap']\n})\n"],"names":["SideBarHeader","styled","SideBarBody","SideBarFooter","StyledSideBarBrand","SideBarBrand","SideBarBrandLogo","Image","SideBarBrandName","Text"],"mappings":"0HAOa,MAAAA,EAAgBC,EAAO,MAAO,CACzC,KAAM,CAAC,WAAY,sBAAuB,MAAO,QAAQ,CAC3D,CAAC,EAEYC,EAAcD,EAAO,MAAO,CACvC,KAAM,CAAC,OAAQ,kBAAmB,oBAAqB,MAAO,QAAQ,CACxE,CAAC,EAEYE,EAAgBF,EAAO,MAAO,CACzC,KAAM,CAAC,WAAY,sBAAuB,MAAO,QAAQ,CAC3D,CAAC,EAEKG,EAAqBH,EAAO,IAAK,CACrC,KAAM,CACJ,YACA,YACA,OACA,QACA,eACA,qBACA,oBACF,CACF,CAAC,EAEYI,EACXD,EAIWE,EAAmBC,EAEnBC,EAAmBP,EAAOQ,EAAM,CAC3C,KAAM,CAAC,YAAa,mBAAmB,CACzC,CAAC"}
+{"version":3,"file":"SideBarComponents.js","names":[],"sources":["../../../src/components/side-bar/SideBarComponents.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Image } from '../image/Image'\nimport { Text } from '../text/Text'\n\nexport const SideBarHeader = styled('div', {\n  base: ['border-b', 'border-b-(--border)', 'p-4', 'w-full']\n})\n\nexport const SideBarBody = styled('div', {\n  base: ['grow', 'overflow-y-auto', 'overflow-x-hidden', 'p-4', 'w-full']\n})\n\nexport const SideBarFooter = styled('div', {\n  base: ['border-t', 'border-t-(--border)', 'p-4', 'w-full']\n})\n\nconst StyledSideBarBrand = styled('a', {\n  base: [\n    'items-end',\n    'text-text',\n    'flex',\n    'gap-4',\n    'no-underline',\n    'hover:no-underline',\n    'focus:no-underline'\n  ]\n})\n\nexport const SideBarBrand =\n  StyledSideBarBrand as React.ForwardRefExoticComponent<\n    React.ComponentPropsWithRef<'a'> & { as?: React.ElementType }\n  >\n\nexport const SideBarBrandLogo = Image\n\nexport const SideBarBrandName = styled(Text, {\n  base: ['text-text', 'whitespace-nowrap']\n})\n"],"mappings":";;;;AAOA,IAAa,IAAgB,EAAO,OAAO,EACzC,MAAM;CAAC;CAAY;CAAuB;CAAO;CAAS,EAC3D,CAAC,EAEW,IAAc,EAAO,OAAO,EACvC,MAAM;CAAC;CAAQ;CAAmB;CAAqB;CAAO;CAAS,EACxE,CAAC,EAEW,IAAgB,EAAO,OAAO,EACzC,MAAM;CAAC;CAAY;CAAuB;CAAO;CAAS,EAC3D,CAAC,EAcW,IAZc,EAAO,KAAK,EACrC,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EACF,CAAC,EAOW,IAAmB,GAEnB,IAAmB,EAAO,GAAM,EAC3C,MAAM,CAAC,aAAa,oBAAoB,EACzC,CAAC"}

package/dist/components/side-bar/SideBarContext.js

@@ -1,2 +1,7 @@
-import*as e from"react";const t=e.createContext({isExpanded:void 0}),o=()=>e.useContext(t);export{t as SideBarContext,o as useSidebarState};
-//# sourceMappingURL=SideBarContext.js.map
+import * as e from "react";
+//#region src/components/side-bar/SideBarContext.tsx
+var t = e.createContext({ isExpanded: void 0 }), n = () => e.useContext(t);
+//#endregion
+export { t as SideBarContext, n as useSidebarState };
+
+//# sourceMappingURL=SideBarContext.js.map

package/dist/components/side-bar/SideBarContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"SideBarContext.js","sources":["../../../src/components/side-bar/SideBarContext.tsx"],"sourcesContent":["import * as React from 'react'\n\nexport const SideBarContext = React.createContext<{\n  isExpanded?: boolean\n}>({\n  isExpanded: undefined\n})\n\nexport const useSidebarState = () => React.useContext(SideBarContext)\n"],"names":["SideBarContext","React","useSidebarState"],"mappings":"wBAEa,MAAAA,EAAiBC,EAAM,cAEjC,CACD,WAAY,MACd,CAAC,EAEYC,EAAkB,IAAMD,EAAM,WAAWD,CAAc"}
+{"version":3,"file":"SideBarContext.js","names":[],"sources":["../../../src/components/side-bar/SideBarContext.tsx"],"sourcesContent":["import * as React from 'react'\n\nexport const SideBarContext = React.createContext<{\n  isExpanded?: boolean\n}>({\n  isExpanded: undefined\n})\n\nexport const useSidebarState = () => React.useContext(SideBarContext)\n"],"mappings":";;AAEA,IAAa,IAAiB,EAAM,cAEjC,EACD,YAAY,KAAA,GACb,CAAC,EAEW,UAAwB,EAAM,WAAW,EAAe"}

package/dist/components/skeleton-loader/Skeleton.js

@@ -1,2 +1,12 @@
-import{styled as o}from"../../styled.js";const e=o("div",{base:["bg-grey-300","size-16","animate-shimmer"]});e.displayName="Skeleton";export{e as SkeletonLoader};
-//# sourceMappingURL=Skeleton.js.map
+import { styled as e } from "../../styled.js";
+//#region src/components/skeleton-loader/Skeleton.tsx
+var t = e("div", { base: [
+	"bg-grey-300",
+	"size-16",
+	"animate-shimmer"
+] });
+t.displayName = "Skeleton";
+//#endregion
+export { t as SkeletonLoader };
+
+//# sourceMappingURL=Skeleton.js.map

package/dist/components/skeleton-loader/Skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"Skeleton.js","sources":["../../../src/components/skeleton-loader/Skeleton.tsx"],"sourcesContent":["import { styled } from '~/styled'\n\nexport const SkeletonLoader = styled('div', {\n  base: ['bg-grey-300', 'size-16', 'animate-shimmer']\n})\n\nSkeletonLoader.displayName = 'Skeleton'\n"],"names":["SkeletonLoader","styled"],"mappings":"yCAEa,MAAAA,EAAiBC,EAAO,MAAO,CAC1C,KAAM,CAAC,cAAe,UAAW,iBAAiB,CACpD,CAAC,EAEDD,EAAe,YAAc"}
+{"version":3,"file":"Skeleton.js","names":[],"sources":["../../../src/components/skeleton-loader/Skeleton.tsx"],"sourcesContent":["import { styled } from '~/styled'\n\nexport const SkeletonLoader = styled('div', {\n  base: ['bg-grey-300', 'size-16', 'animate-shimmer']\n})\n\nSkeletonLoader.displayName = 'Skeleton'\n"],"mappings":";;AAEA,IAAa,IAAiB,EAAO,OAAO,EAC1C,MAAM;CAAC;CAAe;CAAW;CAAkB,EACpD,CAAC;AAEF,EAAe,cAAc"}

package/dist/components/skeleton-loader/SkeletonButton.js

@@ -1,2 +1,9 @@
-import o from"clsx";import t from"react";import{SkeletonLoader as m}from"./Skeleton.js";const r=({className:e})=>t.createElement(m,{className:o("w-[10rem]","h-8","rounded-sm",e)});export{r as SkeletonButton};
-//# sourceMappingURL=SkeletonButton.js.map
+import { SkeletonLoader as e } from "./Skeleton.js";
+import t from "clsx";
+import n from "react";
+//#region src/components/skeleton-loader/SkeletonButton.tsx
+var r = ({ className: r }) => /* @__PURE__ */ n.createElement(e, { className: t("w-[10rem]", "h-8", "rounded-sm", r) });
+//#endregion
+export { r as SkeletonButton };
+
+//# sourceMappingURL=SkeletonButton.js.map

package/dist/components/skeleton-loader/SkeletonButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"SkeletonButton.js","sources":["../../../src/components/skeleton-loader/SkeletonButton.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport React from 'react'\n\nimport { SkeletonLoader } from './Skeleton'\n\nexport const SkeletonButton = ({\n  className\n}: {\n  className?: React.ComponentProps<typeof SkeletonLoader>['className']\n}) => (\n  <SkeletonLoader\n    className={clsx('w-[10rem]', 'h-8', 'rounded-sm', className)}\n  />\n)\n"],"names":["SkeletonButton","className","React","SkeletonLoader","clsx"],"mappings":"wFAKa,MAAAA,EAAiB,CAAC,CAC7B,UAAAC,CACF,IAGEC,EAAA,cAACC,EAAA,CACC,UAAWC,EAAK,YAAa,MAAO,aAAcH,CAAS,CAC7D,CAAA"}
+{"version":3,"file":"SkeletonButton.js","names":[],"sources":["../../../src/components/skeleton-loader/SkeletonButton.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport React from 'react'\n\nimport { SkeletonLoader } from './Skeleton'\n\nexport const SkeletonButton = ({\n  className\n}: {\n  className?: React.ComponentProps<typeof SkeletonLoader>['className']\n}) => (\n  <SkeletonLoader\n    className={clsx('w-[10rem]', 'h-8', 'rounded-sm', className)}\n  />\n)\n"],"mappings":";;;;AAKA,IAAa,KAAkB,EAC7B,mBAIA,kBAAA,cAAC,GAAD,EACE,WAAW,EAAK,aAAa,OAAO,cAAc,EAAU,EAC5D,CAAA"}

package/dist/components/skeleton-loader/SkeletonCard.js

@@ -1,2 +1,23 @@
-import e from"react";import{Flex as r}from"../flex/Flex.js";import{Tile as a}from"../tile/Tile.js";import{SkeletonLoader as n}from"./Skeleton.js";import{SkeletonButton as c}from"./SkeletonButton.js";import{SkeletonDoughnutChart as i}from"./SkeletonDoughnutChart.js";const f=({numberOfRows:l=3,withChart:m})=>e.createElement(a,{className:"relative w-full flex-col items-center gap-6 p-6"},e.createElement(r,{gap:"6",align:"center",className:"w-full"},m&&e.createElement(i,null),e.createElement(r,{direction:"column",gap:"24",className:"grow"},Array.from({length:l},(t,o)=>o).map(t=>e.createElement(n,{key:t,className:"bg-grey-200 h-10 w-full min-w-25 rounded-md"})))),e.createElement(c,null));export{f as SkeletonCard};
-//# sourceMappingURL=SkeletonCard.js.map
+import { Flex as e } from "../flex/Flex.js";
+import { SkeletonLoader as t } from "./Skeleton.js";
+import { SkeletonButton as n } from "./SkeletonButton.js";
+import { Tile as r } from "../tile/Tile.js";
+import { SkeletonDoughnutChart as i } from "./SkeletonDoughnutChart.js";
+import a from "react";
+//#region src/components/skeleton-loader/SkeletonCard.tsx
+var o = ({ numberOfRows: o = 3, withChart: s }) => /* @__PURE__ */ a.createElement(r, { className: "relative w-full flex-col items-center gap-6 p-6" }, /* @__PURE__ */ a.createElement(e, {
+	gap: "6",
+	align: "center",
+	className: "w-full"
+}, s && /* @__PURE__ */ a.createElement(i, null), /* @__PURE__ */ a.createElement(e, {
+	direction: "column",
+	gap: "24",
+	className: "grow"
+}, Array.from({ length: o }, (e, t) => t).map((e) => /* @__PURE__ */ a.createElement(t, {
+	key: e,
+	className: "bg-grey-200 h-10 w-full min-w-25 rounded-md"
+})))), /* @__PURE__ */ a.createElement(n, null));
+//#endregion
+export { o as SkeletonCard };
+
+//# sourceMappingURL=SkeletonCard.js.map

package/dist/components/skeleton-loader/SkeletonCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"SkeletonCard.js","sources":["../../../src/components/skeleton-loader/SkeletonCard.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Flex } from '../flex/Flex'\nimport { Tile } from '../tile/Tile'\nimport { SkeletonLoader } from './Skeleton'\nimport { SkeletonButton } from './SkeletonButton'\nimport { SkeletonDoughnutChart } from './SkeletonDoughnutChart'\n\nexport const SkeletonCard = ({\n  numberOfRows = 3,\n  withChart\n}: {\n  numberOfRows?: number\n  withChart?: boolean\n}) => (\n  <Tile className=\"relative w-full flex-col items-center gap-6 p-6\">\n    <Flex gap=\"6\" align=\"center\" className=\"w-full\">\n      {withChart && <SkeletonDoughnutChart />}\n      <Flex direction=\"column\" gap=\"24\" className=\"grow\">\n        {Array.from({ length: numberOfRows }, (_, index) => index).map(\n          (rowNumber) => (\n            <SkeletonLoader\n              key={rowNumber}\n              className=\"bg-grey-200 h-10 w-full min-w-25 rounded-md\"\n            />\n          )\n        )}\n      </Flex>\n    </Flex>\n    <SkeletonButton />\n  </Tile>\n)\n"],"names":["SkeletonCard","numberOfRows","withChart","React","Tile","Flex","SkeletonDoughnutChart","_","index","rowNumber","SkeletonLoader","SkeletonButton"],"mappings":"gRAQaA,EAAe,CAAC,CAC3B,aAAAC,EAAe,EACf,UAAAC,CACF,IAIEC,EAAA,cAACC,EAAA,CAAK,UAAU,mDACdD,EAAA,cAACE,EAAA,CAAK,IAAI,IAAI,MAAM,SAAS,UAAU,QACpCH,EAAAA,GAAaC,EAAA,cAACG,EAAA,IAAsB,EACrCH,EAAA,cAACE,EAAA,CAAK,UAAU,SAAS,IAAI,KAAK,UAAU,MAAA,EACzC,MAAM,KAAK,CAAE,OAAQJ,CAAa,EAAG,CAACM,EAAGC,IAAUA,CAAK,EAAE,IACxDC,GACCN,EAAA,cAACO,EAAA,CACC,IAAKD,EACL,UAAU,6CAAA,CACZ,CAEJ,CACF,CACF,EACAN,EAAA,cAACQ,EAAA,IAAe,CAClB"}
+{"version":3,"file":"SkeletonCard.js","names":[],"sources":["../../../src/components/skeleton-loader/SkeletonCard.tsx"],"sourcesContent":["import React from 'react'\n\nimport { Flex } from '../flex/Flex'\nimport { Tile } from '../tile/Tile'\nimport { SkeletonLoader } from './Skeleton'\nimport { SkeletonButton } from './SkeletonButton'\nimport { SkeletonDoughnutChart } from './SkeletonDoughnutChart'\n\nexport const SkeletonCard = ({\n  numberOfRows = 3,\n  withChart\n}: {\n  numberOfRows?: number\n  withChart?: boolean\n}) => (\n  <Tile className=\"relative w-full flex-col items-center gap-6 p-6\">\n    <Flex gap=\"6\" align=\"center\" className=\"w-full\">\n      {withChart && <SkeletonDoughnutChart />}\n      <Flex direction=\"column\" gap=\"24\" className=\"grow\">\n        {Array.from({ length: numberOfRows }, (_, index) => index).map(\n          (rowNumber) => (\n            <SkeletonLoader\n              key={rowNumber}\n              className=\"bg-grey-200 h-10 w-full min-w-25 rounded-md\"\n            />\n          )\n        )}\n      </Flex>\n    </Flex>\n    <SkeletonButton />\n  </Tile>\n)\n"],"mappings":";;;;;;;AAQA,IAAa,KAAgB,EAC3B,kBAAe,GACf,mBAKA,kBAAA,cAAC,GAAD,EAAM,WAAU,mDAeT,EAdL,kBAAA,cAAC,GAAD;CAAM,KAAI;CAAI,OAAM;CAAS,WAAU;CAYhC,EAXJ,KAAa,kBAAA,cAAC,GAAA,KAAwB,EACvC,kBAAA,cAAC,GAAD;CAAM,WAAU;CAAS,KAAI;CAAK,WAAU;CASrC,EARJ,MAAM,KAAK,EAAE,QAAQ,GAAc,GAAG,GAAG,MAAU,EAAM,CAAC,KACxD,MACC,kBAAA,cAAC,GAAD;CACE,KAAK;CACL,WAAU;CACV,CAAA,CAEL,CACI,CACF,EACP,kBAAA,cAAC,GAAA,KAAiB,CACb"}

package/dist/components/skeleton-loader/SkeletonDoughnutChart.js

@@ -1,2 +1,60 @@
-import t from"clsx";import e from"react";import{Tile as l}from"../tile/Tile.js";const r=()=>e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:120,height:121,fill:"none",className:"animate-shimmer"},e.createElement("mask",{id:"a",fill:"#fff"},e.createElement("path",{d:"m117 60 3 3a60 60 0 0 1-39 53q-2 1-4-2l-5-17q-1-2 2-4a36 36 0 0 0 22-30q0-2 3-3z"})),e.createElement("path",{className:"fill-grey-300",stroke:"#fff",strokeWidth:1.6,d:"m117 60 3 3a60 60 0 0 1-39 53q-2 1-4-2l-5-17q-1-2 2-4a36 36 0 0 0 22-30q0-2 3-3z",mask:"url(#a)"}),e.createElement("mask",{id:"b",fill:"#fff"},e.createElement("path",{d:"M117 60q2 0 3-3A60 60 0 0 0 81 4l-4 2-5 17q-1 4 2 4a36 36 0 0 1 22 30q0 3 3 3z"})),e.createElement("path",{className:"fill-grey-300",stroke:"#fff",strokeWidth:1.6,d:"M117 60q2 0 3-3A60 60 0 0 0 81 4l-4 2-5 17q-1 4 2 4a36 36 0 0 1 22 30q0 3 3 3z",mask:"url(#b)"}),e.createElement("mask",{id:"c",fill:"#fff"},e.createElement("path",{d:"M77 6q1-2-2-4a60 60 0 0 0-62 21q-1 2 1 4l14 10h5a36 36 0 0 1 35-12q3 1 4-2z"})),e.createElement("path",{className:"fill-grey-300",stroke:"#fff",strokeWidth:1.6,d:"M77 6q1-2-2-4a60 60 0 0 0-62 21q-1 2 1 4l14 10h5a36 36 0 0 1 35-12q3 1 4-2z",mask:"url(#c)"}),e.createElement("mask",{id:"d",fill:"#fff"},e.createElement("path",{d:"M14 93q-3 2-1 5a60 60 0 0 0 62 20l2-4-5-16-4-3a36 36 0 0 1-35-11q-3-3-5-1z"})),e.createElement("path",{className:"fill-grey-300",stroke:"#fff",strokeWidth:1.6,d:"M14 93q-3 2-1 5a60 60 0 0 0 62 20l2-4-5-16-4-3a36 36 0 0 1-35-11q-3-3-5-1z",mask:"url(#d)"}),e.createElement("mask",{id:"e",fill:"#fff"},e.createElement("path",{d:"M14 27q-2-2-4 1a60 60 0 0 0 0 65q1 2 4 0l14-10q3-2 1-4a36 36 0 0 1 0-37q2-3-1-5z"})),e.createElement("path",{className:"fill-grey-300",stroke:"#fff",strokeWidth:1.6,d:"M14 27q-2-2-4 1a60 60 0 0 0 0 65q1 2 4 0l14-10q3-2 1-4a36 36 0 0 1 0-37q2-3-1-5z",mask:"url(#e)"})),m=({containerCss:a})=>e.createElement(l,{className:t("p-6","flex-row","gap-4","relative",a)},e.createElement(r,null));export{m as SkeletonDoughnutChart};
-//# sourceMappingURL=SkeletonDoughnutChart.js.map
+import { Tile as e } from "../tile/Tile.js";
+import t from "clsx";
+import n from "react";
+//#region src/components/skeleton-loader/SkeletonDoughnutChart.tsx
+var r = () => /* @__PURE__ */ n.createElement("svg", {
+	xmlns: "http://www.w3.org/2000/svg",
+	width: 120,
+	height: 121,
+	fill: "none",
+	className: "animate-shimmer"
+}, /* @__PURE__ */ n.createElement("mask", {
+	id: "a",
+	fill: "#fff"
+}, /* @__PURE__ */ n.createElement("path", { d: "m117 60 3 3a60 60 0 0 1-39 53q-2 1-4-2l-5-17q-1-2 2-4a36 36 0 0 0 22-30q0-2 3-3z" })), /* @__PURE__ */ n.createElement("path", {
+	className: "fill-grey-300",
+	stroke: "#fff",
+	strokeWidth: 1.6,
+	d: "m117 60 3 3a60 60 0 0 1-39 53q-2 1-4-2l-5-17q-1-2 2-4a36 36 0 0 0 22-30q0-2 3-3z",
+	mask: "url(#a)"
+}), /* @__PURE__ */ n.createElement("mask", {
+	id: "b",
+	fill: "#fff"
+}, /* @__PURE__ */ n.createElement("path", { d: "M117 60q2 0 3-3A60 60 0 0 0 81 4l-4 2-5 17q-1 4 2 4a36 36 0 0 1 22 30q0 3 3 3z" })), /* @__PURE__ */ n.createElement("path", {
+	className: "fill-grey-300",
+	stroke: "#fff",
+	strokeWidth: 1.6,
+	d: "M117 60q2 0 3-3A60 60 0 0 0 81 4l-4 2-5 17q-1 4 2 4a36 36 0 0 1 22 30q0 3 3 3z",
+	mask: "url(#b)"
+}), /* @__PURE__ */ n.createElement("mask", {
+	id: "c",
+	fill: "#fff"
+}, /* @__PURE__ */ n.createElement("path", { d: "M77 6q1-2-2-4a60 60 0 0 0-62 21q-1 2 1 4l14 10h5a36 36 0 0 1 35-12q3 1 4-2z" })), /* @__PURE__ */ n.createElement("path", {
+	className: "fill-grey-300",
+	stroke: "#fff",
+	strokeWidth: 1.6,
+	d: "M77 6q1-2-2-4a60 60 0 0 0-62 21q-1 2 1 4l14 10h5a36 36 0 0 1 35-12q3 1 4-2z",
+	mask: "url(#c)"
+}), /* @__PURE__ */ n.createElement("mask", {
+	id: "d",
+	fill: "#fff"
+}, /* @__PURE__ */ n.createElement("path", { d: "M14 93q-3 2-1 5a60 60 0 0 0 62 20l2-4-5-16-4-3a36 36 0 0 1-35-11q-3-3-5-1z" })), /* @__PURE__ */ n.createElement("path", {
+	className: "fill-grey-300",
+	stroke: "#fff",
+	strokeWidth: 1.6,
+	d: "M14 93q-3 2-1 5a60 60 0 0 0 62 20l2-4-5-16-4-3a36 36 0 0 1-35-11q-3-3-5-1z",
+	mask: "url(#d)"
+}), /* @__PURE__ */ n.createElement("mask", {
+	id: "e",
+	fill: "#fff"
+}, /* @__PURE__ */ n.createElement("path", { d: "M14 27q-2-2-4 1a60 60 0 0 0 0 65q1 2 4 0l14-10q3-2 1-4a36 36 0 0 1 0-37q2-3-1-5z" })), /* @__PURE__ */ n.createElement("path", {
+	className: "fill-grey-300",
+	stroke: "#fff",
+	strokeWidth: 1.6,
+	d: "M14 27q-2-2-4 1a60 60 0 0 0 0 65q1 2 4 0l14-10q3-2 1-4a36 36 0 0 1 0-37q2-3-1-5z",
+	mask: "url(#e)"
+})), i = ({ containerCss: i }) => /* @__PURE__ */ n.createElement(e, { className: t("p-6", "flex-row", "gap-4", "relative", i) }, /* @__PURE__ */ n.createElement(r, null));
+//#endregion
+export { i as SkeletonDoughnutChart };
+
+//# sourceMappingURL=SkeletonDoughnutChart.js.map

package/dist/components/skeleton-loader/SkeletonDoughnutChart.js.map

@@ -1 +1 @@
-{"version":3,"file":"SkeletonDoughnutChart.js","sources":["../../../src/components/skeleton-loader/SkeletonDoughnutChart.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport React from 'react'\n\nimport { Tile } from '../tile/Tile'\n\nconst DoughnutSvg = () => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    width={120}\n    height={121}\n    fill=\"none\"\n    className=\"animate-shimmer\"\n  >\n    <mask id=\"a\" fill=\"#fff\">\n      <path d=\"m117 60 3 3a60 60 0 0 1-39 53q-2 1-4-2l-5-17q-1-2 2-4a36 36 0 0 0 22-30q0-2 3-3z\" />\n    </mask>\n    <path\n      className=\"fill-grey-300\"\n      stroke=\"#fff\"\n      strokeWidth={1.6}\n      d=\"m117 60 3 3a60 60 0 0 1-39 53q-2 1-4-2l-5-17q-1-2 2-4a36 36 0 0 0 22-30q0-2 3-3z\"\n      mask=\"url(#a)\"\n    />\n    <mask id=\"b\" fill=\"#fff\">\n      <path d=\"M117 60q2 0 3-3A60 60 0 0 0 81 4l-4 2-5 17q-1 4 2 4a36 36 0 0 1 22 30q0 3 3 3z\" />\n    </mask>\n    <path\n      className=\"fill-grey-300\"\n      stroke=\"#fff\"\n      strokeWidth={1.6}\n      d=\"M117 60q2 0 3-3A60 60 0 0 0 81 4l-4 2-5 17q-1 4 2 4a36 36 0 0 1 22 30q0 3 3 3z\"\n      mask=\"url(#b)\"\n    />\n    <mask id=\"c\" fill=\"#fff\">\n      <path d=\"M77 6q1-2-2-4a60 60 0 0 0-62 21q-1 2 1 4l14 10h5a36 36 0 0 1 35-12q3 1 4-2z\" />\n    </mask>\n    <path\n      className=\"fill-grey-300\"\n      stroke=\"#fff\"\n      strokeWidth={1.6}\n      d=\"M77 6q1-2-2-4a60 60 0 0 0-62 21q-1 2 1 4l14 10h5a36 36 0 0 1 35-12q3 1 4-2z\"\n      mask=\"url(#c)\"\n    />\n    <mask id=\"d\" fill=\"#fff\">\n      <path d=\"M14 93q-3 2-1 5a60 60 0 0 0 62 20l2-4-5-16-4-3a36 36 0 0 1-35-11q-3-3-5-1z\" />\n    </mask>\n    <path\n      className=\"fill-grey-300\"\n      stroke=\"#fff\"\n      strokeWidth={1.6}\n      d=\"M14 93q-3 2-1 5a60 60 0 0 0 62 20l2-4-5-16-4-3a36 36 0 0 1-35-11q-3-3-5-1z\"\n      mask=\"url(#d)\"\n    />\n    <mask id=\"e\" fill=\"#fff\">\n      <path d=\"M14 27q-2-2-4 1a60 60 0 0 0 0 65q1 2 4 0l14-10q3-2 1-4a36 36 0 0 1 0-37q2-3-1-5z\" />\n    </mask>\n    <path\n      className=\"fill-grey-300\"\n      stroke=\"#fff\"\n      strokeWidth={1.6}\n      d=\"M14 27q-2-2-4 1a60 60 0 0 0 0 65q1 2 4 0l14-10q3-2 1-4a36 36 0 0 1 0-37q2-3-1-5z\"\n      mask=\"url(#e)\"\n    />\n  </svg>\n)\n\nexport const SkeletonDoughnutChart = ({\n  containerCss\n}: {\n  containerCss?: string\n}) => (\n  <Tile className={clsx('p-6', 'flex-row', 'gap-4', 'relative', containerCss)}>\n    <DoughnutSvg />\n  </Tile>\n)\n"],"names":["DoughnutSvg","React","SkeletonDoughnutChart","containerCss","Tile","clsx"],"mappings":"gFAKA,MAAMA,EAAc,IAClBC,EAAA,cAAC,MACC,CAAA,MAAM,6BACN,MAAO,IACP,OAAQ,IACR,KAAK,OACL,UAAU,iBAAA,EAEVA,EAAA,cAAC,OAAA,CAAK,GAAG,IAAI,KAAK,QAChBA,EAAA,cAAC,QAAK,EAAE,kFAAA,CAAmF,CAC7F,EACAA,EAAA,cAAC,OACC,CAAA,UAAU,gBACV,OAAO,OACP,YAAa,IACb,EAAE,mFACF,KAAK,SAAA,CACP,EACAA,EAAA,cAAC,QAAK,GAAG,IAAI,KAAK,MAChBA,EAAAA,EAAA,cAAC,OAAK,CAAA,EAAE,iFAAiF,CAC3F,EACAA,EAAA,cAAC,OAAA,CACC,UAAU,gBACV,OAAO,OACP,YAAa,IACb,EAAE,iFACF,KAAK,UACP,EACAA,EAAA,cAAC,OAAK,CAAA,GAAG,IAAI,KAAK,MAAA,EAChBA,EAAA,cAAC,OAAA,CAAK,EAAE,6EAA8E,CAAA,CACxF,EACAA,EAAA,cAAC,QACC,UAAU,gBACV,OAAO,OACP,YAAa,IACb,EAAE,8EACF,KAAK,SACP,CAAA,EACAA,EAAA,cAAC,OAAA,CAAK,GAAG,IAAI,KAAK,QAChBA,EAAA,cAAC,QAAK,EAAE,4EAAA,CAA6E,CACvF,EACAA,EAAA,cAAC,OACC,CAAA,UAAU,gBACV,OAAO,OACP,YAAa,IACb,EAAE,6EACF,KAAK,SAAA,CACP,EACAA,EAAA,cAAC,QAAK,GAAG,IAAI,KAAK,MAChBA,EAAAA,EAAA,cAAC,OAAK,CAAA,EAAE,mFAAmF,CAC7F,EACAA,EAAA,cAAC,OAAA,CACC,UAAU,gBACV,OAAO,OACP,YAAa,IACb,EAAE,mFACF,KAAK,UACP,CACF,EAGWC,EAAwB,CAAC,CACpC,aAAAC,CACF,IAGEF,EAAA,cAACG,EAAA,CAAK,UAAWC,EAAK,MAAO,WAAY,QAAS,WAAYF,CAAY,GACxEF,EAAA,cAACD,EAAA,IAAY,CACf"}
+{"version":3,"file":"SkeletonDoughnutChart.js","names":[],"sources":["../../../src/components/skeleton-loader/SkeletonDoughnutChart.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport React from 'react'\n\nimport { Tile } from '../tile/Tile'\n\nconst DoughnutSvg = () => (\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    width={120}\n    height={121}\n    fill=\"none\"\n    className=\"animate-shimmer\"\n  >\n    <mask id=\"a\" fill=\"#fff\">\n      <path d=\"m117 60 3 3a60 60 0 0 1-39 53q-2 1-4-2l-5-17q-1-2 2-4a36 36 0 0 0 22-30q0-2 3-3z\" />\n    </mask>\n    <path\n      className=\"fill-grey-300\"\n      stroke=\"#fff\"\n      strokeWidth={1.6}\n      d=\"m117 60 3 3a60 60 0 0 1-39 53q-2 1-4-2l-5-17q-1-2 2-4a36 36 0 0 0 22-30q0-2 3-3z\"\n      mask=\"url(#a)\"\n    />\n    <mask id=\"b\" fill=\"#fff\">\n      <path d=\"M117 60q2 0 3-3A60 60 0 0 0 81 4l-4 2-5 17q-1 4 2 4a36 36 0 0 1 22 30q0 3 3 3z\" />\n    </mask>\n    <path\n      className=\"fill-grey-300\"\n      stroke=\"#fff\"\n      strokeWidth={1.6}\n      d=\"M117 60q2 0 3-3A60 60 0 0 0 81 4l-4 2-5 17q-1 4 2 4a36 36 0 0 1 22 30q0 3 3 3z\"\n      mask=\"url(#b)\"\n    />\n    <mask id=\"c\" fill=\"#fff\">\n      <path d=\"M77 6q1-2-2-4a60 60 0 0 0-62 21q-1 2 1 4l14 10h5a36 36 0 0 1 35-12q3 1 4-2z\" />\n    </mask>\n    <path\n      className=\"fill-grey-300\"\n      stroke=\"#fff\"\n      strokeWidth={1.6}\n      d=\"M77 6q1-2-2-4a60 60 0 0 0-62 21q-1 2 1 4l14 10h5a36 36 0 0 1 35-12q3 1 4-2z\"\n      mask=\"url(#c)\"\n    />\n    <mask id=\"d\" fill=\"#fff\">\n      <path d=\"M14 93q-3 2-1 5a60 60 0 0 0 62 20l2-4-5-16-4-3a36 36 0 0 1-35-11q-3-3-5-1z\" />\n    </mask>\n    <path\n      className=\"fill-grey-300\"\n      stroke=\"#fff\"\n      strokeWidth={1.6}\n      d=\"M14 93q-3 2-1 5a60 60 0 0 0 62 20l2-4-5-16-4-3a36 36 0 0 1-35-11q-3-3-5-1z\"\n      mask=\"url(#d)\"\n    />\n    <mask id=\"e\" fill=\"#fff\">\n      <path d=\"M14 27q-2-2-4 1a60 60 0 0 0 0 65q1 2 4 0l14-10q3-2 1-4a36 36 0 0 1 0-37q2-3-1-5z\" />\n    </mask>\n    <path\n      className=\"fill-grey-300\"\n      stroke=\"#fff\"\n      strokeWidth={1.6}\n      d=\"M14 27q-2-2-4 1a60 60 0 0 0 0 65q1 2 4 0l14-10q3-2 1-4a36 36 0 0 1 0-37q2-3-1-5z\"\n      mask=\"url(#e)\"\n    />\n  </svg>\n)\n\nexport const SkeletonDoughnutChart = ({\n  containerCss\n}: {\n  containerCss?: string\n}) => (\n  <Tile className={clsx('p-6', 'flex-row', 'gap-4', 'relative', containerCss)}>\n    <DoughnutSvg />\n  </Tile>\n)\n"],"mappings":";;;;AAKA,IAAM,UACJ,kBAAA,cAAC,OAAD;CACE,OAAM;CACN,OAAO;CACP,QAAQ;CACR,MAAK;CACL,WAAU;CAoDN,EAlDJ,kBAAA,cAAC,QAAD;CAAM,IAAG;CAAI,MAAK;CAEX,EADL,kBAAA,cAAC,QAAD,EAAM,GAAE,oFAAqF,CAAA,CACxF,EACP,kBAAA,cAAC,QAAD;CACE,WAAU;CACV,QAAO;CACP,aAAa;CACb,GAAE;CACF,MAAK;CACL,CAAA,EACF,kBAAA,cAAC,QAAD;CAAM,IAAG;CAAI,MAAK;CAEX,EADL,kBAAA,cAAC,QAAD,EAAM,GAAE,kFAAmF,CAAA,CACtF,EACP,kBAAA,cAAC,QAAD;CACE,WAAU;CACV,QAAO;CACP,aAAa;CACb,GAAE;CACF,MAAK;CACL,CAAA,EACF,kBAAA,cAAC,QAAD;CAAM,IAAG;CAAI,MAAK;CAEX,EADL,kBAAA,cAAC,QAAD,EAAM,GAAE,+EAAgF,CAAA,CACnF,EACP,kBAAA,cAAC,QAAD;CACE,WAAU;CACV,QAAO;CACP,aAAa;CACb,GAAE;CACF,MAAK;CACL,CAAA,EACF,kBAAA,cAAC,QAAD;CAAM,IAAG;CAAI,MAAK;CAEX,EADL,kBAAA,cAAC,QAAD,EAAM,GAAE,8EAA+E,CAAA,CAClF,EACP,kBAAA,cAAC,QAAD;CACE,WAAU;CACV,QAAO;CACP,aAAa;CACb,GAAE;CACF,MAAK;CACL,CAAA,EACF,kBAAA,cAAC,QAAD;CAAM,IAAG;CAAI,MAAK;CAEX,EADL,kBAAA,cAAC,QAAD,EAAM,GAAE,oFAAqF,CAAA,CACxF,EACP,kBAAA,cAAC,QAAD;CACE,WAAU;CACV,QAAO;CACP,aAAa;CACb,GAAE;CACF,MAAK;CACL,CAAA,CACE,EAGK,KAAyB,EACpC,sBAIA,kBAAA,cAAC,GAAD,EAAM,WAAW,EAAK,OAAO,YAAY,SAAS,YAAY,EAAa,EAEpE,EADL,kBAAA,cAAC,GAAA,KAAc,CACV"}

package/dist/components/skeleton-loader/SkeletonHeading.js

@@ -1,2 +1,9 @@
-import o from"clsx";import r from"react";import{SkeletonLoader as t}from"./Skeleton.js";const m=({className:e})=>r.createElement(t,{className:o("w-64","h-6","rounded-xl",e)});export{m as SkeletonHeading};
-//# sourceMappingURL=SkeletonHeading.js.map
+import { SkeletonLoader as e } from "./Skeleton.js";
+import t from "clsx";
+import n from "react";
+//#region src/components/skeleton-loader/SkeletonHeading.tsx
+var r = ({ className: r }) => /* @__PURE__ */ n.createElement(e, { className: t("w-64", "h-6", "rounded-xl", r) });
+//#endregion
+export { r as SkeletonHeading };
+
+//# sourceMappingURL=SkeletonHeading.js.map

package/dist/components/skeleton-loader/SkeletonHeading.js.map

@@ -1 +1 @@
-{"version":3,"file":"SkeletonHeading.js","sources":["../../../src/components/skeleton-loader/SkeletonHeading.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport React from 'react'\n\nimport { SkeletonLoader } from './Skeleton'\n\nexport const SkeletonHeading = ({\n  className\n}: {\n  className?: React.ComponentProps<typeof SkeletonLoader>['className']\n}) => (\n  <SkeletonLoader className={clsx('w-64', 'h-6', 'rounded-xl', className)} />\n)\n"],"names":["SkeletonHeading","className","React","SkeletonLoader","clsx"],"mappings":"wFAKa,MAAAA,EAAkB,CAAC,CAC9B,UAAAC,CACF,IAGEC,EAAA,cAACC,EAAA,CAAe,UAAWC,EAAK,OAAQ,MAAO,aAAcH,CAAS,CAAG,CAAA"}
+{"version":3,"file":"SkeletonHeading.js","names":[],"sources":["../../../src/components/skeleton-loader/SkeletonHeading.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport React from 'react'\n\nimport { SkeletonLoader } from './Skeleton'\n\nexport const SkeletonHeading = ({\n  className\n}: {\n  className?: React.ComponentProps<typeof SkeletonLoader>['className']\n}) => (\n  <SkeletonLoader className={clsx('w-64', 'h-6', 'rounded-xl', className)} />\n)\n"],"mappings":";;;;AAKA,IAAa,KAAmB,EAC9B,mBAIA,kBAAA,cAAC,GAAD,EAAgB,WAAW,EAAK,QAAQ,OAAO,cAAc,EAAU,EAAI,CAAA"}