npm - @cerberus-design/react - Versions diffs - 0.15.0-next-32cd15e → 0.15.0-next-68149ba - Mend

@cerberus-design/react 0.15.0-next-32cd15e → 0.15.0-next-68149ba

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (111) hide show

package/build/legacy/_tsup-dts-rollup.d.cts CHANGED Viewed

@@ -545,14 +545,46 @@ export { BaseSelectProps as BaseSelectProps_alias_1 }
 declare function Button(props: ButtonProps): JSX.Element;
 export { Button }
 export { Button as Button_alias_1 }
+export { Button as Button_alias_2 }
 /**
- * This module contains the Button component.
- * @module
+ * An icon to display in a button that utilizes the pending state to display
+ * a loading spinner.
+ */
+declare function ButtonIcon(props: PropsWithChildren<object>): JSX_2.Element;
+export { ButtonIcon }
+export { ButtonIcon as ButtonIcon_alias_1 }
+export { ButtonIcon as ButtonIcon_alias_2 }
+/**
+ * An Object containing the parts of the Button component. For users that
+ * prefer Object component syntax.
+ *
+ * @remarks
+ *
+ * When using object component syntax, you import the ButtonParts object and
+ * the entire family of components vs. only what you use.
  */
-declare type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & ButtonVariantProps;
+declare const ButtonParts: ButtonPartsValue;
+export { ButtonParts }
+export { ButtonParts as ButtonParts_alias_1 }
+export { ButtonParts as ButtonParts_alias_2 }
+/**
+ * This module contains the parts of the Button component.
+ * @module 'button/parts'
+ */
+declare interface ButtonPartsValue {
+    Root: ElementType;
+    Icon: ElementType;
+}
+declare type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & ButtonVariantProps & {
+    pending?: boolean;
+};
 export { ButtonProps }
 export { ButtonProps as ButtonProps_alias_1 }
+export { ButtonProps as ButtonProps_alias_2 }
 export { CancelDrop }

package/build/legacy/components/DatePicker.client.cjs CHANGED Viewed

@@ -33,7 +33,7 @@ __export(DatePicker_client_exports, {
   RangePickerInput: () => RangePickerInput
 });
 module.exports = __toCommonJS(DatePicker_client_exports);
-var import_react5 = require("@ark-ui/react");
+var import_react6 = require("@ark-ui/react");
 // src/components/Portal.tsx
 var import_react = require("@ark-ui/react");
@@ -132,16 +132,23 @@ function IconButton(props) {
   );
 }
-// src/components/Button.tsx
+// src/components/button/button.tsx
+var import_react4 = require("react");
 var import_css3 = require("@cerberus/styled-system/css");
 var import_recipes3 = require("@cerberus/styled-system/recipes");
+var import_jsx = require("@cerberus/styled-system/jsx");
 var import_jsx_runtime4 = require("react/jsx-runtime");
+var ButtonContext = (0, import_react4.createContext)({
+  pending: false
+});
 function Button(props) {
-  const { palette, usage, shape, size, ...nativeProps } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+  const { palette, usage, shape, size, pending = false, ...nativeProps } = props;
+  const value = (0, import_react4.useMemo)(() => ({ pending }), [pending]);
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ButtonContext.Provider, { value, children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
     "button",
     {
       ...nativeProps,
+      disabled: pending || nativeProps.disabled,
       className: (0, import_css3.cx)(
         nativeProps.className,
         (0, import_recipes3.button)({
@@ -152,15 +159,15 @@ function Button(props) {
         })
       )
     }
-  );
+  ) });
 }
 // src/context/cerberus.tsx
-var import_react4 = require("react");
+var import_react5 = require("react");
 var import_jsx_runtime5 = require("react/jsx-runtime");
