@webiny/admin-ui 0.0.0-unstable.e53eceafb5 → 0.0.0-unstable.e6f0dc8ca7

package/DatePicker/primitives/TimeOnlyPicker.js

@@ -0,0 +1,24 @@
+import React from "react";
+import { TimePicker } from "./components/TimePicker.js";
+const TimeOnlyPicker = ({
+  value,
+  onChange,
+  disabled,
+  size,
+  variant,
+  invalid,
+  className
+}) => {
+  return /*#__PURE__*/React.createElement(TimePicker, {
+    value: value,
+    onChange: onChange,
+    disabled: disabled,
+    size: size,
+    variant: variant,
+    invalid: invalid,
+    className: className
+  });
+};
+export { TimeOnlyPicker };
+
+//# sourceMappingURL=TimeOnlyPicker.js.map

package/DatePicker/primitives/TimeOnlyPicker.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","TimePicker","TimeOnlyPicker","value","onChange","disabled","size","variant","invalid","className","createElement"],"sources":["TimeOnlyPicker.tsx"],"sourcesContent":["import React from \"react\";\nimport type { TimeOnlyPickerProps } from \"../utils/types.js\";\nimport { TimePicker } from \"./components/TimePicker.js\";\n\nconst TimeOnlyPicker = ({\n    value,\n    onChange,\n    disabled,\n    size,\n    variant,\n    invalid,\n    className\n}: TimeOnlyPickerProps) => {\n    return (\n        <TimePicker\n            value={value}\n            onChange={onChange}\n            disabled={disabled}\n            size={size}\n            variant={variant}\n            invalid={invalid}\n            className={className}\n        />\n    );\n};\n\nexport { TimeOnlyPicker };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,UAAU;AAEnB,MAAMC,cAAc,GAAGA,CAAC;EACpBC,KAAK;EACLC,QAAQ;EACRC,QAAQ;EACRC,IAAI;EACJC,OAAO;EACPC,OAAO;EACPC;AACiB,CAAC,KAAK;EACvB,oBACIT,KAAA,CAAAU,aAAA,CAACT,UAAU;IACPE,KAAK,EAAEA,KAAM;IACbC,QAAQ,EAAEA,QAAS;IACnBC,QAAQ,EAAEA,QAAS;IACnBC,IAAI,EAAEA,IAAK;IACXC,OAAO,EAAEA,OAAQ;IACjBC,OAAO,EAAEA,OAAQ;IACjBC,SAAS,EAAEA;EAAU,CACxB,CAAC;AAEV,CAAC;AAED,SAASP,cAAc","ignoreList":[]}

package/DatePicker/primitives/WeekPicker.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { WeekPickerProps } from "../utils/types.js";
+declare const WeekPicker: ({ value, onChange, placeholder, disabled, size, variant, invalid, onOpenChange, className, displayFormat }: WeekPickerProps) => React.JSX.Element;
+export { WeekPicker };

package/DatePicker/primitives/WeekPicker.js

@@ -0,0 +1,97 @@
+import React, { useMemo, useState } from "react";
+import { eachDayOfInterval, endOfISOWeek, startOfISOWeek } from "date-fns";
+import { Calendar } from "../../Calendar/index.js";
+import { PopoverPrimitive } from "../../Popover/index.js";
+import { formatDateForDisplay, formatWeekValue, parseWeekValue } from "../utils/dateHelpers.js";
+import { DatePickerTrigger } from "./components/DatePickerTrigger.js";
+function weekDatesFromParsed(parsed) {
+  const jan4 = new Date(parsed.year, 0, 4);
+  const weekStart = startOfISOWeek(new Date(jan4.getTime() + (parsed.week - 1) * 7 * 86400000));
+  return eachDayOfInterval({
+    start: weekStart,
+    end: endOfISOWeek(weekStart)
+  });
+}
+const WeekPicker = ({
+  value,
+  onChange,
+  placeholder,
+  disabled,
+  size,
+  variant,
+  invalid,
+  onOpenChange,
+  className,
+  displayFormat
+}) => {
+  const [open, setOpen] = useState(false);
+  const [hoveredDay, setHoveredDay] = useState();
+  const handleOpenChange = isOpen => {
+    setOpen(isOpen);
+    if (!isOpen) {
+      setHoveredDay(undefined);
+    }
+    if (onOpenChange) {
+      onOpenChange(isOpen);
+    }
+  };
+  const displayValue = formatDateForDisplay(value, "week", displayFormat);
+  const parsed = value ? parseWeekValue(value) : undefined;
+  const selectedWeekDays = useMemo(() => parsed ? weekDatesFromParsed(parsed) : [], [value]);
+  const hoveredWeekDays = useMemo(() => {
+    if (!hoveredDay) {
+      return [];
+    }
+    const start = startOfISOWeek(hoveredDay);
+    return eachDayOfInterval({
+      start,
+      end: endOfISOWeek(start)
+    });
+  }, [hoveredDay]);
+  const modifiers = useMemo(() => ({
+    selectedWeek: selectedWeekDays,
+    selectedWeekStart: selectedWeekDays.length > 0 ? [selectedWeekDays[0]] : [],
+    selectedWeekEnd: selectedWeekDays.length > 0 ? [selectedWeekDays[6]] : [],
+    hoveredWeek: hoveredWeekDays,
+    hoveredWeekStart: hoveredWeekDays.length > 0 ? [hoveredWeekDays[0]] : [],
+    hoveredWeekEnd: hoveredWeekDays.length > 0 ? [hoveredWeekDays[6]] : []
+  }), [selectedWeekDays, hoveredWeekDays]);
+  const modifiersClassNames = useMemo(() => ({
+    selectedWeek: "bg-primary-subtle [&>button]:bg-transparent [&>button]:text-primary-strong [&>button]:rounded-none [&>button]:hover:bg-primary-subtle/70",
+    selectedWeekStart: "[&>button]:bg-primary [&>button]:text-neutral-base [&>button]:rounded-l-sm [&>button]:rounded-r-none [&>button]:hover:bg-primary-strong",
+    selectedWeekEnd: "[&>button]:bg-primary [&>button]:text-neutral-base [&>button]:rounded-r-sm [&>button]:rounded-l-none [&>button]:hover:bg-primary-strong",
+    hoveredWeek: "bg-neutral-light [&>button]:rounded-none",
+    hoveredWeekStart: "[&>button]:rounded-l-sm [&>button]:rounded-r-none",
+    hoveredWeekEnd: "[&>button]:rounded-r-sm [&>button]:rounded-l-none"
+  }), []);
+  return /*#__PURE__*/React.createElement("div", {
+    className: className
+  }, /*#__PURE__*/React.createElement(PopoverPrimitive, {
+    open: open,
+    onOpenChange: handleOpenChange
+  }, /*#__PURE__*/React.createElement(DatePickerTrigger, {
+    displayValue: displayValue,
+    placeholder: placeholder ?? "Pick a week",
+    disabled: disabled,
+    size: size,
+    variant: variant,
+    invalid: invalid
+  }), /*#__PURE__*/React.createElement(PopoverPrimitive.Content, {
+    align: "start"
+  }, /*#__PURE__*/React.createElement(Calendar, {
+    modifiers: modifiers,
+    modifiersClassNames: modifiersClassNames,
+    onDayClick: date => {
+      if (onChange) {
+        onChange(formatWeekValue(date));
+      }
+      handleOpenChange(false);
+    },
+    onDayMouseEnter: day => setHoveredDay(day),
+    onDayMouseLeave: () => setHoveredDay(undefined),
+    ISOWeek: true
+  }))));
+};
+export { WeekPicker };
+
+//# sourceMappingURL=WeekPicker.js.map

