@ifhover/leaf-ui 0.0.0-stage → 0.6.0

package/dist/esm/browser/modules/config-provider/helpers.js

@@ -0,0 +1,77 @@
+"use client";
+import { TinyColor } from "@ctrl/tinycolor";
+import { useEffect, useState } from "react";
+import { useLeafConfig } from "./context.js";
+function useSystemAppearance(initial = 'light') {
+    const [appearance, setAppearance] = useState(initial);
+    useEffect(()=>{
+        const media = matchMedia('(prefers-color-scheme: dark)');
+        const update = ()=>setAppearance(media.matches ? 'dark' : 'light');
+        update();
+        media.addEventListener('change', update);
+        return ()=>media.removeEventListener('change', update);
+    }, []);
+    return appearance;
+}
+function colorContrast(foreground, background, canvas = '#ffffff') {
+    const fg = new TinyColor(foreground), bg = new TinyColor(background);
+    if (!fg.isValid || !bg.isValid) return null;
+    const base = new TinyColor(canvas);
+    if (!base.isValid || 1 !== base.getAlpha()) return null;
+    const composite = (front, back)=>{
+        const a = front.toRgb(), b = back.toRgb();
+        return new TinyColor({
+            r: a.r * a.a + b.r * (1 - a.a),
+            g: a.g * a.a + b.g * (1 - a.a),
+            b: a.b * a.a + b.b * (1 - a.a)
+        });
+    };
+    const backgroundColor = composite(bg, base);
+    const luminance = (color)=>{
+        const { r, g, b } = color.toRgb();
+        const values = [
+            r,
+            g,
+            b
+        ].map((channel)=>{
+            const value = channel / 255;
+            return value <= 0.04045 ? value / 12.92 : ((value + 0.055) / 1.055) ** 2.4;
+        });
+        return (values[0] ?? 0) * 0.2126 + (values[1] ?? 0) * 0.7152 + (values[2] ?? 0) * 0.0722;
+    };
+    const a = luminance(composite(fg, backgroundColor)), b = luminance(backgroundColor);
+    return (Math.max(a, b) + 0.05) / (Math.min(a, b) + 0.05);
+}
+function useBreakpoint(initial = {}) {
+    const { theme } = useLeafConfig();
+    const [matches, setMatches] = useState(initial);
+    useEffect(()=>{
+        const sizes = {
+            xs: 0,
+            sm: 576,
+            md: 768,
+            lg: 992,
+            xl: 1200,
+            ...theme.breakpoints
+        };
+        const queries = Object.entries(sizes).map(([key, width])=>[
+                key,
+                matchMedia(`(min-width: ${width}px)`)
+            ]);
+        const update = ()=>setMatches(Object.fromEntries(queries.map(([key, query])=>[
+                    key,
+                    query.matches
+                ])));
+        for (const [, query] of queries)query.addEventListener('change', update);
+        update();
+        return ()=>{
+            for (const [, query] of queries)query.removeEventListener('change', update);
+        };
+    }, [
+        theme.breakpoints
+    ]);
+    return matches;
+}
+export { colorContrast, useBreakpoint, useSystemAppearance };
+
+//# sourceMappingURL=helpers.js.map

package/dist/esm/browser/modules/config-provider/helpers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"config-provider/helpers.js","sources":["../../../../../src/config-provider/helpers.ts"],"sourcesContent":["import { TinyColor } from '@ctrl/tinycolor';\nimport { useEffect, useState } from 'react';\nimport { useLeafConfig } from './context';\nexport function useSystemAppearance(initial: 'light' | 'dark' = 'light') {\n  const [appearance, setAppearance] = useState(initial);\n  useEffect(() => {\n    const media = matchMedia('(prefers-color-scheme: dark)');\n    const update = () => setAppearance(media.matches ? 'dark' : 'light');\n    update();\n    media.addEventListener('change', update);\n    return () => media.removeEventListener('change', update);\n  }, []);\n  return appearance;\n}\nexport function colorContrast(foreground: string, background: string, canvas = '#ffffff') {\n  const fg = new TinyColor(foreground),\n    bg = new TinyColor(background);\n  if (!fg.isValid || !bg.isValid) return null;\n  const base = new TinyColor(canvas);\n  if (!base.isValid || base.getAlpha() !== 1) return null;\n  const composite = (front: TinyColor, back: TinyColor) => {\n    const a = front.toRgb(),\n      b = back.toRgb();\n    return new TinyColor({\n      r: a.r * a.a + b.r * (1 - a.a),\n      g: a.g * a.a + b.g * (1 - a.a),\n      b: a.b * a.a + b.b * (1 - a.a),\n    });\n  };\n  const backgroundColor = composite(bg, base);\n  const luminance = (color: TinyColor) => {\n    const { r, g, b } = color.toRgb();\n    const values = [r, g, b].map((channel) => {\n      const value = channel / 255;\n      return value <= 0.04045 ? value / 12.92 : ((value + 0.055) / 1.055) ** 2.4;\n    });\n    return (values[0] ?? 0) * 0.2126 + (values[1] ?? 0) * 0.7152 + (values[2] ?? 0) * 0.0722;\n  };\n  const a = luminance(composite(fg, backgroundColor)),\n    b = luminance(backgroundColor);\n  return (Math.max(a, b) + 0.05) / (Math.min(a, b) + 0.05);\n}\nexport function useBreakpoint(\n  initial: Partial<Record<'xs' | 'sm' | 'md' | 'lg' | 'xl', boolean>> = {},\n) {\n  const { theme } = useLeafConfig();\n  const [matches, setMatches] = useState(initial);\n  useEffect(() => {\n    const sizes = { xs: 0, sm: 576, md: 768, lg: 992, xl: 1200, ...theme.breakpoints };\n    const queries = Object.entries(sizes).map(\n      ([key, width]) => [key, matchMedia(`(min-width: ${width}px)`)] as const,\n    );\n    const update = () =>\n      setMatches(Object.fromEntries(queries.map(([key, query]) => [key, query.matches])));\n    for (const [, query] of queries) query.addEventListener('change', update);\n    update();\n    return () => {\n      for (const [, query] of queries) query.removeEventListener('change', update);\n    };\n  }, [theme.breakpoints]);\n  return matches;\n}\n"],"names":["useSystemAppearance","initial","appearance","setAppearance","useState","useEffect","media","matchMedia","update","colorContrast","foreground","background","canvas","fg","TinyColor","bg","base","composite","front","back","a","b","backgroundColor","luminance","color","r","g","values","channel","value","Math","useBreakpoint","theme","useLeafConfig","matches","setMatches","sizes","queries","Object","key","width","query"],"mappings":"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"}

