@atom-learning/components 6.4.2 → 6.5.1

package/dist/components/combobox/ComboboxInput.js

@@ -1,2 +1,35 @@
-import{ComboboxInput as n}from"@reach/combobox";import*as e from"react";import{styled as d}from"../../styled.js";const o=d(n,{base:["bg-white","bg-(image:--bg-chevron)","bg-position-[right_--spacing(3)_top_50%,0_0]","[background-repeat:no-repeat,repeat-x]","bg-size-[--spacing(5)_auto,100%]","shadow-none","appearance-none","border","border-grey-700","rounded-md","text-grey-1000","cursor-text","block","font-body","h-10","pl-3","pr-10","transition-all","duration-100","ease-out","w-full","placeholder:opacity-100","placeholder:text-grey-700","focus-within:border-primary-800","focus-within:outline-none","disabled:bg-grey-200","disabled:cursor-not-allowed","disabled:text-grey-800"],variants:{size:{sm:["h-8","text-sm","leading-[1.7]"],md:["h-10","text-md","leading-loose"],lg:["h-12","text-md","leading-loose"]},state:{error:["border","border-danger"]}}}),i=e.forwardRef(({size:r="md",...t},a)=>e.createElement(o,{size:r,...t,ref:a}));export{i as ComboboxInput,o as StyledComboboxInput};
-//# sourceMappingURL=ComboboxInput.js.map
+import { styled as e } from "../../styled.js";
+import * as t from "react";
+import { ComboboxInput as n } from "@reach/combobox";
+//#region src/components/combobox/ComboboxInput.tsx
+var r = e(n, {
+	base: /* @__PURE__ */ "bg-white.bg-(image:--bg-chevron).bg-position-[right_--spacing(3)_top_50%,0_0].[background-repeat:no-repeat,repeat-x].bg-size-[--spacing(5)_auto,100%].shadow-none.appearance-none.border.border-grey-700.rounded-md.text-grey-1000.cursor-text.block.font-body.h-10.pl-3.pr-10.transition-all.duration-100.ease-out.w-full.placeholder:opacity-100.placeholder:text-grey-700.focus-within:border-primary-800.focus-within:outline-none.disabled:bg-grey-200.disabled:cursor-not-allowed.disabled:text-grey-800".split("."),
+	variants: {
+		size: {
+			sm: [
+				"h-8",
+				"text-sm",
+				"leading-[1.7]"
+			],
+			md: [
+				"h-10",
+				"text-md",
+				"leading-loose"
+			],
+			lg: [
+				"h-12",
+				"text-md",
+				"leading-loose"
+			]
+		},
+		state: { error: ["border", "border-danger"] }
+	}
+}), i = t.forwardRef(({ size: e = "md", ...n }, i) => /* @__PURE__ */ t.createElement(r, {
+	size: e,
+	...n,
+	ref: i
+}));
+//#endregion
+export { i as ComboboxInput };
+
+//# sourceMappingURL=ComboboxInput.js.map

package/dist/components/combobox/ComboboxInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxInput.js","sources":["../../../src/components/combobox/ComboboxInput.tsx"],"sourcesContent":["import { ComboboxInput as BaseComboboxInput } from '@reach/combobox'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nexport const StyledComboboxInput = styled(BaseComboboxInput, {\n  base: [\n    'bg-white',\n    'bg-(image:--bg-chevron)',\n    'bg-position-[right_--spacing(3)_top_50%,0_0]',\n    '[background-repeat:no-repeat,repeat-x]',\n    'bg-size-[--spacing(5)_auto,100%]',\n    'shadow-none',\n    'appearance-none',\n    'border',\n    'border-grey-700',\n    'rounded-md',\n    'text-grey-1000',\n    'cursor-text',\n    'block',\n    'font-body',\n    'h-10',\n    'pl-3',\n    'pr-10',\n    'transition-all',\n    'duration-100',\n    'ease-out',\n    'w-full',\n    'placeholder:opacity-100',\n    'placeholder:text-grey-700',\n    'focus-within:border-primary-800',\n    'focus-within:outline-none',\n    'disabled:bg-grey-200',\n    'disabled:cursor-not-allowed',\n    'disabled:text-grey-800'\n  ],\n\n  variants: {\n    size: {\n      sm: ['h-8', 'text-sm', 'leading-[1.7]'],\n      md: ['h-10', 'text-md', 'leading-loose'],\n      lg: ['h-12', 'text-md', 'leading-loose']\n    },\n    state: {\n      error: ['border', 'border-danger']\n    }\n  }\n})\n\nexport type ComboboxInputProps = React.ComponentProps<\n  typeof StyledComboboxInput\n>\n\nexport const ComboboxInput = React.forwardRef<\n  HTMLInputElement,\n  ComboboxInputProps\n>(({ size = 'md', ...rest }, ref) => (\n  <StyledComboboxInput\n    size={size as React.ComponentProps<typeof StyledComboboxInput>['size']}\n    {...rest}\n    ref={ref}\n  />\n))\n"],"names":["StyledComboboxInput","styled","BaseComboboxInput","ComboboxInput","React","size","rest","ref"],"mappings":"iHAKO,MAAMA,EAAsBC,EAAOC,EAAmB,CAC3D,KAAM,CACJ,WACA,0BACA,+CACA,yCACA,mCACA,cACA,kBACA,SACA,kBACA,aACA,iBACA,cACA,QACA,YACA,OACA,OACA,QACA,iBACA,eACA,WACA,SACA,0BACA,4BACA,kCACA,4BACA,uBACA,8BACA,wBACF,EAEA,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,MAAO,UAAW,eAAe,EACtC,GAAI,CAAC,OAAQ,UAAW,eAAe,EACvC,GAAI,CAAC,OAAQ,UAAW,eAAe,CACzC,EACA,MAAO,CACL,MAAO,CAAC,SAAU,eAAe,CACnC,CACF,CACF,CAAC,EAMYC,EAAgBC,EAAM,WAGjC,CAAC,CAAE,KAAAC,EAAO,KAAM,GAAGC,CAAK,EAAGC,IAC3BH,EAAA,cAACJ,EACC,CAAA,KAAMK,EACL,GAAGC,EACJ,IAAKC,CAAAA,CACP,CACD"}
+{"version":3,"file":"ComboboxInput.js","names":[],"sources":["../../../src/components/combobox/ComboboxInput.tsx"],"sourcesContent":["import { ComboboxInput as BaseComboboxInput } from '@reach/combobox'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nexport const StyledComboboxInput = styled(BaseComboboxInput, {\n  base: [\n    'bg-white',\n    'bg-(image:--bg-chevron)',\n    'bg-position-[right_--spacing(3)_top_50%,0_0]',\n    '[background-repeat:no-repeat,repeat-x]',\n    'bg-size-[--spacing(5)_auto,100%]',\n    'shadow-none',\n    'appearance-none',\n    'border',\n    'border-grey-700',\n    'rounded-md',\n    'text-grey-1000',\n    'cursor-text',\n    'block',\n    'font-body',\n    'h-10',\n    'pl-3',\n    'pr-10',\n    'transition-all',\n    'duration-100',\n    'ease-out',\n    'w-full',\n    'placeholder:opacity-100',\n    'placeholder:text-grey-700',\n    'focus-within:border-primary-800',\n    'focus-within:outline-none',\n    'disabled:bg-grey-200',\n    'disabled:cursor-not-allowed',\n    'disabled:text-grey-800'\n  ],\n\n  variants: {\n    size: {\n      sm: ['h-8', 'text-sm', 'leading-[1.7]'],\n      md: ['h-10', 'text-md', 'leading-loose'],\n      lg: ['h-12', 'text-md', 'leading-loose']\n    },\n    state: {\n      error: ['border', 'border-danger']\n    }\n  }\n})\n\nexport type ComboboxInputProps = React.ComponentProps<\n  typeof StyledComboboxInput\n>\n\nexport const ComboboxInput = React.forwardRef<\n  HTMLInputElement,\n  ComboboxInputProps\n>(({ size = 'md', ...rest }, ref) => (\n  <StyledComboboxInput\n    size={size as React.ComponentProps<typeof StyledComboboxInput>['size']}\n    {...rest}\n    ref={ref}\n  />\n))\n"],"mappings":";;;;AAKA,IAAa,IAAsB,EAAO,GAAmB;CAC3D,MAAM,2gBA6BL;CAED,UAAU;EACR,MAAM;GACJ,IAAI;IAAC;IAAO;IAAW;IAAgB;GACvC,IAAI;IAAC;IAAQ;IAAW;IAAgB;GACxC,IAAI;IAAC;IAAQ;IAAW;IAAgB;GACzC;EACD,OAAO,EACL,OAAO,CAAC,UAAU,gBAAgB,EACnC;EACF;CACF,CAAC,EAMW,IAAgB,EAAM,YAGhC,EAAE,UAAO,MAAM,GAAG,KAAQ,MAC3B,kBAAA,cAAC,GAAD;CACQ;CACN,GAAI;CACC;CACL,CAAA,CACF"}

package/dist/components/combobox/ComboboxList.js

@@ -1,2 +1,8 @@
-import{ComboboxList as o}from"@reach/combobox";import{styled as t}from"../../styled.js";const s=t(o,{base:["select-none"]});export{s as ComboboxList};
-//# sourceMappingURL=ComboboxList.js.map
+import { styled as e } from "../../styled.js";
+import { ComboboxList as t } from "@reach/combobox";
+//#region src/components/combobox/ComboboxList.tsx
+var n = e(t, { base: ["select-none"] });
+//#endregion
+export { n as ComboboxList };
+
+//# sourceMappingURL=ComboboxList.js.map

package/dist/components/combobox/ComboboxList.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxList.js","sources":["../../../src/components/combobox/ComboboxList.tsx"],"sourcesContent":["import { ComboboxList as BaseComboboxList } from '@reach/combobox'\n\nimport { styled } from '~/styled'\n\nexport const ComboboxList = styled(BaseComboboxList, {\n  base: ['select-none']\n})\n"],"names":["ComboboxList","styled","BaseComboboxList"],"mappings":"wFAIO,MAAMA,EAAeC,EAAOC,EAAkB,CACnD,KAAM,CAAC,aAAa,CACtB,CAAC"}
+{"version":3,"file":"ComboboxList.js","names":[],"sources":["../../../src/components/combobox/ComboboxList.tsx"],"sourcesContent":["import { ComboboxList as BaseComboboxList } from '@reach/combobox'\n\nimport { styled } from '~/styled'\n\nexport const ComboboxList = styled(BaseComboboxList, {\n  base: ['select-none']\n})\n"],"mappings":";;;AAIA,IAAa,IAAe,EAAO,GAAkB,EACnD,MAAM,CAAC,cAAc,EACtB,CAAC"}

package/dist/components/combobox/ComboboxOption.js

@@ -1,2 +1,17 @@
-import{ComboboxOption as o}from"@reach/combobox";import{styled as e}from"../../styled.js";const r=e(o,{base:["text-grey-900","cursor-pointer","p-2","hover:bg-grey-100","hover:rounded-sm","aria-selected:bg-grey-100","aria-selected:rounded-sm","data-user-value:text-primary-800"]});export{r as ComboboxOption};
-//# sourceMappingURL=ComboboxOption.js.map
+import { styled as e } from "../../styled.js";
+import { ComboboxOption as t } from "@reach/combobox";
+//#region src/components/combobox/ComboboxOption.tsx
+var n = e(t, { base: [
+	"text-grey-900",
+	"cursor-pointer",
+	"p-2",
+	"hover:bg-grey-100",
+	"hover:rounded-sm",
+	"aria-selected:bg-grey-100",
+	"aria-selected:rounded-sm",
+	"data-user-value:text-primary-800"
+] });
+//#endregion
+export { n as ComboboxOption };
+
+//# sourceMappingURL=ComboboxOption.js.map

