qaema-ui 0.0.42 → 0.0.44

package/dist/_virtual/index2.js

@@ -1,7 +1,7 @@
 import { getDefaultExportFromCjs as r } from "./_commonjsHelpers.js";
-import { __require as o } from "../node_modules/prop-types/index.js";
-var p = /* @__PURE__ */ o();
-const s = /* @__PURE__ */ r(p);
+import { __require as t } from "../node_modules/react-helmet-async/node_modules/react-fast-compare/index.js";
+var a = t();
+const m = /* @__PURE__ */ r(a);
 export {
-  s as default
+  m as default
 };

package/dist/_virtual/index3.js

@@ -1,7 +1,7 @@
 import { getDefaultExportFromCjs as r } from "./_commonjsHelpers.js";
-import { __require as t } from "../node_modules/react-helmet-async/node_modules/react-fast-compare/index.js";
-var a = t();
-const m = /* @__PURE__ */ r(a);
+import { __require as o } from "../node_modules/shallowequal/index.js";
+var a = o();
+const t = /* @__PURE__ */ r(a);
 export {
-  m as default
+  t as default
 };

package/dist/_virtual/index4.js

@@ -1,7 +1,7 @@
 import { getDefaultExportFromCjs as r } from "./_commonjsHelpers.js";
-import { __require as o } from "../node_modules/shallowequal/index.js";
-var a = o();
-const t = /* @__PURE__ */ r(a);
+import { __require as o } from "../node_modules/prop-types/index.js";
+var p = /* @__PURE__ */ o();
+const s = /* @__PURE__ */ r(p);
 export {
-  t as default
+  s as default
 };

package/dist/components/RadioInput.d.ts

@@ -19,6 +19,7 @@ export type RadioInputProps = {
     optional?: boolean;
     error?: string;
     badge?: BadgeConfig;
+    optionsVariant?: string;
 };
 declare const RadioInput: React.FC<RadioInputProps>;
 export default RadioInput;

package/dist/components/RadioInput.js

@@ -1,20 +1,20 @@
-import { j as l } from "../_virtual/jsx-runtime.js";
-import { TbSparkles as y } from "../node_modules/react-icons/tb/index.js";
-import o from "styled-components";
-import { useQaemaCoreTranslation as m } from "../i18n/i18n.js";
-import w from "./Hint.js";
-import { Optional as $ } from "./InputField.js";
-import j from "./Radio.js";
-const b = o.div`
+import { j as i } from "../_virtual/jsx-runtime.js";
+import { TbSparkles as $ } from "../node_modules/react-icons/tb/index.js";
+import a, { css as p } from "styled-components";
+import { useQaemaCoreTranslation as w } from "../i18n/i18n.js";
+import j from "./Hint.js";
+import { Optional as v } from "./InputField.js";
+import b from "./Radio.js";
+const F = a.div`
   display: flex;
   align-items: center;
   gap: ${({ theme: e }) => e.spacing.xs};
-`, v = o.div`
+`, z = a.div`
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   gap: ${({ theme: e }) => e.spacing.xs};
-`, F = o.div`
+`, R = a.div`
   display: flex;
   flex-direction: row;
   align-items: center;
@@ -30,7 +30,7 @@ const b = o.div`
     line-height: ${({ theme: e }) => e.typography.lineHeights.xs};
     color: ${({ theme: e }) => e.colors.grey.n350};
   }
-`, z = o.span`
+`, I = a.span`
   display: inline-flex;
   align-items: center;
   height: 20px;
@@ -38,52 +38,62 @@ const b = o.div`
   gap: 8px;
   border-radius: 4px;
   background: ${({ theme: e }) => {
-  var n, i, s;
-  return ((s = (i = (n = e.colors) == null ? void 0 : n.primary) == null ? void 0 : i.purple) == null ? void 0 : s.n100) || "#F1EEFF";
+  var n, l, t;
+  return ((t = (l = (n = e.colors) == null ? void 0 : n.primary) == null ? void 0 : l.purple) == null ? void 0 : t.n100) || "#F1EEFF";
 }};
   color: ${({ theme: e }) => {
-  var n, i, s;
-  return ((s = (i = (n = e.colors) == null ? void 0 : n.primary) == null ? void 0 : i.purple) == null ? void 0 : s.n450) || "#7259FF";
+  var n, l, t;
+  return ((t = (l = (n = e.colors) == null ? void 0 : n.primary) == null ? void 0 : l.purple) == null ? void 0 : t.n450) || "#7259FF";
 }};
   font-size: ${({ theme: e }) => e.typography.sizes.s2 || "10px"};
   line-height: ${({ theme: e }) => e.typography.lineHeights.m};
   font-weight: 400;
