@jirawatpyk/aura-react 4.15.0 → 4.17.0

package/dist/esm/AppShell.js

@@ -8,26 +8,25 @@ import { useBreakpoint } from "./responsive.js";
 const AppShell = React.forwardRef(function AppShell2(props, ref) {
   const t = useStrings();
   const bp = useBreakpoint();
-  const compact = bp === "base" || bp === "sm" || bp === "md";
+  const wide = bp === "lg" || bp === "xl";
   const st = React.useState(false), open = st[0], setOpen = st[1];
   React.useEffect(
     function() {
-      if (!compact) setOpen(false);
+      if (wide) setOpen(false);
     },
-    [compact]
+    [wide]
   );
-  const navEl = props.nav;
-  const nav = props.nav && React.isValidElement(props.nav) && compact ? React.cloneElement(navEl, {
+  const navEl = props.nav && React.isValidElement(props.nav) ? props.nav : null;
+  const drawerNav = navEl ? React.cloneElement(navEl, {
     onChange: function(id) {
       if (navEl.props.onChange) navEl.props.onChange(id);
       setOpen(false);
     },
     className: cx(navEl.props.className, "is-in-drawer"),
-    /* The drawer is already full-size: never a rail, no collapse button. */
     collapsed: false,
     collapsible: false
   }) : props.nav;
-  return /* @__PURE__ */ React.createElement("div", { ref, className: cx("aura-shell", compact && "is-compact", props.className) }, !compact ? /* @__PURE__ */ React.createElement("div", { className: "aura-shell__nav" }, nav) : null, compact ? /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ React.createElement("div", { ref, className: cx("aura-shell", props.className) }, props.nav ? /* @__PURE__ */ React.createElement("div", { className: "aura-shell__nav" }, props.nav) : null, props.nav ? /* @__PURE__ */ React.createElement(
     Drawer,
     {
       open,
@@ -39,10 +38,11 @@ const AppShell = React.forwardRef(function AppShell2(props, ref) {
       "aria-label": props.navLabel || t.navigation,
       dismissible: true
     },
-    nav
-  ) : null, /* @__PURE__ */ React.createElement("div", { className: "aura-shell__main" }, props.header || compact ? /* @__PURE__ */ React.createElement("header", { className: "aura-shell__bar" }, compact ? /* @__PURE__ */ React.createElement(
+    drawerNav
+  ) : null, /* @__PURE__ */ React.createElement("div", { className: "aura-shell__main" }, props.header || props.nav ? /* @__PURE__ */ React.createElement("header", { className: cx("aura-shell__bar", !props.header && "aura-shell__bar--menu-only") }, props.nav ? /* @__PURE__ */ React.createElement(
     IconButton,
     {
+      className: "aura-shell__menu",
       icon: "menu",
       label: props.menuLabel || t.openNav,
       size: "md",

package/dist/esm/Breadcrumb.js

@@ -5,7 +5,7 @@ import { cx } from "./internal.js";
 import { useLinkComponent, useStrings } from "./locale.js";
 const Breadcrumb = React.forwardRef(function Breadcrumb2(props, ref) {
   const t = useStrings();
-  const Link = useLinkComponent();
+  const Link = useLinkComponent(props.linkComponent);
   const items = props.items || [];
   return /* @__PURE__ */ React.createElement("nav", { ref, "aria-label": props.label || t.breadcrumb, className: cx("aura-crumbs", props.className) }, /* @__PURE__ */ React.createElement("ol", null, items.map(function(it, i) {
     const last = i === items.length - 1;

package/dist/esm/Button.js

@@ -15,7 +15,8 @@ function ButtonLink(props, ref, Link) {
     "disabled",
     "linkComponent",
     "href",
-    "fullWidth"
+    "fullWidth",
+    "size"
   ]);
   const Tag = disabled ? "a" : Link;
   return /* @__PURE__ */ React.createElement(
@@ -27,7 +28,13 @@ function ButtonLink(props, ref, Link) {
       role: disabled ? "link" : void 0,
       "aria-disabled": disabled || void 0,
       tabIndex: disabled ? -1 : props.tabIndex,
-      className: cx("aura-btn", "aura-btn--" + variant, props.fullWidth && "aura-btn--full", props.className),
+      className: cx(
+        "aura-btn",
+        "aura-btn--" + variant,
+        props.size === "sm" && "aura-btn--sm",
+        props.fullWidth && "aura-btn--full",
+        props.className
+      ),
       onClick: disabled ? void 0 : props.onClick
     },
     props.icon ? /* @__PURE__ */ React.createElement(Icon, { name: props.icon }) : null,
@@ -53,7 +60,8 @@ const Button = React.forwardRef(
       "iconRight",
       "loading",
       "onClick",
-      "fullWidth"
+      "fullWidth",
+      "size"
     ]);
     return /* @__PURE__ */ React.createElement(
       "button",
@@ -64,6 +72,7 @@ const Button = React.forwardRef(
         className: cx(
           "aura-btn",
           "aura-btn--" + variant,
+          props.size === "sm" && "aura-btn--sm",
           props.fullWidth && "aura-btn--full",
           loading && "is-loading",
           props.className

package/dist/esm/Command.js

@@ -15,7 +15,12 @@ function Command(props) {
   const id = uid(), listId = id + "-list";
   const box = React.useRef(null);
   const input = React.useRef(null);
-  const q = React.useState(""), act = React.useState(0);
+  const qState = React.useState(""), act = React.useState(null);
+  const query = props.query !== void 0 ? props.query : qState[0];
+  function setQuery(v) {
+    if (props.query === void 0) qState[1](v);
+    if (props.onQueryChange) props.onQueryChange(v);
+  }
   const openRef = React.useRef(props.open);
   openRef.current = props.open;
   const close = function() {
@@ -41,15 +46,15 @@ function Command(props) {
   React.useEffect(
     function() {
       if (!props.open) {
-        q[1]("");
-        act[1](0);
+        if (query) setQuery("");
+        act[1](null);
       }
     },
     [props.open]
   );
-  const filter = props.filter || defaultFilter;
+  const filter = props.filter === false ? null : props.filter || defaultFilter;
   const shown = (props.items || []).filter(function(it) {
-    return filter(it, q[0]);
+    return !filter || filter(it, query);
   });
   const groups = [];
   shown.forEach(function(it) {
@@ -71,7 +76,10 @@ function Command(props) {
   }).filter(function(i2) {
     return i2 >= 0;
   });
-  const active = enabled.indexOf(act[0]) >= 0 ? act[0] : enabled.length ? enabled[0] : -1;
+  const byId = act[0] == null ? -1 : flat.findIndex(function(it) {
+    return it.id === act[0];
+  });
+  const active = enabled.indexOf(byId) >= 0 ? byId : enabled.length ? enabled[0] : -1;
   const optId = function(i2) {
     return id + "-o" + i2;
   };
@@ -96,7 +104,7 @@ function Command(props) {
     if (dir === "first") n = 0;
     else if (dir === "last") n = enabled.length - 1;
     else n = (at + dir + enabled.length) % enabled.length;
-    act[1](enabled[n]);
+    act[1](flat[enabled[n]].id);
   }
   function onKey(e) {
     if (e.key === "ArrowDown") {
@@ -154,56 +162,68 @@ function Command(props) {
             "aria-label": props.label || t.commandMenu,
             placeholder: props.placeholder || t.commandPlaceholder,
             className: "aura-command__input",
-            value: q[0],
+            value: query,
             autoComplete: "off",
             spellCheck: false,
             onChange: function(e) {
-              q[1](e.target.value);
-              act[1](0);
+              setQuery(e.target.value);
+              act[1](null);
             },
             onKeyDown: onKey
           }
         ), /* @__PURE__ */ React.createElement("kbd", { className: "aura-command__kbd" }, "Esc")),
-        /* @__PURE__ */ React.createElement("div", { className: "aura-command__list", id: listId, role: "listbox", "aria-label": props.label || t.commandMenu }, !flat.length ? /* @__PURE__ */ React.createElement("p", { className: "aura-command__empty", role: "presentation" }, props.emptyText || t.noMatches) : groups.map(function(g, gi) {
-          const gid = id + "-g" + gi;
-          return /* @__PURE__ */ React.createElement(
-            "div",
-            {
-              key: g.name || gi,
-              role: "group",
-              "aria-labelledby": g.name ? gid : void 0,
-              className: "aura-command__group"
-            },
-            g.name ? /* @__PURE__ */ React.createElement("div", { className: "aura-command__heading", id: gid, role: "presentation" }, g.name) : null,
-            g.items.map(function(it) {
-              i++;
-              const n = i;
-              return /* @__PURE__ */ React.createElement(
-                "div",
-                {
-                  key: it.id,
-                  id: optId(n),
-                  role: "option",
-                  "aria-selected": n === active,
-                  "aria-disabled": it.disabled || void 0,
-                  className: cx("aura-command__item", n === active && "is-active", it.disabled && "is-disabled"),
-                  onPointerDown: function(e) {
-                    e.preventDefault();
-                  },
-                  onPointerMove: function() {
-                    if (!it.disabled && act[0] !== n) act[1](n);
+        /* @__PURE__ */ React.createElement(
+          "div",
+          {
+            className: "aura-command__list",
+            id: listId,
+            role: "listbox",
+            "aria-label": props.label || t.commandMenu,
+            "aria-busy": props.loading || void 0
+          },
+          props.loading ? /* @__PURE__ */ React.createElement("div", { className: "aura-command__loading", role: "presentation" }, /* @__PURE__ */ React.createElement(Icon, { name: "loader-circle", className: "aura-spin" }), t.searching) : null,
+          !flat.length ? props.loading ? null : /* @__PURE__ */ React.createElement("div", { className: "aura-command__empty", role: "presentation" }, props.empty != null ? props.empty : props.emptyText || t.noMatches) : groups.map(function(g, gi) {
+            const gid = id + "-g" + gi;
+            return /* @__PURE__ */ React.createElement(
+              "div",
+              {
+                key: g.name || gi,
+                role: "group",
+                "aria-labelledby": g.name ? gid : void 0,
+                className: "aura-command__group"
+              },
+              g.name ? /* @__PURE__ */ React.createElement("div", { className: "aura-command__heading", id: gid, role: "presentation" }, g.name) : null,
+              g.items.map(function(it) {
+                i++;
+                const n = i;
+                return /* @__PURE__ */ React.createElement(
+                  "div",
+                  {
+                    key: it.id,
+                    id: optId(n),
+                    role: "option",
+                    "aria-selected": n === active,
+                    "aria-disabled": it.disabled || void 0,
+                    className: cx("aura-command__item", n === active && "is-active", it.disabled && "is-disabled"),
+                    onPointerDown: function(e) {
+                      e.preventDefault();
+                    },
+                    onPointerMove: function() {
+                      if (!it.disabled && act[0] !== it.id) act[1](it.id);
+                    },
+                    onClick: function() {
+                      run(it);
+                    }
                   },
-                  onClick: function() {
-                    run(it);
-                  }
-                },
-                it.icon ? /* @__PURE__ */ React.createElement(Icon, { name: it.icon }) : null,
-                /* @__PURE__ */ React.createElement("span", { className: "aura-command__text" }, /* @__PURE__ */ React.createElement("span", { className: "aura-command__label" }, it.label), it.description ? /* @__PURE__ */ React.createElement("span", { className: "aura-command__desc" }, it.description) : null),
-                it.shortcut ? /* @__PURE__ */ React.createElement("kbd", { className: "aura-command__kbd" }, it.shortcut) : null
-              );
-            })
-          );
-        })),
+                  it.icon ? /* @__PURE__ */ React.createElement(Icon, { name: it.icon }) : null,
+                  /* @__PURE__ */ React.createElement("span", { className: "aura-command__text" }, /* @__PURE__ */ React.createElement("span", { className: "aura-command__label" }, it.label), it.description ? /* @__PURE__ */ React.createElement("span", { className: "aura-command__desc" }, it.description) : null),
+                  it.shortcut ? /* @__PURE__ */ React.createElement("kbd", { className: "aura-command__kbd" }, it.shortcut) : null
+                );
+              })
+            );
+          })
+        ),
+        /* @__PURE__ */ React.createElement("span", { className: "aura-sr-only", role: "status" }, props.loading ? t.searching : props.loading === false && query ? t.results(flat.length) : ""),
         /* @__PURE__ */ React.createElement("div", { className: "aura-command__foot", "aria-hidden": true }, t.commandHint, /* @__PURE__ */ React.createElement("span", { className: "aura-command__mod" }, isMac() ? "\u2318K" : "Ctrl K"))
       )
     ),

package/dist/esm/DataTable.js

@@ -15,6 +15,7 @@ const DEFAULT_COLUMNS = [
   { key: "owner", label: "OWNER" }
 ];
 const SKELETON_WIDTHS = ["72%", "56%", "84%", "44%", "64%"];
+const STACK_WIDTHS = [360, 400, 480, 520, 560, 600, 640, 720, 768, 800, 900, 960, 1024];
 const ROW_H_DEFAULT = 48, OVERSCAN = 8, FLEX_MIN = 160;
 const DataTable = React.forwardRef(function DataTable2(props, ref) {
   const t = useStrings();
@@ -33,11 +34,20 @@ const DataTable = React.forwardRef(function DataTable2(props, ref) {
   const selectable = !!props.selectable;
   const reorderable = props.reorderable !== false && !!props.columnControls;
   const controls = !!props.columnControls;
-  const sortState = useMaybeControlled(props.sort, props.defaultSort || null, props.onSortChange);
+  const oneCallback = !!props.onStateChange;
+  const sortState = useMaybeControlled(
+    props.sort,
+    props.defaultSort || null,
+    oneCallback ? null : props.onSortChange
+  );
   const sort = sortState[0], setSort = sortState[1];
   const selState = useMaybeControlled(props.selected, props.defaultSelected || [], props.onSelectionChange);
   const selected = selState[0], setSelected = selState[1];
-  const pageState = useMaybeControlled(props.page, props.defaultPage || 1, props.onPageChange);
+  const pageState = useMaybeControlled(
+    props.page,
+    props.defaultPage || 1,
+    oneCallback ? null : props.onPageChange
+  );
   const orderState = useMaybeControlled(
     props.columnOrder,
     columns.map(function(c) {
@@ -79,6 +89,7 @@ const DataTable = React.forwardRef(function DataTable2(props, ref) {
   const measure = !!props.stackBelow || columns.some(function(c) {
     return c.hideBelow != null;
   });
+  const dual = !!props.stackBelow && boxWidth[0] == null && STACK_WIDTHS.indexOf(props.stackBelow) >= 0;
   React.useEffect(
     function() {
       if (!measure || !wrapRef.current || typeof ResizeObserver === "undefined") return;
@@ -90,9 +101,15 @@ const DataTable = React.forwardRef(function DataTable2(props, ref) {
         ro.disconnect();
       };
     },
-    [measure]
+    [measure, dual]
   );
   const stacked = !!props.stackBelow && boxWidth[0] != null && boxWidth[0] < props.stackBelow;
+  useIsoLayoutEffect(
+    function() {
+      if (measure && boxWidth[0] == null && wrapRef.current) boxWidth[1](wrapRef.current.getBoundingClientRect().width);
+    },
+    [measure]
+  );
   function tooNarrow(c) {
     if (c.hideBelow == null || boxWidth[0] == null || stacked) return false;
     const px = typeof c.hideBelow === "number" ? c.hideBelow : BP[c.hideBelow];
@@ -200,11 +217,15 @@ const DataTable = React.forwardRef(function DataTable2(props, ref) {
   const pageRows = pageSize && !manual ? view.slice(first, first + pageSize) : view;
   const canSortAny = !busy && (manual ? total > 1 : rows.length > 1);
   const shownTotal = manual && props.totalRows == null ? first + rows.length : total;
-  const linkPaging = !!props.getPageHref && !props.onPageChange;
+  const linkPaging = !!props.getPageHref && !props.onPageChange && !oneCallback;
   const prevLink = React.useRef(null), nextLink = React.useRef(null);
-  function goPage(p, focus) {
+  function emit(s, p) {
+    if (props.onStateChange) props.onStateChange({ sort: s, page: p });
+  }
+  function goPage(p, focus, quiet) {
     const next = Math.min(Math.max(1, p), pageCount);
     if (next === page) return false;
+    if (!quiet) emit(sort, next);
     if (linkPaging) {
       const a = next === page - 1 ? prevLink.current : next === page + 1 ? nextLink.current : null;
       if (a) a.click();
@@ -216,8 +237,12 @@ const DataTable = React.forwardRef(function DataTable2(props, ref) {
     return true;
   }
   function sortBy(key) {
-    setSort(nextSort(key));
-    if (!(manual && linkPaging)) goPage(1);
+    applySort(nextSort(key));
+  }
+  function applySort(s) {
+    setSort(s);
+    if (!(manual && linkPaging)) goPage(1, void 0, true);
+    emit(s, 1);
   }
   const rowHref = props.getRowHref;
   function followRow(el, e) {
@@ -432,16 +457,14 @@ const DataTable = React.forwardRef(function DataTable2(props, ref) {
           label: t.sortAsc,
           icon: "arrow-up",
           onSelect: function() {
-            setSort({ key: c.key, dir: "asc" });
-            goPage(1);
+            applySort({ key: c.key, dir: "asc" });
           }
         },
         {
           label: t.sortDesc,
           icon: "arrow-down",
           onSelect: function() {
-            setSort({ key: c.key, dir: "desc" });
-            goPage(1);
+            applySort({ key: c.key, dir: "desc" });
           }
         },
         { separator: true }
@@ -878,9 +901,10 @@ const DataTable = React.forwardRef(function DataTable2(props, ref) {
           className: "aura-icon-btn",
           "aria-label": label,
           onClick: function(e) {
-            if (props.onPageChange) {
+            if (props.onPageChange || oneCallback) {
               e.preventDefault();
               pageState[1](p);
+              emit(sort, p);
             }
           }
         },
@@ -904,7 +928,7 @@ const DataTable = React.forwardRef(function DataTable2(props, ref) {
   } else if (height && rows.length && !loading) {
     foot = /* @__PURE__ */ React.createElement("div", { className: "aura-table__foot" }, /* @__PURE__ */ React.createElement("span", null, t.rowCount(shownTotal)), selectable && selected.length ? /* @__PURE__ */ React.createElement("span", null, t.selectedCount(selected.length)) : /* @__PURE__ */ React.createElement("span", null));
   }
-  if (stacked) {
+  function renderStacked(wrapRefArg) {
     const titleCol = vis[0], pillCol = vis.filter(function(c) {
       return c.pill && c !== titleCol;
     })[0];
@@ -968,7 +992,7 @@ const DataTable = React.forwardRef(function DataTable2(props, ref) {
     return /* @__PURE__ */ React.createElement(
       "div",
       {
-        ref: wrapMerged,
+        ref: wrapRefArg,
         "data-density": props.density,
         className: cx("aura-table aura-table--stacked", refreshing && "is-refreshing", props.className),
         role: "region",
@@ -989,15 +1013,16 @@ const DataTable = React.forwardRef(function DataTable2(props, ref) {
       foot
     );
   }
+  if (stacked) return renderStacked(wrapMerged);
   const scrollStyle = {
     scrollPaddingLeft: "calc(var(--aura-space-6)" + selW + " + " + acc + "px)",
     scrollPaddingTop: ROW_H + "px"
   };
   if (height) scrollStyle.height = height + "px";
-  return /* @__PURE__ */ React.createElement(
+  const gridEl = /* @__PURE__ */ React.createElement(
     "div",
     {
-      ref: wrapMerged,
+      ref: dual ? void 0 : wrapMerged,
       "data-density": props.density,
       className: cx("aura-table", scrolledX[0] && "is-scrolled-x", refreshing && "is-refreshing", props.className)
     },
@@ -1053,6 +1078,8 @@ const DataTable = React.forwardRef(function DataTable2(props, ref) {
       }
     ) : null
   );
+  if (!dual) return gridEl;
+  return /* @__PURE__ */ React.createElement("div", { ref: wrapMerged, className: "aura-table-dual", "data-stack-below": props.stackBelow }, renderStacked(void 0), gridEl);
 });
 export {
   DataTable

package/dist/esm/DatePicker.js

@@ -6,111 +6,21 @@ import { cx, uid, useMaybeControlled, useMounted, useIsoLayoutEffect, trapTab, u
 import { Icon } from "./Icon.js";
 import { IconButton } from "./IconButton.js";
 import { Field } from "./Field.js";
-const ERA = /^พ\.ศ\.\s?|\s?(BE|พ\.ศ\.)$/g;
-const pad = function(n) {
-  return (n < 10 ? "0" : "") + n;
-};
-function toISO(d) {
-  return d ? d.getFullYear() + "-" + pad(d.getMonth() + 1) + "-" + pad(d.getDate()) : null;
-}
-function fromISO(s) {
-  if (!s) return null;
-  const m = /^(\d{4})-(\d{2})-(\d{2})$/.exec(s);
-  return m ? new Date(+m[1], +m[2] - 1, +m[3]) : null;
-}
-function addDays(d, n) {
-  return new Date(d.getFullYear(), d.getMonth(), d.getDate() + n);
-}
-function addMonths(d, n) {
-  const t = new Date(d.getFullYear(), d.getMonth() + n, 1);
-  const last = new Date(t.getFullYear(), t.getMonth() + 1, 0).getDate();
-  return new Date(t.getFullYear(), t.getMonth(), Math.min(d.getDate(), last));
-}
-function same(a, b) {
-  return !!a && !!b && a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
-}
-const TAGS = { th: "th-TH", en: "en-GB", sv: "sv-SE" };
-function defaultCalendar(locale) {
-  return locale === "th" ? "buddhist" : "gregory";
-}
-function localeTag(locale, calendar) {
-  const cal = calendar || defaultCalendar(locale);
-  return (TAGS[locale || "en"] || "en-GB") + "-u-ca-" + (cal === "gregory" ? "gregory" : "buddhist");
-}
-const DATE_TEXT = {
-  th: {
-    prevYears: "\u0E0A\u0E48\u0E27\u0E07\u0E1B\u0E35\u0E01\u0E48\u0E2D\u0E19\u0E2B\u0E19\u0E49\u0E32",
-    nextYears: "\u0E0A\u0E48\u0E27\u0E07\u0E1B\u0E35\u0E16\u0E31\u0E14\u0E44\u0E1B",
-    prevMonth: "\u0E40\u0E14\u0E37\u0E2D\u0E19\u0E01\u0E48\u0E2D\u0E19\u0E2B\u0E19\u0E49\u0E32",
-    nextMonth: "\u0E40\u0E14\u0E37\u0E2D\u0E19\u0E16\u0E31\u0E14\u0E44\u0E1B",
-    today: "\u0E27\u0E31\u0E19\u0E19\u0E35\u0E49",
-    clear: "\u0E25\u0E49\u0E32\u0E07",
-    chooseDate: "\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E27\u0E31\u0E19\u0E17\u0E35\u0E48",
-    datePlaceholder: "\u0E27\u0E27/\u0E14\u0E14/\u0E1B\u0E1B\u0E1B\u0E1B",
-    clearDate: "\u0E25\u0E49\u0E32\u0E07\u0E27\u0E31\u0E19\u0E17\u0E35\u0E48",
-    openCalendar: "\u0E40\u0E1B\u0E34\u0E14\u0E1B\u0E0F\u0E34\u0E17\u0E34\u0E19",
-    chooseDates: "\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E0A\u0E48\u0E27\u0E07\u0E27\u0E31\u0E19\u0E17\u0E35\u0E48",
-    rangePlaceholder: "\u0E27\u0E27/\u0E14\u0E14/\u0E1B\u0E1B\u0E1B\u0E1B \u2013 \u0E27\u0E27/\u0E14\u0E14/\u0E1B\u0E1B\u0E1B\u0E1B",
-    clearDates: "\u0E25\u0E49\u0E32\u0E07\u0E0A\u0E48\u0E27\u0E07\u0E27\u0E31\u0E19\u0E17\u0E35\u0E48",
-    chooseStart: "\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E27\u0E31\u0E19\u0E40\u0E23\u0E34\u0E48\u0E21\u0E15\u0E49\u0E19",
-    chooseEnd: "\u0E40\u0E25\u0E37\u0E2D\u0E01\u0E27\u0E31\u0E19\u0E2A\u0E34\u0E49\u0E19\u0E2A\u0E38\u0E14"
-  },
-  en: {
-    prevYears: "Previous years",
-    nextYears: "Next years",
-    prevMonth: "Previous month",
-    nextMonth: "Next month",
-    today: "Today",
-    clear: "Clear",
-    chooseDate: "Choose date",
-    datePlaceholder: "DD/MM/YYYY",
-    clearDate: "Clear date",
-    openCalendar: "Open calendar",
-    chooseDates: "Choose dates",
-    rangePlaceholder: "DD/MM/YYYY \u2013 DD/MM/YYYY",
-    clearDates: "Clear dates",
-    chooseStart: "Choose the start date",
-    chooseEnd: "Choose the end date"
-  },
-  sv: {
-    prevYears: "Tidigare \xE5r",
-    nextYears: "Senare \xE5r",
-    prevMonth: "F\xF6reg\xE5ende m\xE5nad",
-    nextMonth: "N\xE4sta m\xE5nad",
-    today: "Idag",
-    clear: "Rensa",
-    chooseDate: "V\xE4lj datum",
-    datePlaceholder: "\xE5\xE5\xE5\xE5-mm-dd",
-    clearDate: "Rensa datum",
-    openCalendar: "\xD6ppna kalendern",
-    chooseDates: "V\xE4lj datum",
-    rangePlaceholder: "\xE5\xE5\xE5\xE5-mm-dd \u2013 \xE5\xE5\xE5\xE5-mm-dd",
-    clearDates: "Rensa datumen",
-    chooseStart: "V\xE4lj startdatum",
-    chooseEnd: "V\xE4lj slutdatum"
-  }
-};
-function dateText(locale) {
-  return DATE_TEXT[locale || "en"] || DATE_TEXT.en;
-}
-const fmtCache = {};
-const PRESETS = {
-  short: { day: "numeric", month: "short", year: "numeric" },
-  long: { day: "numeric", month: "long", year: "numeric" },
-  numeric: { day: "2-digit", month: "2-digit", year: "numeric" }
-};
-function fmt(tag, opts, d) {
-  const k = tag + JSON.stringify(opts);
-  if (!fmtCache[k]) fmtCache[k] = new Intl.DateTimeFormat(tag, opts);
-  return fmtCache[k].format(d);
-}
-function formatDate(iso, opts) {
-  const o = opts || {}, d = fromISO(iso);
-  if (!d) return "";
-  const f = typeof o.format === "object" ? o.format : PRESETS[o.format || "short"];
-  const loc = o.locale || "th";
-  return fmt(localeTag(loc, o.calendar || defaultCalendar(loc)), f, d).replace(ERA, "");
-}
+import {
+  ERA,
+  addDays,
+  addMonths,
+  dateText,
+  defaultCalendar,
+  fmt,
+  formatDate,
+  fromISO,
+  localeTag,
+  parseDate,
+  same,
+  toISO
+} from "./dates.js";
+import { formatDate as formatDate2, parseDate as parseDate2 } from "./dates.js";
 function useFormatDate() {
   const ctx = useAuraLocale(), locale = ctx.locale || "en", calendar = ctx.calendar;
   return React.useCallback(
@@ -127,43 +37,6 @@ function useFormatDate() {
     [locale, calendar]
   );
 }
-let MONTHS = null;
-function monthIndex(word) {
-  if (!MONTHS) {
-    MONTHS = {};
-    ["th-TH", "en-GB", "sv-SE"].forEach(function(tag) {
-      ["short", "long"].forEach(function(w) {
-        for (let i = 0; i < 12; i++) {
-          const n = new Intl.DateTimeFormat(tag, { month: w }).format(new Date(2020, i, 1)).toLowerCase().replace(/\.$/, "");
-          MONTHS[n] = i;
-          if (/^[a-zåäö]/.test(n)) MONTHS[n.slice(0, 3)] = i;
-        }
-      });
-    });
-  }
-  const k = word.toLowerCase().replace(/\.$/, "");
-  return MONTHS[k] != null ? MONTHS[k] : -1;
-}
-function parseDate(text) {
-  const s = String(text || "").trim();
-  let m = /^(\d{4})-(\d{1,2})-(\d{1,2})$/.exec(s), y, mo, d;
-  if (m) {
-    y = +m[1];
-    mo = +m[2];
-    d = +m[3];
-  } else if (m = /^(\d{1,2})[\/.\-](\d{1,2})[\/.\-](\d{4})$/.exec(s)) {
-    d = +m[1];
-    mo = +m[2];
-    y = +m[3];
-  } else if ((m = /^(\d{1,2})\s+(\S+)\s+(\d{4})$/.exec(s.replace(ERA, "").trim())) && monthIndex(m[2]) >= 0) {
-    d = +m[1];
-    mo = monthIndex(m[2]) + 1;
-    y = +m[3];
-  } else return null;
-  if (y >= 2400) y -= 543;
-  const dt = new Date(y, mo - 1, d);
-  return dt.getMonth() === mo - 1 && dt.getDate() === d ? toISO(dt) : null;
-}
 const Calendar = React.forwardRef(function Calendar2(props, ref) {
   const ctx = useAuraLocale(), locale = props.locale || ctx.locale || "en", calendar = props.calendar || ctx.calendar || defaultCalendar(locale), tag = localeTag(locale, calendar);
   const weekStart = props.weekStartsOn == null ? locale === "sv" ? 1 : 0 : props.weekStartsOn;
@@ -721,9 +594,7 @@ export {
   Calendar,
   DatePicker,
   DateRangePicker,
-  formatDate,
-  fromISO,
-  parseDate,
-  toISO,
+  formatDate2 as formatDate,
+  parseDate2 as parseDate,
   useFormatDate
 };

package/dist/esm/FileUpload.js

@@ -5,16 +5,7 @@ import { useStrings } from "./locale.js";
 import { Icon } from "./Icon.js";
 import { IconButton } from "./IconButton.js";
 import { Field } from "./Field.js";
-function formatBytes(n) {
-  if (n == null) return "";
-  if (n < 1024) return n + " B";
-  let u = ["KB", "MB", "GB"], i = -1;
-  do {
-    n /= 1024;
-    i++;
-  } while (n >= 1024 && i < u.length - 1);
-  return (n >= 10 || Math.round(n) === n ? Math.round(n) : n.toFixed(1)) + " " + u[i];
-}
+import { formatBytes } from "./text.js";
 function matches(file, accept) {
   if (!accept) return true;
   const name = (file.name || "").toLowerCase(), type = (file.type || "").toLowerCase();