package/dist/components/combobox/ComboboxOption.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxOption.js","sources":["../../../src/components/combobox/ComboboxOption.tsx"],"sourcesContent":["import { ComboboxOption as BaseComboboxOption } from '@reach/combobox'\n\nimport { styled } from '~/styled'\n\nexport const ComboboxOption = styled(BaseComboboxOption, {\n  base: [\n    'text-grey-900',\n    'cursor-pointer',\n    'p-2',\n    'hover:bg-grey-100',\n    'hover:rounded-sm',\n    'aria-selected:bg-grey-100',\n    'aria-selected:rounded-sm',\n    'data-user-value:text-primary-800'\n  ]\n})\n"],"names":["ComboboxOption","styled","BaseComboboxOption"],"mappings":"0FAIa,MAAAA,EAAiBC,EAAOC,EAAoB,CACvD,KAAM,CACJ,gBACA,iBACA,MACA,oBACA,mBACA,4BACA,2BACA,kCACF,CACF,CAAC"}
+{"version":3,"file":"ComboboxOption.js","names":[],"sources":["../../../src/components/combobox/ComboboxOption.tsx"],"sourcesContent":["import { ComboboxOption as BaseComboboxOption } from '@reach/combobox'\n\nimport { styled } from '~/styled'\n\nexport const ComboboxOption = styled(BaseComboboxOption, {\n  base: [\n    'text-grey-900',\n    'cursor-pointer',\n    'p-2',\n    'hover:bg-grey-100',\n    'hover:rounded-sm',\n    'aria-selected:bg-grey-100',\n    'aria-selected:rounded-sm',\n    'data-user-value:text-primary-800'\n  ]\n})\n"],"mappings":";;;AAIA,IAAa,IAAiB,EAAO,GAAoB,EACvD,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EACF,CAAC"}

package/dist/components/combobox/ComboboxPopover.js

@@ -1,2 +1,19 @@
-import{ComboboxPopover as o}from"@reach/combobox";import{styled as e}from"../../styled.js";const r=e(o,{base:["bg-white","border","border-grey-200","rounded-md","shadow-md","font-body","text-md","outline-none","p-1","translate-y-2"]});export{r as ComboboxPopover};
-//# sourceMappingURL=ComboboxPopover.js.map
+import { styled as e } from "../../styled.js";
+import { ComboboxPopover as t } from "@reach/combobox";
+//#region src/components/combobox/ComboboxPopover.tsx
+var n = e(t, { base: [
+	"bg-white",
+	"border",
+	"border-grey-200",
+	"rounded-md",
+	"shadow-md",
+	"font-body",
+	"text-md",
+	"outline-none",
+	"p-1",
+	"translate-y-2"
+] });
+//#endregion
+export { n as ComboboxPopover };
+
+//# sourceMappingURL=ComboboxPopover.js.map

package/dist/components/combobox/ComboboxPopover.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxPopover.js","sources":["../../../src/components/combobox/ComboboxPopover.tsx"],"sourcesContent":["import { ComboboxPopover as BaseComboboxPopover } from '@reach/combobox'\n\nimport { styled } from '~/styled'\n\nexport const ComboboxPopover = styled(BaseComboboxPopover, {\n  base: [\n    'bg-white',\n    'border',\n    'border-grey-200',\n    'rounded-md',\n    'shadow-md',\n    'font-body',\n    'text-md',\n    'outline-none',\n    'p-1',\n    'translate-y-2'\n  ]\n})\n"],"names":["ComboboxPopover","styled","BaseComboboxPopover"],"mappings":"2FAIO,MAAMA,EAAkBC,EAAOC,EAAqB,CACzD,KAAM,CACJ,WACA,SACA,kBACA,aACA,YACA,YACA,UACA,eACA,MACA,eACF,CACF,CAAC"}
+{"version":3,"file":"ComboboxPopover.js","names":[],"sources":["../../../src/components/combobox/ComboboxPopover.tsx"],"sourcesContent":["import { ComboboxPopover as BaseComboboxPopover } from '@reach/combobox'\n\nimport { styled } from '~/styled'\n\nexport const ComboboxPopover = styled(BaseComboboxPopover, {\n  base: [\n    'bg-white',\n    'border',\n    'border-grey-200',\n    'rounded-md',\n    'shadow-md',\n    'font-body',\n    'text-md',\n    'outline-none',\n    'p-1',\n    'translate-y-2'\n  ]\n})\n"],"mappings":";;;AAIA,IAAa,IAAkB,EAAO,GAAqB,EACzD,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EACF,CAAC"}

package/dist/components/create-password-field/CreatePasswordField.js

@@ -1,2 +1,37 @@
-import E from"invariant";import*as a from"react";import{useFormContext as N}from"react-hook-form";import{throttle as k}from"throttle-debounce";import{InlineMessage as P}from"../inline-message/InlineMessage.js";import{PasswordField as B}from"../password-field/PasswordField.js";const u=({validate:p,defaultValidation:v,messageDirection:f="row",label:b="Create a password",name:r="password",className:y,validation:w,appearance:C,...h})=>{var i;const{formState:o,control:n}=N(),[s,m]=a.useState(!1),[c,d]=a.useState(v),F=o.touched[r],g=((i=o.errors[r])==null?void 0:i.type)==="validate"||Object.values(c).every(e=>!e),l=a.useCallback(async e=>{const t=await p(e);return t?(E(typeof t=="object","The validate function must return an object"),d(t),Object.values(t).every(x=>x)):!1},[d]),j=a.useCallback(k(500,l),[l]),O=(e,t)=>e?"success":t?"neutral":"error",S=n.mode.isOnBlur&&(s||F)||n.mode.isOnSubmit&&(s||o.isSubmitted&&g);return a.createElement("div",{className:y},a.createElement(B,{label:b,name:r,onChange:e=>j(e.target.value),onBlur:()=>m(!1),onFocus:()=>m(!0),validation:{...w,validate:l},appearance:C,...h}),S&&a.createElement("div",{style:{"--direction":f},className:"direction-(--direction) mt-2 flex flex-wrap gap-2"},Object.entries(c).map(([e,t])=>a.createElement(P,{key:e,theme:O(t,s)},e))))};u.displayName="CreatePasswordField";export{u as CreatePasswordField};
-//# sourceMappingURL=CreatePasswordField.js.map
+import { InlineMessage as e } from "../inline-message/InlineMessage.js";
+import { PasswordField as t } from "../password-field/PasswordField.js";
+import * as n from "react";
+import r from "invariant";
+import { throttle as i } from "throttle-debounce";
+import { useFormContext as a } from "react-hook-form";
+//#region src/components/create-password-field/CreatePasswordField.tsx
+var o = ({ validate: o, defaultValidation: s, messageDirection: c = "row", label: l = "Create a password", name: u = "password", className: d, validation: f, appearance: p, ...m }) => {
+	let { formState: h, control: g } = a(), [_, v] = n.useState(!1), [y, b] = n.useState(s), x = h.touched[u], S = h.errors[u]?.type === "validate" || Object.values(y).every((e) => !e), C = n.useCallback(async (e) => {
+		let t = await o(e);
+		return t ? (r(typeof t == "object", "The validate function must return an object"), b(t), Object.values(t).every((e) => e)) : !1;
+	}, [b]), w = n.useCallback(i(500, C), [C]), T = (e, t) => e ? "success" : t ? "neutral" : "error", E = g.mode.isOnBlur && (_ || x) || g.mode.isOnSubmit && (_ || h.isSubmitted && S);
+	return /* @__PURE__ */ n.createElement("div", { className: d }, /* @__PURE__ */ n.createElement(t, {
+		label: l,
+		name: u,
+		onChange: (e) => w(e.target.value),
+		onBlur: () => v(!1),
+		onFocus: () => v(!0),
+		validation: {
+			...f,
+			validate: C
+		},
+		appearance: p,
+		...m
+	}), E && /* @__PURE__ */ n.createElement("div", {
+		style: { "--direction": c },
+		className: "direction-(--direction) mt-2 flex flex-wrap gap-2"
+	}, Object.entries(y).map(([t, r]) => /* @__PURE__ */ n.createElement(e, {
+		key: t,
+		theme: T(r, _)
+	}, t))));
+};
+o.displayName = "CreatePasswordField";
+//#endregion
+export { o as CreatePasswordField };
+
+//# sourceMappingURL=CreatePasswordField.js.map

package/dist/components/create-password-field/CreatePasswordField.js.map

