@wrdagency/blockout 0.0.18 → 0.1.0

package/dist/components/controls/base-control/index.js

@@ -1,33 +1,33 @@
 import { jsxs as e, jsx as o } from "react/jsx-runtime";
 import { cn as h } from "../../../utils/css.js";
 import "react";
-import { Affix as t } from "./affix.js";
+import { Affix as r } from "./affix.js";
 import '../../../assets/index3.css';const C = ({
   as: n = "div",
-  label: r,
+  label: c,
   className: a,
-  id: c,
-  help: l,
+  id: l,
+  help: s,
   children: m,
   prefix: i,
   suffix: d,
   required: p
 }) => {
   const _ = n, b = n === "fieldset" ? "legend" : "label", f = () => {
-    var s;
-    (s = document.getElementById(c)) == null || s.focus();
+    var t;
+    (t = document.getElementById(l)) == null || t.focus();
   };
   return /* @__PURE__ */ e(_, { className: h("component-base-control", a), children: [
-    /* @__PURE__ */ e(b, { className: "component-base-control__label", htmlFor: c, children: [
-      r,
+    c && /* @__PURE__ */ e(b, { className: "component-base-control__label", htmlFor: l, children: [
+      c,
       p && /* @__PURE__ */ o("span", { className: "component-base-control__label__required", children: "*" })
     ] }),
     /* @__PURE__ */ e("div", { className: "component-base-control__box", onClick: f, children: [
-      /* @__PURE__ */ o(t, { children: i }),
+      /* @__PURE__ */ o(r, { children: i }),
       /* @__PURE__ */ o("div", { className: "component-base-control__control", children: m }),
-      /* @__PURE__ */ o(t, { suffix: !0, children: d })
+      /* @__PURE__ */ o(r, { suffix: !0, children: d })
     ] }),
-    l && /* @__PURE__ */ o("div", { className: "component-base-control__help", children: l })
+    s && /* @__PURE__ */ o("div", { className: "component-base-control__help", children: s })
   ] });
 };
 export {

package/dist/components/controls/base-popover-control/index.d.ts

@@ -0,0 +1,9 @@
+import { FC, InputHTMLAttributes, ReactNode } from 'react';
+import { CommonProps } from '../base-control/props';
+interface BasePopoverControlProps extends CommonProps {
+    children: ReactNode;
+    placeholder: ReactNode;
+    inputProps: Omit<InputHTMLAttributes<HTMLInputElement>, "type">;
+}
+export declare const BasePopoverControl: FC<BasePopoverControlProps>;
+export {};

package/dist/components/controls/base-popover-control/index.js

@@ -0,0 +1,47 @@
+import { jsx as o, jsxs as t } from "react/jsx-runtime";
+import "react";
+import '../../../assets/styles.css';import '../../../assets/style3.css';import '../../../assets/style2.css';import '../../../assets/index16.css';/* empty css                      */
+/* empty css                      */
+import { Truncate as a } from "../../../primitives/truncate/index.js";
+/* empty css                       */
+import { e as c } from "../../../CaretDown.es-eySGHzTJ.js";
+import { BaseControl as i } from "../base-control/index.js";
+import { useBaseControlProps as l } from "../base-control/props.js";
+import { u as m, P as v, a as d } from "../../../WMYDSCNQ-DECXdiUT.js";
+import { a as u } from "../../../MTZPJQMC-DyCWBG18.js";
+function P(r = {}) {
+  const e = m(r);
+  return /* @__PURE__ */ o(u, { value: e, children: r.children });
+}
+const y = (r) => {
+  const { baseProps: e, controlProps: p } = l(r, {
+    className: "component-base-popover-control"
+  }), { placeholder: n, children: s } = p;
+  return /* @__PURE__ */ t(i, { ...e, children: [
+    /* @__PURE__ */ o("input", { ...p.inputProps, id: p.id, type: "hidden" }),
+    /* @__PURE__ */ t(P, { children: [
+      /* @__PURE__ */ t(v, { className: "component-base-popover-control__input", children: [
+        /* @__PURE__ */ o(a, { className: "component-base-popover-control__value", children: n }),
+        /* @__PURE__ */ o("div", { className: "component-base-popover-control__caret", children: /* @__PURE__ */ o(c, {}) })
+      ] }),
+      /* @__PURE__ */ o(
+        d,
+        {
+          className: "component-base-popover-control__popover",
+          "data-colour-scheme": "invert",
+          wrapperProps: {
+            className: "component-base-popover-control__popover__wrapper"
+          },
+          fitViewport: !0,
+          gutter: 8,
+          overflowPadding: 4,
+          portal: !0,
+          children: s
+        }
+      )
+    ] })
+  ] });
+};
+export {
+  y as BasePopoverControl
+};

package/dist/components/controls/checkbox-control/index.d.ts

@@ -0,0 +1,8 @@
+import { InputHTMLAttributes } from 'react';
+import { ControlFC } from '../base-control/props';
+interface CheckboxControlProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "value" | "checked"> {
+    value?: boolean;
+    onChangeValue?: (value: boolean) => void;
+}
+export declare const CheckboxControl: ControlFC<CheckboxControlProps>;
+export {};

package/dist/components/controls/checkbox-control/index.js

@@ -0,0 +1,57 @@
+import { jsxs as r, jsx as o } from "react/jsx-runtime";
+import { cn as N } from "../../../utils/css.js";
+import { noop as t } from "../../../utils/noop.js";
+import "react";
+import '../../../assets/style4.css';import '../../../assets/style3.css';import '../../../assets/style2.css';import '../../../assets/index4.css';/* empty css                      */
+/* empty css                      */
+/* empty css                      */
+import { VisuallyHidden as g } from "../../../primitives/visually-hidden/index.js";
+import { r as C, a as P } from "../../../Square.es-KJLdY11q.js";
+import { Affix as l } from "../base-control/affix.js";
+import { useBaseControlProps as j } from "../base-control/props.js";
+const q = (s) => {
+  const { baseProps: a, controlProps: m } = j(s, {
+    className: "component-checkbox-control"
+  }), { id: i, label: p, prefix: h, suffix: x, help: e, className: d } = a, {
+    value: c = !1,
+    onChange: f = t,
+    onChangeValue: b = t,
+    ...u
+  } = m, k = (n) => {
+    b(n.currentTarget.checked), f(n);
+  }, _ = c ? C : P;
+  return /* @__PURE__ */ r(
+    "div",
+    {
+      className: N(d, c && "component-checkbox-control--checked"),
+      children: [
+        /* @__PURE__ */ o(g, { children: /* @__PURE__ */ o(
+          "input",
+          {
+            className: "component-checkbox-control__input",
+            type: "checkbox",
+            checked: c,
+            onChange: k,
+            ...u
+          }
+        ) }),
+        /* @__PURE__ */ r("label", { className: "component-checkbox-control__label", htmlFor: i, children: [
+          /* @__PURE__ */ o(
+            _,
+            {
+              className: "component-checkbox-control__icon",
+              weight: c ? "fill" : "regular"
+            }
+          ),
+          /* @__PURE__ */ o(l, { children: h }),
+          /* @__PURE__ */ o("span", { className: "component-checkbox-control__text", children: p }),
+          /* @__PURE__ */ o(l, { suffix: !0, children: x })
+        ] }),
+        e && /* @__PURE__ */ o("div", { className: "component-checkbox-control__help", children: e })
+      ]
+    }
+  );
+};
+export {
+  q as CheckboxControl
+};

package/dist/components/controls/choice-control/choice.js

@@ -1,22 +1,24 @@
 import { jsx as c, jsxs as n } from "react/jsx-runtime";
-import { cn as m } from "../../../utils/css.js";
+import { cn as h } from "../../../utils/css.js";
 import { useId as s } from "react";
-import '../../../assets/style.css';/* empty css                      */
+import '../../../assets/style4.css';import '../../../assets/style3.css';import '../../../assets/style2.css';/* empty css                      */
+/* empty css                      */
+/* empty css                      */
 import { VisuallyHidden as a } from "../../../primitives/visually-hidden/index.js";
-const x = ({
+const v = ({
   value: t,
-  label: l,
+  label: r,
   description: o,
-  disabled: r,
+  disabled: l,
   multiple: e = !1,
   className: _,
-  ...h
+  ...m
 }) => {
   const i = s();
   return /* @__PURE__ */ c(
     "label",
     {
-      className: m(
+      className: h(
         "component-choice-control__choice",
         `component-choice-control__choice--${e ? "multiple" : "single"}`,
         _
@@ -26,12 +28,12 @@ const x = ({
         /* @__PURE__ */ c(a, { children: /* @__PURE__ */ c(
           "input",
           {
-            ...h,
+            ...m,
             className: "component-choice-control__choice__input",
             id: i,
             type: e ? "checkbox" : "radio",
             value: t,
-            disabled: r
+            disabled: l
           }
         ) }),
         /* @__PURE__ */ c(
@@ -42,7 +44,7 @@ const x = ({
           }
         ),
         /* @__PURE__ */ n("div", { className: "component-choice-control__choice__text", children: [
-          /* @__PURE__ */ c("div", { className: "component-choice-control__choice__label", children: l }),
+          /* @__PURE__ */ c("div", { className: "component-choice-control__choice__label", children: r }),
           o && /* @__PURE__ */ c("p", { className: "component-choice-control__choice__description", children: o })
         ] })
       ] })
@@ -50,5 +52,5 @@ const x = ({
   );
 };
 export {
-  x as Choice
+  v as Choice
 };

package/dist/components/controls/choice-control/index.js

@@ -5,7 +5,7 @@ import "react";
 import { BaseControl as g } from "../base-control/index.js";
 import { useBaseControlProps as v } from "../base-control/props.js";
 import { Choice as P } from "./choice.js";
-import '../../../assets/index4.css';const _ = (l) => {
+import '../../../assets/index5.css';const _ = (l) => {
   const { baseProps: a, controlProps: s } = v(l, {
     className: "component-choice-control"
   }), {

package/dist/components/controls/index.d.ts

@@ -1,8 +1,11 @@
 export { BaseControl } from './base-control';
+export { CheckboxControl } from './checkbox-control';
 export { ChoiceControl } from './choice-control';
 export { NumberControl } from './number-control';
 export { PasswordControl } from './password-control';
-export { SelectControl } from './select-control';
+export { RecurrenceControl } from './recurrence-control';
+export { Options, SelectControl } from './select-control';
 export { TextControl } from './text-control';
 export { TextareaControl } from './textarea-control';
 export { ToggleControl } from './toggle-control';
+export { ToggleGroupControl } from './toggle-group-control';

package/dist/components/controls/index.js

@@ -1,18 +1,27 @@
-import { BaseControl as t } from "./base-control/index.js";
-import { ChoiceControl as l } from "./choice-control/index.js";
-import { NumberControl as m } from "./number-control/index.js";
-import { PasswordControl as f } from "./password-control/index.js";
-import { SelectControl as p } from "./select-control/index.js";
-import { TextControl as s } from "./text-control/index.js";
-import { TextareaControl as c } from "./textarea-control/index.js";
-import { ToggleControl as b } from "./toggle-control/index.js";
+import { BaseControl as e } from "./base-control/index.js";
+import { CheckboxControl as x } from "./checkbox-control/index.js";
+import { ChoiceControl as m } from "./choice-control/index.js";
+import { NumberControl as C } from "./number-control/index.js";
+import { PasswordControl as a } from "./password-control/index.js";
+import { RecurrenceControl as s } from "./recurrence-control/index.js";
+import '../../assets/style.css';/* empty css                   */
+import { SelectControl as T } from "./select-control/component.js";
+import { o as u } from "../../options-Cfoqhxw2.js";
+import { TextControl as h } from "./text-control/index.js";
+import { TextareaControl as k } from "./textarea-control/index.js";
+import { ToggleControl as B } from "./toggle-control/index.js";
+import { ToggleGroupControl as N } from "./toggle-group-control/index.js";
 export {
-  t as BaseControl,
-  l as ChoiceControl,
-  m as NumberControl,
-  f as PasswordControl,
-  p as SelectControl,
-  s as TextControl,
-  c as TextareaControl,
-  b as ToggleControl
+  e as BaseControl,
+  x as CheckboxControl,
+  m as ChoiceControl,
+  C as NumberControl,
+  u as Options,
+  a as PasswordControl,
+  s as RecurrenceControl,
+  T as SelectControl,
+  h as TextControl,
+  k as TextareaControl,
+  B as ToggleControl,
+  N as ToggleGroupControl
 };

package/dist/components/controls/number-control/index.js

@@ -1,13 +1,13 @@
-import { jsxs as s, Fragment as f, jsx as n } from "react/jsx-runtime";
-import { noop as u } from "../../../utils/noop.js";
-import { e as d } from "../../../CaretDown.es-eySGHzTJ.js";
+import { jsxs as l, Fragment as p, jsx as n } from "react/jsx-runtime";
+import { noop as c } from "../../../utils/noop.js";
+import { e as f } from "../../../CaretDown.es-eySGHzTJ.js";
 import { r as h } from "../../../CaretUp.es-Cy8czlHG.js";
 import { useRef as x } from "react";
 import { BaseControl as C } from "../base-control/index.js";
 import { Affix as _ } from "../base-control/affix.js";
 import { useBaseControlProps as g } from "../base-control/props.js";
-import '../../../assets/index5.css';const T = (r) => {
-  const e = x(null), i = () => /* @__PURE__ */ s("div", { className: "component-number-control__spinbox", children: [
+import '../../../assets/index6.css';const T = (o) => {
+  const r = x(null), s = () => /* @__PURE__ */ l("div", { className: "component-number-control__spinbox", children: [
     /* @__PURE__ */ n(
       "button",
       {
@@ -15,9 +15,10 @@ import '../../../assets/index5.css';const T = (r) => {
         className: "component-number-control__spinbox__button",
         "aria-label": "Increment",
         role: "spinbutton",
-        "aria-controls": r.id,
-        onClick: () => c(1),
+        "aria-controls": o.id,
+        onClick: () => i(1),
         tabIndex: -1,
+        disabled: o.disabled,
         children: /* @__PURE__ */ n(h, {})
       }
     ),
@@ -28,38 +29,39 @@ import '../../../assets/index5.css';const T = (r) => {
         className: "component-number-control__spinbox__button",
         "aria-label": "Decrement",
         role: "spinbutton",
-        "aria-controls": r.id,
-        onClick: () => c(-1),
+        "aria-controls": o.id,
+        onClick: () => i(-1),
         tabIndex: -1,
-        children: /* @__PURE__ */ n(d, {})
+        disabled: o.disabled,
+        children: /* @__PURE__ */ n(f, {})
       }
     )
-  ] }), c = (o) => {
-    e.current && (o > 0 ? e.current.stepUp(o) : e.current.stepDown(o * -1), t(Number(e.current.value)), e.current.focus());
-  }, { baseProps: l, controlProps: m } = g(r, {
+  ] }), i = (e) => {
+    r.current && (e > 0 ? r.current.stepUp(e) : r.current.stepDown(e * -1), t(Number(r.current.value)), r.current.focus());
+  }, { baseProps: a, controlProps: u } = g(o, {
     className: "component-number-control",
-    suffix: /* @__PURE__ */ s(f, { children: [
-      /* @__PURE__ */ n(_, { suffix: !0, children: r.suffix }),
-      /* @__PURE__ */ n(i, {})
+    suffix: /* @__PURE__ */ l(p, { children: [
+      /* @__PURE__ */ n(_, { suffix: !0, children: o.suffix }),
+      /* @__PURE__ */ n(s, {})
     ] })
   }), {
-    onChangeValue: t = u,
-    onChange: a = u,
-    value: p = "",
-    ...b
-  } = m;
-  return /* @__PURE__ */ n(C, { ...l, children: /* @__PURE__ */ n(
+    onChangeValue: t = c,
+    onChange: m = c,
+    value: b = "",
+    ...d
+  } = u;
+  return /* @__PURE__ */ n(C, { ...a, children: /* @__PURE__ */ n(
     "input",
     {
       className: "component-number-control__input",
       type: "number",
       inputMode: "numeric",
-      ref: e,
-      onChange: (o) => {
-        o.currentTarget.value === "" ? t(void 0) : t(Number(o.currentTarget.value)), a(o);
+      ref: r,
+      onChange: (e) => {
+        e.currentTarget.value === "" ? t(void 0) : t(Number(e.currentTarget.value)), m(e);
       },
-      value: p,
-      ...b
+      value: b,
+      ...d
     }
   ) });
 };

package/dist/components/controls/password-control/index.js

@@ -5,7 +5,7 @@ import { useState as E, useRef as g } from "react";
 import { w as o } from "../../../SSRBase.es-BUXS72ra.js";
 import { BaseControl as f } from "../base-control/index.js";
 import { useBaseControlProps as M } from "../base-control/props.js";
-import '../../../assets/index11.css';const L = /* @__PURE__ */ new Map([
+import '../../../assets/index18.css';const L = /* @__PURE__ */ new Map([
   [
     "bold",
     /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M251,123.13c-.37-.81-9.13-20.26-28.48-39.61C196.63,57.67,164,44,128,44S59.37,57.67,33.51,83.52C14.16,102.87,5.4,122.32,5,123.13a12.08,12.08,0,0,0,0,9.75c.37.82,9.13,20.26,28.49,39.61C59.37,198.34,92,212,128,212s68.63-13.66,94.48-39.51c19.36-19.35,28.12-38.79,28.49-39.61A12.08,12.08,0,0,0,251,123.13Zm-46.06,33C183.47,177.27,157.59,188,128,188s-55.47-10.73-76.91-31.88A130.36,130.36,0,0,1,29.52,128,130.45,130.45,0,0,1,51.09,99.89C72.54,78.73,98.41,68,128,68s55.46,10.73,76.91,31.89A130.36,130.36,0,0,1,226.48,128,130.45,130.45,0,0,1,204.91,156.12ZM128,84a44,44,0,1,0,44,44A44.05,44.05,0,0,0,128,84Zm0,64a20,20,0,1,1,20-20A20,20,0,0,1,128,148Z" }))

package/dist/components/controls/recurrence-control/index.d.ts

@@ -0,0 +1,8 @@
+import { ControlFC } from '../base-control/props';
+interface RecurrenceControlProps {
+    value?: string;
+    defaultValue?: string;
+    onChangeValue?: (value: string) => void;
+}
+export declare const RecurrenceControl: ControlFC<RecurrenceControlProps>;
+export {};

package/dist/components/controls/recurrence-control/index.js

@@ -0,0 +1,208 @@
+import { jsxs as m, jsx as r, Fragment as M } from "react/jsx-runtime";
+import { useObjectState as b } from "../../../hooks/state.js";
+import { Weekday as y, Frequency as p, createRRule as v } from "../../../types/date.js";
+import { getOrdinalSuffix as d } from "../../../utils/date.js";
+import { noop as w } from "../../../utils/noop.js";
+import * as e from "react";
+import { useMemo as F } from "react";
+import { w as A } from "../../../SSRBase.es-BUXS72ra.js";
+import { useBaseControlProps as C } from "../base-control/props.js";
+import { BasePopoverControl as k } from "../base-popover-control/index.js";
+import { NumberControl as h } from "../number-control/index.js";
+import '../../../assets/style.css';import '../../../assets/index19.css';/* empty css                      */
+import { SelectControl as s } from "../select-control/component.js";
+import { f as q, w as S, a as B } from "../../../options-Cfoqhxw2.js";
+import { ToggleGroupControl as x } from "../toggle-group-control/index.js";
+const P = /* @__PURE__ */ new Map([
+  [
+    "bold",
+    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M128,20A108,108,0,1,0,236,128,108.12,108.12,0,0,0,128,20Zm0,192a84,84,0,1,1,84-84A84.09,84.09,0,0,1,128,212Z" }))
+  ],
+  [
+    "duotone",
+    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M224,128a96,96,0,1,1-96-96A96,96,0,0,1,224,128Z", opacity: "0.2" }), /* @__PURE__ */ e.createElement("path", { d: "M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm0,192a88,88,0,1,1,88-88A88.1,88.1,0,0,1,128,216Z" }))
+  ],
+  [
+    "fill",
+    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M232,128A104,104,0,1,1,128,24,104.13,104.13,0,0,1,232,128Z" }))
+  ],
+  [
+    "light",
+    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M128,26A102,102,0,1,0,230,128,102.12,102.12,0,0,0,128,26Zm0,192a90,90,0,1,1,90-90A90.1,90.1,0,0,1,128,218Z" }))
+  ],
+  [
+    "regular",
+    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm0,192a88,88,0,1,1,88-88A88.1,88.1,0,0,1,128,216Z" }))
+  ],
+  [
+    "thin",
+    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M128,28A100,100,0,1,0,228,128,100.11,100.11,0,0,0,128,28Zm0,192a92,92,0,1,1,92-92A92.1,92.1,0,0,1,128,220Z" }))
+  ]
+]), Z = e.forwardRef((o, n) => /* @__PURE__ */ e.createElement(A, { ref: n, ...o, weights: P }));
+Z.displayName = "CircleIcon";
+const _ = /* @__PURE__ */ new Map([
+  [
+    "bold",
+    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M128,20A108,108,0,1,0,236,128,108.12,108.12,0,0,0,128,20Zm0,192a84,84,0,1,1,84-84A84.09,84.09,0,0,1,128,212Zm0-140a56,56,0,1,0,56,56A56.06,56.06,0,0,0,128,72Zm0,88a32,32,0,1,1,32-32A32,32,0,0,1,128,160Z" }))
+  ],
+  [
+    "duotone",
+    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M176,128a48,48,0,1,1-48-48A48,48,0,0,1,176,128Z", opacity: "0.2" }), /* @__PURE__ */ e.createElement("path", { d: "M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm0,192a88,88,0,1,1,88-88A88.1,88.1,0,0,1,128,216Zm0-144a56,56,0,1,0,56,56A56.06,56.06,0,0,0,128,72Zm0,96a40,40,0,1,1,40-40A40,40,0,0,1,128,168Z" }))
+  ],
+  [
+    "fill",
+    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm0,192a88,88,0,1,1,88-88A88.1,88.1,0,0,1,128,216Zm56-88a56,56,0,1,1-56-56A56.06,56.06,0,0,1,184,128Z" }))
+  ],
+  [
+    "light",
+    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M128,26A102,102,0,1,0,230,128,102.12,102.12,0,0,0,128,26Zm0,192a90,90,0,1,1,90-90A90.1,90.1,0,0,1,128,218Zm0-144a54,54,0,1,0,54,54A54.06,54.06,0,0,0,128,74Zm0,96a42,42,0,1,1,42-42A42,42,0,0,1,128,170Z" }))
+  ],
+  [
+    "regular",
+    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm0,192a88,88,0,1,1,88-88A88.1,88.1,0,0,1,128,216Zm0-144a56,56,0,1,0,56,56A56.06,56.06,0,0,0,128,72Zm0,96a40,40,0,1,1,40-40A40,40,0,0,1,128,168Z" }))
+  ],
+  [
+    "thin",
+    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M128,28A100,100,0,1,0,228,128,100.11,100.11,0,0,0,128,28Zm0,192a92,92,0,1,1,92-92A92.1,92.1,0,0,1,128,220Zm0-144a52,52,0,1,0,52,52A52.06,52.06,0,0,0,128,76Zm0,96a44,44,0,1,1,44-44A44.05,44.05,0,0,1,128,172Z" }))
+  ]
+]), g = e.forwardRef((o, n) => /* @__PURE__ */ e.createElement(A, { ref: n, ...o, weights: _ }));
+g.displayName = "RadioButtonIcon";
+const J = (o) => {
+  const { baseProps: n, controlProps: u } = C(o, {
+    className: "component-recurrence-control"
+  }), { onChangeValue: c = w, ...i } = u, [t, l] = b({
+    interval: 1,
+    frequency: p.Weekly,
+    frequencySubtype: "byweekday",
+    weeklyByWeekday: [y.Monday],
+    monthlyByMonthDay: 1,
+    monthlySetPos: "first",
+    monthlyByWeekday: y.Monday
+  }), E = F(() => v(t).toText(), [t]);
+  return /* @__PURE__ */ m(
+    k,
+    {
+      ...n,
+      placeholder: E,
+      inputProps: i,
+      children: [
+        /* @__PURE__ */ m("div", { className: "component-recurrence-control__row", children: [
+          /* @__PURE__ */ r(
+            h,
+            {
+              value: t.interval,
+              onChangeValue: (a) => l({ interval: a || 1 }),
+              suffix: d(t.interval),
+              min: 1,
+              "aria-label": "Recurrence frequency"
+            }
+          ),
+          /* @__PURE__ */ r(
+            s,
+            {
+              "aria-label": "Recurrence period",
+              value: t.frequency,
+              onChangeValue: (a) => l({ frequency: a }),
+              options: q
+            }
+          )
+        ] }),
+        t.frequency === p.Weekly && /* @__PURE__ */ r("div", { style: { marginTop: "1rem" }, children: /* @__PURE__ */ r(
+          x,
+          {
+            value: t.weeklyByWeekday,
+            onChangeValue: (a) => l({ weeklyByWeekday: a }),
+            label: "On every",
+            options: S,
+            multiple: !0
+          }
+        ) }),
+        t.frequency === p.Monthly && /* @__PURE__ */ m(M, { children: [
+          /* @__PURE__ */ r(
+            f,
+            {
+              type: "bymonthday",
+              parsed: t,
+              setParsed: l,
+              children: /* @__PURE__ */ r(
+                h,
+                {
+                  prefix: "On the",
+                  suffix: d(t.monthlyByMonthDay) + " of the month",
+                  value: t.monthlyByMonthDay,
+                  onChangeValue: (a) => l({ monthlyByMonthDay: a || 1 }),
+                  min: 1,
+                  max: 31
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ m(f, { type: "byweekday", parsed: t, setParsed: l, children: [
+            /* @__PURE__ */ r(
+              s,
+              {
+                prefix: "On the",
+                options: [
+                  {
+                    value: "first",
+                    label: "First"
+                  },
+                  {
+                    value: "second",
+                    label: "Second"
+                  },
+                  {
+                    value: "third",
+                    label: "Third"
+                  },
+                  {
+                    value: "fourth",
+                    label: "Fourth"
+                  },
+                  {
+                    value: "last",
+                    label: "Last"
+                  }
+                ],
+                value: t.monthlySetPos,
+                onChangeValue: (a) => l({ monthlySetPos: a })
+              }
+            ),
+            /* @__PURE__ */ r(
+              s,
+              {
+                options: B,
+                value: t.monthlyByWeekday,
+                onChangeValue: (a) => l({ monthlyByWeekday: a })
+              }
+            )
+          ] })
+        ] })
+      ]
+    }
+  );
+}, f = (o) => {
+  const { type: n, children: u, parsed: c, setParsed: i } = o;
+  return /* @__PURE__ */ m("div", { className: "component-recurrence-control__frequency_type", children: [
+    /* @__PURE__ */ r(
+      "button",
+      {
+        className: "component-recurrence-control__radio",
+        "aria-pressed": c.frequencySubtype === n,
+        onClick: () => i({ frequencySubtype: n }),
+        children: c.frequencySubtype === n ? /* @__PURE__ */ r(g, { weight: "fill" }) : /* @__PURE__ */ r(Z, {})
+      }
+    ),
+    /* @__PURE__ */ r(
+      "fieldset",
+      {
+        className: "component-recurrence-control__row",
+        disabled: c.frequencySubtype !== n,
+        children: u
+      }
+    )
+  ] });
+};
+export {
+  J as RecurrenceControl
+};

package/dist/components/controls/select-control/component.d.ts

@@ -0,0 +1,12 @@
+import { Optionable } from '../../../types/options';
+import { ControlProps } from '../base-control/props';
+import * as Ariakit from "@ariakit/react";
+interface SelectControlProps<T extends string = string> extends Ariakit.SelectOptions {
+    value?: T;
+    onChangeValue?: (value: T) => void;
+    options?: Optionable<T>[];
+    searchable?: boolean;
+    placeholder?: string;
+}
+export declare function SelectControl<T extends string = string>(props: ControlProps<SelectControlProps<T>>): import("react/jsx-runtime").JSX.Element;
+export {};