design-system-silkhaus 3.13.0-beta.lint-rule.1 → 4.0.0-beta.combine-tailwind-config.1

package/dist/app/index.js

@@ -1,9 +1,279 @@
-import { B as s, a as t, b as n, D as p, M as r, f as e } from "../index-DoJhqBt6.js";
+var J = Object.defineProperty, K = Object.defineProperties;
+var L = Object.getOwnPropertyDescriptors;
+var C = Object.getOwnPropertySymbols;
+var Q = Object.prototype.hasOwnProperty, X = Object.prototype.propertyIsEnumerable;
+var I = (s, e, a) => e in s ? J(s, e, { enumerable: !0, configurable: !0, writable: !0, value: a }) : s[e] = a, x = (s, e) => {
+  for (var a in e || (e = {}))
+    Q.call(e, a) && I(s, a, e[a]);
+  if (C)
+    for (var a of C(e))
+      X.call(e, a) && I(s, a, e[a]);
+  return s;
+}, k = (s, e) => K(s, L(e));
+import { j as d, p as Y, u as Z, o as _, i as O, s as ss, r as es, v as ds, d as as, e as ls, f as ts, g as rs, a as m, F as ns, A as is, h as os, D as cs, x as us, C as fs, l as xs, k as ms, n as ps } from "../ButtonsGroupSelector-sjBrndhv.js";
+import { w as ks } from "../ButtonsGroupSelector-sjBrndhv.js";
+import { useState as b } from "react";
+const hs = (s) => window.innerWidth < Y ? /* @__PURE__ */ d.jsx(R, x({}, s)) : /* @__PURE__ */ d.jsx(M, x({}, s));
+hs.displayName = "Dropdown";
+const M = ({
+  placement: s = "bottom-start",
+  trigger: e,
+  triggerContainerClassName: a,
+  disabled: l,
+  onOpenChange: o,
+  adjustHeight: n = !0,
+  adjustWidth: t = !0,
+  options: r,
+  getSelectedValueDisplayText: i = P,
+  placeholder: u,
+  value: f,
+  isMultiSelect: y,
+  onChange: w
+}) => {
+  const [p, N] = b(), h = typeof f == "undefined" ? p : f, c = typeof f == "undefined" ? N : () => {
+  }, [A, F] = b(!1), { refs: g, floatingStyles: B, context: j } = Z({
+    open: A,
+    onOpenChange: (v) => {
+      F(v), o && o(v);
+    },
+    middleware: [
+      _(8),
+      O({
+        crossAxis: s.includes("-"),
+        fallbackAxisSideDirection: "end"
+      }),
+      ss({ padding: 4 }),
+      es({
+        apply({ availableWidth: v, availableHeight: q, elements: z }) {
+          n && (z.floating.style.maxHeight = `${q - 4}px`), t && (z.floating.style.maxWidth = `${v - 4}px`);
+        }
+      })
+    ],
+    whileElementsMounted: os,
+    placement: s
+  }), E = ds(j), W = as(j), $ = ls(j), G = ts(j), { getReferenceProps: T, getFloatingProps: H } = rs([E, W, $, G]);
+  return e || (e = /* @__PURE__ */ d.jsx(
+    U,
+    {
+      selectedOption: D(h, r),
+      getSelectedValueDisplayText: i,
+      placeholder: u
+    }
+  )), l ? /* @__PURE__ */ d.jsx("div", { className: a, children: e }) : /* @__PURE__ */ d.jsxs(d.Fragment, { children: [
+    /* @__PURE__ */ d.jsx(
+      "div",
+      k(x({
+        className: m("ds-cursor-pointer", a),
+        ref: g.setReference
+      }, T()), {
+        children: e
+      })
+    ),
+    A && /* @__PURE__ */ d.jsx(ns, { children: /* @__PURE__ */ d.jsx(
+      "div",
+      k(x({
+        ref: g.setFloating,
+        style: B
+      }, H()), {
+        className: m(
+          "ds-z-[29999] ds-flex ds-min-w-[200px] ds-flex-col ds-gap-1 ds-rounded ds-bg-white ds-p-2 ds-shadow-md",
+          n && "ds-overflow-y-auto",
+          t && "ds-overflow-x-auto"
+        ),
+        children: /* @__PURE__ */ d.jsx(
+          V,
+          {
+            isMultiSelect: y,
+            options: r,
+            value: h,
+            setValue: c,
+            setIsOpen: F,
+            onChange: w
+          }
+        )
+      })
+    ) })
+  ] });
+};
+M.displayName = "DesktopDropdown";
+const R = ({
+  trigger: s,
+  triggerContainerClassName: e,
+  disabled: a,
+  onOpenChange: l,
+  getSelectedValueDisplayText: o = P,
+  placeholder: n,
+  value: t,
+  options: r,
+  isMultiSelect: i,
+  onChange: u,
+  closeButtonLabel: f = "Close"
+}) => {
+  const [y, w] = b(), p = typeof t == "undefined" ? y : t, N = typeof t == "undefined" ? w : () => {
+  }, [h, c] = b(!1);
+  return s || (s = /* @__PURE__ */ d.jsx(
+    U,
+    {
+      selectedOption: D(p, r),
+      getSelectedValueDisplayText: o,
+      placeholder: n
+    }
+  )), a ? /* @__PURE__ */ d.jsx("div", { className: e, children: s }) : /* @__PURE__ */ d.jsxs(d.Fragment, { children: [
+    /* @__PURE__ */ d.jsx(
+      "div",
+      {
+        className: e,
+        onClick: () => {
+          c(!0), l && l(!0);
+        },
+        children: s
+      }
+    ),
+    /* @__PURE__ */ d.jsx(
+      is,
+      {
+        animation: "slideUp",
+        show: h,
+        handleClose: () => {
+          c(!1), l && l(!1);
+        },
+        contentClassName: m("ds-absolute ds-mb-0 ds-w-full"),
+        className: "ds-z-[29999]",
+        children: /* @__PURE__ */ d.jsx(
+          S,
+          {
+            onClose: () => {
+              c(!1), l && l(!1);
+            },
+            closeButtonLabel: f,
+            children: /* @__PURE__ */ d.jsx(
+              V,
+              {
+                isMultiSelect: i,
+                options: r,
+                value: p,
+                setValue: N,
+                setIsOpen: c,
+                onChange: u
+              }
+            )
+          }
+        )
+      }
+    )
+  ] });
+};
+R.displayName = "MobileDropdown";
+const S = ({ onClose: s, closeButtonLabel: e, children: a }) => /* @__PURE__ */ d.jsxs("div", { className: "ds-mb-0 ds-flex ds-max-h-dvh ds-w-full ds-flex-col ds-bg-white", children: [
+  /* @__PURE__ */ d.jsxs("div", { className: "ds-flex ds-shrink-0 ds-items-center ds-justify-between ds-px-8 ds-py-4", children: [
+    /* @__PURE__ */ d.jsx(
+      "div",
+      {
+        onClick: s,
+        className: "ds-flex ds-size-5 ds-cursor-pointer ds-items-center ds-justify-center",
+        children: /* @__PURE__ */ d.jsx(fs, { className: "ds-size-4" })
+      }
+    ),
+    /* @__PURE__ */ d.jsx("div", { className: "ds-size-5" })
+  ] }),
+  /* @__PURE__ */ d.jsx("div", { className: "ds-grow ds-overflow-y-auto ds-p-4 ds-text-xSmallCalloutRegular", children: a }),
+  /* @__PURE__ */ d.jsx("div", { className: "ds-px-8 ds-py-4", children: /* @__PURE__ */ d.jsx(
+    xs,
+    {
+      buttonClassName: "ds-py-3",
+      onClick: s,
+      children: e
+    }
+  ) })
+] });
+S.displayName = "MobilePopoverContentWrapper";
+const U = ({
+  selectedOption: s,
+  getSelectedValueDisplayText: e,
+  placeholder: a
+}) => {
+  const l = !s || Array.isArray(s) && s.length === 0 ? a || "" : e(s);
+  return /* @__PURE__ */ d.jsx(
+    cs,
+    {
+      color: "secondary",
+      endIcon: /* @__PURE__ */ d.jsx(us, { className: "ds-size-4" }),
+      buttonClassName: "ds-justify-between",
+      children: l
+    }
+  );
+}, V = ({
+  options: s,
+  isMultiSelect: e,
+  value: a,
+  setValue: l,
+  setIsOpen: o,
+  onChange: n
+}) => s && s.map((t) => /* @__PURE__ */ d.jsx(
+  js,
+  {
+    onClick: () => {
+      let r;
+      if (e) {
+        const i = a || [];
+        i.includes(t.value) ? r = i.filter((u) => u !== t.value) : r = [...i, t.value];
+      } else
+        r = t.value, o(!1);
+      l(r), n && n(D(r, s));
+    },
+    option: t,
+    isSelected: Array.isArray(a) ? a.some((r) => r === t.value) : a === t.value,
+    showCheckbox: e
+  },
+  t.value
+)), js = ({
+  onClick: s,
+  option: e,
+  isSelected: a,
+  showCheckbox: l
+}) => /* @__PURE__ */ d.jsxs(
+  "div",
+  {
+    onClick: e.disabled ? void 0 : s,
+    className: m(
+      "ds-group ds-flex ds-min-h-[72px] ds-cursor-pointer ds-items-center ds-gap-4 ds-rounded ds-px-4 ds-py-2 ds-text-mediumSubHeadEmphasized hover:ds-bg-[#F6F8FC] ds-tablet:ds-min-h-[auto] ds-tablet:ds-gap-2 ds-tablet:ds-px-2 ds-desktop:ds-text-mediumFootnoteEmphasized",
+      !l && "ds-transition-[padding] ds-duration-300 hover:ds-px-4"
+    ),
+    children: [
+      e.thumbnailUrl && /* @__PURE__ */ d.jsx(
+        "img",
+        {
+          src: e.thumbnailUrl,
+          className: "ds-h-14 ds-w-14 ds-shrink-0 ds-rounded ds-object-cover group-hover:ds-pr-0 ds-tablet:ds-h-6 ds-tablet:ds-w-9 ds-tablet:ds-rounded-sm"
+        }
+      ),
+      e.icon,
+      /* @__PURE__ */ d.jsx(
+        "div",
+        {
+          className: m(
+            "ds-flex-grow",
+            !l && "ds-transition-[padding] ds-duration-300 group-hover:ds-pr-0 ds-tablet:ds-pr-4"
+          ),
+          children: e.label
+        }
+      ),
+      a && !l && /* @__PURE__ */ d.jsx(ms, { className: "ds-size-4 ds-shrink-0" }),
+      l && /* @__PURE__ */ d.jsx(
+        ps,
+        {
+          isChecked: a,
+          disabled: e.disabled
+        }
+      )
+    ]
+  }
+), D = (s, e) => Array.isArray(s) ? e.filter((a) => s.includes(a.value)) : e.find((a) => a.value === s), P = (s) => Array.isArray(s) ? s.map((e) => e.label).join(", ") : s.label;
 export {
-  s as Button,
-  t as ButtonsGroupSelector,
-  n as DesktopDropdown,
-  p as Dropdown,
-  r as MobileDropdown,
-  e as findOptionByValue
+  cs as Button,
+  ks as ButtonsGroupSelector,
+  M as DesktopDropdown,
+  hs as Dropdown,
+  R as MobileDropdown,
+  D as findOptionByValue
 };