@@ -1 +1 @@
-{"version":3,"file":"CreatePasswordField.js","sources":["../../../src/components/create-password-field/CreatePasswordField.tsx"],"sourcesContent":["import invariant from 'invariant'\nimport * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\nimport { throttle } from 'throttle-debounce'\n\nimport { Override } from '~/utilities/types'\n\nimport { FieldElementWrapperProps } from '../field-wrapper/FieldWrapper'\nimport { InlineMessage } from '../inline-message/InlineMessage'\nimport { PasswordField } from '../password-field/PasswordField'\nimport { PasswordInput } from '../password-input/PasswordInput'\n\ntype ValidationResult = Record<string, boolean>\n\ntype CreatePasswordFieldProps = Override<\n  React.ComponentProps<typeof PasswordInput> & FieldElementWrapperProps,\n  {\n    label?: string\n    name?: string\n    validate: (\n      password: string\n    ) => Promise<ValidationResult | undefined> | ValidationResult\n    defaultValidation: ValidationResult\n    messageDirection?: 'row' | 'column'\n  }\n>\n\nexport const CreatePasswordField = ({\n  validate,\n  defaultValidation,\n  messageDirection = 'row',\n  label = 'Create a password',\n  name = 'password',\n  className,\n  validation,\n  appearance,\n  ...remainingProps\n}: CreatePasswordFieldProps) => {\n  const { formState, control } = useFormContext()\n  const [isFocused, setIsFocused] = React.useState<boolean>(false)\n  const [validationResult, setValidationResult] =\n    React.useState<ValidationResult>(defaultValidation)\n\n  const touched: boolean = formState.touched[name]\n  const error =\n    formState.errors[name]?.type === 'validate' ||\n    Object.values(validationResult).every((isValid) => !isValid)\n\n  const validatePassword = React.useCallback(\n    async (password: string) => {\n      const result = await validate(password)\n\n      if (result) {\n        invariant(\n          typeof result === 'object',\n          'The validate function must return an object'\n        )\n\n        setValidationResult(result)\n        return Object.values(result).every((isValid) => isValid)\n      }\n\n      return false\n    },\n    [setValidationResult]\n  )\n\n  const handleChange = React.useCallback(throttle(500, validatePassword), [\n    validatePassword\n  ])\n\n  const getMessageTheme = (result: boolean, isFocused: boolean) => {\n    if (result) return 'success'\n\n    return isFocused ? 'neutral' : 'error'\n  }\n\n  const showValidation: boolean =\n    (control.mode.isOnBlur && (isFocused || touched)) ||\n    (control.mode.isOnSubmit && (isFocused || (formState.isSubmitted && error)))\n\n  return (\n    <div className={className}>\n      <PasswordField\n        label={label}\n        name={name}\n        onChange={(e: React.ChangeEvent<HTMLInputElement>) =>\n          handleChange(e.target.value)\n        }\n        onBlur={() => setIsFocused(false)}\n        onFocus={() => setIsFocused(true)}\n        validation={{ ...validation, validate: validatePassword }}\n        appearance={appearance}\n        {...remainingProps}\n      />\n      {showValidation && (\n        <div\n          style={{ '--direction': messageDirection }}\n          className=\"direction-(--direction) mt-2 flex flex-wrap gap-2\"\n        >\n          {Object.entries(validationResult).map(([message, result]) => (\n            <InlineMessage\n              key={message}\n              theme={getMessageTheme(result, isFocused)}\n            >\n              {message}\n            </InlineMessage>\n          ))}\n        </div>\n      )}\n    </div>\n  )\n}\n\nCreatePasswordField.displayName = 'CreatePasswordField'\n"],"names":["CreatePasswordField","validate","defaultValidation","messageDirection","label","name","className","validation","appearance","remainingProps","_a","formState","control","useFormContext","isFocused","setIsFocused","React","validationResult","setValidationResult","touched","error","isValid","validatePassword","password","result","invariant","handleChange","throttle","getMessageTheme","showValidation","PasswordField","message","InlineMessage"],"mappings":"qRA2Ba,MAAAA,EAAsB,CAAC,CAClC,SAAAC,EACA,kBAAAC,EACA,iBAAAC,EAAmB,MACnB,MAAAC,EAAQ,oBACR,KAAAC,EAAO,WACP,UAAAC,EACA,WAAAC,EACA,WAAAC,EACA,GAAGC,CACL,IAAgC,CArChC,IAAAC,EAsCE,KAAM,CAAE,UAAAC,EAAW,QAAAC,CAAQ,EAAIC,IACzB,CAACC,EAAWC,CAAY,EAAIC,EAAM,SAAkB,EAAK,EACzD,CAACC,EAAkBC,CAAmB,EAC1CF,EAAM,SAA2Bd,CAAiB,EAE9CiB,EAAmBR,EAAU,QAAQN,CAAI,EACzCe,IACJV,EAAAC,EAAU,OAAON,CAAI,IAArB,KAAA,OAAAK,EAAwB,QAAS,YACjC,OAAO,OAAOO,CAAgB,EAAE,MAAOI,GAAY,CAACA,CAAO,EAEvDC,EAAmBN,EAAM,YAC7B,MAAOO,GAAqB,CAC1B,MAAMC,EAAS,MAAMvB,EAASsB,CAAQ,EAEtC,OAAIC,GACFC,EACE,OAAOD,GAAW,SAClB,6CACF,EAEAN,EAAoBM,CAAM,EACnB,OAAO,OAAOA,CAAM,EAAE,MAAOH,GAAYA,CAAO,GAGlD,EACT,EACA,CAACH,CAAmB,CACtB,EAEMQ,EAAeV,EAAM,YAAYW,EAAS,IAAKL,CAAgB,EAAG,CACtEA,CACF,CAAC,EAEKM,EAAkB,CAACJ,EAAiBV,IACpCU,EAAe,UAEZV,EAAY,UAAY,QAG3Be,EACHjB,EAAQ,KAAK,WAAaE,GAAaK,IACvCP,EAAQ,KAAK,aAAeE,GAAcH,EAAU,aAAeS,GAEtE,OACEJ,EAAA,cAAC,MAAA,CAAI,UAAWV,CAAAA,EACdU,EAAA,cAACc,EAAA,CACC,MAAO1B,EACP,KAAMC,EACN,SAAW,GACTqB,EAAa,EAAE,OAAO,KAAK,EAE7B,OAAQ,IAAMX,EAAa,EAAK,EAChC,QAAS,IAAMA,EAAa,EAAI,EAChC,WAAY,CAAE,GAAGR,EAAY,SAAUe,CAAiB,EACxD,WAAYd,EACX,GAAGC,CAAAA,CACN,EACCoB,GACCb,EAAA,cAAC,MACC,CAAA,MAAO,CAAE,cAAeb,CAAiB,EACzC,UAAU,mDAAA,EAET,OAAO,QAAQc,CAAgB,EAAE,IAAI,CAAC,CAACc,EAASP,CAAM,IACrDR,EAAA,cAACgB,EAAA,CACC,IAAKD,EACL,MAAOH,EAAgBJ,EAAQV,CAAS,CAEvCiB,EAAAA,CACH,CACD,CACH,CAEJ,CAEJ,EAEA/B,EAAoB,YAAc"}
+{"version":3,"file":"CreatePasswordField.js","names":[],"sources":["../../../src/components/create-password-field/CreatePasswordField.tsx"],"sourcesContent":["import invariant from 'invariant'\nimport * as React from 'react'\nimport { useFormContext } from 'react-hook-form'\nimport { throttle } from 'throttle-debounce'\n\nimport { Override } from '~/utilities/types'\n\nimport { FieldElementWrapperProps } from '../field-wrapper/FieldWrapper'\nimport { InlineMessage } from '../inline-message/InlineMessage'\nimport { PasswordField } from '../password-field/PasswordField'\nimport { PasswordInput } from '../password-input/PasswordInput'\n\ntype ValidationResult = Record<string, boolean>\n\ntype CreatePasswordFieldProps = Override<\n  React.ComponentProps<typeof PasswordInput> & FieldElementWrapperProps,\n  {\n    label?: string\n    name?: string\n    validate: (\n      password: string\n    ) => Promise<ValidationResult | undefined> | ValidationResult\n    defaultValidation: ValidationResult\n    messageDirection?: 'row' | 'column'\n  }\n>\n\nexport const CreatePasswordField = ({\n  validate,\n  defaultValidation,\n  messageDirection = 'row',\n  label = 'Create a password',\n  name = 'password',\n  className,\n  validation,\n  appearance,\n  ...remainingProps\n}: CreatePasswordFieldProps) => {\n  const { formState, control } = useFormContext()\n  const [isFocused, setIsFocused] = React.useState<boolean>(false)\n  const [validationResult, setValidationResult] =\n    React.useState<ValidationResult>(defaultValidation)\n\n  const touched: boolean = formState.touched[name]\n  const error =\n    formState.errors[name]?.type === 'validate' ||\n    Object.values(validationResult).every((isValid) => !isValid)\n\n  const validatePassword = React.useCallback(\n    async (password: string) => {\n      const result = await validate(password)\n\n      if (result) {\n        invariant(\n          typeof result === 'object',\n          'The validate function must return an object'\n        )\n\n        setValidationResult(result)\n        return Object.values(result).every((isValid) => isValid)\n      }\n\n      return false\n    },\n    [setValidationResult]\n  )\n\n  const handleChange = React.useCallback(throttle(500, validatePassword), [\n    validatePassword\n  ])\n\n  const getMessageTheme = (result: boolean, isFocused: boolean) => {\n    if (result) return 'success'\n\n    return isFocused ? 'neutral' : 'error'\n  }\n\n  const showValidation: boolean =\n    (control.mode.isOnBlur && (isFocused || touched)) ||\n    (control.mode.isOnSubmit && (isFocused || (formState.isSubmitted && error)))\n\n  return (\n    <div className={className}>\n      <PasswordField\n        label={label}\n        name={name}\n        onChange={(e: React.ChangeEvent<HTMLInputElement>) =>\n          handleChange(e.target.value)\n        }\n        onBlur={() => setIsFocused(false)}\n        onFocus={() => setIsFocused(true)}\n        validation={{ ...validation, validate: validatePassword }}\n        appearance={appearance}\n        {...remainingProps}\n      />\n      {showValidation && (\n        <div\n          style={{ '--direction': messageDirection }}\n          className=\"direction-(--direction) mt-2 flex flex-wrap gap-2\"\n        >\n          {Object.entries(validationResult).map(([message, result]) => (\n            <InlineMessage\n              key={message}\n              theme={getMessageTheme(result, isFocused)}\n            >\n              {message}\n            </InlineMessage>\n          ))}\n        </div>\n      )}\n    </div>\n  )\n}\n\nCreatePasswordField.displayName = 'CreatePasswordField'\n"],"mappings":";;;;;;;AA2BA,IAAa,KAAuB,EAClC,aACA,sBACA,sBAAmB,OACnB,WAAQ,qBACR,UAAO,YACP,cACA,eACA,eACA,GAAG,QAC2B;CAC9B,IAAM,EAAE,cAAW,eAAY,GAAgB,EACzC,CAAC,GAAW,KAAgB,EAAM,SAAkB,GAAM,EAC1D,CAAC,GAAkB,KACvB,EAAM,SAA2B,EAAkB,EAE/C,IAAmB,EAAU,QAAQ,IACrC,IACJ,EAAU,OAAO,IAAO,SAAS,cACjC,OAAO,OAAO,EAAiB,CAAC,OAAO,MAAY,CAAC,EAAQ,EAExD,IAAmB,EAAM,YAC7B,OAAO,MAAqB;EAC1B,IAAM,IAAS,MAAM,EAAS,EAAS;AAYvC,SAVI,KACF,EACE,OAAO,KAAW,UAClB,8CACD,EAED,EAAoB,EAAO,EACpB,OAAO,OAAO,EAAO,CAAC,OAAO,MAAY,EAAQ,IAGnD;IAET,CAAC,EAAoB,CACtB,EAEK,IAAe,EAAM,YAAY,EAAS,KAAK,EAAiB,EAAE,CACtE,EACD,CAAC,EAEI,KAAmB,GAAiB,MACpC,IAAe,YAEZ,IAAY,YAAY,SAG3B,IACH,EAAQ,KAAK,aAAa,KAAa,MACvC,EAAQ,KAAK,eAAe,KAAc,EAAU,eAAe;AAEtE,QACE,kBAAA,cAAC,OAAD,EAAgB,cA4BV,EA3BJ,kBAAA,cAAC,GAAD;EACS;EACD;EACN,WAAW,MACT,EAAa,EAAE,OAAO,MAAM;EAE9B,cAAc,EAAa,GAAM;EACjC,eAAe,EAAa,GAAK;EACjC,YAAY;GAAE,GAAG;GAAY,UAAU;GAAkB;EAC7C;EACZ,GAAI;EACJ,CAAA,EACD,KACC,kBAAA,cAAC,OAAD;EACE,OAAO,EAAE,eAAe,GAAkB;EAC1C,WAAU;EAUN,EARH,OAAO,QAAQ,EAAiB,CAAC,KAAK,CAAC,GAAS,OAC/C,kBAAA,cAAC,GAAD;EACE,KAAK;EACL,OAAO,EAAgB,GAAQ,EAAU;EAG3B,EADb,EACa,CAChB,CACE,CAEJ;;AAIV,EAAoB,cAAc"}

package/dist/components/data-table/DataTable.js

@@ -1,2 +1,42 @@
-import{DataTableBody as a}from"./DataTableBody.js";import{DataTableBulkActions as o}from"./DataTableBulkActions.js";import{DataTableBulkActionsFloating as t}from"./DataTableBulkActionsFloating.js";import{DataTableProvider as r}from"./DataTableContext.js";import{DataTableDataCell as e}from"./DataTableDataCell.js";import{DataTableEmptyState as l}from"./DataTableEmptyState.js";import{DataTableError as m}from"./DataTableError.js";import{DataTableGlobalFilter as i}from"./DataTableGlobalFilter.js";import{DataTableHead as b}from"./DataTableHead.js";import{DataTableHeaderCell as D}from"./DataTableHeaderCell.js";import{DataTableLoading as p}from"./DataTableLoading.js";import{DataTableMetaData as T}from"./DataTableMetaData.js";import{DataTableRow as f}from"./DataTableRow.js";import{DataTableRowSelectionCheckbox as n}from"./DataTableRowSelectionCheckbox.js";import{DataTableSelectAllRowsCheckbox as c}from"./DataTableSelectAllRowsCheckbox.js";import{DataTableTable as d}from"./DataTableTable.js";import{DragAndDropTable as g}from"./drag-and-drop/DragAndDropTable.js";import{Pagination as s}from"./pagination/Pagination.js";const k=Object.assign(r,{Body:a,DataCell:e,DragAndDropTable:g,GlobalFilter:i,Head:b,HeaderCell:D,MetaData:T,Pagination:s,Row:f,Table:d,Loading:p,Error:m,EmptyState:l,SelectAllRowsCheckbox:c,RowSelectionCheckbox:n,BulkActions:o,BulkActionsFloating:t});export{k as DataTable};
-//# sourceMappingURL=DataTable.js.map
+import { DataTableProvider as e } from "./DataTableContext.js";
+import { DataTableDataCell as t } from "./DataTableDataCell.js";
+import { DataTableRowSelectionCheckbox as n } from "./DataTableRowSelectionCheckbox.js";
+import { DataTableRow as r } from "./DataTableRow.js";
+import { DataTableBody as i } from "./DataTableBody.js";
+import { DataTableMetaData as a } from "./DataTableMetaData.js";
+import { DataTableBulkActions as o } from "./DataTableBulkActions.js";
+import { DataTableBulkActionsFloating as s } from "./DataTableBulkActionsFloating.js";
+import { DataTableEmptyState as c } from "./DataTableEmptyState.js";
+import { DataTableError as l } from "./DataTableError.js";
+import { DataTableGlobalFilter as u } from "./DataTableGlobalFilter.js";
+import { DataTableHeaderCell as d } from "./DataTableHeaderCell.js";
+import { DataTableSelectAllRowsCheckbox as f } from "./DataTableSelectAllRowsCheckbox.js";
+import { DataTableHead as p } from "./DataTableHead.js";
+import { DataTableLoading as m } from "./DataTableLoading.js";
+import { DataTableTable as h } from "./DataTableTable.js";
+import { DragAndDropTable as g } from "./drag-and-drop/DragAndDropTable.js";
+import { Pagination as _ } from "./pagination/Pagination.js";
+//#region src/components/data-table/DataTable.tsx
+var v = Object.assign(e, {
+	Body: i,
+	DataCell: t,
+	DragAndDropTable: g,
+	GlobalFilter: u,
+	Head: p,
+	HeaderCell: d,
+	MetaData: a,
+	Pagination: _,
+	Row: r,
+	Table: h,
+	Loading: m,
+	Error: l,
+	EmptyState: c,
+	SelectAllRowsCheckbox: f,
+	RowSelectionCheckbox: n,
+	BulkActions: o,
+	BulkActionsFloating: s
+});
+//#endregion
+export { v as DataTable };
+
+//# sourceMappingURL=DataTable.js.map

