@hortiview/shared-components 2.19.0 → 2.20.0

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+## [2.20.0](https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared/compare/v2.19.1...v2.20.0) (2026-03-24)
+
+### Features
+
+* add new country keys for Netherlands and Canada in AVAILABLE_COUNTRY_KEYS ([2fdd83d](https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared/commit/2fdd83dd30c4e72f54b8a3401f98a9ab0ed55ec9))
+
+## [2.19.1](https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared/compare/v2.19.0...v2.19.1) (2026-03-24)
+
+### Code Refactoring
+
+* add variant prop to SearchBar and update ListArea usage ([49dda20](https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared/commit/49dda20ad8db46234d2f87f24519736f6b9ec746))
+* remove centered layout from stories and add BasicLayout as decorator to preview ([7c03c49](https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared/commit/7c03c497c96978eea35b98256627ded9378827c8))
+* replace FullWidthDecorator with BasicLayout in Storybook preview ([b44d297](https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared/commit/b44d29716a79f80ddae02774fcd8fedae397078b))
+
 ## [2.19.0](https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared/compare/v2.18.1...v2.19.0) (2026-03-18)
 
 ### Features

package/dist/components/ListArea/ListArea.js

@@ -3,8 +3,8 @@ import { D } from "../../index.es-C27R5Xae.js";
 import { E as j } from "../../index.es-DhlgTSuU.js";
 import { L as A } from "../../index.es-Cg57snrN.js";
 import { c as p } from "../../index-Df2FYN-K.js";