package/dist/esm/browser/modules/config-provider/index.js

@@ -0,0 +1,3 @@
+"use client";
+export { ConfigProvider } from "./config-provider.js";
+export { colorContrast, useBreakpoint, useSystemAppearance } from "./helpers.js";

package/dist/esm/browser/modules/config-provider/use-color-variables.js

@@ -0,0 +1,50 @@
+"use client";
+import { useEffect, useState } from "react";
+import { deriveColors } from "../colors.js";
+import { composedParent } from "../shared/dom.js";
+import { leafThemeColors } from "../theme.js";
+function useColorVariables(root, theme) {
+    const [resolved, setResolved] = useState({});
+    useEffect(()=>{
+        const node = root.current;
+        const entries = Object.entries(leafThemeColors(theme));
+        if (!node || !entries.some(([, value])=>String(value).includes('var('))) return void setResolved((previous)=>Object.keys(previous).length ? {} : previous);
+        const sync = ()=>{
+            const probe = document.createElement('span');
+            probe.hidden = true;
+            node.append(probe);
+            const overrides = {};
+            for (const [key, value] of entries){
+                probe.style.color = '';
+                probe.style.color = String(value);
+                if (probe.style.color) overrides[key] = getComputedStyle(probe).color;
+            }
+            probe.remove();
+            const mode = theme.appearance ?? (getComputedStyle(node).colorScheme.includes('dark') ? 'dark' : 'light');
+            const next = deriveColors(mode, overrides);
+            setResolved((previous)=>JSON.stringify(previous) === JSON.stringify(next) ? previous : next);
+        };
+        sync();
+        const observer = new MutationObserver(sync);
+        let ancestor = node;
+        while(ancestor){
+            observer.observe(ancestor, {
+                attributes: true,
+                attributeFilter: [
+                    'style',
+                    'class',
+                    'data-leaf-theme'
+                ]
+            });
+            ancestor = composedParent(ancestor);
+        }
+        return ()=>observer.disconnect();
+    }, [
+        root,
+        theme
+    ]);
+    return resolved;
+}
+export { useColorVariables };
+
+//# sourceMappingURL=use-color-variables.js.map

package/dist/esm/browser/modules/config-provider/use-color-variables.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"config-provider/use-color-variables.js","sources":["../../../../../src/config-provider/use-color-variables.ts"],"sourcesContent":["import { type RefObject, useEffect, useState } from 'react';\nimport { deriveColors } from '../colors';\nimport { composedParent } from '../shared/dom';\nimport { type LeafTheme, type LeafThemeStyle, leafThemeColors } from '../theme';\n\n/** Resolve CSS variable colors after hydration; concrete theme colors are already SSR safe. */\nexport function useColorVariables(root: RefObject<HTMLDivElement | null>, theme: LeafTheme) {\n  const [resolved, setResolved] = useState<LeafThemeStyle>({});\n  useEffect(() => {\n    const node = root.current;\n    const entries = Object.entries(leafThemeColors(theme));\n    if (!node || !entries.some(([, value]) => String(value).includes('var('))) {\n      setResolved((previous) => (Object.keys(previous).length ? {} : previous));\n      return;\n    }\n    const sync = () => {\n      const probe = document.createElement('span');\n      probe.hidden = true;\n      node.append(probe);\n      const overrides: Record<string, string> = {};\n      for (const [key, value] of entries) {\n        probe.style.color = '';\n        probe.style.color = String(value);\n        if (probe.style.color) overrides[key] = getComputedStyle(probe).color;\n      }\n      probe.remove();\n      const mode =\n        theme.appearance ??\n        (getComputedStyle(node).colorScheme.includes('dark') ? 'dark' : 'light');\n      const next = deriveColors(mode, overrides);\n      setResolved((previous) =>\n        JSON.stringify(previous) === JSON.stringify(next) ? previous : next,\n      );\n    };\n    sync();\n    const observer = new MutationObserver(sync);\n    let ancestor: HTMLElement | null = node;\n    while (ancestor) {\n      observer.observe(ancestor, {\n        attributes: true,\n        attributeFilter: ['style', 'class', 'data-leaf-theme'],\n      });\n      ancestor = composedParent(ancestor);\n    }\n    return () => observer.disconnect();\n  }, [root, theme]);\n  return resolved;\n}\n"],"names":["useColorVariables","root","theme","resolved","setResolved","useState","useEffect","node","entries","Object","leafThemeColors","value","String","previous","sync","probe","document","overrides","key","getComputedStyle","mode","next","deriveColors","JSON","observer","MutationObserver","ancestor","composedParent"],"mappings":";;;;;AAMO,SAASA,kBAAkBC,IAAsC,EAAEC,KAAgB;IACxF,MAAM,CAACC,UAAUC,YAAY,GAAGC,SAAyB,CAAC;IAC1DC,UAAU;QACR,MAAMC,OAAON,KAAK,OAAO;QACzB,MAAMO,UAAUC,OAAO,OAAO,CAACC,gBAAgBR;QAC/C,IAAI,CAACK,QAAQ,CAACC,QAAQ,IAAI,CAAC,CAAC,GAAGG,MAAM,GAAKC,OAAOD,OAAO,QAAQ,CAAC,UAAU,YACzEP,YAAY,CAACS,WAAcJ,OAAO,IAAI,CAACI,UAAU,MAAM,GAAG,CAAC,IAAIA;QAGjE,MAAMC,OAAO;YACX,MAAMC,QAAQC,SAAS,aAAa,CAAC;YACrCD,MAAM,MAAM,GAAG;YACfR,KAAK,MAAM,CAACQ;YACZ,MAAME,YAAoC,CAAC;YAC3C,KAAK,MAAM,CAACC,KAAKP,MAAM,IAAIH,QAAS;gBAClCO,MAAM,KAAK,CAAC,KAAK,GAAG;gBACpBA,MAAM,KAAK,CAAC,KAAK,GAAGH,OAAOD;gBAC3B,IAAII,MAAM,KAAK,CAAC,KAAK,EAAEE,SAAS,CAACC,IAAI,GAAGC,iBAAiBJ,OAAO,KAAK;YACvE;YACAA,MAAM,MAAM;YACZ,MAAMK,OACJlB,MAAM,UAAU,IACfiB,CAAAA,iBAAiBZ,MAAM,WAAW,CAAC,QAAQ,CAAC,UAAU,SAAS,OAAM;YACxE,MAAMc,OAAOC,aAAaF,MAAMH;YAChCb,YAAY,CAACS,WACXU,KAAK,SAAS,CAACV,cAAcU,KAAK,SAAS,CAACF,QAAQR,WAAWQ;QAEnE;QACAP;QACA,MAAMU,WAAW,IAAIC,iBAAiBX;QACtC,IAAIY,WAA+BnB;QACnC,MAAOmB,SAAU;YACfF,SAAS,OAAO,CAACE,UAAU;gBACzB,YAAY;gBACZ,iBAAiB;oBAAC;oBAAS;oBAAS;iBAAkB;YACxD;YACAA,WAAWC,eAAeD;QAC5B;QACA,OAAO,IAAMF,SAAS,UAAU;IAClC,GAAG;QAACvB;QAAMC;KAAM;IAChB,OAAOC;AACT"}