package/dist/components/data-table/DataTable.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTable.js","sources":["../../../src/components/data-table/DataTable.tsx"],"sourcesContent":["import { DataTableBody } from './DataTableBody'\nimport { DataTableBulkActions } from './DataTableBulkActions'\nimport { DataTableBulkActionsFloating } from './DataTableBulkActionsFloating'\nimport { DataTableProvider } from './DataTableContext'\nimport { DataTableDataCell } from './DataTableDataCell'\nimport { DataTableEmptyState } from './DataTableEmptyState'\nimport { DataTableError } from './DataTableError'\nimport { DataTableGlobalFilter } from './DataTableGlobalFilter'\nimport { DataTableHead } from './DataTableHead'\nimport { DataTableHeaderCell } from './DataTableHeaderCell'\nimport { DataTableLoading } from './DataTableLoading'\nimport { DataTableMetaData } from './DataTableMetaData'\nimport { DataTableRow } from './DataTableRow'\nimport { DataTableRowSelectionCheckbox } from './DataTableRowSelectionCheckbox'\nimport { DataTableSelectAllRowsCheckbox } from './DataTableSelectAllRowsCheckbox'\nimport { DataTableTable } from './DataTableTable'\nimport { DragAndDropTable } from './drag-and-drop/DragAndDropTable'\nimport { Pagination } from './pagination/Pagination'\n\n/** Context provider for DataTable state and logic.\n *\n * Children can call `useDataTable` to access everything provided by `@tanstack/react-table` plus\n * the functionality we've built on top.\n */\nexport const DataTable = Object.assign(DataTableProvider, {\n  /** Default table body implementation for `DataTable`.\n   *\n   * Can be configured with alternating colours of rows. If you need more customisation options,\n   * you can build your own implementation with `useDataTable()` and the UI-only `Table` components.\n   */\n  Body: DataTableBody,\n\n  /** Default table data cell implementation for `DataTable`\n   *\n   *\n   */\n  DataCell: DataTableDataCell,\n\n  /**\n   * Used in place of `DataTable.Table` to render a table with rows that the user can sort by drag-and-drop\n   */\n  DragAndDropTable: DragAndDropTable,\n\n  /** Default global search implementation for `DataTable`\n   *\n   * If you need more customisation options, you can compose your own implementation with our UI-only input components and `useDataTable`.\n   */\n  GlobalFilter: DataTableGlobalFilter,\n\n  /** Default table head implementation\n   *\n   * Can be configured to be sortable and with different visual themes.\n   * If you need more customisation options, you can build your own implementation\n   * with `useDataTable` and the UI-only `Table` components.\n   */\n  Head: DataTableHead,\n\n  /** Default header implementation for `DataTable`\n   *\n   * Can be configured to make the column sortable. If you need more customisation options,\n   * you can build your own implementation with the UI-only `Table` components.\n   */\n  HeaderCell: DataTableHeaderCell,\n\n  /** Default pagination implementation for `DataTable`\n   *\n   * Can navigate forward, backward, or to any specific page. If you need more customisation options,\n   * you can build your own implementation with `useDataTable` and other UI components.\n   *\n   */\n  MetaData: DataTableMetaData,\n\n  /** Default display of amount of items and current sorting status for 'DataTable'\n   *\n   */\n  Pagination: Pagination,\n\n  /** Default row implementation for `DataTable`\n   *\n   * Renders all visible cells as `Table.Cell`. If you need more customisation options,\n   * you can build your own implementation with the UI-only `Table` components.\n   */\n  Row: DataTableRow,\n\n  /** Default table implementation for `DataTable`.\n   *\n   * Can be configured with sortable columns and different visual themes.\n   *\n   * If you need more customisation options, you can compose your own implementation with\n   * lower-level `DataTable` components or build the whole thing from\n   * scratch with `useDataTable` and the UI-only `Table` components.\n   *\n   */\n  Table: DataTableTable,\n\n  /** Default loading implementation for remote data\n   *\n   * Renders a loading component while fetching the paginated data using `getAsyncData`.\n   *\n   * If you need more customisation, you can compose your own implentation, `asyncDataState`\n   * can be retrieved from `useDataTable`\n   */\n  Loading: DataTableLoading,\n\n  /** Default error implementation for remote data\n   *\n   * Renders an error component when `getAsyncData` promise rejects.\n   * Children are rendered as a function, it exposes a `runAsyncData` function to the children component.\n   * `runAsyncData()` can be used to retry fetching the paginated data with the current pageIndex, pageSize\n   * and sorting parameters or your own custom paginated options.\n   *\n   * If you need more customisation, you can compose your own implentation, `asyncDataState` and `runAsyncData()`\n   * can be retrieved from `useDataTable`\n   *\n   */\n  Error: DataTableError,\n\n  /** Empty state implementation for `DataTable`.\n   *\n   * Extends the EmptyState component\n   */\n  EmptyState: DataTableEmptyState,\n\n  /** Select all rows checkbox.\n   *\n   * Renders a checkbox on the header, allowing for bulk selection/deselection of all selectable rows\n   */\n  SelectAllRowsCheckbox: DataTableSelectAllRowsCheckbox,\n\n  /** Individual row selection checkbox.\n   *\n   * Renders a checkbox on each row, allowing for individual selection/deselection of any selectable row\n   */\n  RowSelectionCheckbox: DataTableRowSelectionCheckbox,\n\n  /** Bulk actions for selected rows.\n   *\n   * Renders a toolbar with actions that can be applied to all selected rows\n   */\n  BulkActions: DataTableBulkActions,\n\n  /** Bulk actions for selected rows.\n   *\n   * Renders a toolbar with actions that can be applied to all selected rows\n   */\n  BulkActionsFloating: DataTableBulkActionsFloating\n})\n"],"names":["DataTable","DataTableProvider","DataTableBody","DataTableDataCell","DragAndDropTable","DataTableGlobalFilter","DataTableHead","DataTableHeaderCell","DataTableMetaData","Pagination","DataTableRow","DataTableTable","DataTableLoading","DataTableError","DataTableEmptyState","DataTableSelectAllRowsCheckbox","DataTableRowSelectionCheckbox","DataTableBulkActions","DataTableBulkActionsFloating"],"mappings":"omCAwBO,MAAMA,EAAY,OAAO,OAAOC,EAAmB,CAMxD,KAAMC,EAMN,SAAUC,EAKV,iBAAkBC,EAMlB,aAAcC,EAQd,KAAMC,EAON,WAAYC,EAQZ,SAAUC,EAKV,WAAYC,EAOZ,IAAKC,EAWL,MAAOC,EASP,QAASC,EAaT,MAAOC,EAMP,WAAYC,EAMZ,sBAAuBC,EAMvB,qBAAsBC,EAMtB,YAAaC,EAMb,oBAAqBC,CACvB,CAAC"}
+{"version":3,"file":"DataTable.js","names":[],"sources":["../../../src/components/data-table/DataTable.tsx"],"sourcesContent":["import { DataTableBody } from './DataTableBody'\nimport { DataTableBulkActions } from './DataTableBulkActions'\nimport { DataTableBulkActionsFloating } from './DataTableBulkActionsFloating'\nimport { DataTableProvider } from './DataTableContext'\nimport { DataTableDataCell } from './DataTableDataCell'\nimport { DataTableEmptyState } from './DataTableEmptyState'\nimport { DataTableError } from './DataTableError'\nimport { DataTableGlobalFilter } from './DataTableGlobalFilter'\nimport { DataTableHead } from './DataTableHead'\nimport { DataTableHeaderCell } from './DataTableHeaderCell'\nimport { DataTableLoading } from './DataTableLoading'\nimport { DataTableMetaData } from './DataTableMetaData'\nimport { DataTableRow } from './DataTableRow'\nimport { DataTableRowSelectionCheckbox } from './DataTableRowSelectionCheckbox'\nimport { DataTableSelectAllRowsCheckbox } from './DataTableSelectAllRowsCheckbox'\nimport { DataTableTable } from './DataTableTable'\nimport { DragAndDropTable } from './drag-and-drop/DragAndDropTable'\nimport { Pagination } from './pagination/Pagination'\n\n/** Context provider for DataTable state and logic.\n *\n * Children can call `useDataTable` to access everything provided by `@tanstack/react-table` plus\n * the functionality we've built on top.\n */\nexport const DataTable = Object.assign(DataTableProvider, {\n  /** Default table body implementation for `DataTable`.\n   *\n   * Can be configured with alternating colours of rows. If you need more customisation options,\n   * you can build your own implementation with `useDataTable()` and the UI-only `Table` components.\n   */\n  Body: DataTableBody,\n\n  /** Default table data cell implementation for `DataTable`\n   *\n   *\n   */\n  DataCell: DataTableDataCell,\n\n  /**\n   * Used in place of `DataTable.Table` to render a table with rows that the user can sort by drag-and-drop\n   */\n  DragAndDropTable: DragAndDropTable,\n\n  /** Default global search implementation for `DataTable`\n   *\n   * If you need more customisation options, you can compose your own implementation with our UI-only input components and `useDataTable`.\n   */\n  GlobalFilter: DataTableGlobalFilter,\n\n  /** Default table head implementation\n   *\n   * Can be configured to be sortable and with different visual themes.\n   * If you need more customisation options, you can build your own implementation\n   * with `useDataTable` and the UI-only `Table` components.\n   */\n  Head: DataTableHead,\n\n  /** Default header implementation for `DataTable`\n   *\n   * Can be configured to make the column sortable. If you need more customisation options,\n   * you can build your own implementation with the UI-only `Table` components.\n   */\n  HeaderCell: DataTableHeaderCell,\n\n  /** Default pagination implementation for `DataTable`\n   *\n   * Can navigate forward, backward, or to any specific page. If you need more customisation options,\n   * you can build your own implementation with `useDataTable` and other UI components.\n   *\n   */\n  MetaData: DataTableMetaData,\n\n  /** Default display of amount of items and current sorting status for 'DataTable'\n   *\n   */\n  Pagination: Pagination,\n\n  /** Default row implementation for `DataTable`\n   *\n   * Renders all visible cells as `Table.Cell`. If you need more customisation options,\n   * you can build your own implementation with the UI-only `Table` components.\n   */\n  Row: DataTableRow,\n\n  /** Default table implementation for `DataTable`.\n   *\n   * Can be configured with sortable columns and different visual themes.\n   *\n   * If you need more customisation options, you can compose your own implementation with\n   * lower-level `DataTable` components or build the whole thing from\n   * scratch with `useDataTable` and the UI-only `Table` components.\n   *\n   */\n  Table: DataTableTable,\n\n  /** Default loading implementation for remote data\n   *\n   * Renders a loading component while fetching the paginated data using `getAsyncData`.\n   *\n   * If you need more customisation, you can compose your own implentation, `asyncDataState`\n   * can be retrieved from `useDataTable`\n   */\n  Loading: DataTableLoading,\n\n  /** Default error implementation for remote data\n   *\n   * Renders an error component when `getAsyncData` promise rejects.\n   * Children are rendered as a function, it exposes a `runAsyncData` function to the children component.\n   * `runAsyncData()` can be used to retry fetching the paginated data with the current pageIndex, pageSize\n   * and sorting parameters or your own custom paginated options.\n   *\n   * If you need more customisation, you can compose your own implentation, `asyncDataState` and `runAsyncData()`\n   * can be retrieved from `useDataTable`\n   *\n   */\n  Error: DataTableError,\n\n  /** Empty state implementation for `DataTable`.\n   *\n   * Extends the EmptyState component\n   */\n  EmptyState: DataTableEmptyState,\n\n  /** Select all rows checkbox.\n   *\n   * Renders a checkbox on the header, allowing for bulk selection/deselection of all selectable rows\n   */\n  SelectAllRowsCheckbox: DataTableSelectAllRowsCheckbox,\n\n  /** Individual row selection checkbox.\n   *\n   * Renders a checkbox on each row, allowing for individual selection/deselection of any selectable row\n   */\n  RowSelectionCheckbox: DataTableRowSelectionCheckbox,\n\n  /** Bulk actions for selected rows.\n   *\n   * Renders a toolbar with actions that can be applied to all selected rows\n   */\n  BulkActions: DataTableBulkActions,\n\n  /** Bulk actions for selected rows.\n   *\n   * Renders a toolbar with actions that can be applied to all selected rows\n   */\n  BulkActionsFloating: DataTableBulkActionsFloating\n})\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAwBA,IAAa,IAAY,OAAO,OAAO,GAAmB;CAMxD,MAAM;CAMN,UAAU;CAKQ;CAMlB,cAAc;CAQd,MAAM;CAON,YAAY;CAQZ,UAAU;CAKE;CAOZ,KAAK;CAWL,OAAO;CASP,SAAS;CAaT,OAAO;CAMP,YAAY;CAMZ,uBAAuB;CAMvB,sBAAsB;CAMtB,aAAa;CAMb,qBAAqB;CACtB,CAAC"}

package/dist/components/data-table/DataTable.types.js

@@ -1,2 +1,8 @@
-var E=(e=>(e.NONE="none",e.PENDING="pending",e.FULFILLED="fulfilled",e.REJECTED="rejected",e))(E||{});export{E as AsyncDataState};
-//# sourceMappingURL=DataTable.types.js.map
+//#region src/components/data-table/DataTable.types.ts
+var e = /* @__PURE__ */ function(e) {
+	return e.NONE = "none", e.PENDING = "pending", e.FULFILLED = "fulfilled", e.REJECTED = "rejected", e;
+}({});
+//#endregion
+export { e as AsyncDataState };
+
+//# sourceMappingURL=DataTable.types.js.map

package/dist/components/data-table/DataTable.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTable.types.js","sources":["../../../src/components/data-table/DataTable.types.ts"],"sourcesContent":["import type {\n  ColumnOrderTableState,\n  ColumnPinningTableState,\n  ColumnSizingTableState,\n  ExpandedTableState,\n  FiltersTableState,\n  GroupingTableState,\n  PaginationTableState,\n  Row,\n  RowSelectionState,\n  RowSelectionTableState,\n  SortDirection,\n  SortingTableState,\n  Table,\n  VisibilityTableState\n} from '@tanstack/react-table'\nimport * as React from 'react'\n\nexport enum AsyncDataState {\n  NONE = 'none',\n  PENDING = 'pending',\n  FULFILLED = 'fulfilled',\n  REJECTED = 'rejected'\n}\n\nexport type TAsyncDataResult = {\n  total: number\n  results: TableData\n}\n\nexport type TAsyncDataOptions = {\n  pageIndex: number\n  pageSize: number\n  sortBy?: string\n  sortDirection?: SortDirection\n  globalFilter?: string\n}\n\nexport type TGetAsyncData = (\n  options: TAsyncDataOptions\n) => Promise<TAsyncDataResult | undefined>\n\nexport type TablePosition = {\n  top: number | null\n  bottom: number | null\n  offsetTop: number\n  isVisible: boolean\n}\n\nexport type DataTableContextType<T = unknown> = Table<T> & {\n  setIsSortable: React.Dispatch<React.SetStateAction<boolean>>\n  applyPagination: () => void\n  getTotalRows: () => number\n  isSortable: boolean\n  asyncDataState?: AsyncDataState\n  runAsyncData?: (options: Partial<TAsyncDataOptions>) => Promise<void>\n  hasAsyncData: boolean\n  disabledRows?: Record<string, boolean>\n  enableRowSelection?: boolean | ((row: Row<unknown>) => boolean)\n  rowSelection: RowSelectionState\n  tablePosition?: TablePosition\n  setTablePosition: React.Dispatch<React.SetStateAction<TablePosition>>\n  data: TAsyncDataResult\n  columns: any\n  tableId: string\n  /**\n   * Directly update the data array that the table rows are built from.\n   * This is useful when re-ordering rows, but is high-risk if you're not sure what you're doing!\n   *\n   *  Note in particular that this value is also updated if you update the value of the `DataTable`'s `data` prop\n   *  — it's probably best to only use one of those two methods for any given table.\n   */\n  setData: React.Dispatch<React.SetStateAction<TAsyncDataResult>>\n}\n\nexport type TableData = Array<Record<string, unknown>>\n\nexport type InitialState = Partial<\n  VisibilityTableState &\n    ColumnOrderTableState &\n    ColumnPinningTableState &\n    FiltersTableState &\n    SortingTableState &\n    ExpandedTableState &\n    GroupingTableState &\n    ColumnSizingTableState &\n    PaginationTableState &\n    RowSelectionTableState\n>\n\nexport type TDefaultSort = { column: string; direction: SortDirection }\n"],"names":["AsyncDataState"],"mappings":"AAkBO,IAAKA,GAAAA,IACVA,EAAA,KAAO,OACPA,EAAA,QAAU,UACVA,EAAA,UAAY,YACZA,EAAA,SAAW,WAJDA,IAAAA,GAAA,CAAA,CAAA"}
+{"version":3,"file":"DataTable.types.js","names":[],"sources":["../../../src/components/data-table/DataTable.types.ts"],"sourcesContent":["import type {\n  ColumnOrderTableState,\n  ColumnPinningTableState,\n  ColumnSizingTableState,\n  ExpandedTableState,\n  FiltersTableState,\n  GroupingTableState,\n  PaginationTableState,\n  Row,\n  RowSelectionState,\n  RowSelectionTableState,\n  SortDirection,\n  SortingTableState,\n  Table,\n  VisibilityTableState\n} from '@tanstack/react-table'\nimport * as React from 'react'\n\nexport enum AsyncDataState {\n  NONE = 'none',\n  PENDING = 'pending',\n  FULFILLED = 'fulfilled',\n  REJECTED = 'rejected'\n}\n\nexport type TAsyncDataResult = {\n  total: number\n  results: TableData\n}\n\nexport type TAsyncDataOptions = {\n  pageIndex: number\n  pageSize: number\n  sortBy?: string\n  sortDirection?: SortDirection\n  globalFilter?: string\n}\n\nexport type TGetAsyncData = (\n  options: TAsyncDataOptions\n) => Promise<TAsyncDataResult | undefined>\n\nexport type TablePosition = {\n  top: number | null\n  bottom: number | null\n  offsetTop: number\n  isVisible: boolean\n}\n\nexport type DataTableContextType<T = unknown> = Table<T> & {\n  setIsSortable: React.Dispatch<React.SetStateAction<boolean>>\n  applyPagination: () => void\n  getTotalRows: () => number\n  isSortable: boolean\n  asyncDataState?: AsyncDataState\n  runAsyncData?: (options: Partial<TAsyncDataOptions>) => Promise<void>\n  hasAsyncData: boolean\n  disabledRows?: Record<string, boolean>\n  enableRowSelection?: boolean | ((row: Row<unknown>) => boolean)\n  rowSelection: RowSelectionState\n  tablePosition?: TablePosition\n  setTablePosition: React.Dispatch<React.SetStateAction<TablePosition>>\n  data: TAsyncDataResult\n  columns: any\n  tableId: string\n  /**\n   * Directly update the data array that the table rows are built from.\n   * This is useful when re-ordering rows, but is high-risk if you're not sure what you're doing!\n   *\n   *  Note in particular that this value is also updated if you update the value of the `DataTable`'s `data` prop\n   *  — it's probably best to only use one of those two methods for any given table.\n   */\n  setData: React.Dispatch<React.SetStateAction<TAsyncDataResult>>\n}\n\nexport type TableData = Array<Record<string, unknown>>\n\nexport type InitialState = Partial<\n  VisibilityTableState &\n    ColumnOrderTableState &\n    ColumnPinningTableState &\n    FiltersTableState &\n    SortingTableState &\n    ExpandedTableState &\n    GroupingTableState &\n    ColumnSizingTableState &\n    PaginationTableState &\n    RowSelectionTableState\n>\n\nexport type TDefaultSort = { column: string; direction: SortDirection }\n"],"mappings":";AAkBA,IAAY,IAAL,yBAAA,GAAA;QACL,EAAA,OAAA,QACA,EAAA,UAAA,WACA,EAAA,YAAA,aACA,EAAA,WAAA;KACD"}

package/dist/components/data-table/DataTableBody.js

@@ -1,2 +1,20 @@
-import*as o from"react";import{Table as i}from"../table/Table.js";import{useDataTable as n}from"./DataTableContext.js";import{DataTableRow as p}from"./DataTableRow.js";const l=({striped:t=!1,rowAction:r,...a})=>{const{getRowModel:m}=n();return o.createElement(i.Body,{...a,striped:t},m().rows.map(e=>o.createElement(p,{row:e,key:e.id,rowAction:r})))};export{l as DataTableBody};
-//# sourceMappingURL=DataTableBody.js.map
+import { Table as e } from "../table/Table.js";
+import { useDataTable as t } from "./DataTableContext.js";
+import { DataTableRow as n } from "./DataTableRow.js";
+import * as r from "react";
+//#region src/components/data-table/DataTableBody.tsx
+var i = ({ striped: i = !1, rowAction: a, ...o }) => {
+	let { getRowModel: s } = t();
+	return /* @__PURE__ */ r.createElement(e.Body, {
+		...o,
+		striped: i
+	}, s().rows.map((e) => /* @__PURE__ */ r.createElement(n, {
+		row: e,
+		key: e.id,
+		rowAction: a
+	})));
+};
+//#endregion
+export { i as DataTableBody };
+
+//# sourceMappingURL=DataTableBody.js.map

package/dist/components/data-table/DataTableBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableBody.js","sources":["../../../src/components/data-table/DataTableBody.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Table } from '../table/Table'\nimport { useDataTable } from './DataTableContext'\nimport { DataTableRow } from './DataTableRow'\n\ntype DataTableBodyProps = Omit<\n  React.ComponentProps<typeof Table.Body>,\n  'children'\n> & {\n  rowAction?: (row: Record<string, unknown>, event: React.MouseEvent) => void\n}\n\nexport const DataTableBody = ({\n  striped = false,\n  rowAction,\n  ...props\n}: DataTableBodyProps) => {\n  const { getRowModel } = useDataTable()\n\n  return (\n    <Table.Body {...props} striped={striped}>\n      {getRowModel().rows.map((row) => {\n        return <DataTableRow row={row} key={row.id} rowAction={rowAction} />\n      })}\n    </Table.Body>\n  )\n}\n"],"names":["DataTableBody","striped","rowAction","props","getRowModel","useDataTable","React","Table","row","DataTableRow"],"mappings":"wKAaa,MAAAA,EAAgB,CAAC,CAC5B,QAAAC,EAAU,GACV,UAAAC,EACA,GAAGC,CACL,IAA0B,CACxB,KAAM,CAAE,YAAAC,CAAY,EAAIC,EAAAA,EAExB,OACEC,EAAA,cAACC,EAAM,KAAN,CAAY,GAAGJ,EAAO,QAASF,CAC7BG,EAAAA,EAAAA,EAAc,KAAK,IAAKI,GAChBF,EAAA,cAACG,EAAA,CAAa,IAAKD,EAAK,IAAKA,EAAI,GAAI,UAAWN,CAAW,CAAA,CACnE,CACH,CAEJ"}
+{"version":3,"file":"DataTableBody.js","names":[],"sources":["../../../src/components/data-table/DataTableBody.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Table } from '../table/Table'\nimport { useDataTable } from './DataTableContext'\nimport { DataTableRow } from './DataTableRow'\n\ntype DataTableBodyProps = Omit<\n  React.ComponentProps<typeof Table.Body>,\n  'children'\n> & {\n  rowAction?: (row: Record<string, unknown>, event: React.MouseEvent) => void\n}\n\nexport const DataTableBody = ({\n  striped = false,\n  rowAction,\n  ...props\n}: DataTableBodyProps) => {\n  const { getRowModel } = useDataTable()\n\n  return (\n    <Table.Body {...props} striped={striped}>\n      {getRowModel().rows.map((row) => {\n        return <DataTableRow row={row} key={row.id} rowAction={rowAction} />\n      })}\n    </Table.Body>\n  )\n}\n"],"mappings":";;;;;AAaA,IAAa,KAAiB,EAC5B,aAAU,IACV,cACA,GAAG,QACqB;CACxB,IAAM,EAAE,mBAAgB,GAAc;AAEtC,QACE,kBAAA,cAAC,EAAM,MAAP;EAAY,GAAI;EAAgB;EAInB,EAHV,GAAa,CAAC,KAAK,KAAK,MAChB,kBAAA,cAAC,GAAD;EAAmB;EAAK,KAAK,EAAI;EAAe;EAAa,CAAA,CACpE,CACS"}

