@strapi/design-system 1.4.0 → 1.4.1

package/dist/SimpleMenu/SimpleMenu.js

@@ -1,108 +1,132 @@
 var Y = Object.defineProperty;
-var g = Object.getOwnPropertySymbols;
-var $ = Object.prototype.hasOwnProperty, F = Object.prototype.propertyIsEnumerable;
-var N = (e, r, o) => r in e ? Y(e, r, { enumerable: !0, configurable: !0, writable: !0, value: o }) : e[r] = o, y = (e, r) => {
-  for (var o in r || (r = {}))
-    $.call(r, o) && N(e, o, r[o]);
-  if (g)
-    for (var o of g(r))
-      F.call(r, o) && N(e, o, r[o]);
+var C = Object.getOwnPropertySymbols;
+var F = Object.prototype.hasOwnProperty, V = Object.prototype.propertyIsEnumerable;
+var N = (e, r, t) => r in e ? Y(e, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[r] = t, p = (e, r) => {
+  for (var t in r || (r = {}))
+    F.call(r, t) && N(e, t, r[t]);
+  if (C)
+    for (var t of C(r))
+      V.call(r, t) && N(e, t, r[t]);
   return e;
 };
-var S = (e, r) => {
-  var o = {};
+var b = (e, r) => {
+  var t = {};
   for (var s in e)
-    $.call(e, s) && r.indexOf(s) < 0 && (o[s] = e[s]);
-  if (e != null && g)
-    for (var s of g(e))
-      r.indexOf(s) < 0 && F.call(e, s) && (o[s] = e[s]);
-  return o;
+    F.call(e, s) && r.indexOf(s) < 0 && (t[s] = e[s]);
+  if (e != null && C)
+    for (var s of C(e))
+      r.indexOf(s) < 0 && V.call(e, s) && (t[s] = e[s]);
+  return t;
 };
-import i, { useRef as w, useEffect as C, useState as V, Children as Z, cloneElement as ee } from "react";
+import i, { useRef as w, useEffect as P, useState as q, Children as Z, cloneElement as ee } from "react";
 import n from "prop-types";
-import v from "styled-components";
+import h from "styled-components";
 import { NavLink as ne } from "react-router-dom";
-import { useCallbackRef as q } from "@radix-ui/react-use-callback-ref";
-import oe from "@strapi/icons/CarretDown";
-import { Typography as L } from "../Typography/Typography.js";
-import { Box as x } from "../Box/Box.js";
-import { Flex as te } from "../Flex/Flex.js";
-import { Button as W } from "../Button/Button.js";
-import { POPOVER_PLACEMENTS as re, Popover as se } from "../Popover/Popover.js";
-import { getOptionStyle as _ } from "./utils.js";
-import { useId as ie } from "../helpers/useId.js";
+import { useCallbackRef as W } from "@radix-ui/react-use-callback-ref";
+import te from "@strapi/icons/CarretDown";
+import { Typography as S } from "../Typography/Typography.js";
+import { Link as oe } from "../Link/Link.js";
+import { Box as R } from "../Box/Box.js";
+import { Flex as re } from "../Flex/Flex.js";
+import { Button as _ } from "../Button/Button.js";
+import { POPOVER_PLACEMENTS as ie, Popover as se } from "../Popover/Popover.js";
+import { getOptionStyle as M } from "./utils.js";
+import { useId as ae } from "../helpers/useId.js";
 import { KeyboardKeys as c } from "../helpers/keyboardKeys.js";
-const ae = v.button`
+const le = h.button`
   border: none;
   padding: 0;
   background: transparent;
   cursor: pointer;
-  ${_}
-`, ce = v(ne)`
+  ${M}
+`, ce = h(ne)`
   text-decoration: none;
-  ${_}
-`, le = v.span`
+  ${M}
+`, pe = h(oe)`
+  /* Removing Link hover effect */
+  &:hover {
+    color: currentColor;
+  }
+
+  &:focus-visible {
+    /* Removing Link focus-visible after properties and reset to global outline */
+    outline: 2px solid ${({ theme: e }) => e.colors.primary600};
+    outline-offset: 2px;
+    &:after {
+      content: none;
+    }
+  }
+
+  ${M}
+`, ue = h.span`
   display: flex;
   align-items: center;
   svg {
     height: 4px;
     width: 6px;
   }
-`, pe = v(W)`
+`, me = h(_)`
   padding: ${({ theme: e }) => `${e.spaces[1]} ${e.spaces[3]}`};
-`, z = (b) => {
-  var E = b, { children: e, onClick: r, to: o, isFocused: s } = E, k = S(E, ["children", "onClick", "to", "isFocused"]);
-  const p = w();
-  C(() => {
-    s && p.current && p.current.focus();
+`, z = (B) => {
+  var v = B, { children: e, onClick: r, to: t, isFocused: s, href: u } = v, D = b(v, ["children", "onClick", "to", "isFocused", "href"]);
+  const l = w();
+  P(() => {
+    s && l.current && l.current.focus();
   }, [s]);
-  const l = y({
+  const m = p({
     tabIndex: s ? 0 : -1,
-    ref: p,
+    ref: l,
     role: "menuitem"
-  }, k), D = (I) => {
-    (I.key === c.SPACE || I.key === c.ENTER) && r();
+  }, D), K = (f) => {
+    (f.key === c.SPACE || f.key === c.ENTER) && r();
   };
-  return o ? /* @__PURE__ */ i.createElement(ce, y({
-    to: o
-  }, l), /* @__PURE__ */ i.createElement(x, {
+  return t && !u ? /* @__PURE__ */ i.createElement(ce, p({
+    to: t
+  }, m), /* @__PURE__ */ i.createElement(R, {
     padding: 2
-  }, /* @__PURE__ */ i.createElement(L, null, e))) : /* @__PURE__ */ i.createElement(ae, y({
-    onKeyDown: D,
+  }, /* @__PURE__ */ i.createElement(S, null, e))) : u && !t ? /* @__PURE__ */ i.createElement(pe, p({
+    isExternal: !0,
+    href: u
+  }, m), /* @__PURE__ */ i.createElement(R, {
+    padding: 2
+  }, /* @__PURE__ */ i.createElement(S, null, e))) : /* @__PURE__ */ i.createElement(le, p({
+    onKeyDown: K,
     onMouseDown: r,
     type: "button"
-  }, l), /* @__PURE__ */ i.createElement(x, {
+  }, m), /* @__PURE__ */ i.createElement(R, {
     padding: 2
-  }, /* @__PURE__ */ i.createElement(L, null, e)));
+  }, /* @__PURE__ */ i.createElement(S, null, e)));
 };
 z.defaultProps = {
   as: void 0,
+  href: void 0,
+  isFocused: !1,
   onClick() {
   },
-  isFocused: !1,
   to: void 0
 };
 z.propTypes = {
   as: n.elementType,
   children: n.node.isRequired,
+  href: n.string,
   isFocused: n.bool,
   onClick: n.func,
   to: n.string
 };
-const P = (I) => {
-  var M = I, {
+const x = (K) => {
+  var f = K, {
     label: e,
     children: r,
-    id: o,
+    id: t,
     as: s,
-    onOpen: k = () => {
+    onOpen: u = () => {
     },
-    onClose: b = () => {
+    onClose: D = () => {
     },
-    size: E,
-    popoverPlacement: p,
+    size: B,
+    popoverPlacement: v,
     onReachEnd: l
-  } = M, D = S(M, [
+  } = f, m = b(f, [
     "label",
     "children",
     "id",
@@ -113,74 +137,74 @@ const P = (I) => {
     "popoverPlacement",
     "onReachEnd"
   ]);
-  const u = w(), O = ie("simplemenu", o), m = w(!1), [d, f] = V(!1), [R, T] = V(0), h = Z.toArray(r), j = s || (E === "S" ? pe : W), B = !!l && typeof l == "function";
-  C(() => {
+  const d = w(), I = ae("simplemenu", t), y = w(!1), [E, g] = q(!1), [O, T] = q(0), k = Z.toArray(r), j = s || (B === "S" ? me : _), $ = !!l && typeof l == "function";
+  P(() => {
     if (["string", "number"].includes(typeof e)) {
-      const t = h.findIndex((a) => a.props.children === e);
-      t !== -1 && T(t);
+      const o = k.findIndex((a) => a.props.children === e);
+      o !== -1 && T(o);
     }
   }, [e]);
-  const K = q(k), A = q(b);
-  C(() => {
-    m != null && m.current ? d ? K() : A() : m.current = !0;
-  }, [m, A, K, d]), C(() => {
-    i.isValidElement(e) && R === -1 && u.current.focus();
-  }, [e, R]);
-  const H = (t) => {
-    d && (t.key === c.ESCAPE && (t.stopPropagation(), f(!1), u.current.focus()), t.key === c.DOWN && T((a) => a === h.length - 1 ? 0 : a + 1), t.key === c.UP && T((a) => a === 0 ? h.length - 1 : a - 1));
-  }, U = (t) => {
-    (t.key === c.ENTER || t.key === c.SPACE) && f((a) => !a);
-  }, G = (t) => {
-    t.preventDefault(), t.currentTarget.contains(t.relatedTarget) || f(!1);
-  }, J = (t) => {
-    t.preventDefault(), f((a) => !a);
+  const L = W(u), A = W(D);
+  P(() => {
+    y != null && y.current ? E ? L() : A() : y.current = !0;
+  }, [y, A, L, E]), P(() => {
+    i.isValidElement(e) && O === -1 && d.current.focus();
+  }, [e, O]);
+  const H = (o) => {
+    E && (o.key === c.ESCAPE && (o.stopPropagation(), g(!1), d.current.focus()), o.key === c.DOWN && T((a) => a === k.length - 1 ? 0 : a + 1), o.key === c.UP && T((a) => a === 0 ? k.length - 1 : a - 1));
+  }, U = (o) => {
+    (o.key === c.ENTER || o.key === c.SPACE) && g((a) => !a);
+  }, G = (o) => {
+    o.preventDefault(), o.currentTarget.contains(o.relatedTarget) || g(!1);
+  }, J = (o) => {
+    o.preventDefault(), g((a) => !a);
   }, Q = () => {
-    B && l();
-  }, X = h.map((t, a) => /* @__PURE__ */ i.createElement(te, {
+    $ && l();
+  }, X = k.map((o, a) => /* @__PURE__ */ i.createElement(re, {
     as: "li",
     key: a,
     justifyContent: "center",
     role: "menuitem"
-  }, ee(t, {
+  }, ee(o, {
     onClick() {
-      t.props.onClick(), f(!1), u.current.focus();
+      o.props.onClick(), g(!1), d.current.focus();
     },
-    isFocused: R === a
+    isFocused: O === a
   })));
   return /* @__PURE__ */ i.createElement("div", {
     onKeyDown: H
-  }, /* @__PURE__ */ i.createElement(j, y({
+  }, /* @__PURE__ */ i.createElement(j, p({
     label: i.isValidElement(e) ? null : e,
     "aria-haspopup": !0,
-    "aria-expanded": d,
-    "aria-controls": O,
+    "aria-expanded": E,
+    "aria-controls": I,
     onKeyDown: U,
     onMouseDown: J,
-    ref: u,
+    ref: d,
     type: "button",
     variant: "ghost",
-    endIcon: /* @__PURE__ */ i.createElement(le, null, /* @__PURE__ */ i.createElement(oe, {
+    endIcon: /* @__PURE__ */ i.createElement(ue, null, /* @__PURE__ */ i.createElement(te, {
       "aria-hidden": !0
     }))
-  }, D), e), d && /* @__PURE__ */ i.createElement(se, {
+  }, m), e), E && /* @__PURE__ */ i.createElement(se, {
     onBlur: G,
-    placement: p,
-    source: u,
+    placement: v,
+    source: d,
     onReachEnd: Q,
-    intersectionId: B ? `popover-${O}` : void 0,
+    intersectionId: $ ? `popover-${I}` : void 0,
     spacing: 4
-  }, /* @__PURE__ */ i.createElement(x, {
+  }, /* @__PURE__ */ i.createElement(R, {
     role: "menu",
     as: "ul",
     padding: 1,
-    id: O
+    id: I
   }, X)));
 };
-P.defaultProps = {
+x.defaultProps = {
   as: void 0
 };
-P.displayName = "SimpleMenu";
-P.defaultProps = {
+x.displayName = "SimpleMenu";
+x.defaultProps = {
   id: void 0,
   onOpen: void 0,
   onClose: void 0,
@@ -188,7 +212,7 @@ P.defaultProps = {
   popoverPlacement: "bottom-start",
   size: "M"
 };
-P.propTypes = {
+x.propTypes = {
   as: n.any,
   children: n.oneOfType([n.arrayOf(n.node), n.node]).isRequired,
   id: n.string,
@@ -196,10 +220,10 @@ P.propTypes = {
   onClose: n.func,
   onOpen: n.func,
   onReachEnd: n.func,
-  popoverPlacement: n.oneOf(re),
+  popoverPlacement: n.oneOf(ie),
   size: n.oneOf(["S", "M"])
 };
 export {
   z as MenuItem,
-  P as SimpleMenu
+  x as SimpleMenu
 };

package/dist/TextInput/TextInput.cjs

@@ -1 +1 @@
-"use strict";var _=Object.defineProperty;var a=Object.getOwnPropertySymbols;var b=Object.prototype.hasOwnProperty,m=Object.prototype.propertyIsEnumerable;var F=(e,i,l)=>i in e?_(e,i,{enumerable:!0,configurable:!0,writable:!0,value:l}):e[i]=l,q=(e,i)=>{for(var l in i||(i={}))b.call(i,l)&&F(e,l,i[l]);if(a)for(var l of a(i))m.call(i,l)&&F(e,l,i[l]);return e};var j=(e,i)=>{var l={};for(var r in e)b.call(e,r)&&i.indexOf(r)<0&&(l[r]=e[r]);if(e!=null&&a)for(var r of a(e))i.indexOf(r)<0&&m.call(e,r)&&(l[r]=e[r]);return l};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react"),h=require("prop-types"),x=require("../Field/Field.cjs"),O=require("../Field/FieldLabel.cjs"),R=require("../Field/FieldInput.cjs"),S=require("../Field/FieldHint.cjs"),k=require("../Field/FieldError.cjs");require("../Field/FieldContext.cjs");require("../Field/FieldAction.cjs");const z=require("../Stack/Stack.cjs"),H=require("../themes/sizes.cjs"),L=require("../helpers/useId.cjs"),v=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},d=v(o),t=v(h),n=d.default.forwardRef((P,c)=>{var f=P,{size:e,startAction:i,endAction:l,name:r,hint:y,error:I,label:u,labelAction:g,id:E,required:T}=f,s=j(f,["size","startAction","endAction","name","hint","error","label","labelAction","id","required"]);const A=L.useId("textinput",E),p=o.useRef(null);if(!u&&!s["aria-label"])throw new Error('The TextInput component needs a "label" or an "aria-label" props');return o.useImperativeHandle(c,()=>({inputWrapperRef:p})),d.default.createElement("div",{ref:p},d.default.createElement(x.Field,{name:r,hint:y,error:I,id:A},d.default.createElement(z.Stack,{spacing:1},u&&d.default.createElement(O.FieldLabel,{required:T,action:g},u),d.default.createElement(R.FieldInput,q({size:e,ref:c,startAction:i,endAction:l},s)),d.default.createElement(S.FieldHint,null),d.default.createElement(k.FieldError,null))))});n.displayName="TextInput";n.defaultProps={"aria-label":void 0,label:void 0,labelAction:void 0,error:void 0,hint:void 0,id:void 0,startAction:void 0,size:"M",endAction:void 0,required:!1};n.propTypes={"aria-label":t.default.string,endAction:t.default.element,error:t.default.oneOfType([t.default.string,t.default.bool]),hint:t.default.oneOfType([t.default.string,t.default.node,t.default.arrayOf(t.default.node)]),id:t.default.string,label:t.default.string,labelAction:t.default.element,name:t.default.string.isRequired,required:t.default.bool,size:t.default.oneOf(Object.keys(H.sizes.input)),startAction:t.default.element};exports.TextInput=n;
+"use strict";var _=Object.defineProperty;var a=Object.getOwnPropertySymbols;var b=Object.prototype.hasOwnProperty,m=Object.prototype.propertyIsEnumerable;var F=(e,i,l)=>i in e?_(e,i,{enumerable:!0,configurable:!0,writable:!0,value:l}):e[i]=l,q=(e,i)=>{for(var l in i||(i={}))b.call(i,l)&&F(e,l,i[l]);if(a)for(var l of a(i))m.call(i,l)&&F(e,l,i[l]);return e};var j=(e,i)=>{var l={};for(var r in e)b.call(e,r)&&i.indexOf(r)<0&&(l[r]=e[r]);if(e!=null&&a)for(var r of a(e))i.indexOf(r)<0&&m.call(e,r)&&(l[r]=e[r]);return l};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react"),h=require("prop-types"),x=require("../Field/Field.cjs"),O=require("../Field/FieldLabel.cjs"),R=require("../Field/FieldInput.cjs"),S=require("../Field/FieldHint.cjs"),k=require("../Field/FieldError.cjs");require("../Field/FieldContext.cjs");require("../Field/FieldAction.cjs");const z=require("../Stack/Stack.cjs"),H=require("../themes/sizes.cjs"),L=require("../helpers/useId.cjs"),v=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},d=v(o),t=v(h),n=d.default.forwardRef((P,c)=>{var f=P,{size:e,startAction:i,endAction:l,name:r,hint:y,error:I,label:u,labelAction:g,id:E,required:T}=f,s=j(f,["size","startAction","endAction","name","hint","error","label","labelAction","id","required"]);const A=L.useId("textinput",E),p=o.useRef(null);if(!u&&!s["aria-label"])throw new Error('The TextInput component needs a "label" or an "aria-label" props');return o.useImperativeHandle(c,()=>({inputWrapperRef:p})),d.default.createElement("div",{ref:p},d.default.createElement(x.Field,{name:r,hint:y,error:I,id:A,required:T},d.default.createElement(z.Stack,{spacing:1},u&&d.default.createElement(O.FieldLabel,{action:g},u),d.default.createElement(R.FieldInput,q({size:e,ref:c,startAction:i,endAction:l},s)),d.default.createElement(S.FieldHint,null),d.default.createElement(k.FieldError,null))))});n.displayName="TextInput";n.defaultProps={"aria-label":void 0,label:void 0,labelAction:void 0,error:void 0,hint:void 0,id:void 0,startAction:void 0,size:"M",endAction:void 0,required:!1};n.propTypes={"aria-label":t.default.string,endAction:t.default.element,error:t.default.oneOfType([t.default.string,t.default.bool]),hint:t.default.oneOfType([t.default.string,t.default.node,t.default.arrayOf(t.default.node)]),id:t.default.string,label:t.default.string,labelAction:t.default.element,name:t.default.string.isRequired,required:t.default.bool,size:t.default.oneOf(Object.keys(H.sizes.input)),startAction:t.default.element};exports.TextInput=n;

package/dist/TextInput/TextInput.js

@@ -44,11 +44,11 @@ const m = n.forwardRef(
       name: o,
       hint: g,
       error: T,
-      id: x
+      id: x,
+      required: A
     }, /* @__PURE__ */ n.createElement(H, {
       spacing: 1
     }, l && /* @__PURE__ */ n.createElement(q, {
-      required: A,
       action: y
     }, l), /* @__PURE__ */ n.createElement(w, v({
       size: e,

package/dist/Textarea/Textarea.cjs

@@ -12,4 +12,4 @@
     color: ${({theme:e})=>e.colors.neutral500};
     opacity: 1;
   }
-`,n=i.default.forwardRef((A,y)=>{var o=A,{name:e,hint:l,error:t,label:a,children:m,labelAction:h,id:q,required:g}=o,x=F(o,["name","hint","error","label","children","labelAction","id","required"]);const j=P.useId("textarea",q);return i.default.createElement($,null,i.default.createElement(_.Field,{name:e,hint:l,error:t,id:j},i.default.createElement(w.Stack,{spacing:1},a&&i.default.createElement(L.Flex,null,i.default.createElement(I.FieldLabel,{required:g,action:h},a)),i.default.createElement(k.TextareaInput,p({ref:y,as:"textarea",value:m},x)),i.default.createElement(S.FieldHint,null),i.default.createElement(O.FieldError,null))))});n.displayName="Textarea";n.defaultProps={"aria-label":void 0,label:void 0,labelAction:void 0,error:void 0,hint:void 0,id:void 0,children:"",required:!1};n.propTypes={"aria-label":r.default.string,children:r.default.string,error:r.default.string,hint:r.default.oneOfType([r.default.string,r.default.node,r.default.arrayOf(r.default.node)]),id:r.default.string,label:r.default.string,labelAction:r.default.element,name:r.default.string.isRequired,required:r.default.bool};exports.Textarea=n;
+`,n=i.default.forwardRef((A,y)=>{var o=A,{name:e,hint:l,error:t,label:a,children:m,labelAction:h,id:q,required:g}=o,x=F(o,["name","hint","error","label","children","labelAction","id","required"]);const j=P.useId("textarea",q);return i.default.createElement($,null,i.default.createElement(_.Field,{name:e,hint:l,error:t,id:j,required:g},i.default.createElement(w.Stack,{spacing:1},a&&i.default.createElement(L.Flex,null,i.default.createElement(I.FieldLabel,{action:h},a)),i.default.createElement(k.TextareaInput,p({ref:y,as:"textarea",value:m},x)),i.default.createElement(S.FieldHint,null),i.default.createElement(O.FieldError,null))))});n.displayName="Textarea";n.defaultProps={"aria-label":void 0,label:void 0,labelAction:void 0,error:void 0,hint:void 0,id:void 0,children:"",required:!1};n.propTypes={"aria-label":r.default.string,children:r.default.string,error:r.default.string,hint:r.default.oneOfType([r.default.string,r.default.node,r.default.arrayOf(r.default.node)]),id:r.default.string,label:r.default.string,labelAction:r.default.element,name:r.default.string.isRequired,required:r.default.bool};exports.Textarea=n;

package/dist/Textarea/Textarea.js

@@ -54,11 +54,11 @@ const P = y.div`
       name: e,
       hint: t,
       error: r,
-      id: T
+      id: T,
+      required: v
     }, /* @__PURE__ */ a.createElement(I, {
       spacing: 1
     }, o && /* @__PURE__ */ a.createElement(R, null, /* @__PURE__ */ a.createElement(w, {
-      required: v,
       action: u
     }, o)), /* @__PURE__ */ a.createElement(q, s({
       ref: E,

package/dist/Textarea/TextareaInput.cjs

@@ -1,4 +1,4 @@
-"use strict";var j=Object.defineProperty;var a=Object.getOwnPropertySymbols;var f=Object.prototype.hasOwnProperty,y=Object.prototype.propertyIsEnumerable;var p=(e,r,t)=>r in e?j(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,b=(e,r)=>{for(var t in r||(r={}))f.call(r,t)&&p(e,t,r[t]);if(a)for(var t of a(r))y.call(r,t)&&p(e,t,r[t]);return e};var $=(e,r)=>{var t={};for(var o in e)f.call(e,o)&&r.indexOf(o)<0&&(t[o]=e[o]);if(e!=null&&a)for(var o of a(e))r.indexOf(o)<0&&y.call(e,o)&&(t[o]=e[o]);return t};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const F=require("react"),x=require("styled-components"),_=require("prop-types");require("../Field/Field.cjs");require("../Field/FieldLabel.cjs");require("../Field/FieldInput.cjs");const m=require("../Field/FieldContext.cjs");require("../Typography/Typography.cjs");require("../Field/FieldAction.cjs");const v=require("../themes/utils.cjs"),d=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},g=d(F),T=d(x),w=d(_),I=T.default.div`
+"use strict";var x=Object.defineProperty;var a=Object.getOwnPropertySymbols;var f=Object.prototype.hasOwnProperty,y=Object.prototype.propertyIsEnumerable;var p=(e,r,t)=>r in e?x(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t,b=(e,r)=>{for(var t in r||(r={}))f.call(r,t)&&p(e,t,r[t]);if(a)for(var t of a(r))y.call(r,t)&&p(e,t,r[t]);return e};var $=(e,r)=>{var t={};for(var o in e)f.call(e,o)&&r.indexOf(o)<0&&(t[o]=e[o]);if(e!=null&&a)for(var o of a(e))r.indexOf(o)<0&&y.call(e,o)&&(t[o]=e[o]);return t};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const F=require("react"),_=require("styled-components"),m=require("prop-types");require("../Field/Field.cjs");require("../Field/FieldLabel.cjs");require("../Field/FieldInput.cjs");const v=require("../Field/FieldContext.cjs");require("../Typography/Typography.cjs");require("../Field/FieldAction.cjs");const w=require("../themes/utils.cjs"),n=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},g=n(F),q=n(_),I=n(m),P=q.default.div`
   border: 1px solid ${({theme:e,hasError:r})=>r?e.colors.danger600:e.colors.neutral200};
   border-radius: ${({theme:e})=>e.borderRadius};
 
@@ -8,8 +8,8 @@
   padding-bottom: ${({theme:e})=>`${e.spaces[3]}`};
 
   background: ${({theme:e,disabled:r})=>r?e.colors.neutral150:e.colors.neutral0};
-  ${v.inputFocusStyle()}
-`,P=T.default.textarea`
+  ${w.inputFocusStyle()}
+`,R=q.default.textarea`
   display: block;
   width: 100%;
   font-weight: 400;
@@ -27,4 +27,4 @@
   &:focus-within {
     outline: none;
   }
-`,l=F.forwardRef((o,t)=>{var c=o,{disabled:e}=c,r=$(c,["disabled"]);const{id:s,error:u,hint:q,name:h}=m.useField();let i;u?i=`${s}-error`:q&&(i=`${s}-hint`);const n=Boolean(u);return g.default.createElement(I,{hasError:n,disabled:e},g.default.createElement(P,b({id:s,name:h,ref:t,"aria-describedby":i,"aria-invalid":n,disabled:e,hasError:n},r)))});l.displayName="TextareaInput";l.defaultProps={disabled:!1};l.propTypes={disabled:w.default.bool};exports.TextareaInput=l;
+`,i=F.forwardRef((o,t)=>{var c=o,{disabled:e}=c,r=$(c,["disabled"]);const{id:l,error:u,hint:T,name:h,required:j}=v.useField();let s;u?s=`${l}-error`:T&&(s=`${l}-hint`);const d=Boolean(u);return g.default.createElement(P,{hasError:d,disabled:e},g.default.createElement(R,b({id:l,name:h,ref:t,"aria-describedby":s,"aria-invalid":d,disabled:e,hasError:d,"aria-required":j},r)))});i.displayName="TextareaInput";i.defaultProps={disabled:!1};i.propTypes={disabled:I.default.bool};exports.TextareaInput=i;

package/dist/Textarea/TextareaInput.js

@@ -1,34 +1,34 @@
-var h = Object.defineProperty;
-var a = Object.getOwnPropertySymbols;
+var T = Object.defineProperty;
+var t = Object.getOwnPropertySymbols;
 var u = Object.prototype.hasOwnProperty, m = Object.prototype.propertyIsEnumerable;
-var c = (r, o, e) => o in r ? h(r, o, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[o] = e, f = (r, o) => {
+var c = (r, o, e) => o in r ? T(r, o, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[o] = e, f = (r, o) => {
   for (var e in o || (o = {}))
     u.call(o, e) && c(r, e, o[e]);
-  if (a)
-    for (var e of a(o))
+  if (t)
+    for (var e of t(o))
       m.call(o, e) && c(r, e, o[e]);
   return r;
 };
 var $ = (r, o) => {
   var e = {};
-  for (var t in r)
-    u.call(r, t) && o.indexOf(t) < 0 && (e[t] = r[t]);
-  if (r != null && a)
-    for (var t of a(r))
-      o.indexOf(t) < 0 && m.call(r, t) && (e[t] = r[t]);
+  for (var a in r)
+    u.call(r, a) && o.indexOf(a) < 0 && (e[a] = r[a]);
+  if (r != null && t)
+    for (var a of t(r))
+      o.indexOf(a) < 0 && m.call(r, a) && (e[a] = r[a]);
   return e;
 };
-import b, { forwardRef as T } from "react";
+import b, { forwardRef as w } from "react";
 import g from "styled-components";
-import w from "prop-types";
+import k from "prop-types";
 import "../Field/Field.js";
 import "../Field/FieldLabel.js";
 import "../Field/FieldInput.js";
-import { useField as k } from "../Field/FieldContext.js";
+import { useField as E } from "../Field/FieldContext.js";
 import "../Typography/Typography.js";
 import "../Field/FieldAction.js";
-import { inputFocusStyle as E } from "../themes/utils.js";
-const R = g.div`
+import { inputFocusStyle as R } from "../themes/utils.js";
+const q = g.div`
   border: 1px solid ${({ theme: r, hasError: o }) => o ? r.colors.danger600 : r.colors.neutral200};
   border-radius: ${({ theme: r }) => r.borderRadius};
 
@@ -38,7 +38,7 @@ const R = g.div`
   padding-bottom: ${({ theme: r }) => `${r.spaces[3]}`};
 
   background: ${({ theme: r, disabled: o }) => o ? r.colors.neutral150 : r.colors.neutral0};
-  ${E()}
+  ${R()}
 `, v = g.textarea`
   display: block;
   width: 100%;
@@ -57,13 +57,13 @@ const R = g.div`
   &:focus-within {
     outline: none;
   }
-`, l = T((t, e) => {
-  var p = t, { disabled: r } = p, o = $(p, ["disabled"]);
-  const { id: i, error: d, hint: y, name: x } = k();
+`, l = w((a, e) => {
+  var p = a, { disabled: r } = p, o = $(p, ["disabled"]);
+  const { id: i, error: d, hint: y, name: x, required: h } = E();
   let n;
   d ? n = `${i}-error` : y && (n = `${i}-hint`);
   const s = Boolean(d);
-  return /* @__PURE__ */ b.createElement(R, {
+  return /* @__PURE__ */ b.createElement(q, {
     hasError: s,
     disabled: r
   }, /* @__PURE__ */ b.createElement(v, f({
@@ -73,7 +73,8 @@ const R = g.div`
     "aria-describedby": n,
     "aria-invalid": s,
     disabled: r,
-    hasError: s
+    hasError: s,
+    "aria-required": h
   }, o)));
 });
 l.displayName = "TextareaInput";
@@ -81,7 +82,7 @@ l.defaultProps = {
   disabled: !1
 };
 l.propTypes = {
-  disabled: w.bool
+  disabled: k.bool
 };
 export {
   l as TextareaInput

package/dist/TimePicker/TimePicker.cjs

@@ -1,4 +1,4 @@
-"use strict";var w=Object.defineProperty;var d=Object.getOwnPropertySymbols;var v=Object.prototype.hasOwnProperty,O=Object.prototype.propertyIsEnumerable;var g=(t,s,l)=>s in t?w(t,s,{enumerable:!0,configurable:!0,writable:!0,value:l}):t[s]=l,T=(t,s)=>{for(var l in s||(s={}))v.call(s,l)&&g(t,l,s[l]);if(d)for(var l of d(s))O.call(s,l)&&g(t,l,s[l]);return t};var q=(t,s)=>{var l={};for(var r in t)v.call(t,r)&&s.indexOf(r)<0&&(l[r]=t[r]);if(t!=null&&d)for(var r of d(t))s.indexOf(r)<0&&O.call(t,r)&&(l[r]=t[r]);return l};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const B=require("react"),x=require("prop-types"),D=require("@strapi/icons/Clock"),G=require("styled-components"),H=require("../themes/sizes.cjs"),N=require("../Select/Select.cjs"),V=require("../Select/Option.cjs");require("../Select/OptGroup.cjs");require("../Select/MultiSelectNested.cjs");require("../Select/SelectList.cjs");const W=require("../helpers/useId.cjs"),f=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},c=f(B),e=f(x),A=f(D),F=f(G),J=F.default.div`
+"use strict";var B=Object.defineProperty;var d=Object.getOwnPropertySymbols;var q=Object.prototype.hasOwnProperty,v=Object.prototype.propertyIsEnumerable;var g=(t,s,l)=>s in t?B(t,s,{enumerable:!0,configurable:!0,writable:!0,value:l}):t[s]=l,O=(t,s)=>{for(var l in s||(s={}))q.call(s,l)&&g(t,l,s[l]);if(d)for(var l of d(s))v.call(s,l)&&g(t,l,s[l]);return t};var T=(t,s)=>{var l={};for(var r in t)q.call(t,r)&&s.indexOf(r)<0&&(l[r]=t[r]);if(t!=null&&d)for(var r of d(t))s.indexOf(r)<0&&v.call(t,r)&&(l[r]=t[r]);return l};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const x=require("react"),D=require("prop-types"),G=require("@strapi/icons/Clock"),H=require("styled-components"),N=require("../themes/sizes.cjs"),V=require("../Select/Select.cjs"),W=require("../Select/Option.cjs");require("../Select/OptGroup.cjs");require("../Select/MultiSelectNested.cjs");require("../Select/SelectList.cjs");const A=require("../helpers/useId.cjs"),f=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},c=f(x),e=f(D),F=f(G),J=f(H),K=J.default.div`
   display: flex;
   align-items: center;
   svg {
@@ -9,4 +9,4 @@
   svg path {
     fill: ${({theme:t})=>t.colors.neutral500};
   }
-`,y=K=>{var b=K,{disabled:t,error:s,hint:l,id:r,onClear:S,onChange:_,value:p,clearLabel:j,label:M,selectButtonTitle:k,step:C,size:$}=b,I=q(b,["disabled","error","hint","id","onClear","onChange","value","clearLabel","label","selectButtonTitle","step","size"]);const P=W.useId("timepicker",r),z=24,a=[];let n=0;for(let u=0;u<z;u++)for(n=0;n<60;)a.push(`${u<10?`0${u}`:u}:${n<10?`0${n}`:n}`),n+=C;const E=()=>{const u=p.split(":")[0],h=p.split(":")[1],R=a.reduce((o,m)=>{const i=m.split(":")[0];return Math.abs(i-u)<Math.abs(o-u)?i:o},a[0].split(":")[0]),L=a.reduce((o,m)=>{const i=m.split(":")[1];return Math.abs(i-h)<Math.abs(o-h)?i:o},a[0].split(":")[1]);return`${R}:${L}`};return c.default.createElement(N.Select,T({id:P,label:M,placeholder:"--:--",hint:l,onClear:S,clearLabel:j,error:s,value:p?E():null,size:$,onChange:_,disabled:t,selectButtonTitle:k,startIcon:c.default.createElement(J,null,c.default.createElement(A.default,null))},I),a.map(u=>c.default.createElement(V.Option,{value:u,key:u},u)))};y.defaultProps={disabled:!1,error:void 0,hint:void 0,id:void 0,label:void 0,onClear:void 0,size:"M",selectButtonTitle:void 0,step:15,value:void 0};y.propTypes={clearLabel:e.default.string.isRequired,disabled:e.default.bool,error:e.default.oneOfType([e.default.string,e.default.bool]),hint:e.default.oneOfType([e.default.string,e.default.node,e.default.arrayOf(e.default.node)]),id:e.default.oneOfType([e.default.string,e.default.number]),label:e.default.string,onChange:e.default.func.isRequired,onClear:e.default.func,selectButtonTitle:e.default.string,size:e.default.oneOf(Object.keys(H.sizes.input)),step:e.default.number,value:e.default.oneOfType([e.default.arrayOf(e.default.oneOfType([e.default.string,e.default.number])),e.default.string,e.default.number])};exports.TimePicker=y;
+`,b=Q=>{var y=Q,{disabled:t,error:s,hint:l,id:r,onClear:S,onChange:_,value:p,clearLabel:j,label:M,required:k,selectButtonTitle:C,step:$,size:I}=y,P=T(y,["disabled","error","hint","id","onClear","onChange","value","clearLabel","label","required","selectButtonTitle","step","size"]);const z=A.useId("timepicker",r),E=24,a=[];let n=0;for(let u=0;u<E;u++)for(n=0;n<60;)a.push(`${u<10?`0${u}`:u}:${n<10?`0${n}`:n}`),n+=$;const R=()=>{const u=p.split(":")[0],h=p.split(":")[1],L=a.reduce((o,m)=>{const i=m.split(":")[0];return Math.abs(i-u)<Math.abs(o-u)?i:o},a[0].split(":")[0]),w=a.reduce((o,m)=>{const i=m.split(":")[1];return Math.abs(i-h)<Math.abs(o-h)?i:o},a[0].split(":")[1]);return`${L}:${w}`};return c.default.createElement(V.Select,O({id:z,label:M,placeholder:"--:--",hint:l,onClear:S,clearLabel:j,error:s,value:p?R():null,size:I,onChange:_,disabled:t,required:k,selectButtonTitle:C,startIcon:c.default.createElement(K,null,c.default.createElement(F.default,null))},P),a.map(u=>c.default.createElement(W.Option,{value:u,key:u},u)))};b.defaultProps={disabled:!1,error:void 0,hint:void 0,id:void 0,label:void 0,onClear:void 0,required:!1,size:"M",selectButtonTitle:void 0,step:15,value:void 0};b.propTypes={clearLabel:e.default.string.isRequired,disabled:e.default.bool,error:e.default.oneOfType([e.default.string,e.default.bool]),hint:e.default.oneOfType([e.default.string,e.default.node,e.default.arrayOf(e.default.node)]),id:e.default.oneOfType([e.default.string,e.default.number]),label:e.default.string,onChange:e.default.func.isRequired,onClear:e.default.func,required:e.default.bool,selectButtonTitle:e.default.string,size:e.default.oneOf(Object.keys(N.sizes.input)),step:e.default.number,value:e.default.oneOfType([e.default.arrayOf(e.default.oneOfType([e.default.string,e.default.number])),e.default.string,e.default.number])};exports.TimePicker=b;