package/DatePicker/primitives/WeekPicker.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useMemo","useState","eachDayOfInterval","endOfISOWeek","startOfISOWeek","Calendar","PopoverPrimitive","formatDateForDisplay","formatWeekValue","parseWeekValue","DatePickerTrigger","weekDatesFromParsed","parsed","jan4","Date","year","weekStart","getTime","week","start","end","WeekPicker","value","onChange","placeholder","disabled","size","variant","invalid","onOpenChange","className","displayFormat","open","setOpen","hoveredDay","setHoveredDay","handleOpenChange","isOpen","undefined","displayValue","selectedWeekDays","hoveredWeekDays","modifiers","selectedWeek","selectedWeekStart","length","selectedWeekEnd","hoveredWeek","hoveredWeekStart","hoveredWeekEnd","modifiersClassNames","createElement","Content","align","onDayClick","date","onDayMouseEnter","day","onDayMouseLeave","ISOWeek"],"sources":["WeekPicker.tsx"],"sourcesContent":["import React, { useMemo, useState } from \"react\";\nimport { eachDayOfInterval, endOfISOWeek, startOfISOWeek } from \"date-fns\";\nimport { Calendar } from \"~/Calendar/index.js\";\nimport { PopoverPrimitive } from \"~/Popover/index.js\";\nimport type { WeekPickerProps } from \"../utils/types.js\";\nimport { formatDateForDisplay, formatWeekValue, parseWeekValue } from \"../utils/dateHelpers.js\";\nimport { DatePickerTrigger } from \"./components/DatePickerTrigger.js\";\n\nfunction weekDatesFromParsed(parsed: { year: number; week: number }): Date[] {\n    const jan4 = new Date(parsed.year, 0, 4);\n    const weekStart = startOfISOWeek(new Date(jan4.getTime() + (parsed.week - 1) * 7 * 86400000));\n    return eachDayOfInterval({ start: weekStart, end: endOfISOWeek(weekStart) });\n}\n\nconst WeekPicker = ({\n    value,\n    onChange,\n    placeholder,\n    disabled,\n    size,\n    variant,\n    invalid,\n    onOpenChange,\n    className,\n    displayFormat\n}: WeekPickerProps) => {\n    const [open, setOpen] = useState(false);\n    const [hoveredDay, setHoveredDay] = useState<Date | undefined>();\n\n    const handleOpenChange = (isOpen: boolean) => {\n        setOpen(isOpen);\n        if (!isOpen) {\n            setHoveredDay(undefined);\n        }\n        if (onOpenChange) {\n            onOpenChange(isOpen);\n        }\n    };\n\n    const displayValue = formatDateForDisplay(value, \"week\", displayFormat);\n\n    const parsed = value ? parseWeekValue(value) : undefined;\n    const selectedWeekDays = useMemo(() => (parsed ? weekDatesFromParsed(parsed) : []), [value]);\n\n    const hoveredWeekDays = useMemo(() => {\n        if (!hoveredDay) {\n            return [];\n        }\n        const start = startOfISOWeek(hoveredDay);\n        return eachDayOfInterval({ start, end: endOfISOWeek(start) });\n    }, [hoveredDay]);\n\n    const modifiers = useMemo(\n        () => ({\n            selectedWeek: selectedWeekDays,\n            selectedWeekStart: selectedWeekDays.length > 0 ? [selectedWeekDays[0]] : [],\n            selectedWeekEnd: selectedWeekDays.length > 0 ? [selectedWeekDays[6]] : [],\n            hoveredWeek: hoveredWeekDays,\n            hoveredWeekStart: hoveredWeekDays.length > 0 ? [hoveredWeekDays[0]] : [],\n            hoveredWeekEnd: hoveredWeekDays.length > 0 ? [hoveredWeekDays[6]] : []\n        }),\n        [selectedWeekDays, hoveredWeekDays]\n    );\n\n    const modifiersClassNames = useMemo(\n        () => ({\n            selectedWeek:\n                \"bg-primary-subtle [&>button]:bg-transparent [&>button]:text-primary-strong [&>button]:rounded-none [&>button]:hover:bg-primary-subtle/70\",\n            selectedWeekStart:\n                \"[&>button]:bg-primary [&>button]:text-neutral-base [&>button]:rounded-l-sm [&>button]:rounded-r-none [&>button]:hover:bg-primary-strong\",\n            selectedWeekEnd:\n                \"[&>button]:bg-primary [&>button]:text-neutral-base [&>button]:rounded-r-sm [&>button]:rounded-l-none [&>button]:hover:bg-primary-strong\",\n            hoveredWeek: \"bg-neutral-light [&>button]:rounded-none\",\n            hoveredWeekStart: \"[&>button]:rounded-l-sm [&>button]:rounded-r-none\",\n            hoveredWeekEnd: \"[&>button]:rounded-r-sm [&>button]:rounded-l-none\"\n        }),\n        []\n    );\n\n    return (\n        <div className={className}>\n            <PopoverPrimitive open={open} onOpenChange={handleOpenChange}>\n                <DatePickerTrigger\n                    displayValue={displayValue}\n                    placeholder={placeholder ?? \"Pick a week\"}\n                    disabled={disabled}\n                    size={size}\n                    variant={variant}\n                    invalid={invalid}\n                />\n                <PopoverPrimitive.Content align=\"start\">\n                    <Calendar\n                        modifiers={modifiers}\n                        modifiersClassNames={modifiersClassNames}\n                        onDayClick={date => {\n                            if (onChange) {\n                                onChange(formatWeekValue(date));\n                            }\n                            handleOpenChange(false);\n                        }}\n                        onDayMouseEnter={day => setHoveredDay(day)}\n                        onDayMouseLeave={() => setHoveredDay(undefined)}\n                        ISOWeek\n                    />\n                </PopoverPrimitive.Content>\n            </PopoverPrimitive>\n        </div>\n    );\n};\n\nexport { WeekPicker };\n"],"mappings":"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","ignoreList":[]}

package/DatePicker/primitives/YearPicker.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import type { YearPickerProps } from "../utils/types.js";
+declare const YearPicker: ({ value, onChange, placeholder, disabled, size, variant, invalid, yearRange, onOpenChange, className }: YearPickerProps) => React.JSX.Element;
+export { YearPicker };

package/DatePicker/primitives/YearPicker.js