-var CerberusContext = (0, import_react4.createContext)(null);
+var CerberusContext = (0, import_react5.createContext)(null);
 function useCerberusContext() {
-  const context = (0, import_react4.useContext)(CerberusContext);
+  const context = (0, import_react5.useContext)(CerberusContext);
   if (!context) {
     throw new Error("useCerberus must be used within a CerberusProvider");
   }
@@ -168,13 +175,13 @@ function useCerberusContext() {
 }
 // src/components/DatePicker.client.tsx
-var import_react6 = require("react");
+var import_react7 = require("react");
 var import_jsx_runtime6 = require("react/jsx-runtime");
 var datePickerStyles2 = (0, import_recipes4.datePicker)();
 function DatePicker(props) {
   const states = useFieldContext();
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-    import_react5.DatePicker.Root,
+    import_react6.DatePicker.Root,
     {
       ...props,
       ...states,
@@ -188,8 +195,8 @@ function DatePickerViewControlGroup(props) {
   const { icons } = useCerberusContext();
   const { calendarPrev: PrevIcon, calendarNext: NextIcon } = icons;
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(DatePickerViewControl, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react5.DatePicker.PrevTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(IconButton, { ariaLabel: "Previous", size: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(PrevIcon, {}) }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react5.DatePicker.ViewTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react6.DatePicker.PrevTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(IconButton, { ariaLabel: "Previous", size: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(PrevIcon, {}) }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react6.DatePicker.ViewTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
       Button,
       {
         className: (0, import_css4.css)({
@@ -199,17 +206,17 @@ function DatePickerViewControlGroup(props) {
         shape: "rounded",
         size: "sm",
         usage: "ghost",
-        children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react5.DatePicker.RangeText, {})
+        children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react6.DatePicker.RangeText, {})
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react5.DatePicker.NextTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(IconButton, { ariaLabel: "Next", size: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(NextIcon, {}) }) })
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react6.DatePicker.NextTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(IconButton, { ariaLabel: "Next", size: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(NextIcon, {}) }) })
   ] });
 }
 function DatePickerTrigger(props) {
   const { icons } = useCerberusContext();
   const { calendar: CalendarIcon } = icons;
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-    import_react5.DatePicker.Trigger,
+    import_react6.DatePicker.Trigger,
     {
       ...props,
       className: (0, import_css4.cx)(
@@ -226,10 +233,10 @@ function DatePickerTrigger(props) {
 }
 function DatePickerInput(props) {
   const { invalid, ...fieldStates } = useFieldContext();
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_react5.DatePicker.Control, { className: datePickerStyles2.control, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_react6.DatePicker.Control, { className: datePickerStyles2.control, children: [
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DatePickerTrigger, {}),
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      import_react5.DatePicker.Input,
+      import_react6.DatePicker.Input,
       {
         ...props,
         ...fieldStates,
@@ -244,12 +251,12 @@ function DatePickerInput(props) {
 function RangePickerInput(props) {
   const { invalid, ...fieldStates } = useFieldContext();
   const { defaultValue, ...nativeProps } = props;
-  const startDate = (0, import_react6.useMemo)(() => defaultValue == null ? void 0 : defaultValue[0], [defaultValue]);
-  const endDate = (0, import_react6.useMemo)(() => defaultValue == null ? void 0 : defaultValue[1], [defaultValue]);
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_react5.DatePicker.Control, { "data-range": true, className: datePickerStyles2.control, children: [
+  const startDate = (0, import_react7.useMemo)(() => defaultValue == null ? void 0 : defaultValue[0], [defaultValue]);
+  const endDate = (0, import_react7.useMemo)(() => defaultValue == null ? void 0 : defaultValue[1], [defaultValue]);
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_react6.DatePicker.Control, { "data-range": true, className: datePickerStyles2.control, children: [
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DatePickerTrigger, {}),
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      import_react5.DatePicker.Input,
+      import_react6.DatePicker.Input,
       {
         ...nativeProps,
         ...fieldStates,
@@ -263,7 +270,7 @@ function RangePickerInput(props) {
       }
     ),
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-      import_react5.DatePicker.Input,
+      import_react6.DatePicker.Input,
       {
         ...nativeProps,
         ...fieldStates,
@@ -281,8 +288,8 @@ function RangePickerInput(props) {
 }
 function DatePickerContent(props) {
   const { children, withModal, ...contentProps } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Portal, { disabled: withModal ?? false, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react5.DatePicker.Positioner, { className: datePickerStyles2.positioner, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
-    import_react5.DatePicker.Content,
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Portal, { disabled: withModal ?? false, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react6.DatePicker.Positioner, { className: datePickerStyles2.positioner, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    import_react6.DatePicker.Content,
     {
       ...contentProps,
       className: (0, import_css4.cx)(contentProps.className, datePickerStyles2.content),
@@ -310,8 +317,8 @@ function DatePickerDayView(props) {
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DatePickerView, { ...props, view: "day", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DatePickerContext, { children: (datePicker3) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DatePickerViewControlGroup, {}),
     /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(DatePickerTable, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react5.DatePicker.TableHead, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react5.DatePicker.TableRow, { children: datePicker3.weekDays.map((weekDay, id) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DatePickerTableHeader, { children: weekDay.narrow }, id)) }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react5.DatePicker.TableBody, { children: datePicker3.weeks.map((week, id) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react5.DatePicker.TableRow, { children: week.map((day, id2) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DatePickerTableCell, { value: day, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react6.DatePicker.TableHead, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react6.DatePicker.TableRow, { children: datePicker3.weekDays.map((weekDay, id) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DatePickerTableHeader, { children: weekDay.narrow }, id)) }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react6.DatePicker.TableBody, { children: datePicker3.weeks.map((week, id) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react6.DatePicker.TableRow, { children: week.map((day, id2) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DatePickerTableCell, { value: day, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
         DatePickerTableCellTrigger,
         {
           "data-date": getDayValue(day),
@@ -322,15 +329,15 @@ function DatePickerDayView(props) {
   ] }) }) });
 }
 function DatePickerMonthView(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react5.DatePicker.View, { ...props, view: "month", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react5.DatePicker.Context, { children: (datePicker3) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react6.DatePicker.View, { ...props, view: "month", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react6.DatePicker.Context, { children: (datePicker3) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DatePickerViewControlGroup, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DatePickerTable, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react5.DatePicker.TableBody, { children: datePicker3.getMonthsGrid({ columns: 4, format: "short" }).map((months, id) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react5.DatePicker.TableRow, { children: months.map((month, id2) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DatePickerTableCell, { value: month.value, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DatePickerTableCellTrigger, { children: month.label }) }, id2)) }, id)) }) })
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DatePickerTable, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react6.DatePicker.TableBody, { children: datePicker3.getMonthsGrid({ columns: 4, format: "short" }).map((months, id) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react6.DatePicker.TableRow, { children: months.map((month, id2) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DatePickerTableCell, { value: month.value, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DatePickerTableCellTrigger, { children: month.label }) }, id2)) }, id)) }) })
   ] }) }) });
 }
 function DatePickerYearView(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react5.DatePicker.View, { ...props, view: "year", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react5.DatePicker.Context, { children: (datePicker3) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react6.DatePicker.View, { ...props, view: "year", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react6.DatePicker.Context, { children: (datePicker3) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DatePickerViewControlGroup, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DatePickerTable, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react5.DatePicker.TableBody, { children: datePicker3.getYearsGrid({ columns: 4 }).map((years, id) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react5.DatePicker.TableRow, { children: years.map((year, id2) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DatePickerTableCell, { value: year.value, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DatePickerTableCellTrigger, { children: year.label }) }, id2)) }, id)) }) })
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DatePickerTable, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react6.DatePicker.TableBody, { children: datePicker3.getYearsGrid({ columns: 4 }).map((years, id) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react6.DatePicker.TableRow, { children: years.map((year, id2) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DatePickerTableCell, { value: year.value, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(DatePickerTableCellTrigger, { children: year.label }) }, id2)) }, id)) }) })
   ] }) }) });
 }
 function DatePickerCalendar(props) {

package/build/legacy/components/DatePicker.client.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/DatePicker.client.tsx","../../../src/components/Portal.tsx","../../../src/context/field.tsx","../../../src/components/DatePicker.server.tsx","../../../src/components/IconButton.tsx","../../../src/components/Button.tsx","../../../src/context/cerberus.tsx"],"sourcesContent":["'use client'\n\nimport {\n DatePicker as ArkDP,\n type DatePickerContentProps,\n type DatePickerInputProps,\n type DatePickerRootProps,\n type DatePickerTriggerProps,\n type DatePickerViewControlProps,\n type DatePickerViewProps,\n} from '@ark-ui/react'\nimport { Portal } from './Portal'\nimport { datePicker, iconButton } from '@cerberus/styled-system/recipes'\nimport { css, cx } from '@cerberus/styled-system/css'\nimport { useFieldContext } from '../context/field'\nimport {\n DatePickerView,\n DatePickerContext,\n DatePickerTable,\n DatePickerTableHeader,\n DatePickerTableCellTrigger,\n DatePickerTableCell,\n DatePickerViewControl,\n} from './DatePicker.server'\nimport { IconButton } from './IconButton'\nimport { Button } from './Button'\nimport { useCerberusContext } from '../context/cerberus'\nimport { useMemo, type InputHTMLAttributes } from 'react'\n\n/*\n This module contains the DatePicker client family components.\n * @module DatePicker:client\n /\n\n// We are not exposing this to the public API\nconst datePickerStyles = datePicker()\n\n/\n The main context provider for the DatePicker family components.\n * @definition [Date Picker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <Field>\n * <DatePicker name=\"start_date\">\n * <DatePickerLabel>Start date</DatePickerLabel>\n * <DatePickerInput />\n * <DatePickerCalendar />\n * </DatePicker>\n * </Field>\n * ```\n /\nexport function DatePicker(props: DatePickerRootProps) {\n const states = useFieldContext()\n\n // TODO: Remove this once the bug is fixed: https://github.com/chakra-ui/ark/issues/3112\n\n // There is a bug with the Root component that causes random date selection\n // onBlur after the first selection if the format prop is used.\n // const handleFormat = useCallback((value: DateValue) => {\n // return formatISOToMilitary(value.toString())\n // }, [])\n\n return (\n <ArkDP.Root\n {...props}\n {...states}\n positioning={{\n placement: 'bottom-start',\n }}\n />\n )\n}\n\n/\n An abstraction of the DatePicker control that contains the prev, view, and\n * next triggers which control the calendar output.\n * @definition [datePicker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <DatePickerViewControlGroup />\n * ```\n /\nexport function DatePickerViewControlGroup(props: DatePickerViewControlProps) {\n const { icons } = useCerberusContext()\n const { calendarPrev: PrevIcon, calendarNext: NextIcon } = icons\n return (\n <DatePickerViewControl {...props}>\n <ArkDP.PrevTrigger asChild>\n <IconButton ariaLabel=\"Previous\" size=\"sm\">\n <PrevIcon />\n </IconButton>\n </ArkDP.PrevTrigger>\n\n <ArkDP.ViewTrigger asChild>\n <Button\n className={css({\n h: '2rem',\n paddingInline: 'md',\n })}\n shape=\"rounded\"\n size=\"sm\"\n usage=\"ghost\"\n >\n <ArkDP.RangeText />\n </Button>\n </ArkDP.ViewTrigger>\n\n <ArkDP.NextTrigger asChild>\n <IconButton ariaLabel=\"Next\" size=\"sm\">\n <NextIcon />\n </IconButton>\n </ArkDP.NextTrigger>\n </DatePickerViewControl>\n )\n}\n\n/\n The trigger component for the DatePicker which opens the calendar.\n * @definition [datePicker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <DatePickerTrigger />\n * ```\n /\nexport function DatePickerTrigger(props: DatePickerTriggerProps) {\n const { icons } = useCerberusContext()\n const { calendar: CalendarIcon } = icons\n return (\n <ArkDP.Trigger\n {...props}\n className={cx(\n props.className,\n iconButton({\n size: 'sm',\n usage: 'ghost',\n }),\n datePickerStyles.trigger,\n )}\n >\n <CalendarIcon />\n </ArkDP.Trigger>\n )\n}\n\n/\n The input component for the DatePicker.\n * @definition [Date Picker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <Field>\n * <DatePicker name=\"start_date\">\n * <DatePickerLabel>Start date</DatePickerLabel>\n * <DatePickerInput />\n * <DatePickerCalendar />\n * </DatePicker>\n * </Field>\n * ```\n /\nexport function DatePickerInput(props: DatePickerInputProps) {\n const { invalid, ...fieldStates } = useFieldContext()\n return (\n <ArkDP.Control className={datePickerStyles.control}>\n <DatePickerTrigger />\n <ArkDP.Input\n {...props}\n {...fieldStates}\n {...(invalid && { 'aria-invalid': true })}\n className={cx(props.className, datePickerStyles.input)}\n placeholder={props.placeholder ?? 'DD MMM YYYY'}\n maxLength={11}\n />\n </ArkDP.Control>\n )\n}\n\nexport interface RangePickerInputProps\n extends Omit<DatePickerInputProps, 'defaultValue'> {\n /\n The defaultValue to add for the inputs. The first item is the start date\n * and the second item is the end date.\n /\n defaultValue?: [\n InputHTMLAttributes<HTMLInputElement>['defaultValue'],\n InputHTMLAttributes<HTMLInputElement>['defaultValue'],\n ]\n}\n\n/\n The input component for the DatePicker that uses ranges.\n * @definition [Date Picker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <Field>\n * <DatePicker name=\"start_date\" selection=\"range\">\n * <DatePickerLabel>Start date</DatePickerLabel>\n * <RangePickerInput />\n * <DatePickerCalendar />\n * </DatePicker>\n * </Field>\n * ```\n /\nexport function RangePickerInput(props: RangePickerInputProps) {\n const { invalid, ...fieldStates } = useFieldContext()\n const { defaultValue, ...nativeProps } = props\n\n const startDate = useMemo(() => defaultValue?.[0], [defaultValue])\n const endDate = useMemo(() => defaultValue?.[1], [defaultValue])\n\n return (\n <ArkDP.Control data-range className={datePickerStyles.control}>\n <DatePickerTrigger />\n <ArkDP.Input\n {...nativeProps}\n {...fieldStates}\n {...(invalid && { 'aria-invalid': true })}\n data-range-input\n defaultValue={startDate}\n className={cx(props.className, datePickerStyles.input)}\n placeholder={props.placeholder ?? 'DD MMM YYYY'}\n maxLength={11}\n index={0}\n />\n <ArkDP.Input\n {...nativeProps}\n {...fieldStates}\n {...(invalid && { 'aria-invalid': true })}\n data-range-input\n defaultValue={endDate}\n data-range-end-input\n className={cx(props.className, datePickerStyles.input)}\n placeholder={props.placeholder ?? 'DD MMM YYYY'}\n maxLength={11}\n index={1}\n />\n </ArkDP.Control>\n )\n}\n\n/\n The content component for the DatePicker which contains the calendar.\n * @definition [Date Picker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <Field>\n * <DatePicker name=\"start_date\">\n * <DatePickerLabel>Start date</DatePickerLabel>\n * <DatePickerInput />\n * <DatePickerCalendar />\n * </DatePicker>\n * </Field>\n * ```\n /\nexport function DatePickerContent(\n props: DatePickerContentProps & {\n withModal?: boolean\n },\n) {\n const { children, withModal, ...contentProps } = props\n return (\n <Portal disabled={withModal ?? false}>\n <ArkDP.Positioner className={datePickerStyles.positioner}>\n <ArkDP.Content\n {...contentProps}\n className={cx(contentProps.className, datePickerStyles.content)}\n >\n {children}\n </ArkDP.Content>\n </ArkDP.Positioner>\n </Portal>\n )\n}\n\n/\n The day view component for the DatePicker.\n * @definition [Date Picker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <Field>\n * <DatePicker name=\"start_date\">\n * <DatePickerLabel>Start date</DatePickerLabel>\n * <DatePickerInput />\n * <DatePickerCalendar />\n * </DatePicker>\n * </Field>\n * ```\n /\nexport function DatePickerDayView(props: Omit<DatePickerViewProps, 'view'>) {\n function isToday(date: ArkDP.DateValue): boolean {\n const today = new Date()\n const formatted = today.toISOString().split('T')[0]\n const arkDate = `${date.year}-${String(date.month).padStart(2, '0')}-${String(date.day).padStart(2, '0')}`\n return formatted === arkDate\n }\n\n function isPastDay(date: ArkDP.DateValue): boolean {\n const today = new Date()\n const arkDate = `${date.year}-${String(date.month).padStart(2, '0')}-${String(date.day).padStart(2, '0')}`\n return new Date(arkDate) < today\n }\n\n function getDayValue(date: ArkDP.DateValue): 'today' \| 'past' \| 'future' {\n if (isToday(date)) return 'today'\n if (isPastDay(date)) return 'past'\n return 'future'\n }\n\n return (\n <DatePickerView {...props} view=\"day\">\n <DatePickerContext>\n {(datePicker) => (\n <>\n <DatePickerViewControlGroup />\n\n <DatePickerTable>\n <ArkDP.TableHead>\n <ArkDP.TableRow>\n {datePicker.weekDays.map((weekDay, id) => (\n <DatePickerTableHeader key={id}>\n {weekDay.narrow}\n </DatePickerTableHeader>\n ))}\n </ArkDP.TableRow>\n </ArkDP.TableHead>\n\n <ArkDP.TableBody>\n {datePicker.weeks.map((week, id) => (\n <ArkDP.TableRow key={id}>\n {week.map((day, id) => (\n <DatePickerTableCell key={id} value={day}>\n <DatePickerTableCellTrigger\n data-date={getDayValue(day)}\n >\n {day.day}\n </DatePickerTableCellTrigger>\n </DatePickerTableCell>\n ))}\n </ArkDP.TableRow>\n ))}\n </ArkDP.TableBody>\n </DatePickerTable>\n </>\n )}\n </DatePickerContext>\n </DatePickerView>\n )\n}\n\n/\n The month view component for the DatePicker.\n * @definition [Date Picker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <Field>\n * <DatePicker name=\"start_date\">\n * <DatePickerLabel>Start date</DatePickerLabel>\n * <DatePickerInput />\n * <DatePickerCalendar />\n * </DatePicker>\n * </Field>\n * ```\n /\nexport function DatePickerMonthView(props: Omit<DatePickerViewProps, 'view'>) {\n return (\n <ArkDP.View {...props} view=\"month\">\n <ArkDP.Context>\n {(datePicker) => (\n <>\n <DatePickerViewControlGroup />\n\n <DatePickerTable>\n <ArkDP.TableBody>\n {datePicker\n .getMonthsGrid({ columns: 4, format: 'short' })\n .map((months, id) => (\n <ArkDP.TableRow key={id}>\n {months.map((month, id) => (\n <DatePickerTableCell key={id} value={month.value}>\n <DatePickerTableCellTrigger>\n {month.label}\n </DatePickerTableCellTrigger>\n </DatePickerTableCell>\n ))}\n </ArkDP.TableRow>\n ))}\n </ArkDP.TableBody>\n </DatePickerTable>\n </>\n )}\n </ArkDP.Context>\n </ArkDP.View>\n )\n}\n\n/\n The year view component for the DatePicker.\n * @definition [Date Picker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <Field>\n * <DatePicker name=\"start_date\">\n * <DatePickerLabel>Start date</DatePickerLabel>\n * <DatePickerInput />\n * <DatePickerCalendar />\n * </DatePicker>\n * </Field>\n * ```\n /\nexport function DatePickerYearView(props: Omit<DatePickerViewProps, 'view'>) {\n return (\n <ArkDP.View {...props} view=\"year\">\n <ArkDP.Context>\n {(datePicker) => (\n <>\n <DatePickerViewControlGroup />\n\n <DatePickerTable>\n <ArkDP.TableBody>\n {datePicker.getYearsGrid({ columns: 4 }).map((years, id) => (\n <ArkDP.TableRow key={id}>\n {years.map((year, id) => (\n <DatePickerTableCell key={id} value={year.value}>\n <DatePickerTableCellTrigger>\n {year.label}\n </DatePickerTableCellTrigger>\n </DatePickerTableCell>\n ))}\n </ArkDP.TableRow>\n ))}\n </ArkDP.TableBody>\n </DatePickerTable>\n </>\n )}\n </ArkDP.Context>\n </ArkDP.View>\n )\n}\n\n/\n An abstraction of the DatePicker content components that contain the\n * different calendar views and controls.\n * @definition [Date Picker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <Field>\n * <DatePicker name=\"start_date\">\n * <DatePickerLabel>Start date</DatePickerLabel>\n * <DatePickerInput />\n * <DatePickerCalendar />\n * </DatePicker>\n * </Field>\n * ```\n /\nexport function DatePickerCalendar(props: { withModal?: boolean }) {\n return (\n <DatePickerContent withModal={props.withModal}>\n <DatePickerDayView />\n <DatePickerMonthView />\n <DatePickerYearView />\n </DatePickerContent>\n )\n}\n","import {\n Portal as ArkPortal,\n type PortalProps as ArkPortalProps,\n} from '@ark-ui/react'\n\n/\n This module is the Portal component.\n * @module\n /\n\nexport type PortalProps = ArkPortalProps\n\n/\n The Portal component is used to render children into a DOM node that exists outside the DOM hierarchy of the parent component.\n * @see https://cerberus.digitalu.design/react/portal\n * @definition [React Portal Docs](https://react.dev/reference/react-dom/createPortal)\n * @example\n * ```tsx\n * 'use client'\n \n import { Portal } from '@cerberus/react'\n \n function SomeFeatureWithinSSRPage() {\n * return (\n * <Portal>\n * <div>Portal Content outside of the React VDom tree</div>\n * </Portal>\n * )\n * }\n /\nexport const Portal = ArkPortal\n","'use client'\n\nimport {\n createContext,\n useContext,\n useMemo,\n type PropsWithChildren,\n} from 'react'\n\n/\n This module provides a context and hook for the field.\n * @module Field\n /\n\nexport interface FieldContextValue {\n /\n Whether the field is disabled.\n * @description [Moz Input Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attributes)\n /\n disabled?: boolean\n /\n Whether the field is read-only.\n /\n readOnly?: boolean\n /\n Whether the field is required.\n /\n required?: boolean\n /\n Whether the field is invalid.\n /\n invalid?: boolean\n}\n\nconst FieldContext = createContext<FieldContextValue \| null>(null)\n\n/\n Provides the field state for a all related components used within a group.\n * @see https://cerberus.digitalu.design/react/input\n /\nexport function Field(\n props: PropsWithChildren<FieldContextValue>,\n): JSX.Element {\n const value = useMemo(\n () => ({\n disabled: props.disabled,\n readOnly: props.readOnly,\n required: props.required,\n invalid: props.invalid,\n }),\n [props.disabled, props.readOnly, props.required, props.invalid],\n )\n\n return (\n <FieldContext.Provider value={value}>\n {props.children}\n </FieldContext.Provider>\n )\n}\n\n/\n Used to access the field context.\n * @returns The field context.\n /\nexport function useFieldContext(): FieldContextValue {\n const context = useContext(FieldContext)\n if (!context) {\n throw new Error('useFieldContext must be used within a Field Provider.')\n }\n return context\n}\n","import {\n DatePicker as ArkDP,\n type DatePickerLabelProps,\n type DatePickerTableCellProps,\n type DatePickerTableCellTriggerProps,\n type DatePickerTableHeaderProps,\n type DatePickerTableProps,\n type DatePickerViewControlProps,\n} from '@ark-ui/react'\nimport { cx } from '@cerberus/styled-system/css'\nimport { datePicker, label } from '@cerberus/styled-system/recipes'\n\n/\n This module contains the DatePicker server family components.\n * @module DatePicker\n /\n\n// We are not exposing this to the public API\nconst datePickerStyles = datePicker()\n\n/\n The label component for the DatePicker.\n * @definition [datePicker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <DatePickerLabel>\n * <DatePickerLabel.Label>...</DatePickerLabel.Label>\n * </DatePickerLabel>\n * ```\n /\nexport function DatePickerLabel(props: DatePickerLabelProps) {\n const { className, ...arkProps } = props\n return (\n <ArkDP.Label\n {...arkProps}\n className={cx(\n className,\n label({\n size: 'sm',\n }),\n )}\n />\n )\n}\n\n/\n The control component for the DatePicker which wraps the triggers to switch\n * between calendar views.\n * @definition [datePicker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <DatePickerViewControl>\n * <PrevTrigger />\n * <ViewTrigger />\n * <NextTrigger />\n * </DatePickerViewControl>\n * ```\n /\nexport function DatePickerViewControl(props: DatePickerViewControlProps) {\n return (\n <ArkDP.Control\n {...props}\n className={cx(props.className, datePickerStyles.viewControl)}\n />\n )\n}\n\n/\n The table component for the DatePicker.\n * @definition [datePicker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <DatePickerTable />\n * ```\n /\nexport function DatePickerTable(props: DatePickerTableProps) {\n return (\n <ArkDP.Table\n {...props}\n className={cx(props.className, datePickerStyles.table)}\n />\n )\n}\n\n/\n The header component for the DatePicker table.\n * @definition [datePicker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <DatePickerTableHeader />\n * ```\n /\nexport function DatePickerTableHeader(props: DatePickerTableHeaderProps) {\n return (\n <ArkDP.TableHeader\n {...props}\n className={cx(props.className, datePickerStyles.tableHeader)}\n />\n )\n}\n\n/\n The cell component for the DatePicker table.\n * @definition [datePicker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <DatePickerTableCell />\n * ```\n /\nexport function DatePickerTableCell(props: DatePickerTableCellProps) {\n return (\n <ArkDP.TableCell\n {...props}\n className={cx(props.className, datePickerStyles.tableCell)}\n />\n )\n}\n\n/\n The cell component for the DatePicker table.\n * @definition [datePicker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <DatePickerTableCell />\n * ```\n /\nexport function DatePickerTableCellTrigger(\n props: DatePickerTableCellTriggerProps,\n) {\n return (\n <ArkDP.TableCellTrigger\n {...props}\n className={cx(props.className, datePickerStyles.tableCellTrigger)}\n />\n )\n}\n\n/\n The view container which wraps the control and content components.\n * @definition [datePicker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <DatePickerView />\n * ```\n /\nexport const DatePickerView = ArkDP.View\n\n/\n The context component for the DatePicker which provides the DatePicker state.\n * @definition [datePicker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <DatePickerContext />\n * ```\n /\nexport const DatePickerContext = ArkDP.Context\n","import type { ButtonHTMLAttributes } from 'react'\nimport { cx } from '@cerberus/styled-system/css'\nimport {\n iconButton,\n type IconButtonVariantProps,\n} from '@cerberus/styled-system/recipes'\n\n/\n This module contains the Icon Button component.\n * @module\n /\n\nexport interface IconButtonRawProps\n extends ButtonHTMLAttributes<HTMLButtonElement> {\n /\n The aria-label attribute for the icon button.\n /\n ariaLabel: string\n}\nexport type IconButtonProps = IconButtonRawProps & IconButtonVariantProps\n\n/\n A component that allows the user to perform actions using an icon\n * @see https://cerberus.digitalu.design/react/icon-button\n /\nexport function IconButton(props: IconButtonProps): JSX.Element {\n const { ariaLabel, palette, usage, size, ...nativeProps } = props\n return (\n <button\n {...nativeProps}\n aria-label={ariaLabel ?? 'Icon Button'}\n className={cx(\n nativeProps.className,\n iconButton({\n palette,\n usage,\n size,\n }),\n )}\n />\n )\n}\n","import type { ButtonHTMLAttributes } from 'react'\nimport { cx } from '@cerberus/styled-system/css'\nimport {\n button,\n type ButtonVariantProps,\n} from '@cerberus/styled-system/recipes'\n\n/\n This module contains the Button component.\n * @module\n /\n\nexport type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> &\n ButtonVariantProps\n\n/\n A component that allows the user to perform actions\n * @see https://cerberus.digitalu.design/react/button\n /\nexport function Button(props: ButtonProps): JSX.Element {\n const { palette, usage, shape, size, ...nativeProps } = props\n return (\n <button\n {...nativeProps}\n className={cx(\n nativeProps.className,\n button({\n palette,\n usage,\n shape,\n size,\n }),\n )}\n />\n )\n}\n","'use client'\n\nimport { createContext, useContext, type PropsWithChildren } from 'react'\nimport type { SystemConfig } from '../config'\n\n/\n This module contains the Cerberus configuration context and helpers.\n * @module context/cerberus\n /\n\ntype CerberusContextValue = SystemConfig\n\nconst CerberusContext = createContext<CerberusContextValue \| null>(null)\n\ninterface CerberusProviderProps {\n config: SystemConfig\n}\n\n/\n Cerberus configuration provider.\n * @param props.config The Cerberus configuration created with\n * `makeSystemConfig` helper.\n /\nexport function CerberusProvider(\n props: PropsWithChildren<CerberusProviderProps>,\n) {\n return (\n <CerberusContext.Provider value={props.config}>\n {props.children}\n </CerberusContext.Provider>\n )\n}\n\n/\n Returns the Cerberus configuration context.\n * @returns The Cerberus configuration context.\n */\nexport function useCerberusContext() {\n const context = useContext(CerberusContext)\n if (!context) {\n throw new Error('useCerberus must be used within a CerberusProvider')\n }\n return context\n}\n"],"mappings":"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","names":["import_react","ArkPortal","import_recipes","import_css","import_react","import_react","import_jsx_runtime","ArkDP","import_css","import_recipes","import_jsx_runtime","import_css","import_recipes","import_jsx_runtime","import_react","import_jsx_runtime","import_react","import_jsx_runtime","datePickerStyles","ArkDP","datePicker","id"]}
1	+ {"version":3,"sources":["../../../src/components/DatePicker.client.tsx","../../../src/components/Portal.tsx","../../../src/context/field.tsx","../../../src/components/DatePicker.server.tsx","../../../src/components/IconButton.tsx","../../../src/components/button/button.tsx","../../../src/context/cerberus.tsx"],"sourcesContent":["'use client'\n\nimport {\n DatePicker as ArkDP,\n type DatePickerContentProps,\n type DatePickerInputProps,\n type DatePickerRootProps,\n type DatePickerTriggerProps,\n type DatePickerViewControlProps,\n type DatePickerViewProps,\n} from '@ark-ui/react'\nimport { Portal } from './Portal'\nimport { datePicker, iconButton } from '@cerberus/styled-system/recipes'\nimport { css, cx } from '@cerberus/styled-system/css'\nimport { useFieldContext } from '../context/field'\nimport {\n DatePickerView,\n DatePickerContext,\n DatePickerTable,\n DatePickerTableHeader,\n DatePickerTableCellTrigger,\n DatePickerTableCell,\n DatePickerViewControl,\n} from './DatePicker.server'\nimport { IconButton } from './IconButton'\nimport { Button } from './button/button'\nimport { useCerberusContext } from '../context/cerberus'\nimport { useMemo, type InputHTMLAttributes } from 'react'\n\n/*\n This module contains the DatePicker client family components.\n * @module DatePicker:client\n /\n\n// We are not exposing this to the public API\nconst datePickerStyles = datePicker()\n\n/\n The main context provider for the DatePicker family components.\n * @definition [Date Picker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <Field>\n * <DatePicker name=\"start_date\">\n * <DatePickerLabel>Start date</DatePickerLabel>\n * <DatePickerInput />\n * <DatePickerCalendar />\n * </DatePicker>\n * </Field>\n * ```\n /\nexport function DatePicker(props: DatePickerRootProps) {\n const states = useFieldContext()\n\n // TODO: Remove this once the bug is fixed: https://github.com/chakra-ui/ark/issues/3112\n\n // There is a bug with the Root component that causes random date selection\n // onBlur after the first selection if the format prop is used.\n // const handleFormat = useCallback((value: DateValue) => {\n // return formatISOToMilitary(value.toString())\n // }, [])\n\n return (\n <ArkDP.Root\n {...props}\n {...states}\n positioning={{\n placement: 'bottom-start',\n }}\n />\n )\n}\n\n/\n An abstraction of the DatePicker control that contains the prev, view, and\n * next triggers which control the calendar output.\n * @definition [datePicker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <DatePickerViewControlGroup />\n * ```\n /\nexport function DatePickerViewControlGroup(props: DatePickerViewControlProps) {\n const { icons } = useCerberusContext()\n const { calendarPrev: PrevIcon, calendarNext: NextIcon } = icons\n return (\n <DatePickerViewControl {...props}>\n <ArkDP.PrevTrigger asChild>\n <IconButton ariaLabel=\"Previous\" size=\"sm\">\n <PrevIcon />\n </IconButton>\n </ArkDP.PrevTrigger>\n\n <ArkDP.ViewTrigger asChild>\n <Button\n className={css({\n h: '2rem',\n paddingInline: 'md',\n })}\n shape=\"rounded\"\n size=\"sm\"\n usage=\"ghost\"\n >\n <ArkDP.RangeText />\n </Button>\n </ArkDP.ViewTrigger>\n\n <ArkDP.NextTrigger asChild>\n <IconButton ariaLabel=\"Next\" size=\"sm\">\n <NextIcon />\n </IconButton>\n </ArkDP.NextTrigger>\n </DatePickerViewControl>\n )\n}\n\n/\n The trigger component for the DatePicker which opens the calendar.\n * @definition [datePicker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <DatePickerTrigger />\n * ```\n /\nexport function DatePickerTrigger(props: DatePickerTriggerProps) {\n const { icons } = useCerberusContext()\n const { calendar: CalendarIcon } = icons\n return (\n <ArkDP.Trigger\n {...props}\n className={cx(\n props.className,\n iconButton({\n size: 'sm',\n usage: 'ghost',\n }),\n datePickerStyles.trigger,\n )}\n >\n <CalendarIcon />\n </ArkDP.Trigger>\n )\n}\n\n/\n The input component for the DatePicker.\n * @definition [Date Picker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <Field>\n * <DatePicker name=\"start_date\">\n * <DatePickerLabel>Start date</DatePickerLabel>\n * <DatePickerInput />\n * <DatePickerCalendar />\n * </DatePicker>\n * </Field>\n * ```\n /\nexport function DatePickerInput(props: DatePickerInputProps) {\n const { invalid, ...fieldStates } = useFieldContext()\n return (\n <ArkDP.Control className={datePickerStyles.control}>\n <DatePickerTrigger />\n <ArkDP.Input\n {...props}\n {...fieldStates}\n {...(invalid && { 'aria-invalid': true })}\n className={cx(props.className, datePickerStyles.input)}\n placeholder={props.placeholder ?? 'DD MMM YYYY'}\n maxLength={11}\n />\n </ArkDP.Control>\n )\n}\n\nexport interface RangePickerInputProps\n extends Omit<DatePickerInputProps, 'defaultValue'> {\n /\n The defaultValue to add for the inputs. The first item is the start date\n * and the second item is the end date.\n /\n defaultValue?: [\n InputHTMLAttributes<HTMLInputElement>['defaultValue'],\n InputHTMLAttributes<HTMLInputElement>['defaultValue'],\n ]\n}\n\n/\n The input component for the DatePicker that uses ranges.\n * @definition [Date Picker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <Field>\n * <DatePicker name=\"start_date\" selection=\"range\">\n * <DatePickerLabel>Start date</DatePickerLabel>\n * <RangePickerInput />\n * <DatePickerCalendar />\n * </DatePicker>\n * </Field>\n * ```\n /\nexport function RangePickerInput(props: RangePickerInputProps) {\n const { invalid, ...fieldStates } = useFieldContext()\n const { defaultValue, ...nativeProps } = props\n\n const startDate = useMemo(() => defaultValue?.[0], [defaultValue])\n const endDate = useMemo(() => defaultValue?.[1], [defaultValue])\n\n return (\n <ArkDP.Control data-range className={datePickerStyles.control}>\n <DatePickerTrigger />\n <ArkDP.Input\n {...nativeProps}\n {...fieldStates}\n {...(invalid && { 'aria-invalid': true })}\n data-range-input\n defaultValue={startDate}\n className={cx(props.className, datePickerStyles.input)}\n placeholder={props.placeholder ?? 'DD MMM YYYY'}\n maxLength={11}\n index={0}\n />\n <ArkDP.Input\n {...nativeProps}\n {...fieldStates}\n {...(invalid && { 'aria-invalid': true })}\n data-range-input\n defaultValue={endDate}\n data-range-end-input\n className={cx(props.className, datePickerStyles.input)}\n placeholder={props.placeholder ?? 'DD MMM YYYY'}\n maxLength={11}\n index={1}\n />\n </ArkDP.Control>\n )\n}\n\n/\n The content component for the DatePicker which contains the calendar.\n * @definition [Date Picker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <Field>\n * <DatePicker name=\"start_date\">\n * <DatePickerLabel>Start date</DatePickerLabel>\n * <DatePickerInput />\n * <DatePickerCalendar />\n * </DatePicker>\n * </Field>\n * ```\n /\nexport function DatePickerContent(\n props: DatePickerContentProps & {\n withModal?: boolean\n },\n) {\n const { children, withModal, ...contentProps } = props\n return (\n <Portal disabled={withModal ?? false}>\n <ArkDP.Positioner className={datePickerStyles.positioner}>\n <ArkDP.Content\n {...contentProps}\n className={cx(contentProps.className, datePickerStyles.content)}\n >\n {children}\n </ArkDP.Content>\n </ArkDP.Positioner>\n </Portal>\n )\n}\n\n/\n The day view component for the DatePicker.\n * @definition [Date Picker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <Field>\n * <DatePicker name=\"start_date\">\n * <DatePickerLabel>Start date</DatePickerLabel>\n * <DatePickerInput />\n * <DatePickerCalendar />\n * </DatePicker>\n * </Field>\n * ```\n /\nexport function DatePickerDayView(props: Omit<DatePickerViewProps, 'view'>) {\n function isToday(date: ArkDP.DateValue): boolean {\n const today = new Date()\n const formatted = today.toISOString().split('T')[0]\n const arkDate = `${date.year}-${String(date.month).padStart(2, '0')}-${String(date.day).padStart(2, '0')}`\n return formatted === arkDate\n }\n\n function isPastDay(date: ArkDP.DateValue): boolean {\n const today = new Date()\n const arkDate = `${date.year}-${String(date.month).padStart(2, '0')}-${String(date.day).padStart(2, '0')}`\n return new Date(arkDate) < today\n }\n\n function getDayValue(date: ArkDP.DateValue): 'today' \| 'past' \| 'future' {\n if (isToday(date)) return 'today'\n if (isPastDay(date)) return 'past'\n return 'future'\n }\n\n return (\n <DatePickerView {...props} view=\"day\">\n <DatePickerContext>\n {(datePicker) => (\n <>\n <DatePickerViewControlGroup />\n\n <DatePickerTable>\n <ArkDP.TableHead>\n <ArkDP.TableRow>\n {datePicker.weekDays.map((weekDay, id) => (\n <DatePickerTableHeader key={id}>\n {weekDay.narrow}\n </DatePickerTableHeader>\n ))}\n </ArkDP.TableRow>\n </ArkDP.TableHead>\n\n <ArkDP.TableBody>\n {datePicker.weeks.map((week, id) => (\n <ArkDP.TableRow key={id}>\n {week.map((day, id) => (\n <DatePickerTableCell key={id} value={day}>\n <DatePickerTableCellTrigger\n data-date={getDayValue(day)}\n >\n {day.day}\n </DatePickerTableCellTrigger>\n </DatePickerTableCell>\n ))}\n </ArkDP.TableRow>\n ))}\n </ArkDP.TableBody>\n </DatePickerTable>\n </>\n )}\n </DatePickerContext>\n </DatePickerView>\n )\n}\n\n/\n The month view component for the DatePicker.\n * @definition [Date Picker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <Field>\n * <DatePicker name=\"start_date\">\n * <DatePickerLabel>Start date</DatePickerLabel>\n * <DatePickerInput />\n * <DatePickerCalendar />\n * </DatePicker>\n * </Field>\n * ```\n /\nexport function DatePickerMonthView(props: Omit<DatePickerViewProps, 'view'>) {\n return (\n <ArkDP.View {...props} view=\"month\">\n <ArkDP.Context>\n {(datePicker) => (\n <>\n <DatePickerViewControlGroup />\n\n <DatePickerTable>\n <ArkDP.TableBody>\n {datePicker\n .getMonthsGrid({ columns: 4, format: 'short' })\n .map((months, id) => (\n <ArkDP.TableRow key={id}>\n {months.map((month, id) => (\n <DatePickerTableCell key={id} value={month.value}>\n <DatePickerTableCellTrigger>\n {month.label}\n </DatePickerTableCellTrigger>\n </DatePickerTableCell>\n ))}\n </ArkDP.TableRow>\n ))}\n </ArkDP.TableBody>\n </DatePickerTable>\n </>\n )}\n </ArkDP.Context>\n </ArkDP.View>\n )\n}\n\n/\n The year view component for the DatePicker.\n * @definition [Date Picker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <Field>\n * <DatePicker name=\"start_date\">\n * <DatePickerLabel>Start date</DatePickerLabel>\n * <DatePickerInput />\n * <DatePickerCalendar />\n * </DatePicker>\n * </Field>\n * ```\n /\nexport function DatePickerYearView(props: Omit<DatePickerViewProps, 'view'>) {\n return (\n <ArkDP.View {...props} view=\"year\">\n <ArkDP.Context>\n {(datePicker) => (\n <>\n <DatePickerViewControlGroup />\n\n <DatePickerTable>\n <ArkDP.TableBody>\n {datePicker.getYearsGrid({ columns: 4 }).map((years, id) => (\n <ArkDP.TableRow key={id}>\n {years.map((year, id) => (\n <DatePickerTableCell key={id} value={year.value}>\n <DatePickerTableCellTrigger>\n {year.label}\n </DatePickerTableCellTrigger>\n </DatePickerTableCell>\n ))}\n </ArkDP.TableRow>\n ))}\n </ArkDP.TableBody>\n </DatePickerTable>\n </>\n )}\n </ArkDP.Context>\n </ArkDP.View>\n )\n}\n\n/\n An abstraction of the DatePicker content components that contain the\n * different calendar views and controls.\n * @definition [Date Picker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <Field>\n * <DatePicker name=\"start_date\">\n * <DatePickerLabel>Start date</DatePickerLabel>\n * <DatePickerInput />\n * <DatePickerCalendar />\n * </DatePicker>\n * </Field>\n * ```\n /\nexport function DatePickerCalendar(props: { withModal?: boolean }) {\n return (\n <DatePickerContent withModal={props.withModal}>\n <DatePickerDayView />\n <DatePickerMonthView />\n <DatePickerYearView />\n </DatePickerContent>\n )\n}\n","import {\n Portal as ArkPortal,\n type PortalProps as ArkPortalProps,\n} from '@ark-ui/react'\n\n/\n This module is the Portal component.\n * @module\n /\n\nexport type PortalProps = ArkPortalProps\n\n/\n The Portal component is used to render children into a DOM node that exists outside the DOM hierarchy of the parent component.\n * @see https://cerberus.digitalu.design/react/portal\n * @definition [React Portal Docs](https://react.dev/reference/react-dom/createPortal)\n * @example\n * ```tsx\n * 'use client'\n \n import { Portal } from '@cerberus/react'\n \n function SomeFeatureWithinSSRPage() {\n * return (\n * <Portal>\n * <div>Portal Content outside of the React VDom tree</div>\n * </Portal>\n * )\n * }\n /\nexport const Portal = ArkPortal\n","'use client'\n\nimport {\n createContext,\n useContext,\n useMemo,\n type PropsWithChildren,\n} from 'react'\n\n/\n This module provides a context and hook for the field.\n * @module Field\n /\n\nexport interface FieldContextValue {\n /\n Whether the field is disabled.\n * @description [Moz Input Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attributes)\n /\n disabled?: boolean\n /\n Whether the field is read-only.\n /\n readOnly?: boolean\n /\n Whether the field is required.\n /\n required?: boolean\n /\n Whether the field is invalid.\n /\n invalid?: boolean\n}\n\nconst FieldContext = createContext<FieldContextValue \| null>(null)\n\n/\n Provides the field state for a all related components used within a group.\n * @see https://cerberus.digitalu.design/react/input\n /\nexport function Field(\n props: PropsWithChildren<FieldContextValue>,\n): JSX.Element {\n const value = useMemo(\n () => ({\n disabled: props.disabled,\n readOnly: props.readOnly,\n required: props.required,\n invalid: props.invalid,\n }),\n [props.disabled, props.readOnly, props.required, props.invalid],\n )\n\n return (\n <FieldContext.Provider value={value}>\n {props.children}\n </FieldContext.Provider>\n )\n}\n\n/\n Used to access the field context.\n * @returns The field context.\n /\nexport function useFieldContext(): FieldContextValue {\n const context = useContext(FieldContext)\n if (!context) {\n throw new Error('useFieldContext must be used within a Field Provider.')\n }\n return context\n}\n","import {\n DatePicker as ArkDP,\n type DatePickerLabelProps,\n type DatePickerTableCellProps,\n type DatePickerTableCellTriggerProps,\n type DatePickerTableHeaderProps,\n type DatePickerTableProps,\n type DatePickerViewControlProps,\n} from '@ark-ui/react'\nimport { cx } from '@cerberus/styled-system/css'\nimport { datePicker, label } from '@cerberus/styled-system/recipes'\n\n/\n This module contains the DatePicker server family components.\n * @module DatePicker\n /\n\n// We are not exposing this to the public API\nconst datePickerStyles = datePicker()\n\n/\n The label component for the DatePicker.\n * @definition [datePicker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <DatePickerLabel>\n * <DatePickerLabel.Label>...</DatePickerLabel.Label>\n * </DatePickerLabel>\n * ```\n /\nexport function DatePickerLabel(props: DatePickerLabelProps) {\n const { className, ...arkProps } = props\n return (\n <ArkDP.Label\n {...arkProps}\n className={cx(\n className,\n label({\n size: 'sm',\n }),\n )}\n />\n )\n}\n\n/\n The control component for the DatePicker which wraps the triggers to switch\n * between calendar views.\n * @definition [datePicker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <DatePickerViewControl>\n * <PrevTrigger />\n * <ViewTrigger />\n * <NextTrigger />\n * </DatePickerViewControl>\n * ```\n /\nexport function DatePickerViewControl(props: DatePickerViewControlProps) {\n return (\n <ArkDP.Control\n {...props}\n className={cx(props.className, datePickerStyles.viewControl)}\n />\n )\n}\n\n/\n The table component for the DatePicker.\n * @definition [datePicker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <DatePickerTable />\n * ```\n /\nexport function DatePickerTable(props: DatePickerTableProps) {\n return (\n <ArkDP.Table\n {...props}\n className={cx(props.className, datePickerStyles.table)}\n />\n )\n}\n\n/\n The header component for the DatePicker table.\n * @definition [datePicker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <DatePickerTableHeader />\n * ```\n /\nexport function DatePickerTableHeader(props: DatePickerTableHeaderProps) {\n return (\n <ArkDP.TableHeader\n {...props}\n className={cx(props.className, datePickerStyles.tableHeader)}\n />\n )\n}\n\n/\n The cell component for the DatePicker table.\n * @definition [datePicker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <DatePickerTableCell />\n * ```\n /\nexport function DatePickerTableCell(props: DatePickerTableCellProps) {\n return (\n <ArkDP.TableCell\n {...props}\n className={cx(props.className, datePickerStyles.tableCell)}\n />\n )\n}\n\n/\n The cell component for the DatePicker table.\n * @definition [datePicker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <DatePickerTableCell />\n * ```\n /\nexport function DatePickerTableCellTrigger(\n props: DatePickerTableCellTriggerProps,\n) {\n return (\n <ArkDP.TableCellTrigger\n {...props}\n className={cx(props.className, datePickerStyles.tableCellTrigger)}\n />\n )\n}\n\n/\n The view container which wraps the control and content components.\n * @definition [datePicker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <DatePickerView />\n * ```\n /\nexport const DatePickerView = ArkDP.View\n\n/\n The context component for the DatePicker which provides the DatePicker state.\n * @definition [datePicker docs](https://cerberus.digitalu.design/react/date-picker)\n * @example\n * ```tsx\n * <DatePickerContext />\n * ```\n /\nexport const DatePickerContext = ArkDP.Context\n","import type { ButtonHTMLAttributes } from 'react'\nimport { cx } from '@cerberus/styled-system/css'\nimport {\n iconButton,\n type IconButtonVariantProps,\n} from '@cerberus/styled-system/recipes'\n\n/\n This module contains the Icon Button component.\n * @module\n /\n\nexport interface IconButtonRawProps\n extends ButtonHTMLAttributes<HTMLButtonElement> {\n /\n The aria-label attribute for the icon button.\n /\n ariaLabel: string\n}\nexport type IconButtonProps = IconButtonRawProps & IconButtonVariantProps\n\n/\n A component that allows the user to perform actions using an icon\n * @see https://cerberus.digitalu.design/react/icon-button\n /\nexport function IconButton(props: IconButtonProps): JSX.Element {\n const { ariaLabel, palette, usage, size, ...nativeProps } = props\n return (\n <button\n {...nativeProps}\n aria-label={ariaLabel ?? 'Icon Button'}\n className={cx(\n nativeProps.className,\n iconButton({\n palette,\n usage,\n size,\n }),\n )}\n />\n )\n}\n","'use client'\n\nimport {\n type ButtonHTMLAttributes,\n type PropsWithChildren,\n createContext,\n useContext,\n useMemo,\n} from 'react'\nimport { cx } from '@cerberus/styled-system/css'\nimport {\n button,\n type ButtonVariantProps,\n} from '@cerberus/styled-system/recipes'\nimport { Show } from '../Show'\nimport { Spinner } from '../Spinner'\nimport { Box } from '@cerberus/styled-system/jsx'\n\n/\n This module contains the Button component.\n * @module\n /\n\ninterface ButtonContextValue {\n pending: boolean\n}\n\nconst ButtonContext = createContext<ButtonContextValue>({\n pending: false,\n})\n\nexport type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> &\n ButtonVariantProps & {\n pending?: boolean\n }\n\n/\n A component that allows the user to perform actions\n * @see https://cerberus.digitalu.design/react/button\n /\nexport function Button(props: ButtonProps): JSX.Element {\n const { palette, usage, shape, size, pending = false, ...nativeProps } = props\n const value = useMemo(() => ({ pending }), [pending])\n\n return (\n <ButtonContext.Provider value={value}>\n <button\n {...nativeProps}\n disabled={pending \|\| nativeProps.disabled}\n className={cx(\n nativeProps.className,\n button({\n palette,\n usage,\n shape,\n size,\n }),\n )}\n />\n </ButtonContext.Provider>\n )\n}\n\n/\n An icon to display in a button that utilizes the pending state to display\n * a loading spinner.\n /\nexport function ButtonIcon(props: PropsWithChildren<object>) {\n const { pending } = useContext(ButtonContext)\n return (\n <Show when={pending} fallback={<>{props.children}</>}>\n <Box w=\"4\">\n <Spinner />\n </Box>\n </Show>\n )\n}\n","'use client'\n\nimport { createContext, useContext, type PropsWithChildren } from 'react'\nimport type { SystemConfig } from '../config'\n\n/\n This module contains the Cerberus configuration context and helpers.\n * @module context/cerberus\n /\n\ntype CerberusContextValue = SystemConfig\n\nconst CerberusContext = createContext<CerberusContextValue \| null>(null)\n\ninterface CerberusProviderProps {\n config: SystemConfig\n}\n\n/\n Cerberus configuration provider.\n * @param props.config The Cerberus configuration created with\n * `makeSystemConfig` helper.\n /\nexport function CerberusProvider(\n props: PropsWithChildren<CerberusProviderProps>,\n) {\n return (\n <CerberusContext.Provider value={props.config}>\n {props.children}\n </CerberusContext.Provider>\n )\n}\n\n/\n Returns the Cerberus configuration context.\n * @returns The Cerberus configuration context.\n */\nexport function useCerberusContext() {\n const context = useContext(CerberusContext)\n if (!context) {\n throw new Error('useCerberus must be used within a CerberusProvider')\n }\n return context\n}\n"],"mappings":"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","names":["import_react","ArkPortal","import_recipes","import_css","import_react","import_react","import_jsx_runtime","ArkDP","import_css","import_recipes","import_jsx_runtime","import_react","import_css","import_recipes","import_jsx_runtime","import_react","import_jsx_runtime","import_react","import_jsx_runtime","datePickerStyles","ArkDP","datePicker","id"]}

package/build/legacy/components/button/button.cjs ADDED Viewed

@@ -0,0 +1,154 @@
+"use strict";
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+// src/components/button/button.tsx
+var button_exports = {};
+__export(button_exports, {
+  Button: () => Button,
+  ButtonIcon: () => ButtonIcon
+});
+module.exports = __toCommonJS(button_exports);
+var import_react2 = require("react");
+var import_css = require("@cerberus/styled-system/css");
+var import_recipes = require("@cerberus/styled-system/recipes");
+// src/components/Show.tsx
+var import_react = require("react");
+function Show(props) {
+  const { when, children, fallback } = props;
+  const condition = (0, import_react.useMemo)(() => when ?? false, [when]);
+  return (0, import_react.useMemo)(() => {
+    if (condition) return children;
+    return fallback ?? null;
+  }, [condition, children, fallback]);
+}
+// src/components/Spinner.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+function Spinner(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "svg",
+    {
+      "aria-busy": "true",
+      role: "status",
+      xmlns: "http://www.w3.org/2000/svg",
+      height: props.size,
+      width: props.size,
+      viewBox: "0 0 24 24",
+      ...props,
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+        "g",
+        {
+          fill: "none",
+          stroke: "currentColor",
+          strokeLinecap: "round",
+          strokeLinejoin: "round",
+          strokeWidth: 2,
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+              "path",
+              {
+                strokeDasharray: 16,
+                strokeDashoffset: 16,
+                d: "M12 3c4.97 0 9 4.03 9 9",
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                    "animate",
+                    {
+                      fill: "freeze",
+                      attributeName: "stroke-dashoffset",
+                      dur: "0.15s",
+                      values: "16;0"
+                    }
+                  ),
+                  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                    "animateTransform",
+                    {
+                      attributeName: "transform",
+                      dur: "0.75s",
+                      repeatCount: "indefinite",
+                      type: "rotate",
+                      values: "0 12 12;360 12 12"
+                    }
+                  )
+                ]
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              "path",
+              {
+                strokeDasharray: 64,
+                strokeDashoffset: 64,
+                strokeOpacity: 0.3,
+                d: "M12 3c4.97 0 9 4.03 9 9c0 4.97 -4.03 9 -9 9c-4.97 0 -9 -4.03 -9 -9c0 -4.97 4.03 -9 9 -9Z",
+                children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  "animate",
+                  {
+                    fill: "freeze",
+                    attributeName: "stroke-dashoffset",
+                    dur: "0.6s",
+                    values: "64;0"
+                  }
+                )
+              }
+            )
+          ]
+        }
+      )
+    }
+  );
+}
+// src/components/button/button.tsx
+var import_jsx = require("@cerberus/styled-system/jsx");
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var ButtonContext = (0, import_react2.createContext)({
+  pending: false
+});
+function Button(props) {
+  const { palette, usage, shape, size, pending = false, ...nativeProps } = props;
+  const value = (0, import_react2.useMemo)(() => ({ pending }), [pending]);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(ButtonContext.Provider, { value, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    "button",
+    {
+      ...nativeProps,
+      disabled: pending || nativeProps.disabled,
+      className: (0, import_css.cx)(
+        nativeProps.className,
+        (0, import_recipes.button)({
+          palette,
+          usage,
+          shape,
+          size
+        })
+      )
+    }
+  ) });
+}
+function ButtonIcon(props) {
+  const { pending } = (0, import_react2.useContext)(ButtonContext);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Show, { when: pending, fallback: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children: props.children }), children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx.Box, { w: "4", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Spinner, {}) }) });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Button,
+  ButtonIcon
+});
+//# sourceMappingURL=button.cjs.map