package/dist/esm/browser/modules/confirm/confirm.js

@@ -0,0 +1,137 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { CircleAlert } from "lucide-react";
+import { useEffect, useId, useRef, useState } from "react";
+import { FeedbackIcon } from "../alert/alert.js";
+import { ButtonControl } from "../button/button.js";
+import { useLeafConfig } from "../config-provider/context.js";
+import { ModalBase } from "../modal/modal.js";
+function ConfirmDialog({ open, title, icon, children, confirmText, cancelText, type = 'default', showCancel, confirmButtonProps, cancelButtonProps, onCancel, onConfirm, onClose, ...props }) {
+    const { messages } = useLeafConfig();
+    const contentId = useId();
+    const [pending, setPending] = useState(false);
+    const [error, setError] = useState();
+    const mounted = useRef(true);
+    const busy = useRef(false);
+    const generation = useRef(0);
+    const confirmLoading = confirmButtonProps?.loading ?? false;
+    useEffect(()=>{
+        mounted.current = true;
+        return ()=>{
+            mounted.current = false;
+        };
+    }, []);
+    useEffect(()=>{
+        generation.current++;
+        busy.current = false;
+        setPending(false);
+        if (open) setError(void 0);
+    }, [
+        open
+    ]);
+    async function accept() {
+        if (busy.current || confirmLoading) return;
+        busy.current = true;
+        const request = generation.current;
+        setPending(true);
+        setError(void 0);
+        try {
+            await onConfirm?.();
+            if (mounted.current && generation.current === request) onClose?.();
+        } catch (reason) {
+            if (mounted.current && generation.current === request) setError(reason instanceof Error ? reason.message : String(reason));
+        } finally{
+            if (generation.current === request) {
+                busy.current = false;
+                if (mounted.current) setPending(false);
+            }
+        }
+    }
+    const cancel = ()=>{
+        if (!pending && !confirmLoading) {
+            onCancel?.();
+            onClose?.();
+        }
+    };
+    const contentIcon = void 0 === icon && 'default' !== type ? 'danger' === type ? /*#__PURE__*/ jsx(CircleAlert, {
+        "aria-hidden": "true"
+    }) : /*#__PURE__*/ jsx(FeedbackIcon, {
+        type: type
+    }) : icon;
+    return /*#__PURE__*/ jsx(ModalBase, {
+        ...props,
+        open: open,
+        title: title,
+        width: props.width ?? 420,
+        divided: false,
+        confirmLoading: pending || confirmLoading,
+        role: "alertdialog",
+        "aria-label": null == title ? messages.common.confirm : void 0,
+        "aria-describedby": null != children ? contentId : void 0,
+        className: [
+            'leaf-confirm',
+            `leaf-confirm--${type}`,
+            (null != icon || void 0 === icon && 'default' !== type) && 'leaf-confirm--has-icon',
+            props.className
+        ].filter(Boolean).join(' '),
+        maskClosable: pending ? false : props.maskClosable ?? false,
+        closable: !pending && (props.closable ?? false),
+        keyboard: !pending && (props.keyboard ?? true),
+        onClose: cancel,
+        onCancel: cancel,
+        footer: /*#__PURE__*/ jsxs(Fragment, {
+            children: [
+                (showCancel ?? 'success' !== type) && /*#__PURE__*/ jsx(ButtonControl, {
+                    type: "button",
+                    variant: "outline",
+                    ...cancelButtonProps,
+                    disabled: pending || confirmLoading || cancelButtonProps?.disabled,
+                    onClick: (event)=>{
+                        cancelButtonProps?.onClick?.(event);
+                        if (!event.defaultPrevented) cancel();
+                    },
+                    children: cancelText ?? messages.common.cancel
+                }),
+                /*#__PURE__*/ jsx(ButtonControl, {
+                    type: "button",
+                    ...confirmButtonProps,
+                    danger: 'danger' === type,
+                    loading: pending || confirmLoading || confirmButtonProps?.loading,
+                    onClick: (event)=>{
+                        confirmButtonProps?.onClick?.(event);
+                        if (!event.defaultPrevented) accept();
+                    },
+                    children: confirmText ?? messages.common.confirm
+                })
+            ]
+        }),
+        children: (null != contentIcon || null != children || null != error) && /*#__PURE__*/ jsxs("div", {
+            className: "leaf-confirm__body",
+            children: [
+                null != contentIcon && /*#__PURE__*/ jsx("span", {
+                    className: "leaf-confirm__icon",
+                    "aria-hidden": "true",
+                    children: contentIcon
+                }),
+                /*#__PURE__*/ jsxs("div", {
+                    className: "leaf-confirm__content",
+                    children: [
+                        null != children && /*#__PURE__*/ jsx("div", {
+                            id: contentId,
+                            className: "leaf-confirm-description",
+                            children: children
+                        }),
+                        error && /*#__PURE__*/ jsx("p", {
+                            role: "alert",
+                            className: "leaf-confirm-error",
+                            children: error
+                        })
+                    ]
+                })
+            ]
+        })
+    });
+}
+export { ConfirmDialog };
+
+//# sourceMappingURL=confirm.js.map

