@fluidattacks/design 9.0.0 → 9.1.0

package/dist/components/card/card-with-input/index.js

@@ -12,7 +12,6 @@ import "react-dom";
 import "../../typography/heading/index.js";
 import "../../typography/span/index.js";
 import "../../typography/text/index.js";
-import "../../inputs/styles.js";
 import "../../container/index.js";
 import "../../icon-button/index.js";
 import "../../../_virtual/dayjs.min.js";
@@ -21,7 +20,7 @@ import "../../layout/categories/buttons/index.js";
 import { InputNumber as S } from "../../inputs/fields/number/index.js";
 import "../../inputs/utils/action-button/index.js";
 import "../../../node_modules/react-international-phone/dist/index.js";
-const pt = ({
+const it = ({
   control: u,
   description: B,
   disabled: t,
@@ -142,5 +141,5 @@ const pt = ({
   );
 };
 export {
-  pt as CardWithInput
+  it as CardWithInput
 };

package/dist/components/filters/filters-menu/index.js

@@ -1,6 +1,6 @@
 import { jsxs as a, jsx as o } from "react/jsx-runtime";
 import I from "../../../_virtual/snakeCase.js";
-import { forwardRef as O, useContext as $, useMemo as B, useCallback as p, Fragment as L } from "react";
+import { forwardRef as O, useContext as $, useMemo as B, useCallback as h, Fragment as L } from "react";
 import { useTheme as R } from "styled-components";
 import { FiltersContext as A } from "../context/index.js";
 import { NoMatches as P } from "../search/no-matches/index.js";
@@ -15,7 +15,6 @@ import "react-dom";
 import "../../typography/heading/index.js";
 import "../../typography/span/index.js";
 import { Text as M } from "../../typography/text/index.js";
-import "../../inputs/styles.js";
 import { Tag as K } from "../../tag/index.js";
 import "../../../_virtual/dayjs.min.js";
 import "../../icon-button/index.js";
@@ -27,8 +26,8 @@ import { parseTextFilterValue as U, parseCheckboxesFilterValue as X, parseInclud
 const Z = (c, d) => {
   if (d?.some((t) => t.type === "text") ?? !1)
     return U(c ?? "").text ? "1" : "0";
-  const i = new Set(d?.map((t) => t.type) ?? []);
-  if (i.size === 1 && i.has("checkboxes"))
+  const l = new Set(d?.map((t) => t.type) ?? []);
+  if (l.size === 1 && l.has("checkboxes"))
     return X(
       c ?? ""
     ).values.length.toString();
@@ -39,11 +38,11 @@ const Z = (c, d) => {
     return (t.length + f.length).toString();
   }
   return (c ?? "").split(",").filter((t) => t && t !== "-").length.toString();
-}, Te = O(function({
+}, ke = O(function({
   includeSearch: d = !1,
   groupedFilters: g,
-  handleChangeId: i,
-  pinnedFilters: h
+  handleChangeId: l,
+  pinnedFilters: p
 }, b) {
   const t = R(), {
     id: f,
@@ -52,16 +51,16 @@ const Z = (c, d) => {
     values: s,
     updateSearch: v,
     setValues: u
-  } = $(A), C = q(g, y), w = B(() => Object.values(s).filter(Boolean).length > 0, [s]), S = h.length > 0, V = p(
+  } = $(A), C = q(g, y), w = B(() => Object.values(s).filter(Boolean).length > 0, [s]), S = p.length > 0, V = h(
     (e) => () => {
-      i(e), v({ previousValue: s[e] ?? "" }), m({ searchFilter: "", searchGlobal: "" });
+      l(e), v({ previousValue: s[e] ?? "" }), m({ searchFilter: "", searchGlobal: "" });
     },
-    [i, v, m, s]
-  ), j = p(() => {
+    [l, v, m, s]
+  ), j = h(() => {
     u(
       (e) => Object.keys(e).reduce((n, r) => ({ ...n, [r]: "" }), {})
-    ), i("");
-  }, [u, i]), z = p(
+    ), l("");
+  }, [u, l]), z = h(
     (e) => {
       m((n) => ({
         ...n,
@@ -69,7 +68,7 @@ const Z = (c, d) => {
       }));
     },
     [m]
-  ), E = p(
+  ), E = h(
     (e) => (n) => {
       u((r) => ({ ...r, [e]: n }));
     },
@@ -108,7 +107,7 @@ const Z = (c, d) => {
         scroll: "y",
         width: "100%",
         children: [
-          S ? /* @__PURE__ */ o(k, { "data-testid": "menu-pinned", children: h.map((e) => {
+          S ? /* @__PURE__ */ o(k, { "data-testid": "menu-pinned", children: p.map((e) => {
             const n = e.options?.[0]?.items?.map((r) => ({
               name: r.label ?? r.value,
               value: r.value
@@ -141,17 +140,17 @@ const Z = (c, d) => {
                     children: e
                   }
                 ) : void 0,
-                n.map((l) => {
-                  const G = s[l.id], F = Z(
+                n.map((i) => {
+                  const G = s[i.id], F = Z(
                     G,
-                    l.options
+                    i.options
                   );
                   return /* @__PURE__ */ o(L, { children: /* @__PURE__ */ a(
                     N,
                     {
                       as: "button",
-                      "data-testid": l.id,
-                      onClick: V(l.id),
+                      "data-testid": i.id,
+                      onClick: V(i.id),
                       children: [
                         /* @__PURE__ */ o(
                           T,
@@ -162,7 +161,7 @@ const Z = (c, d) => {
                             iconType: "fa-light"
                           }
                         ),
-                        l.label,
+                        i.label,
                         /* @__PURE__ */ a(
                           x,
                           {
@@ -171,7 +170,7 @@ const Z = (c, d) => {
                             gap: 0.5,
                             style: { marginLeft: "auto" },
                             children: [
-                              f === l.id ? /* @__PURE__ */ o(
+                              f === i.id ? /* @__PURE__ */ o(
                                 T,
                                 {
                                   icon: "chevron-right",
@@ -186,7 +185,7 @@ const Z = (c, d) => {
                         )
                       ]
                     }
-                  ) }, l.id);
+                  ) }, i.id);
                 })
               ]
             },
@@ -198,5 +197,5 @@ const Z = (c, d) => {
   ] });
 });
 export {
-  Te as FiltersMenu
+  ke as FiltersMenu
 };

package/dist/components/filters/options-menu/options/index.js

@@ -16,7 +16,6 @@ import "react-dom";
 import "../../../typography/heading/index.js";
 import { Span as G } from "../../../typography/span/index.js";
 import "../../../typography/text/index.js";
-import "../../../inputs/styles.js";
 import "../../../container/index.js";
 import { Tag as H } from "../../../tag/index.js";
 import "../../../../_virtual/isEqual.js";
@@ -281,7 +280,7 @@ const Z = ({
       }
     ) });
   }
-}, Ee = ({
+}, De = ({
   id: i,
   filteredItems: n,
   filterValue: l,
@@ -359,6 +358,6 @@ const Z = ({
   }) ?? null });
 };
 export {
-  Ee as Options,
+  De as Options,
   Z as TextFilterRenderer
 };

package/dist/components/inputs/outline-container/index.js

@@ -1,48 +1,48 @@
 import { jsxs as e, jsx as i, Fragment as j } from "react/jsx-runtime";
 import { useTheme as z } from "styled-components";
-import { Label as x } from "../label/index.js";
-import { StyledOutlineContainer as I } from "../styles.js";
-import { Container as a } from "../../container/index.js";
-import { Icon as O } from "../../icon/index.js";
-import { Link as S } from "../../link/index.js";
-import { Tag as T } from "../../tag/index.js";
+import { Label as $ } from "../label/index.js";
+import { StyledOutlineContainer as x } from "../styles.js";
+import { Container as s } from "../../container/index.js";
+import { Icon as I } from "../../icon/index.js";
+import { Link as O } from "../../link/index.js";
+import { Tag as S } from "../../tag/index.js";
 import "../../typography/heading/index.js";
 import "../../typography/span/index.js";
 import { Text as p } from "../../typography/text/index.js";
 const J = ({
-  children: s,
-  containerRef: f,
-  disabled: y,
-  id: g,
+  children: f,
+  containerRef: y,
+  disabled: g,
+  id: v,
   error: o,
   helpLink: r,
   helpLinkText: h = "Link here",
   helpText: t,
-  htmlFor: v,
-  label: d,
-  linkPosition: l = "down",
+  htmlFor: m,
+  label: a,
+  linkPosition: c = "down",
   maxLength: n,
   required: u,
   tooltip: w,
-  value: c,
+  value: l,
   weight: b
 }) => {
-  const m = z(), C = c ? c.length : 0;
-  return /* @__PURE__ */ e(I, { id: g, ref: f, children: [
-    d === void 0 ? void 0 : /* @__PURE__ */ i(
-      x,
+  const d = z(), C = l ? l.length : 0;
+  return /* @__PURE__ */ e(x, { id: v, ref: y, children: [
+    a === void 0 ? void 0 : /* @__PURE__ */ i(
+      $,
       {
-        htmlFor: v,
-        label: d,
-        link: l === "up" ? r : void 0,
+        htmlFor: m,
+        label: a,
+        link: c === "up" ? r : void 0,
         required: u,
         tooltip: w,
         weight: b
       }
     ),
-    s,
+    f,
     o || n ? /* @__PURE__ */ e(
-      a,
+      s,
       {
         display: "flex",
         justify: o === void 0 ? "end" : "space-between",
@@ -52,25 +52,26 @@ const J = ({
             p,
             {
               className: "error-msg",
-              color: m.palette.error[500],
+              color: d.palette.error[500],
+              "data-testid": `${m}-error`,
               display: "block",
               size: "md",
               children: o
             }
           ),
           n && /* @__PURE__ */ i(
-            T,
+            S,
             {
               priority: "low",
               tagLabel: `${C}/${n}`,
-              variant: y ? "inactive" : "error"
+              variant: g ? "inactive" : "error"
             }
           )
         ]
       }
     ) : void 0,
     t || r ? /* @__PURE__ */ e(
-      a,
+      s,
       {
         alignItems: "center",
         display: "flex",
@@ -79,10 +80,10 @@ const J = ({
         children: [
           t && /* @__PURE__ */ e(j, { children: [
             /* @__PURE__ */ i(
-              O,
+              I,
               {
                 icon: "circle-info",
-                iconColor: m.palette.gray[400],
+                iconColor: d.palette.gray[400],
                 iconSize: "sm",
                 iconType: "fa-light"
               }
@@ -90,14 +91,14 @@ const J = ({
             /* @__PURE__ */ i(
               p,
               {
-                color: m.palette.gray[400],
+                color: d.palette.gray[400],
                 display: "inline-block",
                 size: "md",
                 children: t
               }
             )
           ] }),
-          r && l === "down" ? /* @__PURE__ */ i(S, { href: r, children: h }) : void 0
+          r && c === "down" ? /* @__PURE__ */ i(O, { href: r, children: h }) : void 0
         ]
       }
     ) : void 0

package/dist/components/inputs/outline-container/index.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/slider/index.js

@@ -9,7 +9,6 @@ import { Thumb as k } from "./thumb/index.js";
 import { normalizeValue as v } from "./utils.js";
 import { Container as w } from "../container/index.js";
 import { OutlineContainer as y } from "../inputs/outline-container/index.js";
-import "../inputs/styles.js";
 import "../../_virtual/isEqual.js";
 import "../checkbox/index.js";
 import "../icon/index.js";
@@ -24,7 +23,7 @@ import "react-dom";
 import "../layout/categories/buttons/index.js";
 import "../inputs/utils/action-button/index.js";
 import "../../node_modules/react-international-phone/dist/index.js";
-const te = (o) => {
+const re = (o) => {
   const p = S(), m = $(null), { label: s, minValue: i = 0, maxValue: n = 100, name: r, setValue: d, watch: c } = o, a = x(), t = V({
     ...o,
     numberFormatter: a,
@@ -77,6 +76,6 @@ const te = (o) => {
   ) });
 };
 export {
-  te as Slider,
+  re as Slider,
   x as useNumberFormatter
 };

package/package.json

@@ -57,7 +57,7 @@
     "eslint-plugin-react-hooks": "7.1.1",
     "eslint-plugin-storybook": "10.4.0",
     "jsdom": "27.4.0",
-    "next": "16.3.3",
+    "next": "16.3.7",
     "playwright": "1.60.0",
     "postcss-styled-syntax": "0.7.1",
     "prettier": "3.9.6",
@@ -135,5 +135,5 @@
     "./dist/index.js"
   ],
   "typings": "./dist/index.d.ts",
-  "version": "9.0.0"
+  "version": "9.1.0"
 }