@@ -0,0 +1,54 @@
+import React, { useState } from "react";
+import { PopoverPrimitive } from "../../Popover/index.js";
+import { formatDateForDisplay } from "../utils/dateHelpers.js";
+import { DatePickerTrigger } from "./components/DatePickerTrigger.js";
+import { YearGrid } from "./components/YearGrid.js";
+const YearPicker = ({
+  value,
+  onChange,
+  placeholder,
+  disabled,
+  size,
+  variant,
+  invalid,
+  yearRange,
+  onOpenChange,
+  className
+}) => {
+  const [open, setOpen] = useState(false);
+  const handleOpenChange = isOpen => {
+    setOpen(isOpen);
+    if (onOpenChange) {
+      onOpenChange(isOpen);
+    }
+  };
+  const displayValue = formatDateForDisplay(value, "year");
+  const handleYearSelect = year => {
+    if (onChange) {
+      onChange(year);
+    }
+    handleOpenChange(false);
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: className
+  }, /*#__PURE__*/React.createElement(PopoverPrimitive, {
+    open: open,
+    onOpenChange: handleOpenChange
+  }, /*#__PURE__*/React.createElement(DatePickerTrigger, {
+    displayValue: displayValue,
+    placeholder: placeholder ?? "Pick a year",
+    disabled: disabled,
+    size: size,
+    variant: variant,
+    invalid: invalid
+  }), /*#__PURE__*/React.createElement(PopoverPrimitive.Content, {
+    align: "start"
+  }, /*#__PURE__*/React.createElement(YearGrid, {
+    selectedYears: value !== undefined ? [value] : [],
+    onSelectYear: handleYearSelect,
+    yearRange: yearRange
+  }))));
+};
+export { YearPicker };
+
+//# sourceMappingURL=YearPicker.js.map

package/DatePicker/primitives/YearPicker.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useState","PopoverPrimitive","formatDateForDisplay","DatePickerTrigger","YearGrid","YearPicker","value","onChange","placeholder","disabled","size","variant","invalid","yearRange","onOpenChange","className","open","setOpen","handleOpenChange","isOpen","displayValue","handleYearSelect","year","createElement","Content","align","selectedYears","undefined","onSelectYear"],"sources":["YearPicker.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { PopoverPrimitive } from \"~/Popover/index.js\";\nimport type { YearPickerProps } from \"../utils/types.js\";\nimport { formatDateForDisplay } from \"../utils/dateHelpers.js\";\nimport { DatePickerTrigger } from \"./components/DatePickerTrigger.js\";\nimport { YearGrid } from \"./components/YearGrid.js\";\n\nconst YearPicker = ({\n    value,\n    onChange,\n    placeholder,\n    disabled,\n    size,\n    variant,\n    invalid,\n    yearRange,\n    onOpenChange,\n    className\n}: YearPickerProps) => {\n    const [open, setOpen] = useState(false);\n\n    const handleOpenChange = (isOpen: boolean) => {\n        setOpen(isOpen);\n        if (onOpenChange) {\n            onOpenChange(isOpen);\n        }\n    };\n\n    const displayValue = formatDateForDisplay(value, \"year\");\n\n    const handleYearSelect = (year: number) => {\n        if (onChange) {\n            onChange(year);\n        }\n        handleOpenChange(false);\n    };\n\n    return (\n        <div className={className}>\n            <PopoverPrimitive open={open} onOpenChange={handleOpenChange}>\n                <DatePickerTrigger\n                    displayValue={displayValue}\n                    placeholder={placeholder ?? \"Pick a year\"}\n                    disabled={disabled}\n                    size={size}\n                    variant={variant}\n                    invalid={invalid}\n                />\n                <PopoverPrimitive.Content align=\"start\">\n                    <YearGrid\n                        selectedYears={value !== undefined ? [value] : []}\n                        onSelectYear={handleYearSelect}\n                        yearRange={yearRange}\n                    />\n                </PopoverPrimitive.Content>\n            </PopoverPrimitive>\n        </div>\n    );\n};\n\nexport { YearPicker };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,QAAQ,QAAQ,OAAO;AACvC,SAASC,gBAAgB;AAEzB,SAASC,oBAAoB;AAC7B,SAASC,iBAAiB;AAC1B,SAASC,QAAQ;AAEjB,MAAMC,UAAU,GAAGA,CAAC;EAChBC,KAAK;EACLC,QAAQ;EACRC,WAAW;EACXC,QAAQ;EACRC,IAAI;EACJC,OAAO;EACPC,OAAO;EACPC,SAAS;EACTC,YAAY;EACZC;AACa,CAAC,KAAK;EACnB,MAAM,CAACC,IAAI,EAAEC,OAAO,CAAC,GAAGjB,QAAQ,CAAC,KAAK,CAAC;EAEvC,MAAMkB,gBAAgB,GAAIC,MAAe,IAAK;IAC1CF,OAAO,CAACE,MAAM,CAAC;IACf,IAAIL,YAAY,EAAE;MACdA,YAAY,CAACK,MAAM,CAAC;IACxB;EACJ,CAAC;EAED,MAAMC,YAAY,GAAGlB,oBAAoB,CAACI,KAAK,EAAE,MAAM,CAAC;EAExD,MAAMe,gBAAgB,GAAIC,IAAY,IAAK;IACvC,IAAIf,QAAQ,EAAE;MACVA,QAAQ,CAACe,IAAI,CAAC;IAClB;IACAJ,gBAAgB,CAAC,KAAK,CAAC;EAC3B,CAAC;EAED,oBACInB,KAAA,CAAAwB,aAAA;IAAKR,SAAS,EAAEA;EAAU,gBACtBhB,KAAA,CAAAwB,aAAA,CAACtB,gBAAgB;IAACe,IAAI,EAAEA,IAAK;IAACF,YAAY,EAAEI;EAAiB,gBACzDnB,KAAA,CAAAwB,aAAA,CAACpB,iBAAiB;IACdiB,YAAY,EAAEA,YAAa;IAC3BZ,WAAW,EAAEA,WAAW,IAAI,aAAc;IAC1CC,QAAQ,EAAEA,QAAS;IACnBC,IAAI,EAAEA,IAAK;IACXC,OAAO,EAAEA,OAAQ;IACjBC,OAAO,EAAEA;EAAQ,CACpB,CAAC,eACFb,KAAA,CAAAwB,aAAA,CAACtB,gBAAgB,CAACuB,OAAO;IAACC,KAAK,EAAC;EAAO,gBACnC1B,KAAA,CAAAwB,aAAA,CAACnB,QAAQ;IACLsB,aAAa,EAAEpB,KAAK,KAAKqB,SAAS,GAAG,CAACrB,KAAK,CAAC,GAAG,EAAG;IAClDsB,YAAY,EAAEP,gBAAiB;IAC/BR,SAAS,EAAEA;EAAU,CACxB,CACqB,CACZ,CACjB,CAAC;AAEd,CAAC;AAED,SAASR,UAAU","ignoreList":[]}

package/DatePicker/primitives/components/DatePickerTrigger.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+import { type InputPrimitiveProps } from "../../../Input/index.js";
+interface DatePickerTriggerProps {
+    displayValue?: string;
+    placeholder?: string;
+    disabled?: boolean;
+    size?: InputPrimitiveProps["size"];
+    variant?: InputPrimitiveProps["variant"];
+    invalid?: InputPrimitiveProps["invalid"];
+    iconType?: "calendar" | "time";
+}
+declare const DatePickerTriggerInner: React.ForwardRefExoticComponent<DatePickerTriggerProps & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export { DatePickerTriggerInner as DatePickerTrigger, type DatePickerTriggerProps };

