@prokodo/ui 0.0.4 → 0.0.6

package/dist/components/DatePicker-BTenaDN8.js

@@ -0,0 +1 @@
+"use strict";const F=require("./jsx-runtime-CITbqOLs.js"),y=require("dayjs"),m=require("react"),G=require("./Input-BEO9ig1R.js"),E=({name:s,value:i,onChange:t,onValidate:u,label:I,errorText:S,helperText:k,format:Y="YYYY-MM-DD",minDate:w,maxDate:P,errorTranslations:c,...$})=>{const A=m.useRef(null),R=f=>{if(!f)return null;if(y.isDayjs(f))return f;const v=y(f);return v.isValid()?v:null},x=R(w),e=R(P),[b,D]=m.useState(null),[B,p]=m.useState(S);m.useEffect(()=>{if(!i){D(null),p(void 0),u==null||u(s,void 0);return}if(y.isDayjs(i))D(i),p(void 0),u==null||u(s,void 0);else{const f=R(i);if(f)D(f),p(void 0),u==null||u(s,void 0);else{const v="Invalid initial date.";D(null),p(v),u==null||u(s,v)}}},[i]);const N=f=>{if(x&&f.isBefore(x,"day"))return x.isSame(y(),"day")?(c==null?void 0:c.minDate)??"Date cannot be in the past.":(c==null?void 0:c.minDate)??`Date cannot be before ${x.format(Y)}.`;if(e&&f.isAfter(e,"day"))return e.isSame(y(),"day")?(c==null?void 0:c.maxDate)??"Date cannot be in the future.":(c==null?void 0:c.maxDate)??`Date cannot be after ${e.format(Y)}.`},z=f=>{const v=f.target.value.trim();if(!v){D(null),p(void 0),u==null||u(s,void 0),t==null||t(null);return}const j=y(v,Y,!0);if(!j.isValid()){const q="Invalid date format.";D(null),p(q),u==null||u(s,q),t==null||t(null);return}const M=N(j);if(M!==void 0){D(null),p(M),u==null||u(s,M),t==null||t(null);return}D(j),p(void 0),u==null||u(s,void 0),t==null||t(j)};return F.jsxRuntimeExports.jsx(G.Input,{...$,ref:A,"aria-haspopup":"dialog",errorText:B,helperText:k,id:s,label:I,maxRows:void 0,minRows:void 0,multiline:!1,name:s,rows:void 0,type:"date",value:b?y(b).format("YYYY-MM-DD"):"",onChange:z})};E.displayName="DatePicker";exports.DatePicker=E;

package/dist/components/DatePicker-PK173UTy.js