package/dist/components/data-table/DataTableBulkActions.js

@@ -1,2 +1,45 @@
-import*as e from"react";import{Button as a}from"../button/Button.js";import{Divider as i}from"../divider/Divider.js";import{styled as s}from"../../styled.js";import{useDataTable as c}from"./DataTableContext.js";import{DataTableMetaData as m}from"./DataTableMetaData.js";const u=s("div",{base:["flex","p-2","w-full","mb-2","justify-between","items-center","min-h-16","rounded-t-sm"],variants:{isRowSelected:{true:["bg-primary-100"]}}}),d=({children:l})=>{const{rowSelection:t}=c();return Object.keys(t||{}).length>0?null:l},f=({cancelLabel:l="Cancel",children:t})=>{const{toggleAllPageRowsSelected:n,rowSelection:r}=c(),o=()=>n(!1);return Object.keys(r||{}).length===0?null:e.createElement(e.Fragment,null,t,e.Children.count(t)>0&&e.createElement(i,{orientation:"vertical",className:"mx-4"}),e.createElement(a,{theme:"neutral",onClick:o},l))},b=Object.assign(({children:l,...t})=>{const{rowSelection:n}=c(),r=Object.keys(n||{}).length>0;return e.createElement(u,{isRowSelected:r,...t},e.createElement(m,null),e.createElement("div",{className:"flex items-center justify-end"},l))},{DefaultActions:d,SelectedRowActions:f});export{b as DataTableBulkActions};
-//# sourceMappingURL=DataTableBulkActions.js.map
+import { styled as e } from "../../styled.js";
+import { Button as t } from "../button/Button.js";
+import { useDataTable as n } from "./DataTableContext.js";
+import { Divider as r } from "../divider/Divider.js";
+import { DataTableMetaData as i } from "./DataTableMetaData.js";
+import * as a from "react";
+//#region src/components/data-table/DataTableBulkActions.tsx
+var o = e("div", {
+	base: [
+		"flex",
+		"p-2",
+		"w-full",
+		"mb-2",
+		"justify-between",
+		"items-center",
+		"min-h-16",
+		"rounded-t-sm"
+	],
+	variants: { isRowSelected: { true: ["bg-primary-100"] } }
+}), s = Object.assign(({ children: e, ...t }) => {
+	let { rowSelection: r } = n(), s = Object.keys(r || {}).length > 0;
+	return /* @__PURE__ */ a.createElement(o, {
+		isRowSelected: s,
+		...t
+	}, /* @__PURE__ */ a.createElement(i, null), /* @__PURE__ */ a.createElement("div", { className: "flex items-center justify-end" }, e));
+}, {
+	DefaultActions: ({ children: e }) => {
+		let { rowSelection: t } = n();
+		return Object.keys(t || {}).length > 0 ? null : e;
+	},
+	SelectedRowActions: ({ cancelLabel: e = "Cancel", children: i }) => {
+		let { toggleAllPageRowsSelected: o, rowSelection: s } = n();
+		return Object.keys(s || {}).length === 0 ? null : /* @__PURE__ */ a.createElement(a.Fragment, null, i, a.Children.count(i) > 0 && /* @__PURE__ */ a.createElement(r, {
+			orientation: "vertical",
+			className: "mx-4"
+		}), /* @__PURE__ */ a.createElement(t, {
+			theme: "neutral",
+			onClick: () => o(!1)
+		}, e));
+	}
+});
+//#endregion
+export { s as DataTableBulkActions };
+
+//# sourceMappingURL=DataTableBulkActions.js.map