package/DatePicker/primitives/components/DatePickerTrigger.js

@@ -0,0 +1,45 @@
+import React, { forwardRef } from "react";
+import { ReactComponent as CalendarMonthIcon } from "@webiny/icons/calendar_month.svg";
+import { ReactComponent as ScheduleIcon } from "@webiny/icons/schedule.svg";
+import { Icon } from "../../../Icon/index.js";
+import { inputVariants } from "../../../Input/index.js";
+import { PopoverPrimitive } from "../../../Popover/index.js";
+import { cn } from "../../../utils.js";
+const DatePickerTriggerInner = /*#__PURE__*/forwardRef(({
+  displayValue,
+  placeholder,
+  disabled,
+  size,
+  variant,
+  invalid,
+  iconType = "calendar",
+  className,
+  ...props
+}, ref) => {
+  const IconComponent = iconType === "time" ? ScheduleIcon : CalendarMonthIcon;
+  const iconLabel = iconType === "time" ? "Time" : "Calendar";
+  return /*#__PURE__*/React.createElement(PopoverPrimitive.Trigger, {
+    asChild: true
+  }, /*#__PURE__*/React.createElement("div", Object.assign({
+    ref: ref,
+    role: "button",
+    tabIndex: 0,
+    "data-disabled": disabled,
+    className: cn(inputVariants({
+      size,
+      variant,
+      invalid
+    }), "cursor-pointer justify-between select-none", disabled && "pointer-events-none opacity-50", className)
+  }, props), /*#__PURE__*/React.createElement("span", {
+    className: cn(!displayValue && "text-neutral-dimmed")
+  }, displayValue || placeholder || "Select..."), /*#__PURE__*/React.createElement(Icon, {
+    icon: /*#__PURE__*/React.createElement(IconComponent, null),
+    label: iconLabel,
+    size: "sm",
+    color: "inherit"
+  })));
+});
+DatePickerTriggerInner.displayName = "DatePickerTrigger";
+export { DatePickerTriggerInner as DatePickerTrigger };
+
+//# sourceMappingURL=DatePickerTrigger.js.map

package/DatePicker/primitives/components/DatePickerTrigger.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","forwardRef","ReactComponent","CalendarMonthIcon","ScheduleIcon","Icon","inputVariants","PopoverPrimitive","cn","DatePickerTriggerInner","displayValue","placeholder","disabled","size","variant","invalid","iconType","className","props","ref","IconComponent","iconLabel","createElement","Trigger","asChild","Object","assign","role","tabIndex","icon","label","color","displayName","DatePickerTrigger"],"sources":["DatePickerTrigger.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport { ReactComponent as CalendarMonthIcon } from \"@webiny/icons/calendar_month.svg\";\nimport { ReactComponent as ScheduleIcon } from \"@webiny/icons/schedule.svg\";\nimport { Icon } from \"~/Icon/index.js\";\nimport { inputVariants, type InputPrimitiveProps } from \"~/Input/index.js\";\nimport { PopoverPrimitive } from \"~/Popover/index.js\";\nimport { cn } from \"~/utils.js\";\n\ninterface DatePickerTriggerProps {\n    displayValue?: string;\n    placeholder?: string;\n    disabled?: boolean;\n    size?: InputPrimitiveProps[\"size\"];\n    variant?: InputPrimitiveProps[\"variant\"];\n    invalid?: InputPrimitiveProps[\"invalid\"];\n    iconType?: \"calendar\" | \"time\";\n}\n\nconst DatePickerTriggerInner = forwardRef<\n    HTMLDivElement,\n    DatePickerTriggerProps & React.HTMLAttributes<HTMLDivElement>\n>(\n    (\n        {\n            displayValue,\n            placeholder,\n            disabled,\n            size,\n            variant,\n            invalid,\n            iconType = \"calendar\",\n            className,\n            ...props\n        },\n        ref\n    ) => {\n        const IconComponent = iconType === \"time\" ? ScheduleIcon : CalendarMonthIcon;\n        const iconLabel = iconType === \"time\" ? \"Time\" : \"Calendar\";\n\n        return (\n            <PopoverPrimitive.Trigger asChild>\n                <div\n                    ref={ref}\n                    role=\"button\"\n                    tabIndex={0}\n                    data-disabled={disabled}\n                    className={cn(\n                        inputVariants({ size, variant, invalid }),\n                        \"cursor-pointer justify-between select-none\",\n                        disabled && \"pointer-events-none opacity-50\",\n                        className\n                    )}\n                    {...props}\n                >\n                    <span className={cn(!displayValue && \"text-neutral-dimmed\")}>\n                        {displayValue || placeholder || \"Select...\"}\n                    </span>\n                    <Icon icon={<IconComponent />} label={iconLabel} size=\"sm\" color=\"inherit\" />\n                </div>\n            </PopoverPrimitive.Trigger>\n        );\n    }\n);\n\nDatePickerTriggerInner.displayName = \"DatePickerTrigger\";\n\nexport { DatePickerTriggerInner as DatePickerTrigger, type DatePickerTriggerProps };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,SAASC,cAAc,IAAIC,iBAAiB,QAAQ,kCAAkC;AACtF,SAASD,cAAc,IAAIE,YAAY,QAAQ,4BAA4B;AAC3E,SAASC,IAAI;AACb,SAASC,aAAa;AACtB,SAASC,gBAAgB;AACzB,SAASC,EAAE;AAYX,MAAMC,sBAAsB,gBAAGR,UAAU,CAIrC,CACI;EACIS,YAAY;EACZC,WAAW;EACXC,QAAQ;EACRC,IAAI;EACJC,OAAO;EACPC,OAAO;EACPC,QAAQ,GAAG,UAAU;EACrBC,SAAS;EACT,GAAGC;AACP,CAAC,EACDC,GAAG,KACF;EACD,MAAMC,aAAa,GAAGJ,QAAQ,KAAK,MAAM,GAAGZ,YAAY,GAAGD,iBAAiB;EAC5E,MAAMkB,SAAS,GAAGL,QAAQ,KAAK,MAAM,GAAG,MAAM,GAAG,UAAU;EAE3D,oBACIhB,KAAA,CAAAsB,aAAA,CAACf,gBAAgB,CAACgB,OAAO;IAACC,OAAO;EAAA,gBAC7BxB,KAAA,CAAAsB,aAAA,QAAAG,MAAA,CAAAC,MAAA;IACIP,GAAG,EAAEA,GAAI;IACTQ,IAAI,EAAC,QAAQ;IACbC,QAAQ,EAAE,CAAE;IACZ,iBAAehB,QAAS;IACxBK,SAAS,EAAET,EAAE,CACTF,aAAa,CAAC;MAAEO,IAAI;MAAEC,OAAO;MAAEC;IAAQ,CAAC,CAAC,EACzC,4CAA4C,EAC5CH,QAAQ,IAAI,gCAAgC,EAC5CK,SACJ;EAAE,GACEC,KAAK,gBAETlB,KAAA,CAAAsB,aAAA;IAAML,SAAS,EAAET,EAAE,CAAC,CAACE,YAAY,IAAI,qBAAqB;EAAE,GACvDA,YAAY,IAAIC,WAAW,IAAI,WAC9B,CAAC,eACPX,KAAA,CAAAsB,aAAA,CAACjB,IAAI;IAACwB,IAAI,eAAE7B,KAAA,CAAAsB,aAAA,CAACF,aAAa,MAAE,CAAE;IAACU,KAAK,EAAET,SAAU;IAACR,IAAI,EAAC,IAAI;IAACkB,KAAK,EAAC;EAAS,CAAE,CAC3E,CACiB,CAAC;AAEnC,CACJ,CAAC;AAEDtB,sBAAsB,CAACuB,WAAW,GAAG,mBAAmB;AAExD,SAASvB,sBAAsB,IAAIwB,iBAAiB","ignoreList":[]}

