@cdx-ui/components 0.0.1-beta.14 → 0.0.1-beta.141

package/lib/module/components/DateTimePicker/index.js

@@ -0,0 +1,183 @@
+"use strict";
+
+import { forwardRef, useCallback, useEffect, useMemo, useRef } from 'react';
+import { Schedule } from '@cdx-ui/icons';
+import { dataAttributes, DateTimePickerContext, DateTimePickerRoot as DateTimePickerRootPrimitive, mergeDataAttributes, useDateTimePickerContext } from '@cdx-ui/primitives';
+import { clampDateTimeId, nowDateTimeId } from '@cdx-ui/formatters';
+import { cn, ParentContext, useParentContext } from '@cdx-ui/utils';
+import { Dialog } from '../Dialog';
+import { Icon } from '../Icon';
+import { DateTimeList } from '../DateTimeList';
+import { PickerTrigger } from '../picker/PickerTrigger';
+import { PickerBottomSheetSurface, PickerDialogSurface, PickerPopoverSurface } from '../picker/surfaces';
+import { jsx as _jsx } from "react/jsx-runtime";
+const DATE_FIELD_SCOPE = 'DATE_FIELD';
+const DateTimePickerRoot = /*#__PURE__*/forwardRef(({
+  className,
+  children,
+  style,
+  ...props
+}, ref) => {
+  const parent = useParentContext();
+  const ctx = useMemo(() => ({
+    ...parent,
+    [DATE_FIELD_SCOPE]: {
+      variant: 'outline',
+      size: 'default',
+      fullWidth: true
+    }
+  }), [parent]);
+  return /*#__PURE__*/_jsx(ParentContext.Provider, {
+    value: ctx,
+    children: /*#__PURE__*/_jsx(DateTimePickerRootPrimitive, {
+      ref: ref,
+      className: cn('gap-2', className),
+      style: style,
+      ...props,
+      ...mergeDataAttributes(props, dataAttributes({
+        slot: 'date-time-picker'
+      })),
+      children: children
+    })
+  });
+});
+DateTimePickerRoot.displayName = 'DateTimePicker';
+const DateTimePickerTrigger = /*#__PURE__*/forwardRef(({
+  accessibilityLabel,
+  ...props
+}, ref) => {
+  const {
+    open,
+    setOpen,
+    disabled,
+    triggerRef,
+    labels
+  } = useDateTimePickerContext();
+  return /*#__PURE__*/_jsx(PickerTrigger, {
+    ref: ref,
+    open: open,
+    setOpen: setOpen,
+    disabled: disabled,
+    triggerRef: triggerRef,
+    accessibilityLabel: accessibilityLabel ?? labels.openDateTimePicker,
+    ...props
+  });
+});
+DateTimePickerTrigger.displayName = 'DateTimePicker.Trigger';
+const DateTimePickerTriggerIndicator = () => /*#__PURE__*/_jsx(Icon, {
+  as: Schedule,
+  className: "text-content-secondary"
+});
+DateTimePickerTriggerIndicator.displayName = 'DateTimePicker.TriggerIndicator';
+const DateTimePickerList = /*#__PURE__*/forwardRef(({
+  ...props
+}, ref) => {
+  const {
+    value,
+    onValueChange,
+    draftValue,
+    setDraftValue,
+    open,
+    granularity,
+    locale,
+    hour12,
+    minValue,
+    maxValue
+  } = useDateTimePickerContext();
+  const userInteractedRef = useRef(false);
+  useEffect(() => {
+    if (open) {
+      userInteractedRef.current = false;
+    }
+  }, [open]);
+  const handleUserInteract = useCallback(() => {
+    userInteractedRef.current = true;
+  }, []);
+  const handleValueChange = useCallback(next => {
+    setDraftValue(next);
+    if (!open) {
+      onValueChange?.(next);
+      return;
+    }
+    if (value !== undefined || userInteractedRef.current) {
+      onValueChange?.(next);
+    }
+  }, [onValueChange, open, setDraftValue, value]);
+  const listValue = open ? draftValue ?? clampDateTimeId(value ?? nowDateTimeId({
+    granularity
+  }), {
+    min: minValue,
+    max: maxValue
+  }) : value;
+  return /*#__PURE__*/_jsx(DateTimeList, {
+    ref: ref,
+    value: listValue,
+    onValueChange: handleValueChange,
+    onUserInteract: handleUserInteract,
+    granularity: granularity,
+    locale: locale,
+    hour12: hour12,
+    minValue: minValue,
+    maxValue: maxValue,
+    ...props
+  });
+});
+DateTimePickerList.displayName = 'DateTimePicker.List';
+function DateTimePickerDialog({
+  children
+}) {
+  const ctx = useDateTimePickerContext();
+  return /*#__PURE__*/_jsx(PickerDialogSurface, {
+    open: ctx.open,
+    setOpen: ctx.setOpen,
+    registerSurface: ctx.registerSurface,
+    children: /*#__PURE__*/_jsx(Dialog.Popup, {
+      className: "p-4",
+      children: /*#__PURE__*/_jsx(DateTimePickerContext.Provider, {
+        value: ctx,
+        children: children
+      })
+    })
+  });
+}
+function DateTimePickerBottomSheet({
+  children
+}) {
+  const ctx = useDateTimePickerContext();
+  return /*#__PURE__*/_jsx(PickerBottomSheetSurface, {
+    open: ctx.open,
+    setOpen: ctx.setOpen,
+    registerSurface: ctx.registerSurface,
+    children: /*#__PURE__*/_jsx(DateTimePickerContext.Provider, {
+      value: ctx,
+      children: children
+    })
+  });
+}
+function DateTimePickerPopover({
+  children,
+  className
+}) {
+  const ctx = useDateTimePickerContext();
+  return /*#__PURE__*/_jsx(PickerPopoverSurface, {
+    open: ctx.open,
+    setOpen: ctx.setOpen,
+    registerSurface: ctx.registerSurface,
+    anchorRef: ctx.anchorRef,
+    triggerRef: ctx.triggerRef,
+    className: className,
+    children: /*#__PURE__*/_jsx(DateTimePickerContext.Provider, {
+      value: ctx,
+      children: children
+    })
+  });
+}
+export const DateTimePicker = Object.assign(DateTimePickerRoot, {
+  Trigger: DateTimePickerTrigger,
+  TriggerIndicator: DateTimePickerTriggerIndicator,
+  List: DateTimePickerList,
+  Popover: DateTimePickerPopover,
+  Dialog: DateTimePickerDialog,
+  BottomSheet: DateTimePickerBottomSheet
+});
+//# sourceMappingURL=index.js.map