package/dist/esm/browser/modules/confirm/confirm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"confirm/confirm.js","sources":["../../../../../src/confirm/confirm.tsx"],"sourcesContent":["import { CircleAlert } from 'lucide-react';\nimport { type CSSProperties, type ReactNode, useEffect, useId, useRef, useState } from 'react';\nimport { FeedbackIcon } from '../alert/alert';\nimport { ButtonControl, type ButtonProps } from '../button/button';\nimport { useLeafConfig } from '../config-provider/context';\nimport { ModalBase } from '../modal/modal';\nimport type { DialogFocusOptions } from '../shared/dialog';\n\nexport interface ConfirmOptions extends DialogFocusOptions {\n  title?: ReactNode;\n  /** A short explanation of the action being confirmed. */\n  children?: ReactNode;\n  /** Bare semantic icon beside the content. Use null to hide it. */\n  icon?: ReactNode;\n  type?: 'default' | 'danger' | 'success' | 'warning' | 'info';\n  showCancel?: boolean;\n  confirmText?: ReactNode;\n  cancelText?: ReactNode;\n  confirmButtonProps?: ButtonProps;\n  cancelButtonProps?: ButtonProps;\n  onConfirm?: () => void | Promise<void>;\n  onCancel?: () => void;\n  width?: number | string;\n  closable?: boolean;\n  maskClosable?: boolean;\n  keyboard?: boolean;\n  className?: string;\n  style?: CSSProperties;\n}\ninterface ConfirmDialogProps extends ConfirmOptions {\n  open: boolean;\n  onClose: () => void;\n  afterClose?: () => void;\n}\n\n// Rendered only by the confirmation queue; consumers call useConfirm().confirm().\nexport function ConfirmDialog({\n  open,\n  title,\n  icon,\n  children,\n  confirmText,\n  cancelText,\n  type = 'default',\n  showCancel,\n  confirmButtonProps,\n  cancelButtonProps,\n  onCancel,\n  onConfirm,\n  onClose,\n  ...props\n}: ConfirmDialogProps) {\n  const { messages } = useLeafConfig();\n  const contentId = useId();\n  const [pending, setPending] = useState(false);\n  const [error, setError] = useState<string>();\n  const mounted = useRef(true);\n  const busy = useRef(false);\n  const generation = useRef(0);\n  const confirmLoading = confirmButtonProps?.loading ?? false;\n  useEffect(() => {\n    mounted.current = true;\n    return () => {\n      mounted.current = false;\n    };\n  }, []);\n  useEffect(() => {\n    generation.current++;\n    busy.current = false;\n    setPending(false);\n    if (open) setError(undefined);\n  }, [open]);\n  async function accept() {\n    if (busy.current || confirmLoading) return;\n    busy.current = true;\n    const request = generation.current;\n    setPending(true);\n    setError(undefined);\n    try {\n      await onConfirm?.();\n      if (mounted.current && generation.current === request) onClose?.();\n    } catch (reason) {\n      if (mounted.current && generation.current === request)\n        setError(reason instanceof Error ? reason.message : String(reason));\n    } finally {\n      if (generation.current === request) {\n        busy.current = false;\n        if (mounted.current) setPending(false);\n      }\n    }\n  }\n  const cancel = () => {\n    if (!pending && !confirmLoading) {\n      onCancel?.();\n      onClose?.();\n    }\n  };\n  const contentIcon =\n    icon === undefined && type !== 'default' ? (\n      type === 'danger' ? (\n        <CircleAlert aria-hidden=\"true\" />\n      ) : (\n        <FeedbackIcon type={type} />\n      )\n    ) : (\n      icon\n    );\n  return (\n    <ModalBase\n      {...props}\n      open={open}\n      title={title}\n      width={props.width ?? 420}\n      divided={false}\n      confirmLoading={pending || confirmLoading}\n      role=\"alertdialog\"\n      aria-label={title == null ? messages.common.confirm : undefined}\n      aria-describedby={children != null ? contentId : undefined}\n      className={[\n        'leaf-confirm',\n        `leaf-confirm--${type}`,\n        (icon != null || (icon === undefined && type !== 'default')) && 'leaf-confirm--has-icon',\n        props.className,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n      maskClosable={pending ? false : (props.maskClosable ?? false)}\n      closable={!pending && (props.closable ?? false)}\n      keyboard={!pending && (props.keyboard ?? true)}\n      onClose={cancel}\n      onCancel={cancel}\n      footer={\n        <>\n          {(showCancel ?? type !== 'success') && (\n            <ButtonControl\n              type=\"button\"\n              variant=\"outline\"\n              {...cancelButtonProps}\n              disabled={pending || confirmLoading || cancelButtonProps?.disabled}\n              onClick={(event) => {\n                cancelButtonProps?.onClick?.(event);\n                if (!event.defaultPrevented) cancel();\n              }}\n            >\n              {cancelText ?? messages.common.cancel}\n            </ButtonControl>\n          )}\n          <ButtonControl\n            type=\"button\"\n            {...confirmButtonProps}\n            danger={type === 'danger'}\n            loading={pending || confirmLoading || confirmButtonProps?.loading}\n            onClick={(event) => {\n              confirmButtonProps?.onClick?.(event);\n              if (!event.defaultPrevented) void accept();\n            }}\n          >\n            {confirmText ?? messages.common.confirm}\n          </ButtonControl>\n        </>\n      }\n    >\n      {(contentIcon != null || children != null || error != null) && (\n        <div className=\"leaf-confirm__body\">\n          {contentIcon != null && (\n            <span className=\"leaf-confirm__icon\" aria-hidden=\"true\">\n              {contentIcon}\n            </span>\n          )}\n          <div className=\"leaf-confirm__content\">\n            {children != null && (\n              <div id={contentId} className=\"leaf-confirm-description\">\n                {children}\n              </div>\n            )}\n            {error && (\n              <p role=\"alert\" className=\"leaf-confirm-error\">\n                {error}\n              </p>\n            )}\n          </div>\n        </div>\n      )}\n    </ModalBase>\n  );\n}\n"],"names":["ConfirmDialog","open","title","icon","children","confirmText","cancelText","type","showCancel","confirmButtonProps","cancelButtonProps","onCancel","onConfirm","onClose","props","messages","useLeafConfig","contentId","useId","pending","setPending","useState","error","setError","mounted","useRef","busy","generation","confirmLoading","useEffect","undefined","accept","request","reason","Error","String","cancel","contentIcon","CircleAlert","FeedbackIcon","ModalBase","Boolean","ButtonControl","event"],"mappings":"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"}

package/dist/esm/browser/modules/confirm/index.js

@@ -0,0 +1,2 @@
+"use client";
+export { ConfirmProvider, useConfirm } from "./provider.js";

package/dist/esm/browser/modules/confirm/provider.js