package/DatePicker/primitives/components/MonthGrid.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+interface MonthGridProps {
+    selectedMonths: number[];
+    onSelectMonth: (month: number) => void;
+}
+declare const MonthGrid: ({ selectedMonths, onSelectMonth }: MonthGridProps) => React.JSX.Element;
+export { MonthGrid, type MonthGridProps };

package/DatePicker/primitives/components/MonthGrid.js

@@ -0,0 +1,23 @@
+import React from "react";
+import { Button } from "../../../Button/index.js";
+import { MONTH_NAMES_SHORT } from "../../utils/constants.js";
+const MonthGrid = ({
+  selectedMonths,
+  onSelectMonth
+}) => {
+  return /*#__PURE__*/React.createElement("div", {
+    className: "grid grid-cols-3 gap-xs p-sm"
+  }, MONTH_NAMES_SHORT.map((name, index) => {
+    const isSelected = selectedMonths.includes(index);
+    return /*#__PURE__*/React.createElement(Button, {
+      key: name,
+      variant: isSelected ? "primary" : "ghost",
+      size: "sm",
+      text: name,
+      onClick: () => onSelectMonth(index)
+    });
+  }));
+};
+export { MonthGrid };
+
+//# sourceMappingURL=MonthGrid.js.map

package/DatePicker/primitives/components/MonthGrid.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Button","MONTH_NAMES_SHORT","MonthGrid","selectedMonths","onSelectMonth","createElement","className","map","name","index","isSelected","includes","key","variant","size","text","onClick"],"sources":["MonthGrid.tsx"],"sourcesContent":["import React from \"react\";\nimport { Button } from \"~/Button/index.js\";\nimport { MONTH_NAMES_SHORT } from \"../../utils/constants.js\";\n\ninterface MonthGridProps {\n    selectedMonths: number[];\n    onSelectMonth: (month: number) => void;\n}\n\nconst MonthGrid = ({ selectedMonths, onSelectMonth }: MonthGridProps) => {\n    return (\n        <div className=\"grid grid-cols-3 gap-xs p-sm\">\n            {MONTH_NAMES_SHORT.map((name, index) => {\n                const isSelected = selectedMonths.includes(index);\n                return (\n                    <Button\n                        key={name}\n                        variant={isSelected ? \"primary\" : \"ghost\"}\n                        size=\"sm\"\n                        text={name}\n                        onClick={() => onSelectMonth(index)}\n                    />\n                );\n            })}\n        </div>\n    );\n};\n\nexport { MonthGrid, type MonthGridProps };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,MAAM;AACf,SAASC,iBAAiB;AAO1B,MAAMC,SAAS,GAAGA,CAAC;EAAEC,cAAc;EAAEC;AAA8B,CAAC,KAAK;EACrE,oBACIL,KAAA,CAAAM,aAAA;IAAKC,SAAS,EAAC;EAA8B,GACxCL,iBAAiB,CAACM,GAAG,CAAC,CAACC,IAAI,EAAEC,KAAK,KAAK;IACpC,MAAMC,UAAU,GAAGP,cAAc,CAACQ,QAAQ,CAACF,KAAK,CAAC;IACjD,oBACIV,KAAA,CAAAM,aAAA,CAACL,MAAM;MACHY,GAAG,EAAEJ,IAAK;MACVK,OAAO,EAAEH,UAAU,GAAG,SAAS,GAAG,OAAQ;MAC1CI,IAAI,EAAC,IAAI;MACTC,IAAI,EAAEP,IAAK;MACXQ,OAAO,EAAEA,CAAA,KAAMZ,aAAa,CAACK,KAAK;IAAE,CACvC,CAAC;EAEV,CAAC,CACA,CAAC;AAEd,CAAC;AAED,SAASP,SAAS","ignoreList":[]}

package/DatePicker/primitives/components/SelectedTagsList.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+interface SelectedTagsListProps {
+    items: Array<{
+        key: string;
+        label: string;
+    }>;
+    onRemove: (key: string) => void;
+    disabled?: boolean;
+}
+declare const SelectedTagsList: ({ items, onRemove, disabled }: SelectedTagsListProps) => React.JSX.Element | null;
+export { SelectedTagsList, type SelectedTagsListProps };

package/DatePicker/primitives/components/SelectedTagsList.js

@@ -0,0 +1,23 @@
+import React from "react";
+import { Tag } from "../../../Tag/index.js";
+const SelectedTagsList = ({
+  items,
+  onRemove,
+  disabled
+}) => {
+  if (items.length === 0) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement("div", {
+    className: "flex flex-wrap gap-xs pt-sm"
+  }, items.map(item => /*#__PURE__*/React.createElement(Tag, {
+    key: item.key,
+    content: item.label,
+    variant: "neutral-light",
+    disabled: disabled,
+    onDismiss: () => onRemove(item.key)
+  })));
+};
+export { SelectedTagsList };
+
+//# sourceMappingURL=SelectedTagsList.js.map

package/DatePicker/primitives/components/SelectedTagsList.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","Tag","SelectedTagsList","items","onRemove","disabled","length","createElement","className","map","item","key","content","label","variant","onDismiss"],"sources":["SelectedTagsList.tsx"],"sourcesContent":["import React from \"react\";\nimport { Tag } from \"~/Tag/index.js\";\n\ninterface SelectedTagsListProps {\n    items: Array<{ key: string; label: string }>;\n    onRemove: (key: string) => void;\n    disabled?: boolean;\n}\n\nconst SelectedTagsList = ({ items, onRemove, disabled }: SelectedTagsListProps) => {\n    if (items.length === 0) {\n        return null;\n    }\n\n    return (\n        <div className=\"flex flex-wrap gap-xs pt-sm\">\n            {items.map(item => (\n                <Tag\n                    key={item.key}\n                    content={item.label}\n                    variant=\"neutral-light\"\n                    disabled={disabled}\n                    onDismiss={() => onRemove(item.key)}\n                />\n            ))}\n        </div>\n    );\n};\n\nexport { SelectedTagsList, type SelectedTagsListProps };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,GAAG;AAQZ,MAAMC,gBAAgB,GAAGA,CAAC;EAAEC,KAAK;EAAEC,QAAQ;EAAEC;AAAgC,CAAC,KAAK;EAC/E,IAAIF,KAAK,CAACG,MAAM,KAAK,CAAC,EAAE;IACpB,OAAO,IAAI;EACf;EAEA,oBACIN,KAAA,CAAAO,aAAA;IAAKC,SAAS,EAAC;EAA6B,GACvCL,KAAK,CAACM,GAAG,CAACC,IAAI,iBACXV,KAAA,CAAAO,aAAA,CAACN,GAAG;IACAU,GAAG,EAAED,IAAI,CAACC,GAAI;IACdC,OAAO,EAAEF,IAAI,CAACG,KAAM;IACpBC,OAAO,EAAC,eAAe;IACvBT,QAAQ,EAAEA,QAAS;IACnBU,SAAS,EAAEA,CAAA,KAAMX,QAAQ,CAACM,IAAI,CAACC,GAAG;EAAE,CACvC,CACJ,CACA,CAAC;AAEd,CAAC;AAED,SAAST,gBAAgB","ignoreList":[]}