-`, R = o(y)`
+`, O = a($)`
   width: 12px;
   height: 12px;
   flex: 0 0 auto;
-`, E = (e) => {
-  const { name: n, label: i = "", options: s, value: p, disabled: h, optional: c = !1, onChange: g, error: a, badge: r } = e, { t: d } = m();
-  if (!(s != null && s.length)) return null;
-  const x = (t) => r != null && r.showFor ? typeof r.showFor == "function" ? !!r.showFor(t) : r.showFor === t.value : !1, f = (r == null ? void 0 : r.label) ?? "Recommended";
-  return /* @__PURE__ */ l.jsxs(v, { children: [
-    i && /* @__PURE__ */ l.jsxs(F, { children: [
-      /* @__PURE__ */ l.jsx("label", { children: i }),
-      c && /* @__PURE__ */ l.jsx($, { children: d("OPTIONAL") })
+`, S = a.div`
+  display: flex;
+  width: 100%;
+  flex-direction: ${({ $variant: e }) => e};
+  ${({ $variant: e, theme: n }) => e === "row" ? p`
+          justify-content: space-between;
+          align-items: center;
+        ` : p`
+          gap: ${n.spacing.xs};
+        `}
+`, A = (e) => {
+  const { name: n, label: l = "", options: t, value: c, disabled: h, optional: d = !1, onChange: g, error: o, badge: s, optionsVariant: x = "column" } = e, { t: f } = w();
+  if (!(t != null && t.length)) return null;
+  const u = (r) => s != null && s.showFor ? typeof s.showFor == "function" ? !!s.showFor(r) : s.showFor === r.value : !1, y = (s == null ? void 0 : s.label) ?? "Recommended";
+  return /* @__PURE__ */ i.jsxs(z, { children: [
+    l && /* @__PURE__ */ i.jsxs(R, { children: [
+      /* @__PURE__ */ i.jsx("label", { children: l }),
+      d && /* @__PURE__ */ i.jsx(v, { children: f("OPTIONAL") })
     ] }),
-    s.map((t) => {
-      const u = x(t);
-      return /* @__PURE__ */ l.jsxs(b, { children: [
-        /* @__PURE__ */ l.jsx(
-          j,
+    /* @__PURE__ */ i.jsx(S, { $variant: x, children: t.map((r) => {
+      const m = u(r);
+      return /* @__PURE__ */ i.jsxs(F, { children: [
+        /* @__PURE__ */ i.jsx(
+          b,
           {
             name: n,
-            label: t.label,
-            value: t.value,
-            $selected: p === (t == null ? void 0 : t.value),
+            label: r.label,
+            value: r.value,
+            $selected: c === (r == null ? void 0 : r.value),
             onChange: g,
             $disabled: h
           }
         ),
-        u && /* @__PURE__ */ l.jsxs(z, { children: [
-          (r == null ? void 0 : r.showIcon) !== !1 && /* @__PURE__ */ l.jsx(R, {}),
-          f
+        m && /* @__PURE__ */ i.jsxs(I, { children: [
+          (s == null ? void 0 : s.showIcon) !== !1 && /* @__PURE__ */ i.jsx(O, {}),
+          y
         ] })
-      ] }, t.value);
-    }),
-    a && /* @__PURE__ */ l.jsx(w, { variant: "error", title: a })
+      ] }, r.value);
+    }) }),
+    o && /* @__PURE__ */ i.jsx(j, { variant: "error", title: o })
   ] });
 };
 export {
-  E as default
+  A as default
 };

package/dist/components/TextArea.d.ts

@@ -15,6 +15,7 @@ export type TextAreaProps = {
         onClick: () => void;
     };
     identifier: string;
+    maxLength?: number;
 };
 declare const TextArea: React.FC<TextAreaProps>;
 export default TextArea;

package/dist/components/TextArea.js

@@ -1,8 +1,8 @@
 import { j as o } from "../_virtual/jsx-runtime.js";
 import "react";
 import d from "../node_modules/react-bootstrap/esm/Form.js";
-import e, { useTheme as h, css as i } from "styled-components";
-const m = {
+import e, { useTheme as m, css as i } from "styled-components";
+const b = {
   success: i`
     color: ${({ theme: r }) => r.colors.state.success.n450};
     border: 0.063rem solid ${({ theme: r }) => r.colors.state.success.n450};
@@ -39,12 +39,12 @@ const m = {
       outline: 0;
     }
   `
-}, b = e.div`
+}, w = e.div`
   position: relative;
   width: 100%;
   direction: ${({ theme: r }) => r.dir === "rtl" ? "rtl" : "ltr"};
-`, w = e(d.Control)`
-  ${({ $state: r }) => m[r]};
+`, j = e(d.Control)`
+  ${({ $state: r }) => b[r]};
 
   width: 100%;
   height: 14.125rem;
@@ -87,13 +87,13 @@ const m = {
   &::placeholder {
     text-align: ${({ theme: r }) => r.dir === "rtl" ? "right" : "left"};
   }
-`, j = e(d.Group)`
+`, S = e(d.Group)`
   display: flex;
   flex-direction: column;
   row-gap: ${({ theme: r }) => r.spacing.xs};
   align-items: 'flex-start';
   font-family: ${({ theme: r }) => r.dir === "rtl" ? r.fonts.arabic : r.fonts.english};
-`, S = e(d.Label)`
+`, v = e(d.Label)`
   color: ${({ theme: r }) => r.colors.grey.n700};
   display: flex;
   align-items: flex-end;
@@ -101,7 +101,7 @@ const m = {
   font-size: ${({ theme: r }) => r.typography.sizes.s4};
   font-weight: 400;
   text-align: ${({ theme: r }) => r.dir === "rtl" ? "right" : "left"};
-`, v = e.div`
+`, z = e.div`
   display: flex;
   align-items: center;
   gap: ${({ theme: r }) => r.spacing.xxs};
@@ -134,7 +134,7 @@ const m = {
   display: flex;
   justify-content: ${({ theme: r }) => r.dir === "rtl" ? "flex-end" : "flex-start"};
   text-align: ${({ theme: r }) => r.dir === "rtl" ? "right" : "left"};
-`, z = e.span`
+`, C = e.span`
   color: ${({ theme: r }) => r.colors.grey.n300};
   font-size: ${({ theme: r }) => r.typography.sizes.s2};
 
@@ -142,7 +142,7 @@ const m = {
   display: flex;
   justify-content: ${({ theme: r }) => r.dir === "rtl" ? "flex-end" : "flex-start"};
   text-align: ${({ theme: r }) => r.dir === "rtl" ? "right" : "left"};
-`, H = ({
+`, E = ({
   label: r,
   placeholder: s,
   value: n,
@@ -153,23 +153,24 @@ const m = {
   optional: x = "",
   helperText: c,
   helperTextLink: t,
-  identifier: u
+  identifier: u,
+  maxLength: y = 500
 }) => {
-  const a = h().dir, y = () => !c && !t ? null : /* @__PURE__ */ o.jsx(v, { $state: l, children: a ? /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
+  const a = m().dir, h = () => !c && !t ? null : /* @__PURE__ */ o.jsx(z, { $state: l, children: a ? /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
     t && /* @__PURE__ */ o.jsx($, { onClick: t.onClick, children: t.text }),
     c
   ] }) : /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
     c,
     t && /* @__PURE__ */ o.jsx($, { onClick: t.onClick, children: t.text })
   ] }) });
-  return /* @__PURE__ */ o.jsxs(j, { $dir: a, children: [
-    r && /* @__PURE__ */ o.jsxs(S, { children: [
+  return /* @__PURE__ */ o.jsxs(S, { $dir: a, children: [
+    r && /* @__PURE__ */ o.jsxs(v, { children: [
       r,
       " ",
-      x && /* @__PURE__ */ o.jsx(z, { children: x })
+      x && /* @__PURE__ */ o.jsx(C, { children: x })
     ] }),
-    /* @__PURE__ */ o.jsx(b, { children: /* @__PURE__ */ o.jsx(
-      w,
+    /* @__PURE__ */ o.jsx(w, { children: /* @__PURE__ */ o.jsx(
+      j,
       {
         htmlSize: 80,
         style: { resize: "none" },
@@ -179,6 +180,7 @@ const m = {
         as: "textarea",
         value: n,
         id: u,
+        maxLength: y,
         onChange: g,
         placeholder: s,
         disabled: p || l == "readonly",
@@ -186,9 +188,9 @@ const m = {
         isValid: l == "success"
       }
     ) }),
-    y()
+    h()
   ] });
 };
 export {
-  H as default
+  E as default
 };

package/dist/node_modules/react-bootstrap/esm/CloseButton.js

@@ -1,4 +1,4 @@
-import o from "../../../_virtual/index2.js";
+import o from "../../../_virtual/index4.js";
 import * as p from "react";
 import n from "../../../_virtual/index.js";
 import { j as i } from "../../../_virtual/jsx-runtime.js";

package/dist/node_modules/react-bootstrap/esm/Feedback.js

@@ -1,6 +1,6 @@
 import i from "../../../_virtual/index.js";
 import * as f from "react";
-import e from "../../../_virtual/index2.js";
+import e from "../../../_virtual/index4.js";
 import { j as l } from "../../../_virtual/jsx-runtime.js";
 const c = {
   /**

package/dist/node_modules/react-bootstrap/esm/Form.js

@@ -1,5 +1,5 @@
 import i from "../../../_virtual/index.js";
-import o from "../../../_virtual/index2.js";
+import o from "../../../_virtual/index4.js";
 import * as s from "react";
 import f from "./FormCheck.js";
 import l from "./FormControl.js";

package/dist/node_modules/react-bootstrap/esm/Image.js

@@ -1,6 +1,6 @@
 import f from "../../../_virtual/index.js";
 import * as d from "react";
-import o from "../../../_virtual/index2.js";
+import o from "../../../_virtual/index4.js";
 import { useBootstrapPrefix as u } from "./ThemeProvider.js";
 import { j as p } from "../../../_virtual/jsx-runtime.js";
 o.string, o.bool, o.bool, o.bool, o.bool;

package/dist/node_modules/react-helmet-async/lib/index.esm.js

@@ -2,9 +2,9 @@ var Q = Object.defineProperty;
 var X = (e, t, r) => t in e ? Q(e, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[t] = r;
 var h = (e, t, r) => X(e, typeof t != "symbol" ? t + "" : t, r);
 import y, { Component as R } from "react";
-import ee from "../../../_virtual/index3.js";
+import ee from "../../../_virtual/index2.js";
 import F from "../../../_virtual/browser.js";
-import te from "../../../_virtual/index4.js";
+import te from "../../../_virtual/index3.js";
 var Y = /* @__PURE__ */ ((e) => (e.BASE = "base", e.BODY = "body", e.HEAD = "head", e.HTML = "html", e.LINK = "link", e.META = "meta", e.NOSCRIPT = "noscript", e.SCRIPT = "script", e.STYLE = "style", e.TITLE = "title", e.FRAGMENT = "Symbol(react.fragment)", e))(Y || {}), $ = {
   link: { rel: ["amphtml", "canonical", "alternate"] },
   script: { type: ["application/ld+json"] },

package/dist/node_modules/react-smooth/es6/Animate.js

@@ -1,5 +1,5 @@
 import x, { Children as w, cloneElement as z, PureComponent as F } from "react";
-import a from "../../../_virtual/index2.js";
+import a from "../../../_virtual/index4.js";
 import { deepEqual as H } from "../../fast-equals/dist/esm/index.js";
 import L from "./AnimateManager.js";
 import { configEasing as V } from "./easing.js";

package/dist/node_modules/react-transition-group/esm/Transition.js

@@ -1,6 +1,6 @@
 import C from "../../@babel/runtime/helpers/esm/objectWithoutPropertiesLoose.js";
 import D from "../../@babel/runtime/helpers/esm/inheritsLoose.js";
-import o from "../../../_virtual/index2.js";
+import o from "../../../_virtual/index4.js";
 import v from "react";
 import b from "react-dom";
 import T from "./config.js";

package/dist/node_modules/react-transition-group/esm/utils/PropTypes.js

@@ -1,4 +1,4 @@
-import e from "../../../../_virtual/index2.js";
+import e from "../../../../_virtual/index4.js";
 var n = process.env.NODE_ENV !== "production" ? e.oneOfType([e.number, e.shape({
   enter: e.number,
   exit: e.number,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "qaema-ui",
   "private": false,
-  "version": "0.0.42",
+  "version": "0.0.44",
   "type": "module",
   "publishConfig": {
     "access": "public"