package/dist/components/data-table/DataTableBulkActions.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableBulkActions.js","sources":["../../../src/components/data-table/DataTableBulkActions.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Button } from '~/components/button/Button'\nimport { Divider } from '~/components/divider/Divider'\nimport { styled } from '~/styled'\n\nimport { useDataTable } from './DataTableContext'\nimport { DataTableMetaData } from './DataTableMetaData'\n\nconst StyledContainer = styled('div', {\n  base: [\n    'flex',\n    'p-2',\n    'w-full',\n    'mb-2',\n    'justify-between',\n    'items-center',\n    'min-h-16',\n    'rounded-t-sm'\n  ],\n  variants: {\n    isRowSelected: {\n      true: ['bg-primary-100']\n    }\n  }\n})\n\nconst BulkActionsDefaultActions = ({\n  children\n}: {\n  children: React.ReactElement\n}): React.ReactElement | null => {\n  const { rowSelection } = useDataTable()\n\n  if (Object.keys(rowSelection || {}).length > 0) return null\n\n  return children\n}\n\nconst BulkActionsSelectedRowActions = ({\n  cancelLabel = 'Cancel',\n  children\n}: {\n  cancelLabel?: string\n  children: React.ReactNode\n}) => {\n  const { toggleAllPageRowsSelected, rowSelection } = useDataTable()\n\n  const handleDeselectAllPageRows = () => toggleAllPageRowsSelected(false)\n\n  if (Object.keys(rowSelection || {}).length === 0) return null\n\n  return (\n    <>\n      {children}\n      {React.Children.count(children) > 0 && (\n        <Divider orientation=\"vertical\" className=\"mx-4\" />\n      )}\n      <Button theme=\"neutral\" onClick={handleDeselectAllPageRows}>\n        {cancelLabel}\n      </Button>\n    </>\n  )\n}\n\nexport const DataTableBulkActions = Object.assign(\n  ({\n    children,\n    ...rest\n  }: {\n    children:\n      | React.ReactElement<\n          React.ComponentProps<typeof BulkActionsDefaultActions>\n        >\n      | React.ReactElement<\n          React.ComponentProps<typeof BulkActionsSelectedRowActions>\n        >\n      | [\n          React.ReactElement<\n            React.ComponentProps<typeof BulkActionsDefaultActions>\n          >,\n          React.ReactElement<\n            React.ComponentProps<typeof BulkActionsSelectedRowActions>\n          >\n        ]\n  }) => {\n    const { rowSelection } = useDataTable()\n\n    const isRowSelected = Object.keys(rowSelection || {}).length > 0\n\n    return (\n      <StyledContainer isRowSelected={isRowSelected} {...rest}>\n        <DataTableMetaData />\n        <div className=\"flex items-center justify-end\">{children}</div>\n      </StyledContainer>\n    )\n  },\n  {\n    DefaultActions: BulkActionsDefaultActions,\n    SelectedRowActions: BulkActionsSelectedRowActions\n  }\n)\n"],"names":["StyledContainer","styled","BulkActionsDefaultActions","children","rowSelection","useDataTable","BulkActionsSelectedRowActions","cancelLabel","toggleAllPageRowsSelected","handleDeselectAllPageRows","React","Divider","Button","DataTableBulkActions","rest","isRowSelected","DataTableMetaData"],"mappings":"8QASA,MAAMA,EAAkBC,EAAO,MAAO,CACpC,KAAM,CACJ,OACA,MACA,SACA,OACA,kBACA,eACA,WACA,cACF,EACA,SAAU,CACR,cAAe,CACb,KAAM,CAAC,gBAAgB,CACzB,CACF,CACF,CAAC,EAEKC,EAA4B,CAAC,CACjC,SAAAC,CACF,IAEiC,CAC/B,KAAM,CAAE,aAAAC,CAAa,EAAIC,IAEzB,OAAI,OAAO,KAAKD,GAAgB,CAAA,CAAE,EAAE,OAAS,EAAU,KAEhDD,CACT,EAEMG,EAAgC,CAAC,CACrC,YAAAC,EAAc,SACd,SAAAJ,CACF,IAGM,CACJ,KAAM,CAAE,0BAAAK,EAA2B,aAAAJ,CAAa,EAAIC,EAAa,EAE3DI,EAA4B,IAAMD,EAA0B,EAAK,EAEvE,OAAI,OAAO,KAAKJ,GAAgB,CAAE,CAAA,EAAE,SAAW,EAAU,KAGvDM,EAAA,cAAAA,EAAA,SAAA,KACGP,EACAO,EAAM,SAAS,MAAMP,CAAQ,EAAI,GAChCO,EAAA,cAACC,EAAA,CAAQ,YAAY,WAAW,UAAU,MAAO,CAAA,EAEnDD,EAAA,cAACE,EAAA,CAAO,MAAM,UAAU,QAASH,CAC9BF,EAAAA,CACH,CACF,CAEJ,EAEaM,EAAuB,OAAO,OACzC,CAAC,CACC,SAAAV,EACA,GAAGW,CACL,IAgBM,CACJ,KAAM,CAAE,aAAAV,CAAa,EAAIC,EAAa,EAEhCU,EAAgB,OAAO,KAAKX,GAAgB,EAAE,EAAE,OAAS,EAE/D,OACEM,EAAA,cAACV,EAAA,CAAgB,cAAee,EAAgB,GAAGD,CACjDJ,EAAAA,EAAA,cAACM,EAAA,IAAkB,EACnBN,EAAA,cAAC,MAAA,CAAI,UAAU,+BAAiCP,EAAAA,CAAS,CAC3D,CAEJ,EACA,CACE,eAAgBD,EAChB,mBAAoBI,CACtB,CACF"}
+{"version":3,"file":"DataTableBulkActions.js","names":[],"sources":["../../../src/components/data-table/DataTableBulkActions.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Button } from '~/components/button/Button'\nimport { Divider } from '~/components/divider/Divider'\nimport { styled } from '~/styled'\n\nimport { useDataTable } from './DataTableContext'\nimport { DataTableMetaData } from './DataTableMetaData'\n\nconst StyledContainer = styled('div', {\n  base: [\n    'flex',\n    'p-2',\n    'w-full',\n    'mb-2',\n    'justify-between',\n    'items-center',\n    'min-h-16',\n    'rounded-t-sm'\n  ],\n  variants: {\n    isRowSelected: {\n      true: ['bg-primary-100']\n    }\n  }\n})\n\nconst BulkActionsDefaultActions = ({\n  children\n}: {\n  children: React.ReactElement\n}): React.ReactElement | null => {\n  const { rowSelection } = useDataTable()\n\n  if (Object.keys(rowSelection || {}).length > 0) return null\n\n  return children\n}\n\nconst BulkActionsSelectedRowActions = ({\n  cancelLabel = 'Cancel',\n  children\n}: {\n  cancelLabel?: string\n  children: React.ReactNode\n}) => {\n  const { toggleAllPageRowsSelected, rowSelection } = useDataTable()\n\n  const handleDeselectAllPageRows = () => toggleAllPageRowsSelected(false)\n\n  if (Object.keys(rowSelection || {}).length === 0) return null\n\n  return (\n    <>\n      {children}\n      {React.Children.count(children) > 0 && (\n        <Divider orientation=\"vertical\" className=\"mx-4\" />\n      )}\n      <Button theme=\"neutral\" onClick={handleDeselectAllPageRows}>\n        {cancelLabel}\n      </Button>\n    </>\n  )\n}\n\nexport const DataTableBulkActions = Object.assign(\n  ({\n    children,\n    ...rest\n  }: {\n    children:\n      | React.ReactElement<\n          React.ComponentProps<typeof BulkActionsDefaultActions>\n        >\n      | React.ReactElement<\n          React.ComponentProps<typeof BulkActionsSelectedRowActions>\n        >\n      | [\n          React.ReactElement<\n            React.ComponentProps<typeof BulkActionsDefaultActions>\n          >,\n          React.ReactElement<\n            React.ComponentProps<typeof BulkActionsSelectedRowActions>\n          >\n        ]\n  }) => {\n    const { rowSelection } = useDataTable()\n\n    const isRowSelected = Object.keys(rowSelection || {}).length > 0\n\n    return (\n      <StyledContainer isRowSelected={isRowSelected} {...rest}>\n        <DataTableMetaData />\n        <div className=\"flex items-center justify-end\">{children}</div>\n      </StyledContainer>\n    )\n  },\n  {\n    DefaultActions: BulkActionsDefaultActions,\n    SelectedRowActions: BulkActionsSelectedRowActions\n  }\n)\n"],"mappings":";;;;;;;AASA,IAAM,IAAkB,EAAO,OAAO;CACpC,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU,EACR,eAAe,EACb,MAAM,CAAC,iBAAiB,EACzB,EACF;CACF,CAAC,EAwCW,IAAuB,OAAO,QACxC,EACC,aACA,GAAG,QAiBC;CACJ,IAAM,EAAE,oBAAiB,GAAc,EAEjC,IAAgB,OAAO,KAAK,KAAgB,EAAE,CAAC,CAAC,SAAS;AAE/D,QACE,kBAAA,cAAC,GAAD;EAAgC;EAAe,GAAI;EAGjC,EAFhB,kBAAA,cAAC,GAAA,KAAoB,EACrB,kBAAA,cAAC,OAAD,EAAK,WAAU,iCAAgD,EAAf,EAAe,CAC/C;GAGtB;CACE,iBAvE+B,EACjC,kBAG+B;EAC/B,IAAM,EAAE,oBAAiB,GAAc;AAIvC,SAFI,OAAO,KAAK,KAAgB,EAAE,CAAC,CAAC,SAAS,IAAU,OAEhD;;CA+DL,qBA5DmC,EACrC,iBAAc,UACd,kBAII;EACJ,IAAM,EAAE,8BAA2B,oBAAiB,GAAc;AAMlE,SAFI,OAAO,KAAK,KAAgB,EAAE,CAAC,CAAC,WAAW,IAAU,OAGvD,kBAAA,cAAA,EAAA,UAAA,MACG,GACA,EAAM,SAAS,MAAM,EAAS,GAAG,KAChC,kBAAA,cAAC,GAAD;GAAS,aAAY;GAAW,WAAU;GAAS,CAAA,EAErD,kBAAA,cAAC,GAAD;GAAQ,OAAM;GAAU,eAVY,EAA0B,GAAM;GAY3D,EADN,EACM,CACR;;CAuCJ,CACF"}

package/dist/components/data-table/DataTableBulkActionsFloating.js

@@ -1,2 +1,36 @@
-import{Close as i}from"@atom-learning/icons";import*as e from"react";import{styled as n}from"../../styled.js";import{ActionIcon as c}from"../action-icon/ActionIcon.js";import{Badge as p}from"../badge/Badge.js";import{Icon as f}from"../icon/Icon.js";import{Text as x}from"../text/Text.js";import{BulkActionsSelectedRowActions as u}from"./DataTableBulkActionsSelectedRowActions.js";import{useDataTable as g}from"./DataTableContext.js";const d=n("div",{base:["flex","pl-3","pr-1","py-2","mb-4","mt-2","justify-between","items-center","rounded-lg","bg-primary-800","pointer-events-auto","z-2","w-full","mx-4","shadow-lg","sm:max-w-200","lg:max-w-250","lg:mb-8","lg:pl-4","lg:pr-1","lg:py-3","xl:max-w-350","xl:mb-8","xl:pl-6","xl:pr-2","xl:py-4"]}),b=Object.assign(({children:s,...m})=>{const{rowSelection:t,toggleAllPageRowsSelected:o}=g(),r=e.useRef(null),l=e.useMemo(()=>Object.keys(t||{}).length,[t]),a=()=>o(!1);return l===0?null:e.createElement("section",{ref:r,className:"pointer-events-none sticky bottom-0 left-0 flex justify-center"},e.createElement(d,{...m},e.createElement("div",{className:"flex flex-auto items-center justify-start gap-2"},e.createElement(p,{theme:"success",size:"xs",emphasis:"subtle",className:"h-6 min-w-6"},l),e.createElement(x,{size:"sm",weight:"bold",className:"text-white"},"selected")),e.createElement("div",{className:"flex flex-auto items-center justify-end gap-3"},s,e.createElement(c,{appearance:"simple",theme:"white",size:"md",onClick:a,label:"close"},e.createElement(f,{is:i})))))},{SelectedRowActions:u});export{b as DataTableBulkActionsFloating};
-//# sourceMappingURL=DataTableBulkActionsFloating.js.map
+import { styled as e } from "../../styled.js";
+import { Icon as t } from "../icon/Icon.js";
+import { ActionIcon as n } from "../action-icon/ActionIcon.js";
+import { Text as r } from "../text/Text.js";
+import { Badge as i } from "../badge/Badge.js";
+import { useDataTable as a } from "./DataTableContext.js";
+import { BulkActionsSelectedRowActions as o } from "./DataTableBulkActionsSelectedRowActions.js";
+import * as s from "react";
+import { Close as c } from "@atom-learning/icons";
+//#region src/components/data-table/DataTableBulkActionsFloating.tsx
+var l = e("div", { base: /* @__PURE__ */ "flex.pl-3.pr-1.py-2.mb-4.mt-2.justify-between.items-center.rounded-lg.bg-primary-800.pointer-events-auto.z-2.w-full.mx-4.shadow-lg.sm:max-w-200.lg:max-w-250.lg:mb-8.lg:pl-4.lg:pr-1.lg:py-3.xl:max-w-350.xl:mb-8.xl:pl-6.xl:pr-2.xl:py-4".split(".") }), u = Object.assign(({ children: e, ...o }) => {
+	let { rowSelection: u, toggleAllPageRowsSelected: d } = a(), f = s.useRef(null), p = s.useMemo(() => Object.keys(u || {}).length, [u]);
+	return p === 0 ? null : /* @__PURE__ */ s.createElement("section", {
+		ref: f,
+		className: "pointer-events-none sticky bottom-0 left-0 flex justify-center"
+	}, /* @__PURE__ */ s.createElement(l, o, /* @__PURE__ */ s.createElement("div", { className: "flex flex-auto items-center justify-start gap-2" }, /* @__PURE__ */ s.createElement(i, {
+		theme: "success",
+		size: "xs",
+		emphasis: "subtle",
+		className: "h-6 min-w-6"
+	}, p), /* @__PURE__ */ s.createElement(r, {
+		size: "sm",
+		weight: "bold",
+		className: "text-white"
+	}, "selected")), /* @__PURE__ */ s.createElement("div", { className: "flex flex-auto items-center justify-end gap-3" }, e, /* @__PURE__ */ s.createElement(n, {
+		appearance: "simple",
+		theme: "white",
+		size: "md",
+		onClick: () => d(!1),
+		label: "close"
+	}, /* @__PURE__ */ s.createElement(t, { is: c })))));
+}, { SelectedRowActions: o });
+//#endregion
+export { u as DataTableBulkActionsFloating };
+
+//# sourceMappingURL=DataTableBulkActionsFloating.js.map

package/dist/components/data-table/DataTableBulkActionsFloating.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableBulkActionsFloating.js","sources":["../../../src/components/data-table/DataTableBulkActionsFloating.tsx"],"sourcesContent":["import { Close } from '@atom-learning/icons'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Badge } from '../badge/Badge'\nimport { Icon } from '../icon/Icon'\nimport { Text } from '../text/Text'\nimport { BulkActionsSelectedRowActions } from './DataTableBulkActionsSelectedRowActions'\nimport { useDataTable } from './DataTableContext'\n\nconst StyledContainer = styled('div', {\n  base: [\n    'flex',\n    'pl-3',\n    'pr-1',\n    'py-2',\n    'mb-4',\n    'mt-2',\n    'justify-between',\n    'items-center',\n    'rounded-lg',\n    'bg-primary-800',\n    'pointer-events-auto',\n    'z-2',\n    'w-full',\n    'mx-4',\n    'shadow-lg',\n    'sm:max-w-200',\n    'lg:max-w-250',\n    'lg:mb-8',\n    'lg:pl-4',\n    'lg:pr-1',\n    'lg:py-3',\n    'xl:max-w-350',\n    'xl:mb-8',\n    'xl:pl-6',\n    'xl:pr-2',\n    'xl:py-4'\n  ]\n})\n\nexport const DataTableBulkActionsFloating = Object.assign(\n  ({\n    children,\n    ...rest\n  }: React.PropsWithChildren<React.ComponentProps<typeof StyledContainer>>) => {\n    const { rowSelection, toggleAllPageRowsSelected } = useDataTable()\n\n    const actionBarRef = React.useRef<HTMLDivElement>(null)\n\n    const numberOfSelectedRows = React.useMemo(() => {\n      return Object.keys(rowSelection || {}).length\n    }, [rowSelection])\n\n    const handleDeselectAllPageRows = () => toggleAllPageRowsSelected(false)\n\n    if (numberOfSelectedRows === 0) return null\n\n    return (\n      <section\n        ref={actionBarRef}\n        className=\"pointer-events-none sticky bottom-0 left-0 flex justify-center\"\n      >\n        <StyledContainer {...rest}>\n          <div className=\"flex flex-auto items-center justify-start gap-2\">\n            <Badge\n              theme=\"success\"\n              size=\"xs\"\n              emphasis=\"subtle\"\n              className=\"h-6 min-w-6\"\n            >\n              {numberOfSelectedRows}\n            </Badge>\n            <Text size=\"sm\" weight=\"bold\" className=\"text-white\">\n              selected\n            </Text>\n          </div>\n          <div className=\"flex flex-auto items-center justify-end gap-3\">\n            {children}\n            <ActionIcon\n              appearance=\"simple\"\n              theme=\"white\"\n              size=\"md\"\n              onClick={handleDeselectAllPageRows}\n              label=\"close\"\n            >\n              <Icon is={Close} />\n            </ActionIcon>\n          </div>\n        </StyledContainer>\n      </section>\n    )\n  },\n  {\n    SelectedRowActions: BulkActionsSelectedRowActions\n  }\n)\n"],"names":["StyledContainer","styled","DataTableBulkActionsFloating","children","rest","rowSelection","toggleAllPageRowsSelected","useDataTable","actionBarRef","React","numberOfSelectedRows","handleDeselectAllPageRows","Badge","Text","ActionIcon","Icon","Close","BulkActionsSelectedRowActions"],"mappings":"ibAYA,MAAMA,EAAkBC,EAAO,MAAO,CACpC,KAAM,CACJ,OACA,OACA,OACA,OACA,OACA,OACA,kBACA,eACA,aACA,iBACA,sBACA,MACA,SACA,OACA,YACA,eACA,eACA,UACA,UACA,UACA,UACA,eACA,UACA,UACA,UACA,SACF,CACF,CAAC,EAEYC,EAA+B,OAAO,OACjD,CAAC,CACC,SAAAC,EACA,GAAGC,CACL,IAA6E,CAC3E,KAAM,CAAE,aAAAC,EAAc,0BAAAC,CAA0B,EAAIC,EAAAA,EAE9CC,EAAeC,EAAM,OAAuB,IAAI,EAEhDC,EAAuBD,EAAM,QAAQ,IAClC,OAAO,KAAKJ,GAAgB,CAAA,CAAE,EAAE,OACtC,CAACA,CAAY,CAAC,EAEXM,EAA4B,IAAML,EAA0B,EAAK,EAEvE,OAAII,IAAyB,EAAU,KAGrCD,EAAA,cAAC,UAAA,CACC,IAAKD,EACL,UAAU,gEAEVC,EAAAA,EAAA,cAACT,EAAA,CAAiB,GAAGI,CACnBK,EAAAA,EAAA,cAAC,MAAA,CAAI,UAAU,iDAAA,EACbA,EAAA,cAACG,EAAA,CACC,MAAM,UACN,KAAK,KACL,SAAS,SACT,UAAU,aAETF,EAAAA,CACH,EACAD,EAAA,cAACI,EAAA,CAAK,KAAK,KAAK,OAAO,OAAO,UAAU,YAAa,EAAA,UAErD,CACF,EACAJ,EAAA,cAAC,MAAI,CAAA,UAAU,iDACZN,EACDM,EAAA,cAACK,EAAA,CACC,WAAW,SACX,MAAM,QACN,KAAK,KACL,QAASH,EACT,MAAM,OAAA,EAENF,EAAA,cAACM,EAAA,CAAK,GAAIC,CAAO,CAAA,CACnB,CACF,CACF,CACF,CAEJ,EACA,CACE,mBAAoBC,CACtB,CACF"}
+{"version":3,"file":"DataTableBulkActionsFloating.js","names":[],"sources":["../../../src/components/data-table/DataTableBulkActionsFloating.tsx"],"sourcesContent":["import { Close } from '@atom-learning/icons'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Badge } from '../badge/Badge'\nimport { Icon } from '../icon/Icon'\nimport { Text } from '../text/Text'\nimport { BulkActionsSelectedRowActions } from './DataTableBulkActionsSelectedRowActions'\nimport { useDataTable } from './DataTableContext'\n\nconst StyledContainer = styled('div', {\n  base: [\n    'flex',\n    'pl-3',\n    'pr-1',\n    'py-2',\n    'mb-4',\n    'mt-2',\n    'justify-between',\n    'items-center',\n    'rounded-lg',\n    'bg-primary-800',\n    'pointer-events-auto',\n    'z-2',\n    'w-full',\n    'mx-4',\n    'shadow-lg',\n    'sm:max-w-200',\n    'lg:max-w-250',\n    'lg:mb-8',\n    'lg:pl-4',\n    'lg:pr-1',\n    'lg:py-3',\n    'xl:max-w-350',\n    'xl:mb-8',\n    'xl:pl-6',\n    'xl:pr-2',\n    'xl:py-4'\n  ]\n})\n\nexport const DataTableBulkActionsFloating = Object.assign(\n  ({\n    children,\n    ...rest\n  }: React.PropsWithChildren<React.ComponentProps<typeof StyledContainer>>) => {\n    const { rowSelection, toggleAllPageRowsSelected } = useDataTable()\n\n    const actionBarRef = React.useRef<HTMLDivElement>(null)\n\n    const numberOfSelectedRows = React.useMemo(() => {\n      return Object.keys(rowSelection || {}).length\n    }, [rowSelection])\n\n    const handleDeselectAllPageRows = () => toggleAllPageRowsSelected(false)\n\n    if (numberOfSelectedRows === 0) return null\n\n    return (\n      <section\n        ref={actionBarRef}\n        className=\"pointer-events-none sticky bottom-0 left-0 flex justify-center\"\n      >\n        <StyledContainer {...rest}>\n          <div className=\"flex flex-auto items-center justify-start gap-2\">\n            <Badge\n              theme=\"success\"\n              size=\"xs\"\n              emphasis=\"subtle\"\n              className=\"h-6 min-w-6\"\n            >\n              {numberOfSelectedRows}\n            </Badge>\n            <Text size=\"sm\" weight=\"bold\" className=\"text-white\">\n              selected\n            </Text>\n          </div>\n          <div className=\"flex flex-auto items-center justify-end gap-3\">\n            {children}\n            <ActionIcon\n              appearance=\"simple\"\n              theme=\"white\"\n              size=\"md\"\n              onClick={handleDeselectAllPageRows}\n              label=\"close\"\n            >\n              <Icon is={Close} />\n            </ActionIcon>\n          </div>\n        </StyledContainer>\n      </section>\n    )\n  },\n  {\n    SelectedRowActions: BulkActionsSelectedRowActions\n  }\n)\n"],"mappings":";;;;;;;;;;AAYA,IAAM,IAAkB,EAAO,OAAO,EACpC,MAAM,sQA2BL,EACF,CAAC,EAEW,IAA+B,OAAO,QAChD,EACC,aACA,GAAG,QACwE;CAC3E,IAAM,EAAE,iBAAc,iCAA8B,GAAc,EAE5D,IAAe,EAAM,OAAuB,KAAK,EAEjD,IAAuB,EAAM,cAC1B,OAAO,KAAK,KAAgB,EAAE,CAAC,CAAC,QACtC,CAAC,EAAa,CAAC;AAMlB,QAFI,MAAyB,IAAU,OAGrC,kBAAA,cAAC,WAAD;EACE,KAAK;EACL,WAAU;EA6BF,EA3BR,kBAAA,cAAC,GAAoB,GACnB,kBAAA,cAAC,OAAD,EAAK,WAAU,mDAYT,EAXJ,kBAAA,cAAC,GAAD;EACE,OAAM;EACN,MAAK;EACL,UAAS;EACT,WAAU;EAGJ,EADL,EACK,EACR,kBAAA,cAAC,GAAD;EAAM,MAAK;EAAK,QAAO;EAAO,WAAU;EAEjC,EAF8C,WAE9C,CACH,EACN,kBAAA,cAAC,OAAD,EAAK,WAAU,iDAWT,EAVH,GACD,kBAAA,cAAC,GAAD;EACE,YAAW;EACX,OAAM;EACN,MAAK;EACL,eA7B8B,EAA0B,GAAM;EA8B9D,OAAM;EAGK,EADX,kBAAA,cAAC,GAAD,EAAM,IAAI,GAAS,CAAA,CACR,CACT,CACU,CACV;GAGd,EACE,oBAAoB,GACrB,CACF"}

package/dist/components/data-table/DataTableBulkActionsSelectedRowActions.js

@@ -1,2 +1,19 @@
-import*as e from"react";import{Button as i}from"../button/Button.js";import{Divider as a}from"../divider/Divider.js";import{useDataTable as m}from"./DataTableContext.js";const s=({cancelLabel:l="Cancel",showDividers:n=!0,children:t})=>{const{toggleAllPageRowsSelected:o,rowSelection:r}=m(),c=()=>o(!1);return Object.keys(r||{}).length===0?null:e.createElement(e.Fragment,null,t,n&&e.Children.count(t)>0&&e.createElement(a,{orientation:"vertical",className:"mx-4"}),e.createElement(i,{theme:"neutral",onClick:c},l))};export{s as BulkActionsSelectedRowActions};
-//# sourceMappingURL=DataTableBulkActionsSelectedRowActions.js.map
+import { Button as e } from "../button/Button.js";
+import { useDataTable as t } from "./DataTableContext.js";
+import { Divider as n } from "../divider/Divider.js";
+import * as r from "react";
+//#region src/components/data-table/DataTableBulkActionsSelectedRowActions.tsx
+var i = ({ cancelLabel: i = "Cancel", showDividers: a = !0, children: o }) => {
+	let { toggleAllPageRowsSelected: s, rowSelection: c } = t();
+	return Object.keys(c || {}).length === 0 ? null : /* @__PURE__ */ r.createElement(r.Fragment, null, o, a && r.Children.count(o) > 0 && /* @__PURE__ */ r.createElement(n, {
+		orientation: "vertical",
+		className: "mx-4"
+	}), /* @__PURE__ */ r.createElement(e, {
+		theme: "neutral",
+		onClick: () => s(!1)
+	}, i));
+};
+//#endregion
+export { i as BulkActionsSelectedRowActions };
+
+//# sourceMappingURL=DataTableBulkActionsSelectedRowActions.js.map

package/dist/components/data-table/DataTableBulkActionsSelectedRowActions.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableBulkActionsSelectedRowActions.js","sources":["../../../src/components/data-table/DataTableBulkActionsSelectedRowActions.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Button } from '../button/Button'\nimport { Divider } from '../divider/Divider'\nimport { useDataTable } from './DataTableContext'\n\nexport const BulkActionsSelectedRowActions = ({\n  cancelLabel = 'Cancel',\n  showDividers = true,\n  children\n}: {\n  cancelLabel?: string\n  showDividers?: boolean\n  children: React.ReactNode\n}) => {\n  const { toggleAllPageRowsSelected, rowSelection } = useDataTable()\n\n  const handleDeselectAllPageRows = () => toggleAllPageRowsSelected(false)\n\n  if (Object.keys(rowSelection || {}).length === 0) return null\n\n  return (\n    <>\n      {children}\n      {showDividers && React.Children.count(children) > 0 && (\n        <Divider orientation=\"vertical\" className=\"mx-4\" />\n      )}\n      <Button theme=\"neutral\" onClick={handleDeselectAllPageRows}>\n        {cancelLabel}\n      </Button>\n    </>\n  )\n}\n"],"names":["BulkActionsSelectedRowActions","cancelLabel","showDividers","children","toggleAllPageRowsSelected","rowSelection","useDataTable","handleDeselectAllPageRows","React","Divider","Button"],"mappings":"0KAMa,MAAAA,EAAgC,CAAC,CAC5C,YAAAC,EAAc,SACd,aAAAC,EAAe,GACf,SAAAC,CACF,IAIM,CACJ,KAAM,CAAE,0BAAAC,EAA2B,aAAAC,CAAa,EAAIC,EAE9CC,EAAAA,EAA4B,IAAMH,EAA0B,EAAK,EAEvE,OAAI,OAAO,KAAKC,GAAgB,CAAE,CAAA,EAAE,SAAW,EAAU,KAGvDG,EAAA,cAAAA,EAAA,SACGL,KAAAA,EACAD,GAAgBM,EAAM,SAAS,MAAML,CAAQ,EAAI,GAChDK,EAAA,cAACC,EAAA,CAAQ,YAAY,WAAW,UAAU,OAAO,EAEnDD,EAAA,cAACE,EAAA,CAAO,MAAM,UAAU,QAASH,CAC9BN,EAAAA,CACH,CACF,CAEJ"}
+{"version":3,"file":"DataTableBulkActionsSelectedRowActions.js","names":[],"sources":["../../../src/components/data-table/DataTableBulkActionsSelectedRowActions.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Button } from '../button/Button'\nimport { Divider } from '../divider/Divider'\nimport { useDataTable } from './DataTableContext'\n\nexport const BulkActionsSelectedRowActions = ({\n  cancelLabel = 'Cancel',\n  showDividers = true,\n  children\n}: {\n  cancelLabel?: string\n  showDividers?: boolean\n  children: React.ReactNode\n}) => {\n  const { toggleAllPageRowsSelected, rowSelection } = useDataTable()\n\n  const handleDeselectAllPageRows = () => toggleAllPageRowsSelected(false)\n\n  if (Object.keys(rowSelection || {}).length === 0) return null\n\n  return (\n    <>\n      {children}\n      {showDividers && React.Children.count(children) > 0 && (\n        <Divider orientation=\"vertical\" className=\"mx-4\" />\n      )}\n      <Button theme=\"neutral\" onClick={handleDeselectAllPageRows}>\n        {cancelLabel}\n      </Button>\n    </>\n  )\n}\n"],"mappings":";;;;;AAMA,IAAa,KAAiC,EAC5C,iBAAc,UACd,kBAAe,IACf,kBAKI;CACJ,IAAM,EAAE,8BAA2B,oBAAiB,GAAc;AAMlE,QAFI,OAAO,KAAK,KAAgB,EAAE,CAAC,CAAC,WAAW,IAAU,OAGvD,kBAAA,cAAA,EAAA,UAAA,MACG,GACA,KAAgB,EAAM,SAAS,MAAM,EAAS,GAAG,KAChD,kBAAA,cAAC,GAAD;EAAS,aAAY;EAAW,WAAU;EAAS,CAAA,EAErD,kBAAA,cAAC,GAAD;EAAQ,OAAM;EAAU,eAVY,EAA0B,GAAM;EAY3D,EADN,EACM,CACR"}