package/DatePicker/primitives/components/TimePicker.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+import { type InputPrimitiveProps } from "../../../Input/index.js";
+interface TimePickerProps {
+    value?: string;
+    onChange?: (value: string | undefined) => void;
+    disabled?: boolean;
+    size?: InputPrimitiveProps["size"];
+    variant?: InputPrimitiveProps["variant"];
+    invalid?: InputPrimitiveProps["invalid"];
+    className?: string;
+}
+declare const TimePicker: ({ value, onChange, disabled, size, variant, invalid, className }: TimePickerProps) => React.JSX.Element;
+export { TimePicker, type TimePickerProps };

package/DatePicker/primitives/components/TimePicker.js

@@ -0,0 +1,33 @@
+import React from "react";
+import { ReactComponent as ScheduleIcon } from "@webiny/icons/schedule.svg";
+import { Icon } from "../../../Icon/index.js";
+import { InputPrimitive } from "../../../Input/index.js";
+const TimePicker = ({
+  value,
+  onChange,
+  disabled,
+  size,
+  variant,
+  invalid,
+  className
+}) => {
+  return /*#__PURE__*/React.createElement(InputPrimitive, {
+    type: "time",
+    value: value ?? "",
+    onChange: onChange,
+    disabled: disabled,
+    size: size,
+    variant: variant,
+    invalid: invalid,
+    className: className,
+    startIcon: /*#__PURE__*/React.createElement(Icon, {
+      icon: /*#__PURE__*/React.createElement(ScheduleIcon, null),
+      label: "Time",
+      size: "sm",
+      color: "inherit"
+    })
+  });
+};
+export { TimePicker };
+
+//# sourceMappingURL=TimePicker.js.map

package/DatePicker/primitives/components/TimePicker.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","ReactComponent","ScheduleIcon","Icon","InputPrimitive","TimePicker","value","onChange","disabled","size","variant","invalid","className","createElement","type","startIcon","icon","label","color"],"sources":["TimePicker.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as ScheduleIcon } from \"@webiny/icons/schedule.svg\";\nimport { Icon } from \"~/Icon/index.js\";\nimport { InputPrimitive, type InputPrimitiveProps } from \"~/Input/index.js\";\n\ninterface TimePickerProps {\n    value?: string;\n    onChange?: (value: string | undefined) => void;\n    disabled?: boolean;\n    size?: InputPrimitiveProps[\"size\"];\n    variant?: InputPrimitiveProps[\"variant\"];\n    invalid?: InputPrimitiveProps[\"invalid\"];\n    className?: string;\n}\n\nconst TimePicker = ({\n    value,\n    onChange,\n    disabled,\n    size,\n    variant,\n    invalid,\n    className\n}: TimePickerProps) => {\n    return (\n        <InputPrimitive\n            type=\"time\"\n            value={value ?? \"\"}\n            onChange={onChange}\n            disabled={disabled}\n            size={size}\n            variant={variant}\n            invalid={invalid}\n            className={className}\n            startIcon={<Icon icon={<ScheduleIcon />} label=\"Time\" size=\"sm\" color=\"inherit\" />}\n        />\n    );\n};\n\nexport { TimePicker, type TimePickerProps };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,cAAc,IAAIC,YAAY,QAAQ,4BAA4B;AAC3E,SAASC,IAAI;AACb,SAASC,cAAc;AAYvB,MAAMC,UAAU,GAAGA,CAAC;EAChBC,KAAK;EACLC,QAAQ;EACRC,QAAQ;EACRC,IAAI;EACJC,OAAO;EACPC,OAAO;EACPC;AACa,CAAC,KAAK;EACnB,oBACIZ,KAAA,CAAAa,aAAA,CAACT,cAAc;IACXU,IAAI,EAAC,MAAM;IACXR,KAAK,EAAEA,KAAK,IAAI,EAAG;IACnBC,QAAQ,EAAEA,QAAS;IACnBC,QAAQ,EAAEA,QAAS;IACnBC,IAAI,EAAEA,IAAK;IACXC,OAAO,EAAEA,OAAQ;IACjBC,OAAO,EAAEA,OAAQ;IACjBC,SAAS,EAAEA,SAAU;IACrBG,SAAS,eAAEf,KAAA,CAAAa,aAAA,CAACV,IAAI;MAACa,IAAI,eAAEhB,KAAA,CAAAa,aAAA,CAACX,YAAY,MAAE,CAAE;MAACe,KAAK,EAAC,MAAM;MAACR,IAAI,EAAC,IAAI;MAACS,KAAK,EAAC;IAAS,CAAE;EAAE,CACtF,CAAC;AAEV,CAAC;AAED,SAASb,UAAU","ignoreList":[]}

package/DatePicker/primitives/components/YearGrid.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+interface YearGridProps {
+    selectedYears: number[];
+    onSelectYear: (year: number) => void;
+    yearRange?: [number, number];
+}
+declare const YearGrid: ({ selectedYears, onSelectYear, yearRange }: YearGridProps) => React.JSX.Element;
+export { YearGrid, type YearGridProps };

package/DatePicker/primitives/components/YearGrid.js

@@ -0,0 +1,46 @@
+import React, { useEffect, useRef } from "react";
+import { Button } from "../../../Button/index.js";
+import { ScrollArea } from "../../../ScrollArea/index.js";
+import { defaultYearRange } from "../../utils/dateHelpers.js";
+const YearGrid = ({
+  selectedYears,
+  onSelectYear,
+  yearRange
+}) => {
+  const [start, end] = yearRange ?? defaultYearRange();
+  const years = [];
+  for (let y = start; y <= end; y++) {
+    years.push(y);
+  }
+  const scrollRef = useRef(null);
+  useEffect(() => {
+    if (!scrollRef.current) {
+      return;
+    }
+    const selectedEl = scrollRef.current.querySelector("[data-selected=true]");
+    if (selectedEl) {
+      selectedEl.scrollIntoView({
+        block: "center"
+      });
+    }
+  }, []);
+  return /*#__PURE__*/React.createElement(ScrollArea, {
+    className: "max-h-[280px]"
+  }, /*#__PURE__*/React.createElement("div", {
+    ref: scrollRef,
+    className: "grid grid-cols-3 gap-xs p-sm"
+  }, years.map(year => {
+    const isSelected = selectedYears.includes(year);
+    return /*#__PURE__*/React.createElement(Button, {
+      key: year,
+      variant: isSelected ? "primary" : "ghost",
+      size: "sm",
+      text: String(year),
+      "data-selected": isSelected,
+      onClick: () => onSelectYear(year)
+    });
+  })));
+};
+export { YearGrid };
+
+//# sourceMappingURL=YearGrid.js.map