@@ -0,0 +1,90 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useContext, useEffect, useId, useMemo, useRef, useState, useSyncExternalStore } from "react";
+import { ComponentDefaultsContext, mergeComponentProps } from "../config-provider/component-defaults.js";
+import { ConfigContext, useLeafConfig } from "../config-provider/context.js";
+import { leafThemeVariables } from "../theme.js";
+import { ConfirmDialog } from "./confirm.js";
+import { ConfirmContext, createConfirmStore, emptyConfirmations } from "./store.js";
+function ConfirmProvider({ children }) {
+    const [store] = useState(createConfirmStore);
+    return /*#__PURE__*/ jsxs(ConfirmContext.Provider, {
+        value: store,
+        children: [
+            /*#__PURE__*/ jsx(ConfirmHost, {
+                store: store
+            }),
+            children
+        ]
+    });
+}
+function ConfirmScope({ children }) {
+    return useContext(ConfirmContext) ? children : /*#__PURE__*/ jsx(ConfirmProvider, {
+        children: children
+    });
+}
+function ConfirmHost({ store }) {
+    const requests = useSyncExternalStore(store.subscribe, store.getSnapshot, ()=>emptyConfirmations);
+    const request = requests[0];
+    if (!request) return null;
+    return /*#__PURE__*/ jsx(ConfigContext.Provider, {
+        value: request.config,
+        children: /*#__PURE__*/ jsx(ComponentDefaultsContext.Provider, {
+            value: request.components ?? {},
+            children: /*#__PURE__*/ jsx("div", {
+                className: "leaf-confirm-scope",
+                lang: request.config.locale,
+                "data-leaf-theme": request.config.theme.appearance,
+                style: leafThemeVariables(request.config.theme),
+                children: /*#__PURE__*/ jsx(ConfirmDialog, {
+                    ...request.options,
+                    open: request.open,
+                    onConfirm: async ()=>{
+                        await request.options.onConfirm?.();
+                        store.close(request.id, true);
+                    },
+                    onClose: ()=>store.close(request.id, false),
+                    afterClose: ()=>store.remove(request.id)
+                }, request.id)
+            })
+        })
+    });
+}
+function useConfirm() {
+    const store = useContext(ConfirmContext);
+    const config = useLeafConfig();
+    const components = useContext(ComponentDefaultsContext);
+    const currentComponents = useRef(components);
+    currentComponents.current = components;
+    const currentConfig = useRef(config);
+    currentConfig.current = config;
+    const active = useRef(true);
+    const scope = useId();
+    useEffect(()=>store?.updateScope(scope, config, components), [
+        store,
+        scope,
+        config,
+        components
+    ]);
+    useEffect(()=>{
+        active.current = true;
+        return ()=>{
+            active.current = false;
+            store?.cancelScope(scope);
+        };
+    }, [
+        store,
+        scope
+    ]);
+    const api = useMemo(()=>store ? {
+            confirm: (options)=>active.current ? store.confirm(scope, currentConfig.current, mergeComponentProps(currentComponents.current.Confirm, options), currentComponents.current) : Promise.resolve(false)
+        } : void 0, [
+        store,
+        scope
+    ]);
+    if (!api) throw new Error('useConfirm requires ConfigProvider or ConfirmProvider.');
+    return api;
+}
+export { ConfirmProvider, ConfirmScope, useConfirm };
+
+//# sourceMappingURL=provider.js.map