package/dist/index.d.ts

@@ -42,13 +42,6 @@ export declare interface AccordionProps {
     onStateChange?: (state: boolean) => void;
 }
 
-export declare const ActionBar: ({ applyLabel, cancelLabel, onApply, onCancel, }: {
-    applyLabel: string;
-    cancelLabel: string;
-    onApply?: () => void;
-    onCancel?: () => void;
-}) => JSX_2.Element;
-
 declare type ActionButtonProps = {
     label: string;
 } & ButtonProps;
@@ -509,8 +502,6 @@ export declare const DeleteIcon: FC<{
 
 export declare const desktopMinWidth: number;
 
-export declare const DesktopMonthRangePicker: FC<PropsWithChildren<MonthRangePickerProps>>;
-
 export declare const DesktopPopover: FC<PropsWithChildren<PopoverProps>>;
 
 export declare const DesktopTooltip: FC<PropsWithChildren<TooltipProps>>;
@@ -959,8 +950,6 @@ export declare interface MobileFilterMenuProps extends HTMLAttributes<HTMLDivEle
     rtl?: boolean;
 }
 
-export declare const MobileMonthRangePicker: FC<PropsWithChildren<MonthRangePickerProps>>;
-
 export declare const MobileMultiSelectFilterDropDown: ForwardRefExoticComponent<MobileMultiSelectFilterDropDownProps & RefAttributes<HTMLDivElement>>;
 
 export declare interface MobileMultiSelectFilterDropDownProps extends HTMLAttributes<HTMLDivElement> {
@@ -1014,39 +1003,6 @@ export declare const MoneyIcon: FC<{
     className?: string;
 }>;
 
-export declare type MonthIndex = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11;
-
-export declare type MonthRange = {
-    startDate: MonthYear;
-    endDate?: MonthYear;
-};
-
-export declare const MonthRangePicker: FC<PropsWithChildren<MonthRangePickerProps>>;
-
-export declare type MonthRangePickerProps = {
-    minDate: MonthYear;
-    maxDate: MonthYear;
-    value?: MonthRange;
-    onChange?: (value: MonthRange, shortcut: ShortcutsKey) => void;
-    trigger?: ReactNode;
-    triggerContainerClassName?: string;
-    disabled?: boolean;
-    placeholder?: string;
-    /**
-     * Pass this callback function if you want to override the default selected value display text.
-     * By default the dropdown will display the selected dates in the format of "MMM YY - MMM YY"
-     */
-    getSelectedValueDisplayText?: (value?: MonthRange, placeholder?: string) => string;
-    shortcutLabels: ShortcutsProps['labels'];
-    applyLabel?: string;
-    cancelLabel?: string;
-};
-
-export declare type MonthYear = {
-    month: MonthIndex;
-    year: number;
-};
-
 export declare const MoonIcon: FC<{
     className?: string;
 }>;
@@ -1527,15 +1483,6 @@ export declare const ShareIcon: FC<{
     className?: string;
 }>;
 
-declare type ShortcutsKey = 'custom' | 'currentMonth' | 'lastMonth' | 'last3Months' | 'last12Months' | 'allTime';
-
-declare type ShortcutsProps = {
-    labels: Record<ShortcutsKey, string>;
-    value?: ShortcutsKey;
-    onChange?: (value: ShortcutsKey) => void;
-    className?: string;
-};
-
 export declare const SingleBuildingIcon: FC<{
     className?: string;
 }>;
@@ -1689,6 +1636,10 @@ declare const textVariants: {
         readonly lineHeight: "var(--xLargeHero-TitleRegular-line-height)";
         readonly fontWeight: "var(--xLargeHero-TitleRegular-font-weight)";
     }];