-import { o as w } from "../../orderBy-Ce85KqD6.js";
-import { useState as E, useMemo as v } from "react";
+import { o as v } from "../../orderBy-Ce85KqD6.js";
+import { useState as E, useMemo as w } from "react";
 import { SearchBar as I } from "../SearchBar/SearchBar.js";
 import { g as M, a as N, s as e } from "../../ListAreaService-Y8wR14Xq.js";
 const G = ({
@@ -15,21 +15,21 @@ const G = ({
   searchPlaceholder: g = "",
   isIntegrated: x = !0,
   isSorted: l = !0,
-  itemClassName: c = "",
+  itemClassName: d = "",
   maxHeight: T = "100%",
-  noElementsView: y,
+  noElementsView: b,
   hasLastItemNoRoundedEdges: m = !1,
-  "data-testid": C,
+  "data-testid": y,
   nonInteractive: n = !1,
-  routerLinkElement: d
+  routerLinkElement: c
 }) => {
-  const [r, b] = E(""), s = v(() => {
-    if (!r) return l ? w(t, "title") : t;
+  const [r, C] = E(""), s = w(() => {
+    if (!r) return l ? v(t, "title") : t;
     const u = t.filter((f) => f.title.toLowerCase().includes(r.toLowerCase()) || f.subTitle?.toLowerCase().includes(r.toLowerCase()) || f.overlineTitle?.toLowerCase().includes(r.toLowerCase()));
-    return l ? w(u, "title") : u;
-  }, [r, t, l]), B = v(
-    () => i ? M(s, o, c, d) : N(s, o, c, d),
-    [s, o, c, i, d]
+    return l ? v(u, "title") : u;
+  }, [r, t, l]), B = w(
+    () => i ? M(s, o, d, c) : N(s, o, d, c),
+    [s, o, d, i, c]
   );
   return /* @__PURE__ */ a(
     j,
@@ -43,19 +43,20 @@ const G = ({
             I,
             {
               searchTerm: r,
-              setSearchTerm: b,
+              setSearchTerm: C,
               className: e.searchbar,
-              placeholder: g
+              placeholder: g,
+              variant: "embedded"
             }
           ),
           /* @__PURE__ */ a(D, {})
         ] }),
-        s.length === 0 && y,
+        s.length === 0 && b,
         /* @__PURE__ */ a(
           A,
           {
             nonInteractive: n,
-            "data-testid": C,
+            "data-testid": y,
             items: B,
             className: p(
               e.list,

package/dist/components/SearchBar/SearchBar.d.ts

@@ -9,6 +9,11 @@ type SearchBarProps = Pick<TextfieldProps, 'placeholder' | 'dense' | 'className'
      * the function to set the search term
      */
     setSearchTerm: (value: string) => void;
+    /**
+     * Applies the selected styling to the SearchBar.
+     * @default outlined
+     */
+    variant?: 'embedded' | 'outlined' | 'filled';
 };
-export declare const SearchBar: ({ className, dense, searchTerm, setSearchTerm, placeholder, fullWidth, label }: SearchBarProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SearchBar: ({ className, dense, searchTerm, setSearchTerm, placeholder, fullWidth, label, variant, }: SearchBarProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/SearchBar/SearchBar.js

@@ -1,30 +1,31 @@
 import { jsx as o } from "react/jsx-runtime";
-import { I as l } from "../../index.es-CkB4776y.js";
-import { T as u } from "../../index.es-B9BUXRQn.js";
-import '../../assets/SearchBar.css';const b = "_searchbar_g83qp_1", d = {
-  searchbar: b
-}, g = ({
+import { I as u } from "../../index.es-CkB4776y.js";
+import { T as b } from "../../index.es-B9BUXRQn.js";
+import '../../assets/SearchBar.css';const d = "_searchbar_g83qp_1", p = {
+  searchbar: d
+}, m = ({
   className: r = "",
   dense: e = !1,
   searchTerm: t,
   setSearchTerm: a,
-  placeholder: n,
-  fullWidth: s = !0,
-  label: c
+  placeholder: s,
+  fullWidth: n = !0,
+  label: c,
+  variant: i = "outlined"
 }) => /* @__PURE__ */ o(
-  u,
+  b,
   {
     "data-testid": "search-bar-input",
-    className: `${r ?? ""} ${d.searchbar}`,
+    className: `${r ?? ""} ${p.searchbar}`,
     dense: e,
     label: c,
-    variant: "outlined",
-    placeholder: n,
+    variant: i,
+    placeholder: s,
     value: t,
-    onChange: (i) => a(i.target.value),
-    fullWidth: s,
+    onChange: (l) => a(l.target.value),
+    fullWidth: n,
     trailingIcon: /* @__PURE__ */ o(
-      l,
+      u,
       {
         "data-testid": "search-bar-icon-button",
         icon: t ? "close" : "search",
@@ -35,5 +36,5 @@ import '../../assets/SearchBar.css';const b = "_searchbar_g83qp_1", d = {
   }
 );
 export {
-  g as SearchBar
+  m as SearchBar
 };

package/dist/types/Languages.d.ts

@@ -92,5 +92,7 @@ export declare const LANGUAGE_CODES_MAPPER: Record<AVAILABLE_LANGUAGE_CODES, LAN
  * - Spain (esp)
  * - Mexico (mex)
  * - Turkey (tur)
+ * - Netherlands (nld)
+ * - Canada (can)
  */
 export declare const AVAILABLE_COUNTRY_KEYS: string[];

package/dist/types/Languages.js

@@ -7,17 +7,17 @@ const A = "bb8077e3-ad50-4c1d-8b17-b768b1c9f041", e = "bb8077e3-ad50-4c1d-8b17-b
   "es",
   "tr"
   // 'de' currently not supported
-], t = {
+], n = {
   en: "en-US",
   es: "es-MX",
   tr: "tr-TR"
-}, G = ["esp", "mex", "tur"];
+}, t = ["esp", "mex", "tur", "nld", "can"];
 export {
-  G as AVAILABLE_COUNTRY_KEYS,
+  t as AVAILABLE_COUNTRY_KEYS,
   _ as AVAILABLE_LOCALES,
   A as ENGLISH_LANGUAGE_ID,
   e as GERMAN_LANGUAGE_ID,
-  t as LANGUAGE_CODES_MAPPER,
+  n as LANGUAGE_CODES_MAPPER,
   E as LANGUAGE_ID_MAPPER,
   b as SPANISH_LANGUAGE_ID,
   c as TURKISH_LANGUAGE_ID

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@hortiview/shared-components",
   "description": "This is a shared component library. It should used in the HortiView platform and its modules.",
-  "version": "2.19.0",
+  "version": "2.20.0",
   "type": "module",
   "repository": "https://dev.azure.com/sdundc/HV%20Platform/_git/HortiView-Frontend-Shared",
   "author": "Falk Menge <falk.menge.ext@bayer.com>",