@payfit/unity-components 2.46.12 → 2.46.13

package/dist/esm/components/data-table/parts/DataTableBulkActions.js

@@ -1,150 +0,0 @@
-import { jsx as o, jsxs as m, Fragment as A } from "react/jsx-runtime";
-import { useRef as d, useState as S, useCallback as k } from "react";
-import { useHotkeys as f } from "react-hotkeys-hook";
-import { useIntl as v, FormattedMessage as c } from "react-intl";
-import { ActionBar as I } from "../../action-bar/ActionBar.js";
-import { ActionBarButton as P } from "../../action-bar/parts/ActionBarButton.js";
-import { ActionBarIconButton as R } from "../../action-bar/parts/ActionBarIconButton.js";
-import { ActionBarRoot as w } from "../../action-bar/parts/ActionBarRoot.js";
-import { Button as x } from "../../button/Button.js";
-function F({
-  selectionCount: t,
-  onClearSelection: a,
-  renderSelectionText: r,
-  hasKeyshortcuts: s,
-  keyShortcuts: n
-}) {
-  return /* @__PURE__ */ m(A, { children: [
-    /* @__PURE__ */ m(
-      "div",
-      {
-        className: "uy:typography-body uy:whitespace-nowrap! uy:sr-only uy:md:not-sr-only",
-        role: "status",
-        "aria-live": "polite",
-        "aria-atomic": "true",
-        children: [
-          r ? r(t) : /* @__PURE__ */ o(
-            c,
-            {
-              id: "unity:component:action-bar:selection-count-text",
-              defaultMessage: "{selectionCount, plural, =0 {no items} one {item} other {items}} selected",
-              values: { selectionCount: t }
-            }
-          ),
-          s && /* @__PURE__ */ o("span", { className: "uy:sr-only", children: /* @__PURE__ */ o(
-            c,
-            {
-              id: "unity:component:action-bar:key-shortcuts-text",
-              defaultMessage: "Use {keyShortcuts} to focus the action bar",
-              values: {
-                keyShortcuts: n
-              }
-            }
-          ) })
-        ]
-      }
-    ),
-    /* @__PURE__ */ o(x, { color: "inverted", variant: "ghost", onPress: a, children: /* @__PURE__ */ o(
-      c,
-      {
-        id: "unity:component:action-bar:clear-selection-button",
-        defaultMessage: "Clear selection"
-      }
-    ) })
-  ] });
-}
-const C = (t) => t.type === "icon-button";
-function M({
-  table: t,
-  actions: a,
-  renderSelectionText: r
-}) {
-  const s = d(null), n = d(null), [g, i] = S(!1), p = v(), l = "f6";
-  f(
-    l,
-    () => {
-      if ((t.getIsAllPageRowsSelected() || t.getIsSomePageRowsSelected()) && s.current) {
-        const u = s.current.querySelectorAll(
-          'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
-        );
-        n.current = document.activeElement, u.length > 0 && (u[0].focus(), i(!0));
-      }
-    },
-    {
-      enableOnFormTags: !0
-    }
-  ), f(
-    "esc",
-    () => {
-      g && n.current && (n.current.focus(), i(!1));
-    },
-    {
-      enableOnFormTags: !0
-    }
-  );
-  const b = t.getIsAllPageRowsSelected() || t.getIsSomePageRowsSelected(), y = t.getSelectedRowModel().rows.length, h = t.getPageCount() > 0, B = k(() => {
-    t.resetRowSelection();
-  }, [t]);
-  return /* @__PURE__ */ o(
-    w,
-    {
-      isVisible: b,
-      offsetBottom: h ? "$600" : 0,
-      children: /* @__PURE__ */ o(
-        I,
-        {
-          ref: s,
-          actions: a,
-          prefixContent: /* @__PURE__ */ o(
-            F,
-            {
-              selectionCount: y,
-              onClearSelection: B,
-              renderSelectionText: r,
-              hasKeyshortcuts: !0,
-              keyShortcuts: l
-            }
-          ),
-          onFocus: () => {
-            i(!0);
-          },
-          onBlur: () => {
-            i(!1);
-          },
-          "aria-keyshortcuts": l,
-          "aria-label": p.formatMessage({
-            id: "unity:component:action-bar:toolbar-label",
-            defaultMessage: "Bulk actions toolbar"
-          }),
-          children: (e) => C(e) ? /* @__PURE__ */ o(
-            R,
-            {
-              icon: e.meta.icon,
-              label: e.label,
-              variant: e.variant,
-              onPress: e.meta.onPress,
-              isDisabled: e.meta.isDisabled,
-              isLoading: e.meta.isLoading
-            },
-            e.id
-          ) : /* @__PURE__ */ o(
-            P,
-            {
-              variant: e.variant,
-              onPress: e.meta?.onPress,
-              prefixIcon: e.meta?.prefixIcon,
-              isDisabled: e.meta?.isDisabled,
-              isLoading: e.meta?.isLoading,
-              children: e.label
-            },
-            e.id
-          )
-        }
-      )
-    }
-  );
-}
-M.displayName = "DataTableBulkActions";
-export {
-  M as DataTableBulkActions
-};