+    readonly xLargeHeroTitleEmphasized: readonly ["var(--xLargeHero-TitleEmphasized-font-size)", {
+        readonly lineHeight: "var(--xLargeHero-TitleEmphasized-line-height)";
+        readonly fontWeight: "var(--font-weight-semibold)";
+    }];
     readonly xLargeTitle1Regular: readonly ["var(--xLargeTitle-1Regular-font-size)", {
         readonly lineHeight: "var(--xLargeTitle-1Regular-line-height)";
         readonly fontWeight: "var(--xLargeTitle-1Regular-font-weight)";
@@ -1749,6 +1700,10 @@ declare const textVariants: {
         readonly lineHeight: "var(--LargeHero-TitleRegular-line-height)";
         readonly fontWeight: "var(--LargeHero-TitleRegular-font-weight)";
     }];
+    readonly largeHeroTitleEmphasized: readonly ["var(--LargeHero-TitleEmphasized-font-size)", {
+        readonly lineHeight: "var(--LargeHero-TitleEmphasized-line-height)";
+        readonly fontWeight: "var(--font-weight-semibold)";
+    }];
     readonly largeTitle1Regular: readonly ["var(--LargeTitle-1Regular-font-size)", {
         readonly lineHeight: "var(--LargeTitle-1Regular-line-height)";
         readonly fontWeight: "var(--LargeTitle-1Regular-font-weight)";
@@ -1809,6 +1764,10 @@ declare const textVariants: {
         readonly lineHeight: "var(--MediumHero-TitleRegular-line-height)";
         readonly fontWeight: "var(--MediumHero-TitleRegular-font-weight)";
     }];
+    readonly mediumHeroTitleEmphasized: readonly ["var(--MediumHero-TitleEmphasized-font-size)", {
+        readonly lineHeight: "var(--MediumHero-TitleEmphasized-line-height)";
+        readonly fontWeight: "var(--font-weight-semibold)";
+    }];
     readonly mediumTitle1Regular: readonly ["var(--MediumTitle-1Regular-font-size)", {
         readonly lineHeight: "var(--MediumTitle-1Regular-line-height)";
         readonly fontWeight: "var(--MediumTitle-1Regular-font-weight)";
@@ -1909,6 +1868,10 @@ declare const textVariants: {
         readonly lineHeight: "var(--SmallHero-TitleRegular-line-height)";
         readonly fontWeight: "var(--SmallHero-TitleRegular-font-weight)";
     }];
+    readonly smallHeroTitleEmphasized: readonly ["var(--SmallHero-TitleEmphasized-font-size)", {
+        readonly lineHeight: "var(--SmallHero-TitleEmphasized-line-height)";
+        readonly fontWeight: "var(--font-weight-semibold)";
+    }];
     readonly smallTitle1Regular: readonly ["var(--SmallTitle-1Regular-font-size)", {
         readonly lineHeight: "var(--SmallTitle-1Regular-line-height)";
         readonly fontWeight: "var(--SmallTitle-1Regular-font-weight)";
@@ -1933,30 +1896,14 @@ declare const textVariants: {
         readonly lineHeight: "var(--SmallTitle-3Regular-line-height)";
         readonly fontWeight: "var(--font-weight-semibold)";
     }];
-    readonly smallBodyRegular: readonly ["15px", {
-        readonly lineHeight: "24px";
-        readonly fontWeight: "var(--font-weight-normal)";
-    }];
-    readonly smallBodyEmphasized: readonly ["15px", {
-        readonly lineHeight: "24px";
-        readonly fontWeight: "var(--font-weight-semibold)";
-    }];
     readonly smallBody1Regular: readonly ["var(--SmallBody-1Regular-font-size)", {
         readonly lineHeight: "var(--SmallBody-1Regular-line-height)";
         readonly fontWeight: "var(--SmallBody-1Regular-font-weight)";
     }];
-    readonly smallBody1Emphasized: readonly ["var(--SmallBody-1Regular-font-size)", {
-        readonly lineHeight: "var(--SmallBody-1Regular-line-height)";
-        readonly fontWeight: "var(--font-weight-semibold)";
-    }];
     readonly smallBody2Regular: readonly ["var(--SmallBody-2Regular-font-size)", {
         readonly lineHeight: "var(--SmallBody-2Regular-line-height)";
         readonly fontWeight: "var(--SmallBody-2Regular-font-weight)";
     }];
-    readonly smallBody2Emphasized: readonly ["var(--SmallBody-2Regular-font-size)", {
-        readonly lineHeight: "var(--SmallBody-2Regular-line-height)";
-        readonly fontWeight: "var(--font-weight-semibold)";
-    }];
     readonly smallSubheadRegular: readonly ["var(--SmallSubhead-Regular-font-size)", {
         readonly lineHeight: "var(--SmallSubhead-Regular-line-height)";
         readonly fontWeight: "var(--font-weight-normal)";
@@ -2001,6 +1948,10 @@ declare const textVariants: {
         readonly lineHeight: "var(--xSmallHero-TitleRegular-line-height)";
         readonly fontWeight: "var(--xSmallHero-TitleRegular-font-weight)";
     }];
+    readonly xSmallHeroTitleEmphasized: readonly ["var(--xSmallHero-TitleEmphasized-font-size)", {
+        readonly lineHeight: "var(--xSmallHero-TitleEmphasized-line-height)";
+        readonly fontWeight: "var(--font-weight-semibold)";
+    }];
     readonly xSmallTitle1Regular: readonly ["var(--xSmallTitle-1Regular-font-size)", {
         readonly lineHeight: "var(--xSmallTitle-1Regular-line-height)";
         readonly fontWeight: "var(--xSmallTitle-1Regular-font-weight)";
@@ -2275,9 +2226,6 @@ export declare const useDocumentSize: () => {
     documentWidth: number;
     documentHeight: number;
     screenSize: "mobile" | "tablet" | "desktop";
-    isMobile: boolean;
-    isTablet: boolean;
-    isDesktop: boolean;
 };
 
 export declare const WarningHollowIcon: FC<{