@tedi-design-system/react 18.1.0-rc.10 → 18.1.0-rc.12

package/src/tedi/components/form/search/search.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),i=require("../../../../../external/classnames/index.cjs.js"),v=require("react"),L=require("../../buttons/button/button.cjs.js"),N=require("../textfield/textfield.cjs.js"),s=require("./search.module.scss.cjs.js"),w=require("../../../providers/label-provider/use-labels.cjs.js"),u=v.forwardRef(({placeholder:c,isClearable:d=!0,searchIcon:n="search",onSearch:a,onChange:o,button:e,ariaLabel:f,className:h,input:x,...t},_)=>{const{getLabel:r}=w.useLabels(),b=j=>{j.key==="Enter"&&(a==null||a(t.value))},m=()=>{a==null||a(t.value)},p={...t,ref:_,inputClassName:i.default(s.default["tedi-search__input"],e&&s.default["tedi-search__input--has-button"],h),placeholder:c,isClearable:d,onKeyDown:b,onChange:o,input:{...x,role:"searchbox"},...e?{}:{icon:n}},q=c||r("search"),y=f??q;return l.jsxs("div",{className:i.default(s.default["tedi-search__wrapper"]),role:"search","aria-label":y,children:[l.jsx(N.TextField,{...p}),e&&l.jsx(L.Button,{...e,onClick:m,className:i.default(s.default["tedi-search__button"],e.className),"aria-label":e.children?void 0:r("search"),children:e.children??r("search")})]})});u.displayName="Search";exports.Search=u;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),t=require("../../../../../external/classnames/index.cjs.js"),w=require("react"),j=require("../../buttons/button/button.cjs.js"),L=require("../textfield/textfield.cjs.js"),a=require("./search.module.scss.cjs.js"),k=require("../../../providers/label-provider/use-labels.cjs.js"),u=w.forwardRef(({placeholder:d,isClearable:o=!0,searchIcon:i="search",onSearch:s,onChange:f,button:e,ariaLabel:_,className:h,input:m,...l},p)=>{const{getLabel:r}=k.useLabels(),b=v=>{v.key==="Enter"&&(s==null||s(l.value))},x=()=>{s==null||s(l.value)},n=typeof i=="string"?{name:i}:i,y={color:"secondary",...n,className:t.default(n.className,l.disabled&&a.default["tedi-search__icon--disabled"])},q={...l,ref:p,inputClassName:t.default(a.default["tedi-search__input"],e&&a.default["tedi-search__input--has-button"],h),placeholder:d,isClearable:o,onKeyDown:b,onChange:f,input:{...m,role:"searchbox"},...e?{}:{icon:y}},N=d||r("search"),g=_??N;return c.jsxs("div",{className:t.default(a.default["tedi-search__wrapper"],l.size==="small"&&a.default["tedi-search__wrapper--small"],l.size==="large"&&a.default["tedi-search__wrapper--large"]),role:"search","aria-label":g,children:[c.jsx(L.TextField,{...q}),e&&c.jsx(j.Button,{...e,onClick:x,className:t.default(a.default["tedi-search__button"],!e.children&&a.default["tedi-search__button--icon-only"],e.className),"aria-label":e.children?void 0:r("search"),children:e.children??r("search")})]})});u.displayName="Search";exports.Search=u;

package/src/tedi/components/form/search/search.es.js

@@ -1,51 +1,71 @@
-import { jsxs as w, jsx as c } from "react/jsx-runtime";
-import l from "../../../../../external/classnames/index.es.js";
+import { jsxs as g, jsx as d } from "react/jsx-runtime";
+import i from "../../../../../external/classnames/index.es.js";
 import { forwardRef as L } from "react";