package/lib/module/components/DateTimePicker/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["forwardRef","useCallback","useEffect","useMemo","useRef","Schedule","dataAttributes","DateTimePickerContext","DateTimePickerRoot","DateTimePickerRootPrimitive","mergeDataAttributes","useDateTimePickerContext","clampDateTimeId","nowDateTimeId","cn","ParentContext","useParentContext","Dialog","Icon","DateTimeList","PickerTrigger","PickerBottomSheetSurface","PickerDialogSurface","PickerPopoverSurface","jsx","_jsx","DATE_FIELD_SCOPE","className","children","style","props","ref","parent","ctx","variant","size","fullWidth","Provider","value","slot","displayName","DateTimePickerTrigger","accessibilityLabel","open","setOpen","disabled","triggerRef","labels","openDateTimePicker","DateTimePickerTriggerIndicator","as","DateTimePickerList","onValueChange","draftValue","setDraftValue","granularity","locale","hour12","minValue","maxValue","userInteractedRef","current","handleUserInteract","handleValueChange","next","undefined","listValue","min","max","onUserInteract","DateTimePickerDialog","registerSurface","Popup","DateTimePickerBottomSheet","DateTimePickerPopover","anchorRef","DateTimePicker","Object","assign","Trigger","TriggerIndicator","List","Popover","BottomSheet"],"sourceRoot":"../../../../src","sources":["components/DateTimePicker/index.tsx"],"mappings":";;AAAA,SAASA,UAAU,EAAEC,WAAW,EAAEC,SAAS,EAAEC,OAAO,EAAEC,MAAM,QAAwB,OAAO;AAE3F,SAASC,QAAQ,QAAQ,eAAe;AACxC,SACEC,cAAc,EACdC,qBAAqB,EACrBC,kBAAkB,IAAIC,2BAA2B,EACjDC,mBAAmB,EACnBC,wBAAwB,QAEnB,oBAAoB;AAC3B,SAASC,eAAe,EAAEC,aAAa,QAAyB,oBAAoB;AACpF,SAASC,EAAE,EAAEC,aAAa,EAAEC,gBAAgB,QAAQ,eAAe;AACnE,SAASC,MAAM,QAAQ,WAAW;AAClC,SAASC,IAAI,QAAQ,SAAS;AAC9B,SAASC,YAAY,QAAgC,iBAAiB;AACtE,SAASC,aAAa,QAAiC,yBAAyB;AAChF,SACEC,wBAAwB,EACxBC,mBAAmB,EACnBC,oBAAoB,QACf,oBAAoB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAQ5B,MAAMC,gBAAgB,GAAG,YAAY;AAErC,MAAMlB,kBAAkB,gBAAGR,UAAU,CACnC,CAAC;EAAE2B,SAAS;EAAEC,QAAQ;EAAEC,KAAK;EAAE,GAAGC;AAAM,CAAC,EAAEC,GAAG,KAAK;EACjD,MAAMC,MAAM,GAAGhB,gBAAgB,CAAC,CAAC;EACjC,MAAMiB,GAAG,GAAG9B,OAAO,CACjB,OAAO;IACL,GAAG6B,MAAM;IACT,CAACN,gBAAgB,GAAG;MAAEQ,OAAO,EAAE,SAAS;MAAEC,IAAI,EAAE,SAAS;MAAEC,SAAS,EAAE;IAAK;EAC7E,CAAC,CAAC,EACF,CAACJ,MAAM,CACT,CAAC;EAED,oBACEP,IAAA,CAACV,aAAa,CAACsB,QAAQ;IAACC,KAAK,EAAEL,GAAI;IAAAL,QAAA,eACjCH,IAAA,CAAChB,2BAA2B;MAC1BsB,GAAG,EAAEA,GAAI;MACTJ,SAAS,EAAEb,EAAE,CAAC,OAAO,EAAEa,SAAS,CAAE;MAClCE,KAAK,EAAEA,KAAM;MAAA,GACTC,KAAK;MAAA,GACLpB,mBAAmB,CAACoB,KAAK,EAAExB,cAAc,CAAC;QAAEiC,IAAI,EAAE;MAAmB,CAAC,CAAC,CAAC;MAAAX,QAAA,EAE3EA;IAAQ,CACkB;EAAC,CACR,CAAC;AAE7B,CACF,CAAC;AAEDpB,kBAAkB,CAACgC,WAAW,GAAG,gBAAgB;AASjD,MAAMC,qBAAqB,gBAAGzC,UAAU,CACtC,CAAC;EAAE0C,kBAAkB;EAAE,GAAGZ;AAAM,CAAC,EAAEC,GAAG,KAAK;EACzC,MAAM;IAAEY,IAAI;IAAEC,OAAO;IAAEC,QAAQ;IAAEC,UAAU;IAAEC;EAAO,CAAC,GAAGpC,wBAAwB,CAAC,CAAC;EAClF,oBACEc,IAAA,CAACL,aAAa;IACZW,GAAG,EAAEA,GAAI;IACTY,IAAI,EAAEA,IAAK;IACXC,OAAO,EAAEA,OAAQ;IACjBC,QAAQ,EAAEA,QAAS;IACnBC,UAAU,EAAEA,UAAW;IACvBJ,kBAAkB,EAAEA,kBAAkB,IAAIK,MAAM,CAACC,kBAAmB;IAAA,GAChElB;EAAK,CACV,CAAC;AAEN,CACF,CAAC;AAEDW,qBAAqB,CAACD,WAAW,GAAG,wBAAwB;AAE5D,MAAMS,8BAA8B,GAAGA,CAAA,kBACrCxB,IAAA,CAACP,IAAI;EAACgC,EAAE,EAAE7C,QAAS;EAACsB,SAAS,EAAC;AAAwB,CAAE,CACzD;AAEDsB,8BAA8B,CAACT,WAAW,GAAG,iCAAiC;AAc9E,MAAMW,kBAAkB,gBAAGnD,UAAU,CAAgC,CAAC;EAAE,GAAG8B;AAAM,CAAC,EAAEC,GAAG,KAAK;EAC1F,MAAM;IACJO,KAAK;IACLc,aAAa;IACbC,UAAU;IACVC,aAAa;IACbX,IAAI;IACJY,WAAW;IACXC,MAAM;IACNC,MAAM;IACNC,QAAQ;IACRC;EACF,CAAC,GAAGhD,wBAAwB,CAAC,CAAC;EAC9B,MAAMiD,iBAAiB,GAAGxD,MAAM,CAAC,KAAK,CAAC;EAEvCF,SAAS,CAAC,MAAM;IACd,IAAIyC,IAAI,EAAE;MACRiB,iBAAiB,CAACC,OAAO,GAAG,KAAK;IACnC;EACF,CAAC,EAAE,CAAClB,IAAI,CAAC,CAAC;EAEV,MAAMmB,kBAAkB,GAAG7D,WAAW,CAAC,MAAM;IAC3C2D,iBAAiB,CAACC,OAAO,GAAG,IAAI;EAClC,CAAC,EAAE,EAAE,CAAC;EAEN,MAAME,iBAAiB,GAAG9D,WAAW,CAClC+D,IAAgB,IAAK;IACpBV,aAAa,CAACU,IAAI,CAAC;IACnB,IAAI,CAACrB,IAAI,EAAE;MACTS,aAAa,GAAGY,IAAI,CAAC;MACrB;IACF;IACA,IAAI1B,KAAK,KAAK2B,SAAS,IAAIL,iBAAiB,CAACC,OAAO,EAAE;MACpDT,aAAa,GAAGY,IAAI,CAAC;IACvB;EACF,CAAC,EACD,CAACZ,aAAa,EAAET,IAAI,EAAEW,aAAa,EAAEhB,KAAK,CAC5C,CAAC;EAED,MAAM4B,SAAS,GAAGvB,IAAI,GACjBU,UAAU,IACXzC,eAAe,CAAC0B,KAAK,IAAIzB,aAAa,CAAC;IAAE0C;EAAY,CAAC,CAAC,EAAE;IAAEY,GAAG,EAAET,QAAQ;IAAEU,GAAG,EAAET;EAAS,CAAC,CAAC,GAC1FrB,KAAK;EAET,oBACEb,IAAA,CAACN,YAAY;IACXY,GAAG,EAAEA,GAAI;IACTO,KAAK,EAAE4B,SAAU;IACjBd,aAAa,EAAEW,iBAAkB;IACjCM,cAAc,EAAEP,kBAAmB;IACnCP,WAAW,EAAEA,WAAY;IACzBC,MAAM,EAAEA,MAAO;IACfC,MAAM,EAAEA,MAAO;IACfC,QAAQ,EAAEA,QAAS;IACnBC,QAAQ,EAAEA,QAAS;IAAA,GACf7B;EAAK,CACV,CAAC;AAEN,CAAC,CAAC;AAEFqB,kBAAkB,CAACX,WAAW,GAAG,qBAAqB;AAEtD,SAAS8B,oBAAoBA,CAAC;EAAE1C;AAAkC,CAAC,EAAE;EACnE,MAAMK,GAAG,GAAGtB,wBAAwB,CAAC,CAAC;EACtC,oBACEc,IAAA,CAACH,mBAAmB;IAClBqB,IAAI,EAAEV,GAAG,CAACU,IAAK;IACfC,OAAO,EAAEX,GAAG,CAACW,OAAQ;IACrB2B,eAAe,EAAEtC,GAAG,CAACsC,eAAgB;IAAA3C,QAAA,eAErCH,IAAA,CAACR,MAAM,CAACuD,KAAK;MAAC7C,SAAS,EAAC,KAAK;MAAAC,QAAA,eAC3BH,IAAA,CAAClB,qBAAqB,CAAC8B,QAAQ;QAACC,KAAK,EAAEL,GAAI;QAAAL,QAAA,EAAEA;MAAQ,CAAiC;IAAC,CAC3E;EAAC,CACI,CAAC;AAE1B;AAEA,SAAS6C,yBAAyBA,CAAC;EAAE7C;AAAkC,CAAC,EAAE;EACxE,MAAMK,GAAG,GAAGtB,wBAAwB,CAAC,CAAC;EACtC,oBACEc,IAAA,CAACJ,wBAAwB;IACvBsB,IAAI,EAAEV,GAAG,CAACU,IAAK;IACfC,OAAO,EAAEX,GAAG,CAACW,OAAQ;IACrB2B,eAAe,EAAEtC,GAAG,CAACsC,eAAgB;IAAA3C,QAAA,eAErCH,IAAA,CAAClB,qBAAqB,CAAC8B,QAAQ;MAACC,KAAK,EAAEL,GAAI;MAAAL,QAAA,EAAEA;IAAQ,CAAiC;EAAC,CAC/D,CAAC;AAE/B;AAEA,SAAS8C,qBAAqBA,CAAC;EAC7B9C,QAAQ;EACRD;AAIF,CAAC,EAAE;EACD,MAAMM,GAAG,GAAGtB,wBAAwB,CAAC,CAAC;EACtC,oBACEc,IAAA,CAACF,oBAAoB;IACnBoB,IAAI,EAAEV,GAAG,CAACU,IAAK;IACfC,OAAO,EAAEX,GAAG,CAACW,OAAQ;IACrB2B,eAAe,EAAEtC,GAAG,CAACsC,eAAgB;IACrCI,SAAS,EAAE1C,GAAG,CAAC0C,SAAU;IACzB7B,UAAU,EAAEb,GAAG,CAACa,UAAW;IAC3BnB,SAAS,EAAEA,SAAU;IAAAC,QAAA,eAErBH,IAAA,CAAClB,qBAAqB,CAAC8B,QAAQ;MAACC,KAAK,EAAEL,GAAI;MAAAL,QAAA,EAAEA;IAAQ,CAAiC;EAAC,CACnE,CAAC;AAE3B;AAWA,OAAO,MAAMgD,cAAc,GAAGC,MAAM,CAACC,MAAM,CAACtE,kBAAkB,EAAE;EAC9DuE,OAAO,EAAEtC,qBAAqB;EAC9BuC,gBAAgB,EAAE/B,8BAA8B;EAChDgC,IAAI,EAAE9B,kBAAkB;EACxB+B,OAAO,EAAER,qBAAqB;EAC9BzD,MAAM,EAAEqD,oBAAoB;EAC5Ba,WAAW,EAAEV;AACf,CAAC,CAA2B","ignoreList":[]}

package/lib/module/components/Dialog/animation.js

@@ -0,0 +1,7 @@
+"use strict";
+
+import { createContext } from '@cdx-ui/utils';
+export const [DialogAnimationProvider, useDialogAnimation] = createContext('DialogAnimationContext', {
+  strict: false
+});
+//# sourceMappingURL=animation.js.map

package/lib/module/components/Dialog/animation.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["createContext","DialogAnimationProvider","useDialogAnimation","strict"],"sourceRoot":"../../../../src","sources":["components/Dialog/animation.ts"],"mappings":";;AACA,SAASA,aAAa,QAAQ,eAAe;AAQ7C,OAAO,MAAM,CAACC,uBAAuB,EAAEC,kBAAkB,CAAC,GACxDF,aAAa,CAA8B,wBAAwB,EAAE;EACnEG,MAAM,EAAE;AACV,CAAC,CAAC","ignoreList":[]}