package/dist/esm/browser/modules/confirm/provider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"confirm/provider.js","sources":["../../../../../src/confirm/provider.tsx"],"sourcesContent":["import {\n  type ReactNode,\n  useContext,\n  useEffect,\n  useId,\n  useMemo,\n  useRef,\n  useState,\n  useSyncExternalStore,\n} from 'react';\nimport {\n  ComponentDefaultsContext,\n  mergeComponentProps,\n} from '../config-provider/component-defaults';\nimport { ConfigContext, useLeafConfig } from '../config-provider/context';\nimport { leafThemeVariables } from '../theme';\nimport type { ConfirmOptions } from './confirm';\nimport { ConfirmDialog } from './confirm';\nimport {\n  type ConfirmApi,\n  ConfirmContext,\n  type ConfirmStore,\n  createConfirmStore,\n  emptyConfirmations,\n} from './store';\n\nexport interface ConfirmProviderProps {\n  children?: ReactNode;\n}\nexport function ConfirmProvider({ children }: ConfirmProviderProps) {\n  const [store] = useState(createConfirmStore);\n  return (\n    <ConfirmContext.Provider value={store}>\n      <ConfirmHost store={store} />\n      {children}\n    </ConfirmContext.Provider>\n  );\n}\nexport function ConfirmScope({ children }: ConfirmProviderProps) {\n  return useContext(ConfirmContext) ? children : <ConfirmProvider>{children}</ConfirmProvider>;\n}\nfunction ConfirmHost({ store }: { store: ConfirmStore }) {\n  const requests = useSyncExternalStore(\n    store.subscribe,\n    store.getSnapshot,\n    () => emptyConfirmations,\n  );\n  const request = requests[0];\n  if (!request) return null;\n  return (\n    <ConfigContext.Provider value={request.config}>\n      <ComponentDefaultsContext.Provider value={request.components ?? {}}>\n        <div\n          className=\"leaf-confirm-scope\"\n          lang={request.config.locale}\n          data-leaf-theme={request.config.theme.appearance}\n          style={leafThemeVariables(request.config.theme)}\n        >\n          <ConfirmDialog\n            key={request.id}\n            {...request.options}\n            open={request.open}\n            onConfirm={async () => {\n              await request.options.onConfirm?.();\n              store.close(request.id, true);\n            }}\n            onClose={() => store.close(request.id, false)}\n            afterClose={() => store.remove(request.id)}\n          />\n        </div>\n      </ComponentDefaultsContext.Provider>\n    </ConfigContext.Provider>\n  );\n}\nexport function useConfirm(): ConfirmApi {\n  const store = useContext(ConfirmContext);\n  const config = useLeafConfig();\n  const components = useContext(ComponentDefaultsContext);\n  const currentComponents = useRef(components);\n  currentComponents.current = components;\n  const currentConfig = useRef(config);\n  currentConfig.current = config;\n  const active = useRef(true);\n  const scope = useId();\n  useEffect(\n    () => store?.updateScope(scope, config, components),\n    [store, scope, config, components],\n  );\n  useEffect(() => {\n    active.current = true;\n    return () => {\n      active.current = false;\n      store?.cancelScope(scope);\n    };\n  }, [store, scope]);\n  const api = useMemo<ConfirmApi | undefined>(\n    () =>\n      store\n        ? {\n            confirm: (options) =>\n              active.current\n                ? store.confirm(\n                    scope,\n                    currentConfig.current,\n                    mergeComponentProps<ConfirmOptions>(currentComponents.current.Confirm, options),\n                    currentComponents.current,\n                  )\n                : Promise.resolve(false),\n          }\n        : undefined,\n    [store, scope],\n  );\n  if (!api) throw new Error('useConfirm requires ConfigProvider or ConfirmProvider.');\n  return api;\n}\n"],"names":["ConfirmProvider","children","store","useState","createConfirmStore","ConfirmContext","ConfirmHost","ConfirmScope","useContext","requests","useSyncExternalStore","emptyConfirmations","request","ConfigContext","ComponentDefaultsContext","leafThemeVariables","ConfirmDialog","useConfirm","config","useLeafConfig","components","currentComponents","useRef","currentConfig","active","scope","useId","useEffect","api","useMemo","options","mergeComponentProps","Promise","undefined","Error"],"mappings":";;;;;;;;AA6BO,SAASA,gBAAgB,EAAEC,QAAQ,EAAwB;IAChE,MAAM,CAACC,MAAM,GAAGC,SAASC;IACzB,OAAO,WAAP,GACE,KAACC,eAAe,QAAQ;QAAC,OAAOH;;0BAC9B,IAACI,aAAWA;gBAAC,OAAOJ;;YACnBD;;;AAGP;AACO,SAASM,aAAa,EAAEN,QAAQ,EAAwB;IAC7D,OAAOO,WAAWH,kBAAkBJ,WAAW,WAAXA,GAAW,IAACD,iBAAeA;kBAAEC;;AACnE;AACA,SAASK,YAAY,EAAEJ,KAAK,EAA2B;IACrD,MAAMO,WAAWC,qBACfR,MAAM,SAAS,EACfA,MAAM,WAAW,EACjB,IAAMS;IAER,MAAMC,UAAUH,QAAQ,CAAC,EAAE;IAC3B,IAAI,CAACG,SAAS,OAAO;IACrB,OAAO,WAAP,GACE,IAACC,cAAc,QAAQ;QAAC,OAAOD,QAAQ,MAAM;kBAC3C,kBAACE,yBAAyB,QAAQ;YAAC,OAAOF,QAAQ,UAAU,IAAI,CAAC;sBAC/D,kBAAC;gBACC,WAAU;gBACV,MAAMA,QAAQ,MAAM,CAAC,MAAM;gBAC3B,mBAAiBA,QAAQ,MAAM,CAAC,KAAK,CAAC,UAAU;gBAChD,OAAOG,mBAAmBH,QAAQ,MAAM,CAAC,KAAK;0BAE9C,kBAACI,eAAaA;oBAEX,GAAGJ,QAAQ,OAAO;oBACnB,MAAMA,QAAQ,IAAI;oBAClB,WAAW;wBACT,MAAMA,QAAQ,OAAO,CAAC,SAAS;wBAC/BV,MAAM,KAAK,CAACU,QAAQ,EAAE,EAAE;oBAC1B;oBACA,SAAS,IAAMV,MAAM,KAAK,CAACU,QAAQ,EAAE,EAAE;oBACvC,YAAY,IAAMV,MAAM,MAAM,CAACU,QAAQ,EAAE;mBARpCA,QAAQ,EAAE;;;;AAc3B;AACO,SAASK;IACd,MAAMf,QAAQM,WAAWH;IACzB,MAAMa,SAASC;IACf,MAAMC,aAAaZ,WAAWM;IAC9B,MAAMO,oBAAoBC,OAAOF;IACjCC,kBAAkB,OAAO,GAAGD;IAC5B,MAAMG,gBAAgBD,OAAOJ;IAC7BK,cAAc,OAAO,GAAGL;IACxB,MAAMM,SAASF,OAAO;IACtB,MAAMG,QAAQC;IACdC,UACE,IAAMzB,OAAO,YAAYuB,OAAOP,QAAQE,aACxC;QAAClB;QAAOuB;QAAOP;QAAQE;KAAW;IAEpCO,UAAU;QACRH,OAAO,OAAO,GAAG;QACjB,OAAO;YACLA,OAAO,OAAO,GAAG;YACjBtB,OAAO,YAAYuB;QACrB;IACF,GAAG;QAACvB;QAAOuB;KAAM;IACjB,MAAMG,MAAMC,QACV,IACE3B,QACI;YACE,SAAS,CAAC4B,UACRN,OAAO,OAAO,GACVtB,MAAM,OAAO,CACXuB,OACAF,cAAc,OAAO,EACrBQ,oBAAoCV,kBAAkB,OAAO,CAAC,OAAO,EAAES,UACvET,kBAAkB,OAAO,IAE3BW,QAAQ,OAAO,CAAC;QACxB,IACAC,QACN;QAAC/B;QAAOuB;KAAM;IAEhB,IAAI,CAACG,KAAK,MAAM,IAAIM,MAAM;IAC1B,OAAON;AACT"}

package/dist/esm/browser/modules/confirm/store.js

@@ -0,0 +1,79 @@
+"use client";
+import { createContext } from "react";
+const emptyConfirmations = [];
+function createConfirmStore() {
+    let requests = emptyConfirmations;
+    let sequence = 0;
+    let available = true;
+    const listeners = new Set();
+    const publish = (next)=>{
+        requests = next;
+        for (const listener of listeners)listener();
+    };
+    const close = (id, result)=>{
+        const request = requests[0];
+        if (!request?.open || request.id !== id) return;
+        publish(requests.map((entry)=>entry.id === id ? {
+                ...entry,
+                open: false
+            } : entry));
+        request.resolve(result);
+    };
+    return {
+        getSnapshot: ()=>requests,
+        subscribe: (listener)=>{
+            available = true;
+            listeners.add(listener);
+            return ()=>{
+                listeners.delete(listener);
+                if (!listeners.size) {
+                    available = false;
+                    for (const request of requests)request.resolve(false);
+                    requests = emptyConfirmations;
+                }
+            };
+        },
+        confirm: (scope, config, options, components)=>{
+            if (!available) return Promise.resolve(false);
+            return new Promise((resolve)=>{
+                publish([
+                    ...requests,
+                    {
+                        id: ++sequence,
+                        options,
+                        scope,
+                        config,
+                        components,
+                        open: true,
+                        resolve
+                    }
+                ]);
+            });
+        },
+        close,
+        remove: (id)=>{
+            if (requests[0]?.id === id && !requests[0].open) publish(requests.slice(1));
+        },
+        updateScope: (scope, config, components)=>{
+            if (requests.some((request)=>request.scope === scope && (request.config !== config || request.components !== components))) publish(requests.map((request)=>request.scope === scope ? {
+                    ...request,
+                    config,
+                    components
+                } : request));
+        },
+        cancelScope: (scope)=>{
+            const cancelled = requests.filter((request)=>request.scope === scope);
+            if (!cancelled.length) return;
+            const current = requests[0];
+            publish(requests.filter((request)=>request.scope !== scope || request === current).map((request)=>request.scope === scope ? {
+                    ...request,
+                    open: false
+                } : request));
+            for (const request of cancelled)request.resolve(false);
+        }
+    };
+}
+const ConfirmContext = createContext(null);
+export { ConfirmContext, createConfirmStore, emptyConfirmations };
+
+//# sourceMappingURL=store.js.map