-import { Button as b } from "../../buttons/button/button.es.js";
-import { TextField as k } from "../textfield/textfield.es.js";
+import { Button as k } from "../../buttons/button/button.es.js";
+import { TextField as B } from "../textfield/textfield.es.js";
 import a from "./search.module.scss.es.js";
 import { useLabels as C } from "../../../providers/label-provider/use-labels.es.js";
 const j = L(
   ({
-    placeholder: t,
-    isClearable: o = !0,
-    searchIcon: m = "search",
+    placeholder: o,
+    isClearable: m = !0,
+    searchIcon: l = "search",
     onSearch: s,
-    onChange: d,
+    onChange: n,
     button: e,
     ariaLabel: p,
-    className: n,
-    input: f,
+    className: _,
+    input: h,
     ...r
-  }, h) => {
-    const { getLabel: i } = C(), u = (v) => {
+  }, f) => {
+    const { getLabel: c } = C(), u = (v) => {
       v.key === "Enter" && (s == null || s(r.value));
-    }, _ = () => {
+    }, y = () => {
       s == null || s(r.value);
-    }, x = {
+    }, t = typeof l == "string" ? { name: l } : l, N = {
+      color: "secondary",
+      ...t,
+      className: i(t.className, r.disabled && a["tedi-search__icon--disabled"])
+    }, w = {
       ...r,
-      ref: h,
-      inputClassName: l(a["tedi-search__input"], e && a["tedi-search__input--has-button"], n),
-      placeholder: t,
-      isClearable: o,
+      ref: f,
+      inputClassName: i(a["tedi-search__input"], e && a["tedi-search__input--has-button"], _),
+      placeholder: o,
+      isClearable: m,
       onKeyDown: u,
-      onChange: d,
-      input: { ...f, role: "searchbox" },
-      ...e ? {} : { icon: m }
-    }, N = t || i("search"), y = p ?? N;
-    return /* @__PURE__ */ w("div", { className: l(a["tedi-search__wrapper"]), role: "search", "aria-label": y, children: [
-      /* @__PURE__ */ c(k, { ...x }),
-      e && /* @__PURE__ */ c(
-        b,
-        {
-          ...e,
-          onClick: _,
-          className: l(a["tedi-search__button"], e.className),
-          "aria-label": e.children ? void 0 : i("search"),
-          children: e.children ?? i("search")
-        }
-      )
-    ] });
+      onChange: n,
+      input: { ...h, role: "searchbox" },
+      ...e ? {} : { icon: N }
+    }, x = o || c("search"), b = p ?? x;
+    return /* @__PURE__ */ g(
+      "div",
+      {
+        className: i(
+          a["tedi-search__wrapper"],
+          r.size === "small" && a["tedi-search__wrapper--small"],
+          r.size === "large" && a["tedi-search__wrapper--large"]
+        ),
+        role: "search",
+        "aria-label": b,
+        children: [
+          /* @__PURE__ */ d(B, { ...w }),
+          e && /* @__PURE__ */ d(
+            k,
+            {
+              ...e,
+              onClick: y,
+              className: i(
+                a["tedi-search__button"],
+                !e.children && a["tedi-search__button--icon-only"],
+                e.className
+              ),
+              "aria-label": e.children ? void 0 : c("search"),
+              children: e.children ?? c("search")
+            }
+          )
+        ]
+      }
+    );
   }
 );
 j.displayName = "Search";

package/src/tedi/components/form/search/search.module.scss.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-search__wrapper":"tedi-search__wrapper-92d6f11f","tedi-search__input":"tedi-search__input-94d53b76","tedi-search__input--has-button":"tedi-search__input--has-button-d8e073e7","tedi-search__button":"tedi-search__button-cbb4df17"};exports.default=e;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-search__wrapper":"tedi-search__wrapper-92d6f11f","tedi-search__input":"tedi-search__input-94d53b76","tedi-search__input--has-button":"tedi-search__input--has-button-d8e073e7","tedi-search__icon--disabled":"tedi-search__icon--disabled-2b492592","tedi-search__button":"tedi-search__button-cbb4df17","tedi-search__wrapper--small":"tedi-search__wrapper--small-7c104c6a","tedi-search__wrapper--large":"tedi-search__wrapper--large-b59e60d7","tedi-search__button--icon-only":"tedi-search__button--icon-only-cf897af5"};exports.default=e;

package/src/tedi/components/form/search/search.module.scss.es.js

@@ -1,9 +1,13 @@
-const t = {
+const e = {
   "tedi-search__wrapper": "tedi-search__wrapper-92d6f11f",
   "tedi-search__input": "tedi-search__input-94d53b76",
   "tedi-search__input--has-button": "tedi-search__input--has-button-d8e073e7",
-  "tedi-search__button": "tedi-search__button-cbb4df17"
+  "tedi-search__icon--disabled": "tedi-search__icon--disabled-2b492592",
+  "tedi-search__button": "tedi-search__button-cbb4df17",
+  "tedi-search__wrapper--small": "tedi-search__wrapper--small-7c104c6a",
+  "tedi-search__wrapper--large": "tedi-search__wrapper--large-b59e60d7",
+  "tedi-search__button--icon-only": "tedi-search__button--icon-only-cf897af5"
 };
 export {
-  t as default
+  e as default
 };