package/DatePicker/primitives/components/YearGrid.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useEffect","useRef","Button","ScrollArea","defaultYearRange","YearGrid","selectedYears","onSelectYear","yearRange","start","end","years","y","push","scrollRef","current","selectedEl","querySelector","scrollIntoView","block","createElement","className","ref","map","year","isSelected","includes","key","variant","size","text","String","onClick"],"sources":["YearGrid.tsx"],"sourcesContent":["import React, { useEffect, useRef } from \"react\";\nimport { Button } from \"~/Button/index.js\";\nimport { ScrollArea } from \"~/ScrollArea/index.js\";\nimport { defaultYearRange } from \"../../utils/dateHelpers.js\";\n\ninterface YearGridProps {\n    selectedYears: number[];\n    onSelectYear: (year: number) => void;\n    yearRange?: [number, number];\n}\n\nconst YearGrid = ({ selectedYears, onSelectYear, yearRange }: YearGridProps) => {\n    const [start, end] = yearRange ?? defaultYearRange();\n    const years: number[] = [];\n    for (let y = start; y <= end; y++) {\n        years.push(y);\n    }\n\n    const scrollRef = useRef<HTMLDivElement>(null);\n\n    useEffect(() => {\n        if (!scrollRef.current) {\n            return;\n        }\n        const selectedEl = scrollRef.current.querySelector(\"[data-selected=true]\");\n        if (selectedEl) {\n            selectedEl.scrollIntoView({ block: \"center\" });\n        }\n    }, []);\n\n    return (\n        <ScrollArea className=\"max-h-[280px]\">\n            <div ref={scrollRef} className=\"grid grid-cols-3 gap-xs p-sm\">\n                {years.map(year => {\n                    const isSelected = selectedYears.includes(year);\n                    return (\n                        <Button\n                            key={year}\n                            variant={isSelected ? \"primary\" : \"ghost\"}\n                            size=\"sm\"\n                            text={String(year)}\n                            data-selected={isSelected}\n                            onClick={() => onSelectYear(year)}\n                        />\n                    );\n                })}\n            </div>\n        </ScrollArea>\n    );\n};\n\nexport { YearGrid, type YearGridProps };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,SAAS,EAAEC,MAAM,QAAQ,OAAO;AAChD,SAASC,MAAM;AACf,SAASC,UAAU;AACnB,SAASC,gBAAgB;AAQzB,MAAMC,QAAQ,GAAGA,CAAC;EAAEC,aAAa;EAAEC,YAAY;EAAEC;AAAyB,CAAC,KAAK;EAC5E,MAAM,CAACC,KAAK,EAAEC,GAAG,CAAC,GAAGF,SAAS,IAAIJ,gBAAgB,CAAC,CAAC;EACpD,MAAMO,KAAe,GAAG,EAAE;EAC1B,KAAK,IAAIC,CAAC,GAAGH,KAAK,EAAEG,CAAC,IAAIF,GAAG,EAAEE,CAAC,EAAE,EAAE;IAC/BD,KAAK,CAACE,IAAI,CAACD,CAAC,CAAC;EACjB;EAEA,MAAME,SAAS,GAAGb,MAAM,CAAiB,IAAI,CAAC;EAE9CD,SAAS,CAAC,MAAM;IACZ,IAAI,CAACc,SAAS,CAACC,OAAO,EAAE;MACpB;IACJ;IACA,MAAMC,UAAU,GAAGF,SAAS,CAACC,OAAO,CAACE,aAAa,CAAC,sBAAsB,CAAC;IAC1E,IAAID,UAAU,EAAE;MACZA,UAAU,CAACE,cAAc,CAAC;QAAEC,KAAK,EAAE;MAAS,CAAC,CAAC;IAClD;EACJ,CAAC,EAAE,EAAE,CAAC;EAEN,oBACIpB,KAAA,CAAAqB,aAAA,CAACjB,UAAU;IAACkB,SAAS,EAAC;EAAe,gBACjCtB,KAAA,CAAAqB,aAAA;IAAKE,GAAG,EAAER,SAAU;IAACO,SAAS,EAAC;EAA8B,GACxDV,KAAK,CAACY,GAAG,CAACC,IAAI,IAAI;IACf,MAAMC,UAAU,GAAGnB,aAAa,CAACoB,QAAQ,CAACF,IAAI,CAAC;IAC/C,oBACIzB,KAAA,CAAAqB,aAAA,CAAClB,MAAM;MACHyB,GAAG,EAAEH,IAAK;MACVI,OAAO,EAAEH,UAAU,GAAG,SAAS,GAAG,OAAQ;MAC1CI,IAAI,EAAC,IAAI;MACTC,IAAI,EAAEC,MAAM,CAACP,IAAI,CAAE;MACnB,iBAAeC,UAAW;MAC1BO,OAAO,EAAEA,CAAA,KAAMzB,YAAY,CAACiB,IAAI;IAAE,CACrC,CAAC;EAEV,CAAC,CACA,CACG,CAAC;AAErB,CAAC;AAED,SAASnB,QAAQ","ignoreList":[]}

package/DatePicker/primitives/components/YearStepper.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+interface YearStepperProps {
+    year: number;
+    onYearChange: (year: number) => void;
+}
+declare const YearStepper: ({ year, onYearChange }: YearStepperProps) => React.JSX.Element;
+export { YearStepper, type YearStepperProps };

package/DatePicker/primitives/components/YearStepper.js

@@ -0,0 +1,36 @@
+import React from "react";
+import { ReactComponent as ChevronLeftIcon } from "@webiny/icons/chevron_left.svg";
+import { ReactComponent as ChevronRightIcon } from "@webiny/icons/chevron_right.svg";
+import { IconButton } from "../../../Button/index.js";
+import { Icon } from "../../../Icon/index.js";
+const YearStepper = ({
+  year,
+  onYearChange
+}) => {
+  return /*#__PURE__*/React.createElement("div", {
+    className: "flex items-center justify-center gap-sm py-xs"
+  }, /*#__PURE__*/React.createElement(IconButton, {
+    variant: "ghost",
+    size: "sm",
+    icon: /*#__PURE__*/React.createElement(Icon, {
+      icon: /*#__PURE__*/React.createElement(ChevronLeftIcon, null),
+      label: "Previous year",
+      size: "sm"
+    }),
+    onClick: () => onYearChange(year - 1)
+  }), /*#__PURE__*/React.createElement("span", {
+    className: "text-md font-semibold text-neutral-strong min-w-[4ch] text-center"
+  }, year), /*#__PURE__*/React.createElement(IconButton, {
+    variant: "ghost",
+    size: "sm",
+    icon: /*#__PURE__*/React.createElement(Icon, {
+      icon: /*#__PURE__*/React.createElement(ChevronRightIcon, null),
+      label: "Next year",
+      size: "sm"
+    }),
+    onClick: () => onYearChange(year + 1)
+  }));
+};
+export { YearStepper };
+
+//# sourceMappingURL=YearStepper.js.map