@@ -0,0 +1,93 @@
+import { j as G } from "./jsx-runtime-C5mzlN2N.js";
+import y, { isDayjs as I } from "dayjs";
+import { useRef as H, useState as w, useEffect as J } from "react";
+import { I as K } from "./Input-CrNLI_OY.js";
+const L = ({
+  name: D,
+  value: v,
+  // Dayjs | null from parent
+  onChange: f,
+  // (value: Dayjs | null) => void
+  onValidate: u,
+  // (name: string, error?: string) => void
+  label: S,
+  errorText: k,
+  helperText: P,
+  format: i = "YYYY-MM-DD",
+  minDate: $,
+  maxDate: A,
+  errorTranslations: t,
+  ...B
+}) => {
+  const N = H(null), M = (c) => {
+    if (!c) return null;
+    if (I(c)) return c;
+    const s = y(c);
+    return s.isValid() ? s : null;
+  }, x = M($), Y = M(A), [R, p] = w(null), [q, m] = w(k);
+  J(() => {
+    if (!v) {
+      p(null), m(void 0), u == null || u(D, void 0);
+      return;
+    }
+    if (I(v))
+      p(v), m(void 0), u == null || u(D, void 0);
+    else {
+      const c = M(v);
+      if (c)
+        p(c), m(void 0), u == null || u(D, void 0);
+      else {
+        const s = "Invalid initial date.";
+        p(null), m(s), u == null || u(D, s);
+      }
+    }
+  }, [v]);
+  const z = (c) => {
+    if (x && c.isBefore(x, "day"))
+      return x.isSame(y(), "day") ? (t == null ? void 0 : t.minDate) ?? "Date cannot be in the past." : (t == null ? void 0 : t.minDate) ?? `Date cannot be before ${x.format(i)}.`;
+    if (Y && c.isAfter(Y, "day"))
+      return Y.isSame(y(), "day") ? (t == null ? void 0 : t.maxDate) ?? "Date cannot be in the future." : (t == null ? void 0 : t.maxDate) ?? `Date cannot be after ${Y.format(i)}.`;
+  }, F = (c) => {
+    const s = c.target.value.trim();
+    if (!s) {
+      p(null), m(void 0), u == null || u(D, void 0), f == null || f(null);
+      return;
+    }
+    const j = y(s, i, !0);
+    if (!j.isValid()) {
+      const E = "Invalid date format.";
+      p(null), m(E), u == null || u(D, E), f == null || f(null);
+      return;
+    }
+    const b = z(j);
+    if (b !== void 0) {
+      p(null), m(b), u == null || u(D, b), f == null || f(null);
+      return;
+    }
+    p(j), m(void 0), u == null || u(D, void 0), f == null || f(j);
+  };
+  return /* @__PURE__ */ G.jsx(
+    K,
+    {
+      ...B,
+      ref: N,
+      "aria-haspopup": "dialog",
+      errorText: q,
+      helperText: P,
+      id: D,
+      label: S,
+      maxRows: void 0,
+      minRows: void 0,
+      multiline: !1,
+      name: D,
+      rows: void 0,
+      type: "date",
+      value: R ? y(R).format("YYYY-MM-DD") : "",
+      onChange: F
+    }
+  );
+};
+L.displayName = "DatePicker";
+export {
+  L as D
+};

package/dist/components/Dialog-Bq3tfZ0_.js

@@ -0,0 +1 @@
+"use strict";const o=require("./jsx-runtime-CITbqOLs.js"),C=require("@mui/base"),a=require("react"),m=require("./Button-yvFLX-6Q.js"),K=require("./Headline-CnyLLQLB.js"),M=require("./bem-DC5wv0dD.js"),$="gradientMove",T="fadeInKeyframe",w={"prokodo-Dialog":"prokodo-Dialog","prokodo-Dialog__container":"prokodo-Dialog__container","prokodo-Dialog__container--scroll-paper":"prokodo-Dialog__container--scroll-paper","prokodo-Dialog__container--scroll-body":"prokodo-Dialog__container--scroll-body","prokodo-Dialog__header":"prokodo-Dialog__header","prokodo-Dialog__close":"prokodo-Dialog__close","prokodo-Dialog__close__label":"prokodo-Dialog__close__label","prokodo-Dialog__title--is-hidden":"prokodo-Dialog__title--is-hidden","prokodo-Dialog__content":"prokodo-Dialog__content","prokodo-Dialog__content--scroll-body":"prokodo-Dialog__content--scroll-body","prokodo-Dialog__actions":"prokodo-Dialog__actions","prokodo-Dialog--fade-enter":"prokodo-Dialog--fade-enter","prokodo-Dialog--fade-exit":"prokodo-Dialog--fade-exit","prokodo-Dialog--fullScreen":"prokodo-Dialog--fullScreen",gradientMove:$,fadeInKeyframe:T},e=M.create(w,"Dialog"),k=({actions:r,children:j,className:f,classNameHeader:b,containerChildren:c,contentProps:t={},contentRef:h,fullScreen:v,hideTitle:R,onClose:n,open:E,ref:y,renderHeader:d,scroll:p="paper",showCloseButton:N,title:S,titleProps:I={},translations:i,...q})=>{const[g,x]=a.useState(E??!1),[_,u]=a.useState("exiting"),l=a.useCallback(()=>{u("exiting"),setTimeout(()=>{x(!1),n&&n({},"backdropClick")},300)},[n]),B=a.useCallback(s=>{s.code==="Enter"&&l()},[l]);a.useImperativeHandle(y,()=>({openDialog:()=>{x(!0),setTimeout(()=>{u("entering")},300)},closeDialog:l}),[l]);const D={fullScreen:!!v};return o.jsxRuntimeExports.jsx(C.Modal,{...q,"aria-labelledby":"dialog-title",open:g,className:e(void 0,{...D,"fade-enter":_==="entering","fade-exit":_==="exiting"},f),onClose:l,children:o.jsxRuntimeExports.jsxs(o.jsxRuntimeExports.Fragment,{children:[o.jsxRuntimeExports.jsxs("div",{className:e("container",{...D,"is-visible":g,[`scroll-${p}`]:!0}),children:[o.jsxRuntimeExports.jsxs("div",{className:e("header",void 0,b),children:[o.jsxRuntimeExports.jsxs("div",{children:[o.jsxRuntimeExports.jsx(K.Headline,{...I,id:"dialog-title",className:e("title",{"is-hidden":!!R}),children:S}),d==null?void 0:d()]}),!!N&&o.jsxRuntimeExports.jsxs("div",{"aria-label":(i==null?void 0:i.close)??"Close dialog",className:e("close"),role:"button",tabIndex:0,onClick:l,onKeyDown:B,children:[o.jsxRuntimeExports.jsx("span",{className:e("close__label"),children:(i==null?void 0:i.cancel)??"Cancel"}),o.jsxRuntimeExports.jsx(m.Button,{inert:!0,color:"inherit",tabIndex:-1,variant:"text",iconProps:{name:"Cancel01Icon",size:"sm"}})]})]}),o.jsxRuntimeExports.jsx("div",{...t,ref:h,className:e("content",{[`scroll-${p}`]:!0},t==null?void 0:t.className),children:j}),r&&r.length>0&&o.jsxRuntimeExports.jsx("div",{className:e("actions"),children:r.map(s=>o.jsxRuntimeExports.jsx(m.Button,{...s},`dialog-action-button-${s.id}`))})]}),c!==void 0&&c]})})};k.displayName="Dialog";exports.Dialog=k;