package/dist/esm/browser/modules/confirm/store.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"confirm/store.js","sources":["../../../../../src/confirm/store.ts"],"sourcesContent":["import { createContext } from 'react';\nimport type { LeafComponentDefaults } from '../config-provider/component-defaults';\nimport type { LeafConfig } from '../config-provider/context';\nimport type { ConfirmOptions } from './confirm';\n\nexport interface ConfirmApi {\n  confirm: (options: ConfirmOptions) => Promise<boolean>;\n}\ninterface ConfirmRequest {\n  id: number;\n  options: ConfirmOptions;\n  scope: string;\n  config: LeafConfig;\n  components?: LeafComponentDefaults;\n  open: boolean;\n  resolve: (result: boolean) => void;\n}\nexport const emptyConfirmations: readonly ConfirmRequest[] = [];\n\n/** Requests belong to one provider. Only the first is shown, including its exit animation. */\nexport function createConfirmStore() {\n  let requests = emptyConfirmations;\n  let sequence = 0;\n  let available = true;\n  const listeners = new Set<() => void>();\n  const publish = (next: readonly ConfirmRequest[]) => {\n    requests = next;\n    for (const listener of listeners) listener();\n  };\n  const close = (id: number, result: boolean) => {\n    const request = requests[0];\n    if (!request?.open || request.id !== id) return;\n    publish(requests.map((entry) => (entry.id === id ? { ...entry, open: false } : entry)));\n    request.resolve(result);\n  };\n  return {\n    getSnapshot: () => requests,\n    subscribe: (listener: () => void) => {\n      available = true;\n      listeners.add(listener);\n      return () => {\n        listeners.delete(listener);\n        if (!listeners.size) {\n          available = false;\n          for (const request of requests) request.resolve(false);\n          requests = emptyConfirmations;\n        }\n      };\n    },\n    confirm: (\n      scope: string,\n      config: LeafConfig,\n      options: ConfirmOptions,\n      components?: LeafComponentDefaults,\n    ) => {\n      if (!available) return Promise.resolve(false);\n      return new Promise<boolean>((resolve) => {\n        publish([\n          ...requests,\n          { id: ++sequence, options, scope, config, components, open: true, resolve },\n        ]);\n      });\n    },\n    close,\n    remove: (id: number) => {\n      if (requests[0]?.id === id && !requests[0].open) publish(requests.slice(1));\n    },\n    updateScope: (scope: string, config: LeafConfig, components?: LeafComponentDefaults) => {\n      if (\n        requests.some(\n          (request) =>\n            request.scope === scope &&\n            (request.config !== config || request.components !== components),\n        )\n      )\n        publish(\n          requests.map((request) =>\n            request.scope === scope ? { ...request, config, components } : request,\n          ),\n        );\n    },\n    cancelScope: (scope: string) => {\n      const cancelled = requests.filter((request) => request.scope === scope);\n      if (!cancelled.length) return;\n      const current = requests[0];\n      publish(\n        requests\n          .filter((request) => request.scope !== scope || request === current)\n          .map((request) => (request.scope === scope ? { ...request, open: false } : request)),\n      );\n      for (const request of cancelled) request.resolve(false);\n    },\n  };\n}\nexport type ConfirmStore = ReturnType<typeof createConfirmStore>;\nexport const ConfirmContext = createContext<ConfirmStore | null>(null);\n"],"names":["emptyConfirmations","createConfirmStore","requests","sequence","available","listeners","Set","publish","next","listener","close","id","result","request","entry","scope","config","options","components","Promise","resolve","cancelled","current","ConfirmContext","createContext"],"mappings":";;AAiBO,MAAMA,qBAAgD,EAAE;AAGxD,SAASC;IACd,IAAIC,WAAWF;IACf,IAAIG,WAAW;IACf,IAAIC,YAAY;IAChB,MAAMC,YAAY,IAAIC;IACtB,MAAMC,UAAU,CAACC;QACfN,WAAWM;QACX,KAAK,MAAMC,YAAYJ,UAAWI;IACpC;IACA,MAAMC,QAAQ,CAACC,IAAYC;QACzB,MAAMC,UAAUX,QAAQ,CAAC,EAAE;QAC3B,IAAI,CAACW,SAAS,QAAQA,QAAQ,EAAE,KAAKF,IAAI;QACzCJ,QAAQL,SAAS,GAAG,CAAC,CAACY,QAAWA,MAAM,EAAE,KAAKH,KAAK;gBAAE,GAAGG,KAAK;gBAAE,MAAM;YAAM,IAAIA;QAC/ED,QAAQ,OAAO,CAACD;IAClB;IACA,OAAO;QACL,aAAa,IAAMV;QACnB,WAAW,CAACO;YACVL,YAAY;YACZC,UAAU,GAAG,CAACI;YACd,OAAO;gBACLJ,UAAU,MAAM,CAACI;gBACjB,IAAI,CAACJ,UAAU,IAAI,EAAE;oBACnBD,YAAY;oBACZ,KAAK,MAAMS,WAAWX,SAAUW,QAAQ,OAAO,CAAC;oBAChDX,WAAWF;gBACb;YACF;QACF;QACA,SAAS,CACPe,OACAC,QACAC,SACAC;YAEA,IAAI,CAACd,WAAW,OAAOe,QAAQ,OAAO,CAAC;YACvC,OAAO,IAAIA,QAAiB,CAACC;gBAC3Bb,QAAQ;uBACHL;oBACH;wBAAE,IAAI,EAAEC;wBAAUc;wBAASF;wBAAOC;wBAAQE;wBAAY,MAAM;wBAAME;oBAAQ;iBAC3E;YACH;QACF;QACAV;QACA,QAAQ,CAACC;YACP,IAAIT,QAAQ,CAAC,EAAE,EAAE,OAAOS,MAAM,CAACT,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAEK,QAAQL,SAAS,KAAK,CAAC;QAC1E;QACA,aAAa,CAACa,OAAeC,QAAoBE;YAC/C,IACEhB,SAAS,IAAI,CACX,CAACW,UACCA,QAAQ,KAAK,KAAKE,SACjBF,CAAAA,QAAQ,MAAM,KAAKG,UAAUH,QAAQ,UAAU,KAAKK,UAAS,IAGlEX,QACEL,SAAS,GAAG,CAAC,CAACW,UACZA,QAAQ,KAAK,KAAKE,QAAQ;oBAAE,GAAGF,OAAO;oBAAEG;oBAAQE;gBAAW,IAAIL;QAGvE;QACA,aAAa,CAACE;YACZ,MAAMM,YAAYnB,SAAS,MAAM,CAAC,CAACW,UAAYA,QAAQ,KAAK,KAAKE;YACjE,IAAI,CAACM,UAAU,MAAM,EAAE;YACvB,MAAMC,UAAUpB,QAAQ,CAAC,EAAE;YAC3BK,QACEL,SACG,MAAM,CAAC,CAACW,UAAYA,QAAQ,KAAK,KAAKE,SAASF,YAAYS,SAC3D,GAAG,CAAC,CAACT,UAAaA,QAAQ,KAAK,KAAKE,QAAQ;oBAAE,GAAGF,OAAO;oBAAE,MAAM;gBAAM,IAAIA;YAE/E,KAAK,MAAMA,WAAWQ,UAAWR,QAAQ,OAAO,CAAC;QACnD;IACF;AACF;AAEO,MAAMU,iBAAiBC,cAAmC"}

