gd-design-library 1.0.2 → 1.2.0

package/components/core/Typography/TypographyStyled.js

@@ -1,37 +1,36 @@
-"use client";
 import { jsx as z } from "@emotion/react/jsx-runtime";
-import { forwardRef as V } from "react";
-import { getBoxStyles as w, tokensHandler as A } from "../../../tokens/utils.js";
-import { TextAlign as B, TypographyVariant as j } from "../../../types/typography.js";
-import { SizeVariant as k } from "../../../types/common.js";
+import { forwardRef as A } from "react";
+import { getBoxStyles as B, tokensHandler as j } from "../../../tokens/utils.js";
 import { get as t } from "../../../utils/helpers.js";
-const D = V((p, y) => {
+import { TypographyVariant as k, TextAlign as v } from "../../../types/typography.js";
+import { SizeVariant as H } from "../../../types/common.js";
+const E = A(({
+  theme: {
+    typography: n,
+    colors: y,
+    ...m
+  } = {},
+  $as: c = "span",
+  $color: o,
+  $align: i = v.Start,
+  $variant: p = k.Inherit,
+  $size: a = H.Md,
+  $styleVariant: r,
+  styles: S,
+  ...l
+}, f) => {
   const {
-    theme: {
-      typography: a,
-      colors: i,
-      ...c
-    } = {},
-    $as: l = "span",
-    $color: e,
-    $align: m = B.Start,
-    $variant: n = j.Inherit,
-    $size: S = k.Md,
-    $styleVariant: r,
-    styles: g,
-    ...f
-  } = p, {
-    boxStyles: d,
-    restProps: h
-  } = w(f), o = new Proxy(a || {}, A(c)), u = t(o, "base", {}), x = t(o, n, {}), $ = t(o, [n, S], {}), T = e && t(i, e, e), s = typeof r == "string" ? [r] : r, P = s == null ? void 0 : s.reduce((b, v) => ({
-    ...b,
-    ...t(o, ["styleVariant", v], {})
+    boxStyles: g,
+    restProps: d
+  } = B(l), e = new Proxy(n || {}, j(m)), h = t(e, "base", {}), x = t(e, p, {}), u = t(e, [p, a], {}), T = o && t(y, o, o), s = typeof r == "string" ? [r] : r, b = s == null ? void 0 : s.reduce((P, w) => ({
+    ...P,
+    ...t(e, ["styleVariant", w], {})
   }), {});
-  return /* @__PURE__ */ z(l, { css: [u, x, $, P, {
-    textAlign: m,
+  return /* @__PURE__ */ z(c, { css: [h, x, u, b, {
+    textAlign: i,
     color: T
-  }, d, g], ...h, ref: y });
+  }, g, S], ...d, ref: f });
 });
 export {
-  D as TypographyStyled
+  E as TypographyStyled
 };

package/components/domainSpecific/Accordion/Accordion.d.ts

@@ -1,2 +1,2 @@
 import { AccordionWrapperProps } from './Accordion.types';
-export declare const Accordion: ({ children, allowMultipleExpand, value, defaultValue, onChange, }: AccordionWrapperProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const Accordion: ({ children, allowMultipleExpand, withoutSeparator, value, defaultValue, onChange, }: AccordionWrapperProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/components/domainSpecific/Accordion/Accordion.js

@@ -1,35 +1,37 @@
 "use client";
-import { jsx as O } from "@emotion/react/jsx-runtime";
-import { useState as x, useCallback as i, useMemo as A } from "react";
-import { isArray as a, without as b } from "../../../utils/helpers.js";
-import { AccordionContext as j } from "./hooks/useAccordion.js";
-const z = ({
-  children: p,
+import { jsx as x } from "@emotion/react/jsx-runtime";
+import { useState as A, useCallback as p, useMemo as b } from "react";
+import { isArray as j, without as v } from "../../../utils/helpers.js";
+import { AccordionContext as P } from "./hooks/useAccordion.js";
+const G = ({
+  children: u,
   allowMultipleExpand: m = !1,
-  value: n,
-  defaultValue: u = [],
+  withoutSeparator: n,
+  value: d,
+  defaultValue: I = [],
   onChange: s
 }) => {
-  const [I, f] = x(u), o = a(n), e = o ? n : I, r = i((t) => {
+  const [f, l] = A(I), o = j(d), e = o ? d : f, r = p((t) => {
     if (o) {
       s == null || s(t);
       return;
     }
-    f(t);
-  }, [s, o]), d = i((t) => {
+    l(t);
+  }, [s, o]), i = p((t) => {
     if (e.includes(t)) {
-      const c = b(e, t);
+      const c = v(e, t);
       r(c);
     } else {
       const c = m ? [...e, t] : [t];
       r(c);
     }
-  }, [m, e, r]), l = A(() => ({
+  }, [m, e, r]), O = b(() => ({
     openedItems: e,
-    toggleItem: d
-  }), [d, e]);
-  return /* @__PURE__ */ O(j.Provider, { value: l, children: p });
+    toggleItem: i,
+    withoutSeparator: n
+  }), [i, e, n]);
+  return /* @__PURE__ */ x(P.Provider, { value: O, children: u });
 };
 export {
-  z as Accordion
+  G as Accordion
 };

package/components/domainSpecific/Accordion/Accordion.types.d.ts

@@ -1,23 +1,26 @@
 import { PropsWithChildren, ReactNode } from 'react';
-import { CommonCssComponentProps, CommonCssComponentStyledProps } from '../../index.types';
-export interface AccordionBaseProps extends CommonCssComponentProps, PropsWithChildren {
+import { CommonCssComponentProps, CommonCssComponentStyledProps, BoxCssComponentProps, BoxCssComponentStyledProps } from '../../index.types';
+export interface AccordionBaseProps extends CommonCssComponentProps, Omit<BoxCssComponentProps, 'onClick'>, PropsWithChildren {
     isOpen?: boolean;
 }
 export interface AccordionHeaderProps extends AccordionBaseProps {
     expandIcon?: ReactNode;
 }
-export interface AccordionBasePropsStyled extends CommonCssComponentStyledProps, PropsWithChildren {
+export interface AccordionBasePropsStyled extends CommonCssComponentStyledProps, Omit<BoxCssComponentStyledProps, 'onAbort'>, PropsWithChildren {
     $isOpen?: boolean;
+    $withoutSeparator?: boolean;
 }
-export interface AccordionHeaderPropsStyled extends CommonCssComponentStyledProps<HTMLButtonElement>, PropsWithChildren {
+export interface AccordionHeaderPropsStyled extends CommonCssComponentStyledProps, Omit<BoxCssComponentStyledProps, 'onAbort'>, PropsWithChildren {
 }
 export type AccordionContextType = {
     openedItems: string[];
     toggleItem: (key: string) => void;
+    withoutSeparator?: boolean;
 };
 export interface AccordionWrapperProps {
     children: ReactNode;
     allowMultipleExpand?: boolean;
+    withoutSeparator?: boolean;
     value?: string[];
     defaultValue?: string[];
     onChange?: (openedItems: string[]) => void;

package/components/domainSpecific/Accordion/AccordionContent/AccordionContent.d.ts

@@ -1,2 +1,2 @@
 import { AccordionBaseProps } from '../Accordion.types';
-export declare const AccordionContent: ({ children, id, className, isOpen, styles }: AccordionBaseProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const AccordionContent: ({ children, id, className, isOpen, styles, ...rest }: AccordionBaseProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/components/domainSpecific/Accordion/AccordionContent/AccordionContent.js

@@ -1,21 +1,22 @@
 "use client";
-import { jsx as m } from "@emotion/react/jsx-runtime";
-import { CONTENT_COMPONENT as d } from "../constants.js";
-import { AccordionContentStyled as s } from "../AccordionStyled.js";
-import { useTheme as l } from "../../../../hooks/useTheme/useTheme.js";
-import { Roles as p } from "../../../core/types/roles.types.js";
-const O = ({
+import { jsx as d } from "@emotion/react/jsx-runtime";
+import { CONTENT_COMPONENT as s } from "../constants.js";
+import { AccordionContentStyled as l } from "../AccordionStyled.js";
+import { useTheme as p } from "../../../../hooks/useTheme/useTheme.js";
+import { Roles as f } from "../../../core/types/roles.types.js";
+const T = ({
   children: e,
   id: o,
   className: r = "",
   isOpen: t = !1,
-  styles: n = {}
+  styles: n = {},
+  ...c
 }) => {
-  const c = `accordion-panel-${o}`, i = `accordion-header-${o}`, {
-    theme: a
-  } = l();
-  return /* @__PURE__ */ m(s, { id: c, role: p.Region, "data-testid": `${d}-${o}`, "aria-labelledby": i, $isOpen: t, styles: n, theme: a, className: r, children: e });
+  const i = `accordion-panel-${o}`, a = `accordion-header-${o}`, {
+    theme: m
+  } = p();
+  return /* @__PURE__ */ d(l, { id: i, role: f.Region, "data-testid": `${s}-${o}`, "aria-labelledby": a, $isOpen: t, styles: n, theme: m, className: r, ...c, children: e });
 };
 export {
-  O as AccordionContent
+  T as AccordionContent
 };

package/components/domainSpecific/Accordion/AccordionHeader/AccordionHeader.d.ts

@@ -1,2 +1,2 @@
 import { AccordionHeaderProps } from '../Accordion.types';
-export declare const AccordionHeader: ({ children, id, styles, className, isOpen, expandIcon, }: AccordionHeaderProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const AccordionHeader: ({ children, id, styles, className, isOpen, expandIcon, ...rest }: AccordionHeaderProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/components/domainSpecific/Accordion/AccordionHeader/AccordionHeader.js

@@ -1,29 +1,30 @@
 "use client";
-import { jsxs as m, jsx as p } from "@emotion/react/jsx-runtime";
-import { HEADER_COMPONENT as f } from "../constants.js";
-import { AccordionHeaderStyled as h, AccordionIconStyled as A } from "../AccordionStyled.js";
-import { useTheme as $ } from "../../../../hooks/useTheme/useTheme.js";
-import { useAccordion as u } from "../hooks/useAccordion.js";
-const g = ({
+import { jsxs as p, jsx as f } from "@emotion/react/jsx-runtime";
+import { HEADER_COMPONENT as h } from "../constants.js";
+import { AccordionHeaderStyled as A, AccordionIconStyled as $ } from "../AccordionStyled.js";
+import { useTheme as u } from "../../../../hooks/useTheme/useTheme.js";
+import { useAccordion as x } from "../hooks/useAccordion.js";
+const j = ({
   children: t,
   id: o,
   styles: n = {},
   className: d = "",
   isOpen: e = !1,
-  expandIcon: r
+  expandIcon: r,
+  ...i
 }) => {
   const {
     theme: c
-  } = $(), {
-    toggleItem: i
-  } = u(), a = `accordion-header-${o}`, s = `accordion-panel-${o}`, l = () => {
-    o && i(o);
+  } = u(), {
+    toggleItem: a
+  } = x(), s = `accordion-header-${o}`, l = `accordion-panel-${o}`, m = () => {
+    o && a(o);
   };
-  return /* @__PURE__ */ m(h, { theme: c, id: a, "data-testid": `${f}-${o}`, className: d, "aria-expanded": e, "aria-controls": s, onClick: l, styles: n, children: [
+  return /* @__PURE__ */ p(A, { theme: c, id: s, "data-testid": `${h}-${o}`, className: d, "aria-expanded": e, "aria-controls": l, onClick: m, styles: n, ...i, children: [
     t,
-    r && /* @__PURE__ */ p(A, { theme: c, $isOpen: e, children: r })
+    r && /* @__PURE__ */ f($, { theme: c, $isOpen: e, children: r })
   ] });
 };
 export {
-  g as AccordionHeader
+  j as AccordionHeader
 };

package/components/domainSpecific/Accordion/AccordionItem/AccordionItem.d.ts

@@ -1,2 +1,2 @@
 import { AccordionBaseProps } from '../Accordion.types';
-export declare const AccordionItem: ({ children, id, styles, className }: AccordionBaseProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const AccordionItem: ({ children, id, styles, className, ...rest }: AccordionBaseProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/components/domainSpecific/Accordion/AccordionItem/AccordionItem.js

@@ -1,26 +1,28 @@
 "use client";
 import { jsx as s } from "@emotion/react/jsx-runtime";
-import { Children as l, isValidElement as p, cloneElement as a } from "react";
-import { ITEM_COMPONENT as u } from "../constants.js";
-import { AccordionItemStyled as d } from "../AccordionStyled.js";
-import { useAccordion as f } from "../hooks/useAccordion.js";
-import { useTheme as E } from "../../../../hooks/useTheme/useTheme.js";
-const C = ({
+import { Children as l, isValidElement as u, cloneElement as d } from "react";
+import { ITEM_COMPONENT as f } from "../constants.js";
+import { AccordionItemStyled as h } from "../AccordionStyled.js";
+import { useAccordion as E } from "../hooks/useAccordion.js";
+import { useTheme as I } from "../../../../hooks/useTheme/useTheme.js";
+const x = ({
   children: r,
-  id: e,
+  id: t,
   styles: n = {},
-  className: m = ""
+  className: m = "",
+  ...i
 }) => {
   const {
-    openedItems: c
-  } = f(), {
-    theme: i
-  } = E(), t = e && c.includes(e);
-  return /* @__PURE__ */ s(d, { "data-testid": `${u}-${e}`, "data-open": t, "data-value": e, theme: i, className: m, styles: n, children: l.map(r, (o) => p(o) ? a(o, {
-    id: e,
-    isOpen: t
+    openedItems: a,
+    withoutSeparator: c
+  } = E(), {
+    theme: p
+  } = I(), e = t && a.includes(t);
+  return /* @__PURE__ */ s(h, { "data-testid": `${f}-${t}`, "data-open": e, "data-value": t, theme: p, $withoutSeparator: c, className: m, styles: n, ...i, children: l.map(r, (o) => u(o) ? d(o, {
+    id: t,
+    isOpen: e
   }) : null) });
 };
 export {
-  C as AccordionItem
+  x as AccordionItem
 };

package/components/domainSpecific/Accordion/AccordionStyled.js

@@ -1,52 +1,61 @@
-"use client";
-import { jsx as l } from "@emotion/react/jsx-runtime";
-import { tokensHandler as p } from "../../../tokens/utils.js";
+import { jsx as y } from "@emotion/react/jsx-runtime";
+import { getBoxStyles as a, tokensHandler as i } from "../../../tokens/utils.js";
 import { get as t } from "../../../utils/helpers.js";
-const h = (n) => {
+const A = (e) => {
   const {
     theme: {
-      accordion: c,
-      ...s
+      accordion: s,
+      ...n
     } = {},
-    $isOpen: r,
-    styles: d = {},
-    ...m
-  } = n, o = new Proxy(c || {}, p(s)), e = t(o, "content", {}), i = r ? "opened" : "closed", y = [t(e, "default", {}), t(e, i, {}), d];
-  return /* @__PURE__ */ l("div", { css: y, ...m });
-}, A = (n) => {
+    $isOpen: c,
+    styles: r = {},
+    ...d
+  } = e, {
+    boxStyles: o,
+    restProps: p
+  } = a(d), l = new Proxy(s || {}, i(n)), m = t(l, "content", {}), S = c ? "opened" : "closed", u = [t(m, "default", {}), t(m, S, {}), o, r];
+  return /* @__PURE__ */ y("div", { css: u, ...p });
+}, f = (e) => {
   const {
     theme: {
-      accordion: c,
-      ...s
+      accordion: s,
+      ...n
     } = {},
-    styles: r,
-    ...d
-  } = n, m = new Proxy(c || {}, p(s)), o = t(m, "header", {}), e = [t(o, "default", {}), r];
-  return /* @__PURE__ */ l("button", { css: e, ...d });
-}, P = (n) => {
+    styles: c,
+    ...r
+  } = e, {
+    boxStyles: d,
+    restProps: o
+  } = a(r), p = new Proxy(s || {}, i(n)), l = t(p, "header", {}), m = [t(l, "default", {}), d, c];
+  return /* @__PURE__ */ y("button", { css: m, ...o });
+}, w = (e) => {
   const {
     theme: {
-      accordion: c,
-      ...s
+      accordion: s,
+      ...n
     } = {},
-    styles: r,
+    styles: c,
+    $withoutSeparator: r,
     ...d
-  } = n, m = new Proxy(c || {}, p(s)), o = t(m, "item", {}), e = [t(o, "default", {}), r];
-  return /* @__PURE__ */ l("div", { css: e, ...d });
-}, f = (n) => {
+  } = e, {
+    boxStyles: o,
+    restProps: p
+  } = a(d), l = new Proxy(s || {}, i(n)), m = t(l, r ? "itemNoSeparator" : "item", {}), S = [t(m, "default", {}), o, c];
+  return /* @__PURE__ */ y("div", { css: S, ...p });
+}, b = (e) => {
   const {
     theme: {
-      accordion: c,
-      ...s
+      accordion: s,
+      ...n
     } = {},
-    $isOpen: r,
-    ...d
-  } = n, m = new Proxy(c || {}, p(s)), o = t(m, "icon", {}), e = r ? "opened" : "closed", i = [t(o, "default", {}), t(o, e, {})];
-  return /* @__PURE__ */ l("span", { css: i, ...d });
+    $isOpen: c,
+    ...r
+  } = e, d = new Proxy(s || {}, i(n)), o = t(d, "icon", {}), p = c ? "opened" : "closed", l = [t(o, "default", {}), t(o, p, {})];
+  return /* @__PURE__ */ y("span", { css: l, ...r });
 };
 export {
-  h as AccordionContentStyled,
-  A as AccordionHeaderStyled,
-  f as AccordionIconStyled,
-  P as AccordionItemStyled
+  A as AccordionContentStyled,
+  f as AccordionHeaderStyled,
+  b as AccordionIconStyled,
+  w as AccordionItemStyled
 };

package/components/domainSpecific/Card/Card.js

@@ -1,35 +1,39 @@
 "use client";
-import { jsx as e } from "@emotion/react/jsx-runtime";
-import { forwardRef as a } from "react";
+import { jsx as a } from "@emotion/react/jsx-runtime";
+import { forwardRef as p } from "react";
 import { COMPONENT_NAME as r } from "./constants.js";
-import { CardRating as p } from "./CardRating/CardRating.js";
-import { CardDescription as f } from "./CardDescription/CardDescription.js";
-import { CardTitle as n } from "./CardTitle/CardTitle.js";
-import { CardButton as d } from "./CardButton/CardButton.js";
-import { CardPrice as C } from "./CardPrice/CardPrice.js";
-import { CardImage as s } from "./CardImage/CardImage.js";
-import { CardCounter as c } from "./CardCounter/CardCounter.js";
-import { Column as u } from "../../layout/Column/Column.js";
-import { Box as l } from "../../core/Box/Box.js";
-import { Row as g } from "../../layout/Row/Row.js";
-const N = a((o, t) => {
+import { CardRating as f } from "./CardRating/CardRating.js";
+import { CardDescription as n } from "./CardDescription/CardDescription.js";
+import { CardTitle as d } from "./CardTitle/CardTitle.js";
+import { CardButton as s } from "./CardButton/CardButton.js";
+import { CardPrice as c } from "./CardPrice/CardPrice.js";
+import { CardImage as C } from "./CardImage/CardImage.js";
+import { CardCounter as u } from "./CardCounter/CardCounter.js";
+import { Column as l } from "../../layout/Column/Column.js";
+import { Box as g } from "../../core/Box/Box.js";
+import { Row as N } from "../../layout/Row/Row.js";
+import { useTheme as R } from "../../../hooks/useTheme/useTheme.js";
+import { get as T } from "../../../utils/helpers.js";
+const h = p((o, t) => {
   const {
     children: m,
     ...i
-  } = o;
-  return /* @__PURE__ */ e(l, { ref: t, ...i, "data-testid": r, children: m });
-}), R = Object.assign(N, {
-  Row: g,
-  Column: u,
-  Counter: c,
-  Image: s,
-  Price: C,
-  Button: d,
-  Title: n,
-  Description: f,
-  Rating: p
+  } = o, {
+    theme: e
+  } = R();
+  return /* @__PURE__ */ a(g, { ref: t, css: T(e, "card.default", {}), ...i, "data-testid": r, children: m });
+}), x = Object.assign(h, {
+  Row: N,
+  Column: l,
+  Counter: u,
+  Image: C,
+  Price: c,
+  Button: s,
+  Title: d,
+  Description: n,
+  Rating: f
 });
-R.displayName = r;
+x.displayName = r;
 export {
-  R as Card
+  x as Card
 };

package/components/domainSpecific/Card/CardTitle/constants.js

@@ -1,8 +1,8 @@
-import { TypographyVariant as r } from "../../../../types/typography.js";
-import { CardSizeVariant as o } from "../../../../types/card.js";
+import { CardSizeVariant as r } from "../../../../types/card.js";
+import { TypographyVariant as o } from "../../../../types/typography.js";
 const i = "CardTitle", m = {
-  [o.Default]: r.H6,
-  [o.Sm]: r.Body1
+  [r.Default]: o.H6,
+  [r.Sm]: o.Body1
 };
 export {
   i as COMPONENT_NAME,

package/components/domainSpecific/Header/Header.js

@@ -3,10 +3,10 @@ import { jsxs as n, jsx as e, Fragment as B } from "@emotion/react/jsx-runtime";
 import { forwardRef as I, useState as A } from "react";
 import { COMPONENT_NAME as b } from "./constants.js";
 import { HeaderStyled as E, TopBannerRowStyled as H, NavigationRowStyled as $, MobileMenuOpenedDropdownWrapperStyled as D, CloseMenuIconWrapperStyled as F, MobileMenuWrapperStyled as P, MobileMenuItemWrapperStyled as Q, OpenMenuIconWrapperStyled as V, SearchColumnStyled as _, ActionsColumnStyled as q, MenuRowStyled as z, MenuColumnStyled as G, ChildrenRowStyled as J } from "./HeaderStyled.js";
-import { useMediaQuery as K } from "../../../hooks/useMediaQuery/useMediaQuery.js";
 import { Search as C } from "../Search/Search.js";
-import { useTheme as U } from "../../../hooks/useTheme/useTheme.js";
+import { useTheme as K } from "../../../hooks/useTheme/useTheme.js";
 import { get as i } from "../../../utils/helpers.js";
+import { useMediaQuery as U } from "../../../hooks/useMediaQuery/useMediaQuery.js";
 import { Row as d } from "../../layout/Row/Row.js";
 import { Column as t } from "../../layout/Column/Column.js";
 import { Icon as u } from "../../core/Icon/Icon.js";
@@ -16,7 +16,7 @@ const Z = I((x, j) => {
   var g;
   const {
     theme: r
-  } = U(), c = i(r, "header.icons", {}), {
+  } = K(), c = i(r, "header.icons", {}), {
     bgColor: R = i(r, "header.container.backgroundColor"),
     onMobileMenuItemClick: h,
     menuItemMapper: f,
@@ -30,7 +30,7 @@ const Z = I((x, j) => {
     menu: p,
     actions: o,
     ...k
-  } = x, S = K(`(max-width: ${(g = r == null ? void 0 : r.values) == null ? void 0 : g.screenMedium})`), [v, M] = A(!1);
+  } = x, S = U(`(max-width: ${(g = r == null ? void 0 : r.values) == null ? void 0 : g.screenMedium})`), [v, M] = A(!1);
   return /* @__PURE__ */ n(E, { ref: j, theme: r, $backgroundColor: R, "data-testid": b, ...k, children: [
     O && w && /* @__PURE__ */ e(H, { theme: r, justify: "center", children: w }),
     /* @__PURE__ */ e($, { theme: r, children: S ? v ? (

package/components/domainSpecific/SearchModal/SearchModal.js

@@ -18,7 +18,6 @@ const b = R((i, n) => {
     noHistoryResultsLabel: u = I,
     noResultsLabel: p = N,
     newSearchCta: E = A,
-    // @TODO: rename to loaderLinesCount, add possibility for a loader line set custom size
     loaderItemsCount: C = O,
     modalProps: e = {},
     searchProps: L = {},

package/components/domainSpecific/SearchModal/SearchModal.types.d.ts

@@ -24,7 +24,7 @@ export interface SearchItemsProps extends CommonCssComponentProps {
     noItemsLabel?: string;
     newSearchCta?: string;
 }
-export interface SearchModalProps extends CommonCssComponentProps {
+export interface SearchModalProps extends Omit<CommonCssComponentProps, 'results'> {
     results?: (never | SearchModalResultItemProps | SearchModalHistoryResultItemProps)[];
     historyResults?: (never | SearchModalResultItemProps | SearchModalHistoryResultItemProps)[];
     noResultsLabel?: string;

package/components/index.types.d.ts

@@ -52,6 +52,7 @@ export interface CommonCssInputStyledProps extends InputHTMLAttributes<HTMLInput
     ref?: ForwardedRef<HTMLInputElement>;
 }
 export interface BoxCssComponentProps<T = HTMLDivElement> extends CommonCssComponentProps<T> {
+    display?: string;
     overflow?: string;
     minWidth?: string;
     width?: string;

package/components/layout/ChatContainer/ChatContainer.d.ts

@@ -1,2 +1,2 @@
-import { ChatContainerProps, ChatContainerRef } from './ChatContainer.types';
+import { ChatContainerProps, ChatContainerRef } from './';
 export declare const ChatContainer: import('react').ForwardRefExoticComponent<ChatContainerProps & import('react').RefAttributes<ChatContainerRef>>;