package/dist/esm/components/data-table/parts/DataTableRoot.d.ts

@@ -1,37 +0,0 @@
-import { PropsWithChildren } from 'react';
-export declare const dataTableRoot: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, string[], {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, string[], unknown, unknown, undefined>>;
-export type DataTableRootProps = PropsWithChildren;
-/**
- * The DataTableRoot component provides positioning and layout context for DataTable components.
- * It serves as the container for DataTable, DataTableBulkActions, and other related components.
- * @param {DataTableRootProps} props - The props for the DataTableRoot component
- * @example
- * ```tsx
- * import { DataTableRoot, DataTable, DataTableBulkActions } from '@payfit/unity-components'
- *
- * function Example() {
- *   return (
- *     <DataTableRoot>
- *       <DataTable table={table}>
- *         {row => (
- *           <TableRow key={row.id} isSelected={row.getIsSelected()}>
- *             {row.getVisibleCells().map(cell => (
- *               <TableCell key={cell.id}>
- *                 {flexRender(cell.column.columnDef.cell, cell.getContext())}
- *               </TableCell>
- *             ))}
- *           </TableRow>
- *         )}
- *       </DataTable>
- *       <DataTableBulkActions table={table} actions={actions} />
- *     </DataTableRoot>
- *   )
- * }
- * ```
- * @see {@link DataTableRootProps} for all available props
- * @see Source code in [Github](https://github.com/PayFit/hr-apps/tree/master/libs/shared/unity/components/src/components/data-table)
- */
-declare const DataTableRoot: import('react').ForwardRefExoticComponent<{
-    children?: import('react').ReactNode | undefined;
-} & import('react').RefAttributes<HTMLDivElement>>;
-export { DataTableRoot };

package/dist/esm/components/data-table/parts/DataTableRoot.js

@@ -1,13 +0,0 @@
-import { jsx as e } from "react/jsx-runtime";
-import { forwardRef as r } from "react";
-import { uyTv as m } from "@payfit/unity-themes";
-const i = m({
-  base: ["uy:relative uy:overflow-hidden"]
-}), l = r(
-  ({ children: o, ...a }, t) => /* @__PURE__ */ e("div", { ref: t, className: i(), ...a, children: o })
-);
-l.displayName = "DataTableRoot";
-export {
-  l as DataTableRoot,
-  i as dataTableRoot
-};

package/dist/esm/components/date-calendar/DateCalendar.d.ts

@@ -1,23 +0,0 @@
-import { DateValue } from '@internationalized/date';
-import { CalendarProps as AriaDateCalendarProps } from 'react-aria-components/Calendar';
-type PropsFromAriaCalendar<TDate extends DateValue> = AriaDateCalendarProps<TDate>;
-export type DateCalendarProps<TDate extends DateValue> = PropsFromAriaCalendar<TDate>;
-/**
- * The `DateCalendar` component displays one or more date grids and allows users to navigate through dates select a single date.
- * @param {DateCalendarProps} props - The props for the `DateCalendar` component
- * @example
- * ```tsx
- * import { DateCalendar } from '@payfit/unity-components'
- * import { CalendarDate } from '@internationalized/date'
- *
- * const [date, setDate] = useState(new CalendatDate(2022, 1, 1))
- * <DateCalendar value={date} onChange={setDate} />
- * ```
- * @see {@link DateCalendarProps} for all available props
- * @remarks [API and Demos](https://unity-components.payfit.io/?path=/docs/date-and-time-datecalendar--docs)
- */
-declare function DateCalendar<TDate extends DateValue>({ value, defaultValue, minValue, maxValue, onChange, onFocusChange, ...props }: DateCalendarProps<TDate>): import("react/jsx-runtime").JSX.Element;
-declare namespace DateCalendar {
-    var displayName: string;
-}
-export { DateCalendar };

package/dist/esm/components/date-calendar/DateCalendar.js

@@ -1,176 +0,0 @@
-import { jsx as a, jsxs as s } from "react/jsx-runtime";
-import { useState as b } from "react";
-import { today as k, getLocalTimeZone as f, isToday as F } from "@internationalized/date";
-import { useUnityTheme as R, uyTv as P } from "@payfit/unity-themes";
-import { Calendar as U, Heading as W, CalendarGrid as Z, CalendarGridHeader as $, CalendarHeaderCell as q, CalendarGridBody as w, CalendarCell as z } from "react-aria-components/Calendar";
-import { useIntl as A } from "react-intl";
-import { IconButton as C } from "../icon-button/IconButton.js";
-import { calendarBase as E } from "./DateCalendar.variants.js";
-import { useMonthsList as J } from "./hooks/useMonthsList.js";
-import { useYearsList as K } from "./hooks/useYearsList.js";
-import { DateSegmentSelect as v } from "./parts/DateSegmentSelect.js";
-const Q = P({
-  extend: E,
-  slots: {
-    calendarGrid: "uy:border-spacing-25",
-    calendarCell: [
-      // selected cells
-      //theme: common
-      "uy:data-[selected]:bg-surface-form-active",
-      //theme: legacy
-      "uy:theme-legacy:data-[selected]:text-content-inverted",
-      "uy:theme-legacy:data-[today]:data-[selected]:after:bg-content-inverted",
-      //theme:rebrand
-      "uy:theme-rebrand:data-[selected]:text-content-form-active",
-      "uy:theme-rebrand:data-[today]:data-[selected]:after:bg-border-form-active"
-    ]
-  },
-  variants: {
-    isDisabled: {
-      true: {
-        calendarCell: "uy:data-[selected]:bg-transparent uy:data-[selected]:text-content-neutral-disabled"
-      }
-    }
-  }
-});
-function X({
-  value: c,
-  defaultValue: d,
-  minValue: r,
-  maxValue: n,
-  onChange: p,
-  onFocusChange: D,
-  ...t
-}) {
-  const m = A(), { theme: y } = R(), N = k(f()), x = J(), G = K({
-    startYear: r?.year,
-    endYear: n?.year
-  }), [H, L] = b(c ?? d ?? null), [o, i] = b(() => {
-    const e = c ?? d ?? N;
-    return r && e.compare(r) < 0 ? r : n && e.compare(n) > 0 ? n : e;
-  }), M = (e) => {
-    i(
-      (l) => l.set({ month: parseInt(e, 10) })
-    );
-  }, S = (e) => {
-    i(
-      (l) => l.set({ year: parseInt(e, 10) })
-    );
-  }, {
-    base: B,
-    calendarWrapper: I,
-    dialogHeader: T,
-    dialogHeaderGroup: u,
-    calendarGrid: Y,
-    calendarHeaderCell: O,
-    calendarCell: j
-  } = Q({
-    isDisabled: t.isDisabled,
-    isInteractive: !t.isDisabled && !t.isReadOnly
-  }), h = y === "rebrand" ? "outlined" : "ghost", g = y === "rebrand" ? "primary" : "neutral";
-  return /* @__PURE__ */ a("div", { className: B(), "data-dd-privacy": "mask", children: /* @__PURE__ */ a(
-    U,
-    {
-      ...t,
-      minValue: r,
-      maxValue: n,
-      value: H,
-      defaultValue: d,
-      onChange: (e) => {
-        L(e), p?.(e);
-      },
-      focusedValue: o,
-      onFocusChange: (e) => {
-        i(e), D?.(e);
-      },
-      children: /* @__PURE__ */ s("div", { className: I(), children: [
-        /* @__PURE__ */ s("header", { className: T(), children: [
-          /* @__PURE__ */ a(W, { className: "uy:sr-only" }),
-          /* @__PURE__ */ s(
-            "div",
-            {
-              className: u({
-                className: "uy:pl-100 uy:gap-200"
-              }),
-              children: [
-                /* @__PURE__ */ a(
-                  v,
-                  {
-                    type: "month",
-                    items: x,
-                    value: o.month.toString(),
-                    onChange: M,
-                    isDisabled: t.isDisabled
-                  }
-                ),
-                /* @__PURE__ */ a(
-                  v,
-                  {
-                    type: "year",
-                    items: G,
-                    value: o.year.toString(),
-                    onChange: S,
-                    isDisabled: t.isDisabled
-                  }
-                )
-              ]
-            }
-          ),
-          /* @__PURE__ */ s(
-            "div",
-            {
-              className: u({
-                className: "uy:ml-auto uy:gap-100"
-              }),
-              children: [
-                /* @__PURE__ */ a(
-                  C,
-                  {
-                    slot: "previous",
-                    icon: "CaretLeftOutlined",
-                    color: g,
-                    label: m.formatMessage({
-                      id: "unity:component:common:previous",
-                      defaultMessage: "Previous"
-                    }),
-                    variant: h,
-                    isDisabled: t.isDisabled
-                  }
-                ),
-                /* @__PURE__ */ a(
-                  C,
-                  {
-                    slot: "next",
-                    icon: "CaretRightOutlined",
-                    color: g,
-                    label: m.formatMessage({
-                      id: "unity:component:common:next",
-                      defaultMessage: "Next"
-                    }),
-                    variant: h,
-                    isDisabled: t.isDisabled
-                  }
-                )
-              ]
-            }
-          )
-        ] }),
-        /* @__PURE__ */ s(Z, { className: Y(), weekdayStyle: "short", children: [
-          /* @__PURE__ */ a($, { children: (e) => /* @__PURE__ */ a(q, { className: O(), children: e }) }),
-          /* @__PURE__ */ a(w, { children: (e) => /* @__PURE__ */ a(
-            z,
-            {
-              date: e,
-              "data-today": F(e, f()) ? !0 : void 0,
-              className: j()
-            }
-          ) })
-        ] })
-      ] })
-    }
-  ) });
-}
-X.displayName = "DateCalendar";
-export {
-  X as DateCalendar
-};

package/dist/esm/components/date-calendar/DateCalendar.variants.d.ts

@@ -1,62 +0,0 @@
-/**
- * Base calendar styles shared between DateCalendar and DateRangeCalendar.
- * Use `extend: calendarBase` in component-specific uyTv definitions.
- */
-export declare const calendarBase: import('tailwind-variants').TVReturnType<{
-    isDisabled: {
-        true: {
-            calendarHeaderCell: string;
-        };
-    };
-    isInteractive: {
-        true: {
-            calendarCell: string[];
-        };
-    };
-}, {
-    base: string;
-    calendarWrapper: string;
-    dialogHeader: string;
-    dialogHeaderGroup: string;
-    calendarGrid: string;
-    calendarHeaderCell: string;
-    calendarCell: string[];
-}, undefined, {
-    isDisabled: {
-        true: {
-            calendarHeaderCell: string;
-        };
-    };
-    isInteractive: {
-        true: {
-            calendarCell: string[];
-        };
-    };
-}, {
-    base: string;
-    calendarWrapper: string;
-    dialogHeader: string;
-    dialogHeaderGroup: string;
-    calendarGrid: string;
-    calendarHeaderCell: string;
-    calendarCell: string[];
-}, import('tailwind-variants').TVReturnType<{
-    isDisabled: {
-        true: {
-            calendarHeaderCell: string;
-        };
-    };
-    isInteractive: {
-        true: {
-            calendarCell: string[];
-        };
-    };
-}, {
-    base: string;
-    calendarWrapper: string;
-    dialogHeader: string;
-    dialogHeaderGroup: string;
-    calendarGrid: string;
-    calendarHeaderCell: string;
-    calendarCell: string[];
-}, undefined, unknown, unknown, undefined>>;

package/dist/esm/components/date-calendar/DateCalendar.variants.js

@@ -1,51 +0,0 @@
-import { uyTv as e } from "@payfit/unity-themes";
-const t = e({
-  slots: {
-    base: "",
-    calendarWrapper: "uy:flex uy:flex-col uy:gap-100",
-    dialogHeader: "uy:flex uy:items-center uy:h-500 uy:w-full",
-    dialogHeaderGroup: "uy:flex uy:items-center",
-    calendarGrid: "uy:border-separate uy:w-full",
-    calendarHeaderCell: "uy:typography-body-small-strong uy:text-content-neutral-low uy:w-[44px] uy:h-[44px] uy:p-[1px] uy:uppercase",
-    calendarCell: [
-      //theme: common
-      // base styles
-      "uy:typography-body uy:relative uy:text-content-form-enabled uy:w-[44px] uy:h-[44px] uy:p-[1px] uy:outline-hidden uy:cursor-pointer uy:rounded-circle uy:flex uy:items-center uy:justify-center",
-      // cells outside of current month
-      "uy:data-[outside-month]:text-content-neutral-disabled uy:data-[outside-month]:cursor-not-allowed uy:data-[disabled]:text-content-neutral-disabled uy:data-[disabled]:cursor-not-allowed uy:data-[unavailable]:text-content-neutral-disabled uy:data-[unavailable]:cursor-not-allowed",
-      // "current day" (today) indicator — dot
-      "uy:data-[today]:after:content-[''] uy:data-[today]:after:absolute uy:data-[today]:after:bottom-[6px] uy:data-[today]:after:w-[6px] uy:data-[today]:after:h-[6px] uy:data-[today]:after:rounded-circle",
-      //theme: legacy
-      "uy:theme-legacy:data-[today]:after:bg-surface-primary-active",
-      //theme: rebrand
-      "uy:theme-rebrand:data-[today]:after:bg-border-form-active"
-    ]
-  },
-  variants: {
-    isDisabled: {
-      true: {
-        calendarHeaderCell: "uy:text-content-form-disabled"
-      }
-    },
-    isInteractive: {
-      true: {
-        calendarCell: [
-          //theme: common
-          "uy:hover:bg-surface-neutral-hover uy:active:bg-surface-form-active",
-          "uy:data-[pressed]:bg-surface-neutral-pressed uy:data-[focus-visible]:outline-2 uy:data-[focus-visible]:outline-solid uy:data-[focus-visible]:outline-utility-focus-ring uy:data-[focus-visible]:outline-offset-2",
-          //theme: rebrand
-          "uy:theme-rebrand:active:text-content-form-active",
-          // Disable hover on non-selectable cells
-          "uy:data-[disabled]:hover:bg-transparent uy:data-[unavailable]:hover:bg-transparent uy:data-[outside-month]:hover:bg-transparent"
-        ]
-      }
-    }
-  },
-  defaultVariants: {
-    isDisabled: !1,
-    isInteractive: !0
-  }
-});
-export {
-  t as calendarBase
-};

package/dist/esm/components/date-calendar/hooks/useMonthsList.d.ts

@@ -1,4 +0,0 @@
-export declare function useMonthsList(): {
-    id: string;
-    name: string;
-}[];

package/dist/esm/components/date-calendar/hooks/useMonthsList.js

@@ -1,26 +0,0 @@
-import { useMemo as l } from "react";
-import { createCalendar as d, today as i, getLocalTimeZone as a, CalendarDate as m } from "@internationalized/date";
-import { useLocale as u } from "react-aria-components/I18nProvider";
-function f() {
-  const { locale: o } = u(), c = new Intl.DateTimeFormat().resolvedOptions().calendar, e = d(c);
-  return l(() => {
-    const t = i(a()), n = new m(
-      e,
-      t.year,
-      t.month,
-      t.day
-    );
-    return Array.from({ length: e.getMonthsInYear(n) }).map(
-      (g, s) => {
-        const r = new m(e, n.year, s + 1, 1);
-        return {
-          id: r.month.toString(),
-          name: r.toDate(a()).toLocaleString(o, { month: "long" })
-        };
-      }
-    );
-  }, [o, e]);
-}
-export {
-  f as useMonthsList
-};

package/dist/esm/components/date-calendar/hooks/useYearsList.d.ts

@@ -1,10 +0,0 @@
-export interface UseYearsListOptions {
-    yearsBefore?: number;
-    yearsAfter?: number;
-    startYear?: number;
-    endYear?: number;
-}
-export declare function useYearsList({ yearsBefore, yearsAfter, startYear, endYear, }?: UseYearsListOptions): {
-    id: string;
-    name: string;
-}[];

package/dist/esm/components/date-calendar/hooks/useYearsList.js

@@ -1,33 +0,0 @@
-import { useMemo as g } from "react";
-import { today as D, getLocalTimeZone as c, createCalendar as L, CalendarDate as d } from "@internationalized/date";
-import { useLocale as v } from "react-aria-components/I18nProvider";
-function S({
-  yearsBefore: l = 100,
-  yearsAfter: s = 30,
-  startYear: m,
-  endYear: u
-} = {}) {
-  const { locale: o } = v(), a = D(c()), y = new Intl.DateTimeFormat().resolvedOptions().calendar, t = L(y), n = new d(
-    t,
-    a.year,
-    a.month,
-    a.day
-  );
-  let e = m, r = u;
-  return e === void 0 && (e = n.year - l), r === void 0 && (r = n.year + s), g(
-    () => Array.from({ length: r - e + 1 }).map((w, f) => {
-      const i = e + f, p = new d(t, i, 1, 1);
-      return {
-        id: i.toString(),
-        name: p.toDate(c()).toLocaleString(o, {
-          year: "numeric",
-          calendar: t.identifier
-        })
-      };
-    }),
-    [o, t, r, e]
-  );
-}
-export {
-  S as useYearsList
-};

package/dist/esm/components/date-calendar/parts/DateSegmentSelect.d.ts

@@ -1,15 +0,0 @@
-export interface DateSegmentSelectProps {
-    items: Array<{
-        id: string | number;
-        name: string;
-    }>;
-    value: string;
-    onChange: (value: string) => void;
-    type: 'month' | 'year';
-    isDisabled?: boolean;
-}
-declare function DateSegmentSelect({ items, value, onChange, type, isDisabled, }: DateSegmentSelectProps): import("react/jsx-runtime").JSX.Element;
-declare namespace DateSegmentSelect {
-    var displayName: string;
-}
-export { DateSegmentSelect };

package/dist/esm/components/date-calendar/parts/DateSegmentSelect.js

@@ -1,66 +0,0 @@
-import { jsxs as b, jsx as n } from "react/jsx-runtime";
-import { useState as I } from "react";
-import { IconSprite as v } from "@payfit/unity-icons";
-import { useId as $ } from "react-aria/useId";
-import { useIntl as w } from "react-intl";
-function x({
-  items: a,
-  value: o,
-  onChange: m,
-  type: e,
-  isDisabled: i = !1
-}) {
-  const s = (t) => () => a.find((g) => g.id === t)?.name ?? Array.from({ length: 3 }).join("\0"), r = $(), l = w(), [y, p] = I(s(o)), c = `${r}-calendar-${e}-select-label`, d = `${r}-calendar-${e}-select`, u = `${r}-calendar-${e}-select-description`, f = e === "month" ? "unity:component:form-field:date-picker:segment-select:month:label" : "unity:component:form-field:date-picker:segment-select:year:label", h = e === "month" ? "unity:component:form-field:date-picker:segment-select:month:description" : "unity:component:form-field:date-picker:segment-select:year:description";
-  return /* @__PURE__ */ b("div", { className: "uy:isolation-isolate uy:relative uy:inline-flex uy:items-center uy:cursor-pointer", children: [
-    /* @__PURE__ */ n(
-      "label",
-      {
-        id: c,
-        htmlFor: d,
-        className: "uy:sr-only",
-        "aria-hidden": "true",
-        children: l.formatMessage({
-          id: f,
-          defaultMessage: `Change current ${e}`
-        })
-      }
-    ),
-    /* @__PURE__ */ n(
-      "select",
-      {
-        id: d,
-        value: o,
-        onChange: (t) => {
-          m(t.target.value), p(s(t.target.value));
-        },
-        disabled: i,
-        className: "uy:appearance-none uy:box-border uy:w-[var(--uy-selected-item-width)] uy:bg-transparent uy:border-none uy:rounded-50 uy:capitalize uy:text-content-form-enabled uy:typography-action-large uy:cursor-pointer uy:pr-300 uy:disabled:text-content-form-disabled uy:data-[focus-visible='true']:outline-2 uy:data-[focus-visible='true']:outline-offset-2 uy:data-[focus-visible='true']:outline-utility-focus-ring [background-color:transparent] [-webkit-tap-highlight-color:transparent]",
-        style: {
-          "--uy-selected-item-width": `calc(var(--uy-spacing-300) + ${y.length}ch)`
-        },
-        "aria-labelledby": c,
-        "aria-describedby": u,
-        children: a.map((t) => /* @__PURE__ */ n("option", { value: t.id, children: t.name }, t.id))
-      }
-    ),
-    /* @__PURE__ */ n("div", { className: "uy:absolute uy:right-0 uy:pointer-events-none uy:text-content-neutral-low", children: /* @__PURE__ */ n(
-      v,
-      {
-        src: "CaretDownOutlined",
-        width: 20,
-        height: 20,
-        color: "inherit",
-        role: "presentation",
-        className: i ? "uy:text-content-form-disabled" : ""
-      }
-    ) }),
-    /* @__PURE__ */ n("span", { id: u, className: "uy:sr-only", "aria-hidden": "true", children: l.formatMessage({
-      id: h,
-      defaultMessage: `Press Enter or Space to change ${e}, then use up and down arrows to select a ${e}`
-    }) })
-  ] });
-}
-x.displayName = "DateSegmentSelect";
-export {
-  x as DateSegmentSelect
-};