package/dist/esm/browser/modules/datepicker/datepicker.js

@@ -0,0 +1,119 @@
+"use client";
+import '../../../styles/foundation.css';
+import '../../../styles/components/datepicker.css';
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { forwardRef, useRef } from "react";
+import { ButtonControl } from "../button/button.js";
+import { useComponentProps } from "../config-provider/component-defaults.js";
+import { useLeafConfig } from "../config-provider/context.js";
+import { useFormField } from "../form/form.js";
+import { CalendarPanel, periodKey, startOfPeriod, withinPeriod } from "../shared/calendar.js";
+import { formatPickerDate, parsePickerDate } from "../shared/date-format.js";
+import { DateInput } from "../shared/date-input.js";
+import { useFieldValue, useMergedRef } from "../shared/field.js";
+import { usePopupState } from "../shared/floating.js";
+import { parseDateText } from "../shared/parse-date.js";
+import { MultipleDatePicker } from "./multiple.js";
+const datepicker_SingleDatePicker = /*#__PURE__*/ forwardRef(function({ value, defaultValue = null, minDate, maxDate, picker = 'date', disabledDate, showToday = true, todayText, renderExtraFooter, onChange, onOpenChange, open: controlledOpen, defaultOpen, format, parse, presets, panelValue, onPanelChange, cellRender, multiple: _multiple, ...props }, ref) {
+    const { messages } = useLeafConfig();
+    const field = useFormField();
+    const trigger = useRef(null);
+    const merged = useMergedRef(trigger, ref);
+    const [selected, setSelected] = useFieldValue(value, defaultValue, trigger, props.form);
+    const [open, setOpen] = usePopupState(props.disabled || field?.disabled || props.readOnly, onOpenChange, controlledOpen, defaultOpen);
+    const change = (next)=>{
+        if (props.readOnly || props.disabled || field?.disabled) return;
+        const normalized = next ? startOfPeriod(next, picker) : null;
+        setSelected(normalized);
+        onChange?.(normalized, normalized ? formatPickerDate(normalized, format, (date)=>periodKey(date, picker)) : '');
+    };
+    const today = new Date();
+    today.setHours(0, 0, 0, 0);
+    return /*#__PURE__*/ jsx(DateInput, {
+        ...props,
+        ref: merged,
+        displayValue: selected ? formatPickerDate(selected, format, (date)=>periodKey(date, picker)) : '',
+        formValue: selected ? periodKey(selected, picker) : '',
+        open: open,
+        onOpenChange: setOpen,
+        onOpening: ()=>{},
+        onClear: ()=>change(null),
+        onTextCommit: (text)=>{
+            if (!text) {
+                change(null);
+                return true;
+            }
+            const parsed = parsePickerDate(text, format, (text)=>parseDateText(text, picker), parse);
+            if (!parsed || !withinPeriod(parsed, picker, minDate, maxDate) || disabledDate?.(parsed)) return false;
+            change(parsed);
+            return true;
+        },
+        panelClassName: "leaf-date-picker__panel",
+        renderPanel: (close)=>/*#__PURE__*/ jsxs(Fragment, {
+                children: [
+                    /*#__PURE__*/ jsx(CalendarPanel, {
+                        visibleDate: panelValue,
+                        onVisibleChange: onPanelChange,
+                        cellRender: cellRender,
+                        picker: picker,
+                        disabledDate: disabledDate,
+                        value: selected,
+                        minDate: minDate,
+                        maxDate: maxDate,
+                        onChange: (date)=>{
+                            change(date);
+                            close();
+                        }
+                    }),
+                    presets?.length ? /*#__PURE__*/ jsx("div", {
+                        className: "leaf-picker-presets",
+                        children: presets.map((preset)=>/*#__PURE__*/ jsx(ButtonControl, {
+                                size: "sm",
+                                variant: "ghost",
+                                onClick: ()=>{
+                                    const date = 'function' == typeof preset.value ? preset.value() : preset.value;
+                                    if (withinPeriod(date, picker, minDate, maxDate) && !disabledDate?.(date)) {
+                                        change(date);
+                                        close();
+                                    }
+                                },
+                                children: preset.label
+                            }, preset.key ?? String(preset.label)))
+                    }) : null,
+                    (showToday || null != renderExtraFooter) && /*#__PURE__*/ jsx("div", {
+                        className: "leaf-picker-footer",
+                        children: /*#__PURE__*/ jsxs("div", {
+                            className: "leaf-picker-footer__extra",
+                            children: [
+                                showToday && /*#__PURE__*/ jsx(ButtonControl, {
+                                    variant: "ghost",
+                                    size: "sm",
+                                    disabled: !withinPeriod(today, picker, minDate, maxDate) || disabledDate?.(startOfPeriod(today, picker)),
+                                    onClick: ()=>{
+                                        change(today);
+                                        close();
+                                    },
+                                    children: todayText ?? messages.calendar.today
+                                }),
+                                renderExtraFooter
+                            ]
+                        })
+                    })
+                ]
+            })
+    });
+});
+const datepicker_DatePicker = /*#__PURE__*/ forwardRef(function(rawProps, ref) {
+    const props = useComponentProps('DatePicker', rawProps);
+    return props.multiple ? /*#__PURE__*/ jsx(MultipleDatePicker, {
+        ...props,
+        ref: ref
+    }) : /*#__PURE__*/ jsx(datepicker_SingleDatePicker, {
+        ...props,
+        ref: ref
+    });
+});
+datepicker_DatePicker.displayName = 'DatePicker';
+export { datepicker_DatePicker as DatePicker };
+
+//# sourceMappingURL=datepicker.js.map