package/dist/components/Dialog-KlXAOdt_.js

@@ -0,0 +1,172 @@
+import { j as o } from "./jsx-runtime-C5mzlN2N.js";
+import { Modal as T } from "@mui/base";
+import { useState as k, useCallback as f, useImperativeHandle as $ } from "react";
+import { B as x } from "./Button-B8chVgsB.js";
+import { H as w } from "./Headline-DzEinaZi.js";
+import { c as E } from "./bem-CYKrPjje.js";
+const O = "gradientMove", z = "fadeInKeyframe", F = {
+  "prokodo-Dialog": "prokodo-Dialog",
+  "prokodo-Dialog__container": "prokodo-Dialog__container",
+  "prokodo-Dialog__container--scroll-paper": "prokodo-Dialog__container--scroll-paper",
+  "prokodo-Dialog__container--scroll-body": "prokodo-Dialog__container--scroll-body",
+  "prokodo-Dialog__header": "prokodo-Dialog__header",
+  "prokodo-Dialog__close": "prokodo-Dialog__close",
+  "prokodo-Dialog__close__label": "prokodo-Dialog__close__label",
+  "prokodo-Dialog__title--is-hidden": "prokodo-Dialog__title--is-hidden",
+  "prokodo-Dialog__content": "prokodo-Dialog__content",
+  "prokodo-Dialog__content--scroll-body": "prokodo-Dialog__content--scroll-body",
+  "prokodo-Dialog__actions": "prokodo-Dialog__actions",
+  "prokodo-Dialog--fade-enter": "prokodo-Dialog--fade-enter",
+  "prokodo-Dialog--fade-exit": "prokodo-Dialog--fade-exit",
+  "prokodo-Dialog--fullScreen": "prokodo-Dialog--fullScreen",
+  gradientMove: O,
+  fadeInKeyframe: z
+}, e = E(F, "Dialog"), R = ({
+  actions: r,
+  children: b,
+  className: h,
+  classNameHeader: u,
+  containerChildren: s,
+  contentProps: a = {},
+  contentRef: v,
+  fullScreen: j,
+  hideTitle: y,
+  onClose: t,
+  open: N,
+  ref: I,
+  renderHeader: n,
+  scroll: c = "paper",
+  showCloseButton: S,
+  title: B,
+  titleProps: C = {},
+  translations: l,
+  ...K
+}) => {
+  const [g, p] = k(N ?? !1), [_, D] = k("exiting"), i = f(() => {
+    D("exiting"), setTimeout(() => {
+      p(!1), t && t({}, "backdropClick");
+    }, 300);
+  }, [t]), M = f(
+    (d) => {
+      d.code === "Enter" && i();
+    },
+    [i]
+  );
+  $(
+    I,
+    () => ({
+      openDialog: () => {
+        p(!0), setTimeout(() => {
+          D("entering");
+        }, 300);
+      },
+      closeDialog: i
+    }),
+    [i]
+  );
+  const m = {
+    fullScreen: !!j
+  };
+  return /* @__PURE__ */ o.jsx(
+    T,
+    {
+      ...K,
+      "aria-labelledby": "dialog-title",
+      open: g,
+      className: e(
+        void 0,
+        {
+          ...m,
+          "fade-enter": _ === "entering",
+          "fade-exit": _ === "exiting"
+        },
+        h
+      ),
+      onClose: i,
+      children: /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
+        /* @__PURE__ */ o.jsxs(
+          "div",
+          {
+            className: e("container", {
+              ...m,
+              "is-visible": g,
+              [`scroll-${c}`]: !0
+            }),
+            children: [
+              /* @__PURE__ */ o.jsxs("div", { className: e("header", void 0, u), children: [
+                /* @__PURE__ */ o.jsxs("div", { children: [
+                  /* @__PURE__ */ o.jsx(
+                    w,
+                    {
+                      ...C,
+                      id: "dialog-title",
+                      className: e("title", {
+                        "is-hidden": !!y
+                      }),
+                      children: B
+                    }
+                  ),
+                  n == null ? void 0 : n()
+                ] }),
+                !!S && /* @__PURE__ */ o.jsxs(
+                  "div",
+                  {
+                    "aria-label": (l == null ? void 0 : l.close) ?? "Close dialog",
+                    className: e("close"),
+                    role: "button",
+                    tabIndex: 0,
+                    onClick: i,
+                    onKeyDown: M,
+                    children: [
+                      /* @__PURE__ */ o.jsx("span", { className: e("close__label"), children: (l == null ? void 0 : l.cancel) ?? "Cancel" }),
+                      /* @__PURE__ */ o.jsx(
+                        x,
+                        {
+                          inert: !0,
+                          color: "inherit",
+                          tabIndex: -1,
+                          variant: "text",
+                          iconProps: {
+                            name: "Cancel01Icon",
+                            size: "sm"
+                          }
+                        }
+                      )
+                    ]
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ o.jsx(
+                "div",
+                {
+                  ...a,
+                  ref: v,
+                  className: e(
+                    "content",
+                    {
+                      [`scroll-${c}`]: !0
+                    },
+                    a == null ? void 0 : a.className
+                  ),
+                  children: b
+                }
+              ),
+              r && r.length > 0 && /* @__PURE__ */ o.jsx("div", { className: e("actions"), children: r.map((d) => /* @__PURE__ */ o.jsx(
+                x,
+                {
+                  ...d
+                },
+                `dialog-action-button-${d.id}`
+              )) })
+            ]
+          }
+        ),
+        s !== void 0 && s
+      ] })
+    }
+  );
+};
+R.displayName = "Dialog";
+export {
+  R as D
+};

package/dist/components/Drawer-DulO9091.js

@@ -0,0 +1 @@
+"use strict";const r=require("./jsx-runtime-CITbqOLs.js"),f=require("@mui/base"),t=require("react"),g=require("./bem-DC5wv0dD.js"),I=require("./validations-Cnxtn28y.js"),b=require("./Button-yvFLX-6Q.js"),j=require("./Headline-CnyLLQLB.js"),B="slideInLeft",R="slideInRight",v="slideInTop",C="slideInBottom",E="gradientMove",T="fadeInKeyframe",q={"prokodo-Drawer":"prokodo-Drawer","prokodo-Drawer__container":"prokodo-Drawer__container","prokodo-Drawer__container--fullscreen":"prokodo-Drawer__container--fullscreen","prokodo-Drawer__container--open":"prokodo-Drawer__container--open","prokodo-Drawer__container--anchor-left":"prokodo-Drawer__container--anchor-left","prokodo-Drawer__container--anchor-left--enter":"prokodo-Drawer__container--anchor-left--enter",slideInLeft:B,"prokodo-Drawer__container--anchor-left--exit":"prokodo-Drawer__container--anchor-left--exit","prokodo-Drawer__container--anchor-right":"prokodo-Drawer__container--anchor-right","prokodo-Drawer__container--anchor-right--enter":"prokodo-Drawer__container--anchor-right--enter",slideInRight:R,"prokodo-Drawer__container--anchor-right--exit":"prokodo-Drawer__container--anchor-right--exit","prokodo-Drawer__container--anchor-top":"prokodo-Drawer__container--anchor-top","prokodo-Drawer__container--anchor-top--enter":"prokodo-Drawer__container--anchor-top--enter",slideInTop:v,"prokodo-Drawer__container--anchor-top--exit":"prokodo-Drawer__container--anchor-top--exit","prokodo-Drawer__container--anchor-bottom":"prokodo-Drawer__container--anchor-bottom","prokodo-Drawer__container--anchor-bottom--enter":"prokodo-Drawer__container--anchor-bottom--enter",slideInBottom:C,"prokodo-Drawer__container--anchor-bottom--exit":"prokodo-Drawer__container--anchor-bottom--exit","prokodo-Drawer__header":"prokodo-Drawer__header","prokodo-Drawer__header__title":"prokodo-Drawer__header__title","prokodo-Drawer__header--has-title":"prokodo-Drawer__header--has-title","prokodo-Drawer__content":"prokodo-Drawer__content",gradientMove:E,fadeInKeyframe:T},i=g.create(q,"Drawer"),p=o=>I.isString(o)&&r.jsxRuntimeExports.jsx(j.Headline,{size:"md",type:"h2",children:o}),h=o=>r.jsxRuntimeExports.jsx(b.Button,{"aria-label":"Close dialog",color:"info",role:"button",variant:"text",iconProps:{name:"Cancel01Icon",size:"sm"},onClick:o}),y=({open:o,title:a,fullscreen:w,className:D,containerClassName:k,children:u,anchor:e="left",disabled:c,renderHeader:n,onClose:s,...m})=>{const[d,l]=t.useState("entering");t.useEffect(()=>{setTimeout(()=>{l("entering")},300)},[o]);const _=t.useCallback(()=>{l("exiting"),setTimeout(()=>{s&&s({},"backdropClick")},300)},[s]),x=t.useCallback(()=>t.isValidElement(n==null?void 0:n())?n():r.jsxRuntimeExports.jsxs("div",{className:i("header",{"has-title":!!a}),children:[p(a),!!c&&h(_)]}),[a,c,_,n]);return r.jsxRuntimeExports.jsx(f.Modal,{"aria-labelledby":a,disableEscapeKeyDown:c,open:o,...m,className:i(void 0,void 0,D),onClose:_,children:r.jsxRuntimeExports.jsxs("div",{className:i("container",{open:!!o,fullscreen:!!w,[`anchor-${e}`]:!!e,[`anchor-${e}--open`]:!!o,[`anchor-${e}--enter`]:d==="entering",[`anchor-${e}--exit`]:d==="exiting"},k),children:[x(),r.jsxRuntimeExports.jsx("div",{className:i("content"),children:u})]})})};exports.Drawer=y;exports.renderDrawerCloseButton=h;exports.renderDrawerTitle=p;

package/dist/components/Drawer-i9X07r74.js

@@ -0,0 +1,120 @@
+import { j as r } from "./jsx-runtime-C5mzlN2N.js";
+import { Modal as f } from "@mui/base";
+import { useState as x, useEffect as g, useCallback as p, isValidElement as u } from "react";
+import { c as I } from "./bem-CYKrPjje.js";
+import { i as b } from "./validations-B_cxltQ_.js";
+import { B } from "./Button-B8chVgsB.js";
+import { H as v } from "./Headline-DzEinaZi.js";
+const j = "slideInLeft", y = "slideInRight", C = "slideInTop", T = "slideInBottom", E = "gradientMove", K = "fadeInKeyframe", M = {
+  "prokodo-Drawer": "prokodo-Drawer",
+  "prokodo-Drawer__container": "prokodo-Drawer__container",
+  "prokodo-Drawer__container--fullscreen": "prokodo-Drawer__container--fullscreen",
+  "prokodo-Drawer__container--open": "prokodo-Drawer__container--open",
+  "prokodo-Drawer__container--anchor-left": "prokodo-Drawer__container--anchor-left",
+  "prokodo-Drawer__container--anchor-left--enter": "prokodo-Drawer__container--anchor-left--enter",
+  slideInLeft: j,
+  "prokodo-Drawer__container--anchor-left--exit": "prokodo-Drawer__container--anchor-left--exit",
+  "prokodo-Drawer__container--anchor-right": "prokodo-Drawer__container--anchor-right",
+  "prokodo-Drawer__container--anchor-right--enter": "prokodo-Drawer__container--anchor-right--enter",
+  slideInRight: y,
+  "prokodo-Drawer__container--anchor-right--exit": "prokodo-Drawer__container--anchor-right--exit",
+  "prokodo-Drawer__container--anchor-top": "prokodo-Drawer__container--anchor-top",
+  "prokodo-Drawer__container--anchor-top--enter": "prokodo-Drawer__container--anchor-top--enter",
+  slideInTop: C,
+  "prokodo-Drawer__container--anchor-top--exit": "prokodo-Drawer__container--anchor-top--exit",
+  "prokodo-Drawer__container--anchor-bottom": "prokodo-Drawer__container--anchor-bottom",
+  "prokodo-Drawer__container--anchor-bottom--enter": "prokodo-Drawer__container--anchor-bottom--enter",
+  slideInBottom: T,
+  "prokodo-Drawer__container--anchor-bottom--exit": "prokodo-Drawer__container--anchor-bottom--exit",
+  "prokodo-Drawer__header": "prokodo-Drawer__header",
+  "prokodo-Drawer__header__title": "prokodo-Drawer__header__title",
+  "prokodo-Drawer__header--has-title": "prokodo-Drawer__header--has-title",
+  "prokodo-Drawer__content": "prokodo-Drawer__content",
+  gradientMove: E,
+  fadeInKeyframe: K
+}, a = I(M, "Drawer"), N = (o) => b(o) && /* @__PURE__ */ r.jsx(v, { size: "md", type: "h2", children: o }), R = (o) => /* @__PURE__ */ r.jsx(
+  B,
+  {
+    "aria-label": "Close dialog",
+    color: "info",
+    role: "button",
+    variant: "text",
+    iconProps: {
+      name: "Cancel01Icon",
+      size: "sm"
+    },
+    onClick: o
+  }
+), A = ({
+  open: o,
+  title: t,
+  fullscreen: l,
+  className: h,
+  containerClassName: D,
+  children: w,
+  anchor: e = "left",
+  disabled: i,
+  renderHeader: n,
+  onClose: c,
+  ...k
+}) => {
+  const [s, d] = x("entering");
+  g(() => {
+    setTimeout(() => {
+      d("entering");
+    }, 300);
+  }, [o]);
+  const _ = p(() => {
+    d("exiting"), setTimeout(() => {
+      c && c({}, "backdropClick");
+    }, 300);
+  }, [c]), m = p(() => u(n == null ? void 0 : n()) ? n() : /* @__PURE__ */ r.jsxs(
+    "div",
+    {
+      className: a("header", {
+        "has-title": !!t
+      }),
+      children: [
+        N(t),
+        !!i && R(_)
+      ]
+    }
+  ), [t, i, _, n]);
+  return /* @__PURE__ */ r.jsx(
+    f,
+    {
+      "aria-labelledby": t,
+      disableEscapeKeyDown: i,
+      open: o,
+      ...k,
+      className: a(void 0, void 0, h),
+      onClose: _,
+      children: /* @__PURE__ */ r.jsxs(
+        "div",
+        {
+          className: a(
+            "container",
+            {
+              open: !!o,
+              fullscreen: !!l,
+              [`anchor-${e}`]: !!e,
+              [`anchor-${e}--open`]: !!o,
+              [`anchor-${e}--enter`]: s === "entering",
+              [`anchor-${e}--exit`]: s === "exiting"
+            },
+            D
+          ),
+          children: [
+            m(),
+            /* @__PURE__ */ r.jsx("div", { className: a("content"), children: w })
+          ]
+        }
+      )
+    }
+  );
+};
+export {
+  A as D,
+  R as a,
+  N as r
+};