package/build/legacy/components/button/button.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../../../../src/components/button/button.tsx","../../../../src/components/Show.tsx","../../../../src/components/Spinner.tsx"],"sourcesContent":["'use client'\n\nimport {\n type ButtonHTMLAttributes,\n type PropsWithChildren,\n createContext,\n useContext,\n useMemo,\n} from 'react'\nimport { cx } from '@cerberus/styled-system/css'\nimport {\n button,\n type ButtonVariantProps,\n} from '@cerberus/styled-system/recipes'\nimport { Show } from '../Show'\nimport { Spinner } from '../Spinner'\nimport { Box } from '@cerberus/styled-system/jsx'\n\n/**\n * This module contains the Button component.\n * @module\n */\n\ninterface ButtonContextValue {\n pending: boolean\n}\n\nconst ButtonContext = createContext<ButtonContextValue>({\n pending: false,\n})\n\nexport type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> &\n ButtonVariantProps & {\n pending?: boolean\n }\n\n/**\n * A component that allows the user to perform actions\n * @see https://cerberus.digitalu.design/react/button\n */\nexport function Button(props: ButtonProps): JSX.Element {\n const { palette, usage, shape, size, pending = false, ...nativeProps } = props\n const value = useMemo(() => ({ pending }), [pending])\n\n return (\n <ButtonContext.Provider value={value}>\n <button\n {...nativeProps}\n disabled={pending || nativeProps.disabled}\n className={cx(\n nativeProps.className,\n button({\n palette,\n usage,\n shape,\n size,\n }),\n )}\n />\n </ButtonContext.Provider>\n )\n}\n\n/**\n * An icon to display in a button that utilizes the pending state to display\n * a loading spinner.\n */\nexport function ButtonIcon(props: PropsWithChildren<object>) {\n const { pending } = useContext(ButtonContext)\n return (\n <Show when={pending} fallback={<>{props.children}</>}>\n <Box w=\"4\">\n <Spinner />\n </Box>\n </Show>\n )\n}\n","'use client'\n\nimport { useMemo, type PropsWithChildren, type ReactNode } from 'react'\n\n/**\n * This module contains the Show component.\n * @module\n */\n\nexport interface ShowProps {\n /**\n * The condition to render memoized children or the fallback content.\n */\n when: boolean | null | undefined\n /**\n * The children to render when the condition is false.\n */\n fallback?: ReactNode\n}\n\n/**\n * Conditionally render a memoized version of the children or optional fallback\n * content.\n * @see https://cerberus.digitalu.design/react/show\n * @example\n * ```tsx\n * <Show when={isLoggedIn} fallback={<Navigate to=\"/login\" />}>\n * <Dashboard />\n * </Show>\n */\nexport function Show(props: PropsWithChildren<ShowProps>): ReactNode {\n const { when, children, fallback } = props\n const condition = useMemo(() => when ?? false, [when])\n\n return useMemo(() => {\n if (condition) return children\n return fallback ?? null\n }, [condition, children, fallback])\n}\n","import type { SVGProps } from 'react'\n\n/**\n * This module contains the Spinner component.\n * @module\n */\n\nexport type SpinnerProps = SVGProps<SVGSVGElement> & {\n /**\n * The size of the spinner\n */\n size?: number | string\n}\n\n/**\n * The Spinner component is used to display a loading indicator. Typically used\n * in buttons, modals, and other components that require a loading state.\n * @see https://cerberus.digitalu.design/react/loading-states/\n * @example\n * ```tsx\n * <Button>\n * <Show when={loading} fallback={<>Save</>}>\n * Saving\n * <Spinner size={24} />\n * </Show>\n * </Button>\n * ```\n */\nexport function Spinner(props: SpinnerProps) {\n return (\n <svg\n aria-busy=\"true\"\n role=\"status\"\n xmlns=\"http://www.w3.org/2000/svg\"\n height={props.size}\n width={props.size}\n viewBox=\"0 0 24 24\"\n {...props}\n >\n <g\n fill=\"none\"\n stroke=\"currentColor\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n >\n <path\n strokeDasharray={16}\n strokeDashoffset={16}\n d=\"M12 3c4.97 0 9 4.03 9 9\"\n >\n <animate\n fill=\"freeze\"\n attributeName=\"stroke-dashoffset\"\n dur=\"0.15s\"\n values=\"16;0\"\n ></animate>\n <animateTransform\n attributeName=\"transform\"\n dur=\"0.75s\"\n repeatCount=\"indefinite\"\n type=\"rotate\"\n values=\"0 12 12;360 12 12\"\n ></animateTransform>\n </path>\n <path\n strokeDasharray={64}\n strokeDashoffset={64}\n strokeOpacity={0.3}\n d=\"M12 3c4.97 0 9 4.03 9 9c0 4.97 -4.03 9 -9 9c-4.97 0 -9 -4.03 -9 -9c0 -4.97 4.03 -9 9 -9Z\"\n >\n <animate\n fill=\"freeze\"\n attributeName=\"stroke-dashoffset\"\n dur=\"0.6s\"\n values=\"64;0\"\n ></animate>\n </path>\n </g>\n </svg>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,IAAAA,gBAMO;AACP,iBAAmB;AACnB,qBAGO;;;ACXP,mBAAgE;AA4BzD,SAAS,KAAK,OAAgD;AACnE,QAAM,EAAE,MAAM,UAAU,SAAS,IAAI;AACrC,QAAM,gBAAY,sBAAQ,MAAM,QAAQ,OAAO,CAAC,IAAI,CAAC;AAErD,aAAO,sBAAQ,MAAM;AACnB,QAAI,UAAW,QAAO;AACtB,WAAO,YAAY;AAAA,EACrB,GAAG,CAAC,WAAW,UAAU,QAAQ,CAAC;AACpC;;;ACQQ;AAlBD,SAAS,QAAQ,OAAqB;AAC3C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,MAAK;AAAA,MACL,OAAM;AAAA,MACN,QAAQ,MAAM;AAAA,MACd,OAAO,MAAM;AAAA,MACb,SAAQ;AAAA,MACP,GAAG;AAAA,MAEJ;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,QAAO;AAAA,UACP,eAAc;AAAA,UACd,gBAAe;AAAA,UACf,aAAa;AAAA,UAEb;AAAA;AAAA,cAAC;AAAA;AAAA,gBACC,iBAAiB;AAAA,gBACjB,kBAAkB;AAAA,gBAClB,GAAE;AAAA,gBAEF;AAAA;AAAA,oBAAC;AAAA;AAAA,sBACC,MAAK;AAAA,sBACL,eAAc;AAAA,sBACd,KAAI;AAAA,sBACJ,QAAO;AAAA;AAAA,kBACR;AAAA,kBACD;AAAA,oBAAC;AAAA;AAAA,sBACC,eAAc;AAAA,sBACd,KAAI;AAAA,sBACJ,aAAY;AAAA,sBACZ,MAAK;AAAA,sBACL,QAAO;AAAA;AAAA,kBACR;AAAA;AAAA;AAAA,YACH;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACC,iBAAiB;AAAA,gBACjB,kBAAkB;AAAA,gBAClB,eAAe;AAAA,gBACf,GAAE;AAAA,gBAEF;AAAA,kBAAC;AAAA;AAAA,oBACC,MAAK;AAAA,oBACL,eAAc;AAAA,oBACd,KAAI;AAAA,oBACJ,QAAO;AAAA;AAAA,gBACR;AAAA;AAAA,YACH;AAAA;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;;;AFjEA,iBAAoB;AA8Bd,IAAAC,sBAAA;AAnBN,IAAM,oBAAgB,6BAAkC;AAAA,EACtD,SAAS;AACX,CAAC;AAWM,SAAS,OAAO,OAAiC;AACtD,QAAM,EAAE,SAAS,OAAO,OAAO,MAAM,UAAU,OAAO,GAAG,YAAY,IAAI;AACzE,QAAM,YAAQ,uBAAQ,OAAO,EAAE,QAAQ,IAAI,CAAC,OAAO,CAAC;AAEpD,SACE,6CAAC,cAAc,UAAd,EAAuB,OACtB;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,UAAU,WAAW,YAAY;AAAA,MACjC,eAAW;AAAA,QACT,YAAY;AAAA,YACZ,uBAAO;AAAA,UACL;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,QACF,CAAC;AAAA,MACH;AAAA;AAAA,EACF,GACF;AAEJ;AAMO,SAAS,WAAW,OAAkC;AAC3D,QAAM,EAAE,QAAQ,QAAI,0BAAW,aAAa;AAC5C,SACE,6CAAC,QAAK,MAAM,SAAS,UAAU,6EAAG,gBAAM,UAAS,GAC/C,uDAAC,kBAAI,GAAE,KACL,uDAAC,WAAQ,GACX,GACF;AAEJ;","names":["import_react","import_jsx_runtime"]}