package/DatePicker/primitives/components/YearStepper.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","ReactComponent","ChevronLeftIcon","ChevronRightIcon","IconButton","Icon","YearStepper","year","onYearChange","createElement","className","variant","size","icon","label","onClick"],"sources":["YearStepper.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as ChevronLeftIcon } from \"@webiny/icons/chevron_left.svg\";\nimport { ReactComponent as ChevronRightIcon } from \"@webiny/icons/chevron_right.svg\";\nimport { IconButton } from \"~/Button/index.js\";\nimport { Icon } from \"~/Icon/index.js\";\n\ninterface YearStepperProps {\n    year: number;\n    onYearChange: (year: number) => void;\n}\n\nconst YearStepper = ({ year, onYearChange }: YearStepperProps) => {\n    return (\n        <div className=\"flex items-center justify-center gap-sm py-xs\">\n            <IconButton\n                variant=\"ghost\"\n                size=\"sm\"\n                icon={<Icon icon={<ChevronLeftIcon />} label=\"Previous year\" size=\"sm\" />}\n                onClick={() => onYearChange(year - 1)}\n            />\n            <span className=\"text-md font-semibold text-neutral-strong min-w-[4ch] text-center\">\n                {year}\n            </span>\n            <IconButton\n                variant=\"ghost\"\n                size=\"sm\"\n                icon={<Icon icon={<ChevronRightIcon />} label=\"Next year\" size=\"sm\" />}\n                onClick={() => onYearChange(year + 1)}\n            />\n        </div>\n    );\n};\n\nexport { YearStepper, type YearStepperProps };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,cAAc,IAAIC,eAAe,QAAQ,gCAAgC;AAClF,SAASD,cAAc,IAAIE,gBAAgB,QAAQ,iCAAiC;AACpF,SAASC,UAAU;AACnB,SAASC,IAAI;AAOb,MAAMC,WAAW,GAAGA,CAAC;EAAEC,IAAI;EAAEC;AAA+B,CAAC,KAAK;EAC9D,oBACIR,KAAA,CAAAS,aAAA;IAAKC,SAAS,EAAC;EAA+C,gBAC1DV,KAAA,CAAAS,aAAA,CAACL,UAAU;IACPO,OAAO,EAAC,OAAO;IACfC,IAAI,EAAC,IAAI;IACTC,IAAI,eAAEb,KAAA,CAAAS,aAAA,CAACJ,IAAI;MAACQ,IAAI,eAAEb,KAAA,CAAAS,aAAA,CAACP,eAAe,MAAE,CAAE;MAACY,KAAK,EAAC,eAAe;MAACF,IAAI,EAAC;IAAI,CAAE,CAAE;IAC1EG,OAAO,EAAEA,CAAA,KAAMP,YAAY,CAACD,IAAI,GAAG,CAAC;EAAE,CACzC,CAAC,eACFP,KAAA,CAAAS,aAAA;IAAMC,SAAS,EAAC;EAAmE,GAC9EH,IACC,CAAC,eACPP,KAAA,CAAAS,aAAA,CAACL,UAAU;IACPO,OAAO,EAAC,OAAO;IACfC,IAAI,EAAC,IAAI;IACTC,IAAI,eAAEb,KAAA,CAAAS,aAAA,CAACJ,IAAI;MAACQ,IAAI,eAAEb,KAAA,CAAAS,aAAA,CAACN,gBAAgB,MAAE,CAAE;MAACW,KAAK,EAAC,WAAW;MAACF,IAAI,EAAC;IAAI,CAAE,CAAE;IACvEG,OAAO,EAAEA,CAAA,KAAMP,YAAY,CAACD,IAAI,GAAG,CAAC;EAAE,CACzC,CACA,CAAC;AAEd,CAAC;AAED,SAASD,WAAW","ignoreList":[]}

package/DatePicker/primitives/components/index.d.ts

@@ -0,0 +1,6 @@
+export * from "./DatePickerTrigger.js";
+export * from "./TimePicker.js";
+export * from "./YearStepper.js";
+export * from "./MonthGrid.js";
+export * from "./YearGrid.js";
+export * from "./SelectedTagsList.js";

package/DatePicker/primitives/components/index.js

@@ -0,0 +1,8 @@
+export * from "./DatePickerTrigger.js";
+export * from "./TimePicker.js";
+export * from "./YearStepper.js";
+export * from "./MonthGrid.js";
+export * from "./YearGrid.js";
+export * from "./SelectedTagsList.js";
+
+//# sourceMappingURL=index.js.map

package/DatePicker/primitives/components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./DatePickerTrigger.js\";\nexport * from \"./TimePicker.js\";\nexport * from \"./YearStepper.js\";\nexport * from \"./MonthGrid.js\";\nexport * from \"./YearGrid.js\";\nexport * from \"./SelectedTagsList.js\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA","ignoreList":[]}

package/DatePicker/primitives/index.d.ts

@@ -0,0 +1 @@
+export * from "./DatePickerPrimitive.js";

package/DatePicker/primitives/index.js

@@ -0,0 +1,3 @@
+export * from "./DatePickerPrimitive.js";
+
+//# sourceMappingURL=index.js.map

package/DatePicker/primitives/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./DatePickerPrimitive.js\";\n"],"mappings":"AAAA","ignoreList":[]}

package/DatePicker/utils/constants.d.ts

@@ -0,0 +1,3 @@
+export declare const MONTH_NAMES_SHORT: readonly ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
+export declare const MONTH_NAMES_FULL: readonly ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
+export declare const DEFAULT_YEAR_RANGE_SIZE = 12;

package/DatePicker/utils/constants.js

@@ -0,0 +1,5 @@
+export const MONTH_NAMES_SHORT = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
+export const MONTH_NAMES_FULL = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
+export const DEFAULT_YEAR_RANGE_SIZE = 12;
+
+//# sourceMappingURL=constants.js.map

package/DatePicker/utils/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["MONTH_NAMES_SHORT","MONTH_NAMES_FULL","DEFAULT_YEAR_RANGE_SIZE"],"sources":["constants.ts"],"sourcesContent":["export const MONTH_NAMES_SHORT = [\n    \"Jan\",\n    \"Feb\",\n    \"Mar\",\n    \"Apr\",\n    \"May\",\n    \"Jun\",\n    \"Jul\",\n    \"Aug\",\n    \"Sep\",\n    \"Oct\",\n    \"Nov\",\n    \"Dec\"\n] as const;\n\nexport const MONTH_NAMES_FULL = [\n    \"January\",\n    \"February\",\n    \"March\",\n    \"April\",\n    \"May\",\n    \"June\",\n    \"July\",\n    \"August\",\n    \"September\",\n    \"October\",\n    \"November\",\n    \"December\"\n] as const;\n\nexport const DEFAULT_YEAR_RANGE_SIZE = 12;\n"],"mappings":"AAAA,OAAO,MAAMA,iBAAiB,GAAG,CAC7B,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,EACL,KAAK,CACC;AAEV,OAAO,MAAMC,gBAAgB,GAAG,CAC5B,SAAS,EACT,UAAU,EACV,OAAO,EACP,OAAO,EACP,KAAK,EACL,MAAM,EACN,MAAM,EACN,QAAQ,EACR,WAAW,EACX,SAAS,EACT,UAAU,EACV,UAAU,CACJ;AAEV,OAAO,MAAMC,uBAAuB,GAAG,EAAE","ignoreList":[]}