@keboola/design 10.1.0 → 11.0.0

package/dist/chunk-6J25CVST.js

@@ -0,0 +1,174 @@
+import { DatePicker } from './chunk-XCYGJDUX.js';
+import { useControllableState } from './chunk-WKAUEL6I.js';
+import { InputGroup } from './chunk-SC275NHZ.js';
+import { X, Calendar } from './chunk-RQVK4IYC.js';
+import { createChangeInputEvent } from './chunk-SWQFYNYG.js';
+import { mergeRefs } from './chunk-3W27OLK5.js';
+import { useRef, useState } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+// src/blocks/DateRangeInput/helpers.ts
+var formatDateRange = (range, inputValue) => {
+  if (!range) {
+    return inputValue;
+  }
+  const { from, to } = range;
+  const fromStr = from?.toLocaleDateString();
+  const toStr = to?.toLocaleDateString();
+  return `${fromStr} - ${toStr}`;
+};
+var ISO_DATE_ONLY = /^\d{4}-\d{2}-\d{2}$/;
+var parseLocalDate = (value) => ISO_DATE_ONLY.test(value) ? /* @__PURE__ */ new Date(`${value}T00:00:00`) : new Date(value);
+var parseDateRange = (value) => {
+  const parts = value.split(" - ");
+  if (parts.length !== 2) {
+    return null;
+  }
+  const [fromPart, toPart] = parts;
+  if (!fromPart || !toPart) {
+    return null;
+  }
+  const from = parseLocalDate(fromPart.trim());
+  const to = parseLocalDate(toPart.trim());
+  if (isNaN(from.getTime()) || isNaN(to.getTime())) {
+    return null;
+  }
+  return { from, to };
+};
+var DateRangeInput = ({
+  ref,
+  // group props
+  state,
+  variant,
+  focusVariant,
+  sizing,
+  className,
+  // own props
+  value: valueProp,
+  defaultValue,
+  onValueChange,
+  onValueBlur,
+  onChange,
+  onBlur,
+  onFocus,
+  allowClear = false,
+  startMonth,
+  endMonth,
+  // input props
+  disabled,
+  readOnly,
+  placeholder = "Select a date range",
+  ...restInputProps
+}) => {
+  const inputRef = useRef(null);
+  const [inputValue, setInputValue] = useState("");
+  const [hasFocus, setHasFocus] = useState(false);
+  const [isOpen, setIsOpen] = useState(false);
+  const [month, setMonth] = useState(/* @__PURE__ */ new Date());
+  const [currentValue, setCurrentValue] = useControllableState({
+    prop: valueProp,
+    defaultProp: defaultValue ?? null
+  });
+  const canClear = allowClear && !!currentValue && !disabled && !readOnly;
+  const showPicker = !disabled && !readOnly;
+  const handleChange = (event) => {
+    const newValue = event.target.value;
+    setInputValue(newValue);
+    onChange?.(event);
+    const parsedRange = parseDateRange(newValue);
+    if (parsedRange !== null || !newValue.trim()) {
+      onValueChange?.(parsedRange);
+    }
+  };
+  const handleFocus = (event) => {
+    setInputValue(formatDateRange(currentValue, ""));
+    setHasFocus(true);
+    onFocus?.(event);
+  };
+  const handleBlur = (event) => {
+    setHasFocus(false);
+    onBlur?.(event);
+    const text = event.target.value;
+    const parsedRange = text === formatDateRange(currentValue, "") ? currentValue : parseDateRange(text);
+    onValueBlur?.(parsedRange);
+    setCurrentValue(parsedRange);
+  };
+  const handleDatePickerChange = (newValue) => {
+    const rangeValue = newValue ?? null;
+    setCurrentValue(rangeValue);
+    onValueChange?.(rangeValue);
+    setHasFocus(false);
+  };
+  const handleClear = () => {
+    if (!inputRef.current) return;
+    inputRef.current.value = "";
+    setInputValue("");
+    setCurrentValue(null);
+    onValueChange?.(null);
+    onChange?.(createChangeInputEvent(inputRef.current));
+  };
+  const handleOpenChange = (open) => {
+    if (open) {
+      setMonth(currentValue?.from ?? /* @__PURE__ */ new Date());
+    }
+    setIsOpen(open);
+  };
+  const displayValue = hasFocus ? inputValue : formatDateRange(currentValue, "");
+  return /* @__PURE__ */ jsxs(
+    InputGroup,
+    {
+      state,
+      variant,
+      sizing,
+      focusVariant,
+      className,
+      children: [
+        /* @__PURE__ */ jsx(
+          InputGroup.Input,
+          {
+            ...restInputProps,
+            ref: mergeRefs(ref ?? null, inputRef),
+            type: "text",
+            value: displayValue,
+            placeholder,
+            onChange: handleChange,
+            onFocus: handleFocus,
+            onBlur: handleBlur,
+            disabled,
+            readOnly
+          }
+        ),
+        (canClear || showPicker) && /* @__PURE__ */ jsxs(InputGroup.Addon, { align: "inline-end", children: [
+          canClear && /* @__PURE__ */ jsx(
+            InputGroup.Button,
+            {
+              "aria-label": "Clear date range",
+              onMouseDown: (event) => event.preventDefault(),
+              onClick: handleClear,
+              children: /* @__PURE__ */ jsx(X, { className: "tw:size-4" })
+            }
+          ),
+          showPicker && /* @__PURE__ */ jsx(
+            DatePicker,
+            {
+              endMonth,
+              mode: "range",
+              month,
+              onMonthChange: setMonth,
+              onOpenChange: handleOpenChange,
+              onSelect: handleDatePickerChange,
+              open: isOpen,
+              startMonth,
+              selected: currentValue ?? void 0,
+              children: /* @__PURE__ */ jsx(InputGroup.Button, { "aria-label": "Select date range", children: /* @__PURE__ */ jsx(Calendar, { className: "tw:size-4" }) })
+            }
+          )
+        ] })
+      ]
+    }
+  );
+};
+
+export { DateRangeInput };
+//# sourceMappingURL=chunk-6J25CVST.js.map
+//# sourceMappingURL=chunk-6J25CVST.js.map

package/dist/chunk-6J25CVST.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/blocks/DateRangeInput/helpers.ts","../src/blocks/DateRangeInput/DateRangeInput.tsx"],"names":[],"mappings":"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","file":"chunk-6J25CVST.js","sourcesContent":["import type { DateRange } from 'react-day-picker';\n\nexport const formatDateRange = (\n  range: DateRange | null | undefined,\n  inputValue: string,\n): string => {\n  if (!range) {\n    return inputValue;\n  }\n\n  const { from, to } = range;\n  const fromStr = from?.toLocaleDateString();\n  const toStr = to?.toLocaleDateString();\n  return `${fromStr} - ${toStr}`;\n};\n\nconst ISO_DATE_ONLY = /^\\d{4}-\\d{2}-\\d{2}$/;\n\n/**\n * `new Date('2024-01-15')` is spec'd as UTC midnight, so reading it back with the\n * local getters this component relies on (`getDate`, `toLocaleDateString`) yields\n * the previous day for users west of UTC. Appending a time makes the ISO form\n * parse as local time instead, while keeping `new Date`'s validation — an\n * out-of-range month or day is still `Invalid Date`, whereas building the parts\n * via `new Date(y, m - 1, d)` would silently roll '2024-13-45' over to 2025-02-14.\n *\n * Every other format accepted here ('01/15/2024', 'Jan 15, 2024', '2024/01/15')\n * is already parsed as local time, so only the date-only ISO form is rewritten.\n */\nconst parseLocalDate = (value: string): Date =>\n  ISO_DATE_ONLY.test(value) ? new Date(`${value}T00:00:00`) : new Date(value);\n\nexport const parseDateRange = (value: string): DateRange | null => {\n  const parts = value.split(' - ');\n  if (parts.length !== 2) {\n    return null;\n  }\n\n  const [fromPart, toPart] = parts;\n  if (!fromPart || !toPart) {\n    return null;\n  }\n\n  const from = parseLocalDate(fromPart.trim());\n  const to = parseLocalDate(toPart.trim());\n\n  if (isNaN(from.getTime()) || isNaN(to.getTime())) {\n    return null;\n  }\n\n  return { from, to };\n};\n","import { useRef, useState } from 'react';\nimport type { ChangeEventHandler, ComponentProps, ComponentRef, FocusEventHandler } from 'react';\nimport type { DateRange } from 'react-day-picker';\n\nimport { DatePicker } from '../../components/DatePicker';\nimport { InputGroup } from '../../components/InputGroup';\nimport { useControllableState } from '../../hooks/useControllableState';\nimport { Calendar as CalendarIcon, X } from '../../icons';\nimport { createChangeInputEvent, mergeRefs } from '../../utils';\n\nimport { formatDateRange, parseDateRange } from './helpers';\n\ntype InputGroupProps = Pick<\n  ComponentProps<typeof InputGroup>,\n  'variant' | 'focusVariant' | 'state' | 'sizing'\n>;\n\ntype InputGroupInputProps = Omit<\n  ComponentProps<typeof InputGroup.Input>,\n  'value' | 'defaultValue' | 'type'\n>;\n\ntype Props = InputGroupProps &\n  InputGroupInputProps & {\n    value?: DateRange | null;\n    defaultValue?: DateRange | null;\n    onValueChange?: (value: DateRange | null) => void;\n    onValueBlur?: (value: DateRange | null) => void;\n    allowClear?: boolean;\n    startMonth?: Date;\n    endMonth?: Date;\n  };\n\nexport const DateRangeInput = ({\n  ref,\n\n  // group props\n  state,\n  variant,\n  focusVariant,\n  sizing,\n  className,\n\n  // own props\n  value: valueProp,\n  defaultValue,\n  onValueChange,\n  onValueBlur,\n  onChange,\n  onBlur,\n  onFocus,\n  allowClear = false,\n  startMonth,\n  endMonth,\n\n  // input props\n  disabled,\n  readOnly,\n  placeholder = 'Select a date range',\n  ...restInputProps\n}: Props) => {\n  const inputRef = useRef<ComponentRef<'input'>>(null);\n\n  const [inputValue, setInputValue] = useState('');\n  const [hasFocus, setHasFocus] = useState(false);\n  const [isOpen, setIsOpen] = useState(false);\n  const [month, setMonth] = useState<Date>(new Date());\n\n  // `onValueChange` is fired explicitly per-path below (not through the hook), because commits\n  // happen on blur / picker-select rather than on every keystroke.\n  const [currentValue, setCurrentValue] = useControllableState<DateRange | null>({\n    prop: valueProp,\n    defaultProp: defaultValue ?? null,\n  });\n\n  const canClear = allowClear && !!currentValue && !disabled && !readOnly;\n  const showPicker = !disabled && !readOnly;\n\n  const handleChange: ChangeEventHandler<HTMLInputElement> = (event) => {\n    const newValue = event.target.value;\n    setInputValue(newValue);\n    onChange?.(event);\n\n    const parsedRange = parseDateRange(newValue);\n    if (parsedRange !== null || !newValue.trim()) {\n      onValueChange?.(parsedRange);\n    }\n  };\n\n  const handleFocus: FocusEventHandler<HTMLInputElement> = (event) => {\n    setInputValue(formatDateRange(currentValue, ''));\n    setHasFocus(true);\n    onFocus?.(event);\n  };\n\n  const handleBlur: FocusEventHandler<HTMLInputElement> = (event) => {\n    setHasFocus(false);\n    onBlur?.(event);\n\n    // If the field still shows the formatted current value (focused and blurred\n    // without editing), keep it as-is. `formatDateRange` uses `toLocaleDateString`,\n    // whose output is not reliably parseable by `new Date(...)` in every locale, so\n    // round-tripping an untouched value through `parseDateRange` could wrongly null it.\n    const text = event.target.value;\n    const parsedRange =\n      text === formatDateRange(currentValue, '') ? currentValue : parseDateRange(text);\n    onValueBlur?.(parsedRange);\n\n    setCurrentValue(parsedRange);\n  };\n\n  const handleDatePickerChange = (newValue: DateRange | undefined) => {\n    const rangeValue = newValue ?? null;\n\n    setCurrentValue(rangeValue);\n    onValueChange?.(rangeValue);\n\n    setHasFocus(false);\n  };\n\n  const handleClear = () => {\n    if (!inputRef.current) return;\n    inputRef.current.value = '';\n    setInputValue('');\n    setCurrentValue(null);\n    onValueChange?.(null);\n    onChange?.(createChangeInputEvent(inputRef.current));\n  };\n\n  const handleOpenChange = (open: boolean) => {\n    if (open) {\n      setMonth(currentValue?.from ?? new Date());\n    }\n    setIsOpen(open);\n  };\n\n  const displayValue = hasFocus ? inputValue : formatDateRange(currentValue, '');\n\n  return (\n    <InputGroup\n      state={state}\n      variant={variant}\n      sizing={sizing}\n      focusVariant={focusVariant}\n      className={className}\n    >\n      <InputGroup.Input\n        {...restInputProps}\n        ref={mergeRefs(ref ?? null, inputRef)}\n        type=\"text\"\n        value={displayValue}\n        placeholder={placeholder}\n        onChange={handleChange}\n        onFocus={handleFocus}\n        onBlur={handleBlur}\n        disabled={disabled}\n        readOnly={readOnly}\n      />\n\n      {(canClear || showPicker) && (\n        <InputGroup.Addon align=\"inline-end\">\n          {canClear && (\n            <InputGroup.Button\n              aria-label=\"Clear date range\"\n              onMouseDown={(event) => event.preventDefault()}\n              onClick={handleClear}\n            >\n              <X className=\"tw:size-4\" />\n            </InputGroup.Button>\n          )}\n          {showPicker && (\n            <DatePicker\n              endMonth={endMonth}\n              mode=\"range\"\n              month={month}\n              onMonthChange={setMonth}\n              onOpenChange={handleOpenChange}\n              onSelect={handleDatePickerChange}\n              open={isOpen}\n              startMonth={startMonth}\n              selected={currentValue ?? undefined}\n            >\n              <InputGroup.Button aria-label=\"Select date range\">\n                <CalendarIcon className=\"tw:size-4\" />\n              </InputGroup.Button>\n            </DatePicker>\n          )}\n        </InputGroup.Addon>\n      )}\n    </InputGroup>\n  );\n};\n"]}

package/dist/chunk-6NN35XOP.js

@@ -0,0 +1,120 @@
+import { Loader2, Google } from './chunk-RQVK4IYC.js';
+import { cn } from './chunk-LXLIQ2D6.js';
+import { cva } from 'class-variance-authority';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var LABELS = {
+  signin: "Sign in with Google",
+  signup: "Sign up with Google",
+  continue: "Continue with Google",
+  "signin-short": "Sign in"
+};
+var GOOGLE_FONT_STACK = "'Roboto', arial, sans-serif";
+var variants = cva(
+  [
+    "tailwindcss-preflight",
+    "tw:inline-flex",
+    "tw:items-center",
+    "tw:justify-center",
+    "tw:h-10",
+    "tw:border",
+    "tw:text-sm",
+    // Literal weight (Google spec = 500). The `tw:font-*` scale is brand-overridable
+    // (`--font-weight-*`), and this button must stay brand-independent.
+    "tw:font-[500]",
+    "tw:leading-none",
+    "tw:whitespace-nowrap",
+    "tw:select-none",
+    "tw:cursor-pointer",
+    "tw:transition-shadow",
+    "tw:[&_svg]:shrink-0",
+    // focus — a neutral Google-blue ring, independent of the active brand.
+    "tw:focus-visible:outline-hidden",
+    "tw:focus-visible:ring-2",
+    "tw:focus-visible:ring-[#4285f4]/60",
+    // disabled
+    "tw:disabled:cursor-not-allowed",
+    "tw:disabled:opacity-60",
+    // dark treatment — auto-applied under html[data-theme=dark], overriding
+    // whichever `variant` is active (the ancestor selector out-specifies the
+    // variant's plain color classes).
+    "tw:[[data-theme=dark]_&]:bg-[#131314]",
+    "tw:[[data-theme=dark]_&]:text-[#e3e3e3]",
+    "tw:[[data-theme=dark]_&]:border-[#8e918f]",
+    "tw:[[data-theme=dark]_&]:hover:not-disabled:bg-[#1e1f20]",
+    "tw:[[data-theme=dark]_&]:hover:not-disabled:shadow-none"
+  ],
+  {
+    defaultVariants: {
+      variant: "default",
+      shape: "rectangular",
+      size: "default"
+    },
+    variants: {
+      // Google's approved light-scheme treatments; dark (above) overrides both.
+      variant: {
+        default: [
+          "tw:bg-white",
+          "tw:text-[#1f1f1f]",
+          "tw:border-[#747775]",
+          "tw:hover:not-disabled:bg-[#f7f8f8]",
+          "tw:hover:not-disabled:shadow-[0_1px_2px_0_rgba(60,64,67,0.30),0_1px_3px_1px_rgba(60,64,67,0.15)]"
+        ],
+        neutral: [
+          "tw:bg-[#f2f2f2]",
+          "tw:text-[#1f1f1f]",
+          "tw:border-transparent",
+          "tw:hover:not-disabled:bg-[#e8eaed]"
+        ]
+      },
+      shape: {
+        rectangular: ["tw:rounded"],
+        circle: ["tw:rounded-full"]
+      },
+      size: {
+        default: ["tw:gap-2.5", "tw:px-3"],
+        icon: ["tw:w-10", "tw:p-0"]
+      }
+    }
+  }
+);
+var GoogleButton = ({
+  ref,
+  variant = "default",
+  shape = "rectangular",
+  size = "default",
+  label = "signin",
+  isLoading = false,
+  disabled = false,
+  type = "button",
+  className,
+  children,
+  style,
+  ...buttonProps
+}) => /* @__PURE__ */ jsxs(
+  "button",
+  {
+    ...buttonProps,
+    ref,
+    type,
+    disabled,
+    style: { ...style, fontFamily: GOOGLE_FONT_STACK },
+    className: cn(variants({ variant, shape, size }), className),
+    children: [
+      isLoading ? /* @__PURE__ */ jsx(Loader2, { className: "tw:size-5 tw:shrink-0 tw:animate-spin", "aria-hidden": "true" }) : /* @__PURE__ */ jsx(Google, { className: "tw:size-5" }),
+      /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: cn({
+            "tw:sr-only": size === "icon"
+          }),
+          children: children ?? LABELS[label]
+        }
+      )
+    ]
+  }
+);
+
+export { GoogleButton };
+//# sourceMappingURL=chunk-6NN35XOP.js.map
+//# sourceMappingURL=chunk-6NN35XOP.js.map

package/dist/chunk-6NN35XOP.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/blocks/GoogleButton/GoogleButton.tsx"],"names":[],"mappings":"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","file":"chunk-6NN35XOP.js","sourcesContent":["import type { ComponentPropsWithRef } from 'react';\nimport type { VariantProps } from 'class-variance-authority';\nimport { cva } from 'class-variance-authority';\n\nimport { Google, Loader2 } from '../../icons';\nimport { cn } from '../../utils';\n\nconst LABELS = {\n  signin: 'Sign in with Google',\n  signup: 'Sign up with Google',\n  continue: 'Continue with Google',\n  'signin-short': 'Sign in',\n} as const;\n\nconst GOOGLE_FONT_STACK = \"'Roboto', arial, sans-serif\";\n\nconst variants = cva(\n  [\n    'tailwindcss-preflight',\n    'tw:inline-flex',\n    'tw:items-center',\n    'tw:justify-center',\n    'tw:h-10',\n    'tw:border',\n    'tw:text-sm',\n    // Literal weight (Google spec = 500). The `tw:font-*` scale is brand-overridable\n    // (`--font-weight-*`), and this button must stay brand-independent.\n    'tw:font-[500]',\n    'tw:leading-none',\n    'tw:whitespace-nowrap',\n    'tw:select-none',\n    'tw:cursor-pointer',\n    'tw:transition-shadow',\n    'tw:[&_svg]:shrink-0',\n\n    // focus — a neutral Google-blue ring, independent of the active brand.\n    'tw:focus-visible:outline-hidden',\n    'tw:focus-visible:ring-2',\n    'tw:focus-visible:ring-[#4285f4]/60',\n\n    // disabled\n    'tw:disabled:cursor-not-allowed',\n    'tw:disabled:opacity-60',\n\n    // dark treatment — auto-applied under html[data-theme=dark], overriding\n    // whichever `variant` is active (the ancestor selector out-specifies the\n    // variant's plain color classes).\n    'tw:[[data-theme=dark]_&]:bg-[#131314]',\n    'tw:[[data-theme=dark]_&]:text-[#e3e3e3]',\n    'tw:[[data-theme=dark]_&]:border-[#8e918f]',\n    'tw:[[data-theme=dark]_&]:hover:not-disabled:bg-[#1e1f20]',\n    'tw:[[data-theme=dark]_&]:hover:not-disabled:shadow-none',\n  ],\n  {\n    defaultVariants: {\n      variant: 'default',\n      shape: 'rectangular',\n      size: 'default',\n    },\n    variants: {\n      // Google's approved light-scheme treatments; dark (above) overrides both.\n      variant: {\n        default: [\n          'tw:bg-white',\n          'tw:text-[#1f1f1f]',\n          'tw:border-[#747775]',\n          'tw:hover:not-disabled:bg-[#f7f8f8]',\n          'tw:hover:not-disabled:shadow-[0_1px_2px_0_rgba(60,64,67,0.30),0_1px_3px_1px_rgba(60,64,67,0.15)]',\n        ],\n        neutral: [\n          'tw:bg-[#f2f2f2]',\n          'tw:text-[#1f1f1f]',\n          'tw:border-transparent',\n          'tw:hover:not-disabled:bg-[#e8eaed]',\n        ],\n      },\n      shape: {\n        rectangular: ['tw:rounded'],\n        circle: ['tw:rounded-full'],\n      },\n      size: {\n        default: ['tw:gap-2.5', 'tw:px-3'],\n        icon: ['tw:w-10', 'tw:p-0'],\n      },\n    },\n  },\n);\n\ntype Props = ComponentPropsWithRef<'button'> &\n  VariantProps<typeof variants> & {\n    label?: keyof typeof LABELS;\n    isLoading?: boolean;\n  };\n\nexport const GoogleButton = ({\n  ref,\n  variant = 'default',\n  shape = 'rectangular',\n  size = 'default',\n  label = 'signin',\n  isLoading = false,\n  disabled = false,\n  type = 'button',\n  className,\n  children,\n  style,\n  ...buttonProps\n}: Props) => (\n  <button\n    {...buttonProps}\n    ref={ref}\n    type={type}\n    disabled={disabled}\n    style={{ ...style, fontFamily: GOOGLE_FONT_STACK }}\n    className={cn(variants({ variant, shape, size }), className)}\n  >\n    {isLoading ? (\n      <Loader2 className=\"tw:size-5 tw:shrink-0 tw:animate-spin\" aria-hidden=\"true\" />\n    ) : (\n      <Google className=\"tw:size-5\" />\n    )}\n\n    <span\n      className={cn({\n        'tw:sr-only': size === 'icon',\n      })}\n    >\n      {children ?? LABELS[label]}\n    </span>\n  </button>\n);\n"]}

package/dist/chunk-6NZBVA4T.js

@@ -0,0 +1,24 @@
+import { cn } from './chunk-LXLIQ2D6.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var DOT_CLASS_NAME = cn("tw:h-1.5", "tw:w-1.5", "tw:rounded-full", "tw:bg-muted-foreground");
+var DotsLoader = ({ className }) => {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "tw:relative tw:-m-0.5 tw:flex tw:items-center tw:justify-center tw:gap-1",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx("div", { className: cn(DOT_CLASS_NAME, "tw:animate-dot-pulse-1") }),
+        /* @__PURE__ */ jsx("div", { className: cn(DOT_CLASS_NAME, "tw:animate-dot-pulse-2") }),
+        /* @__PURE__ */ jsx("div", { className: cn(DOT_CLASS_NAME, "tw:animate-dot-pulse-3") })
+      ]
+    }
+  );
+};
+
+export { DotsLoader };
+//# sourceMappingURL=chunk-6NZBVA4T.js.map
+//# sourceMappingURL=chunk-6NZBVA4T.js.map

package/dist/chunk-6NZBVA4T.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/DotsLoader.tsx"],"names":[],"mappings":";;;AAMA,IAAM,cAAA,GAAiB,EAAA,CAAG,UAAA,EAAY,UAAA,EAAY,mBAAmB,wBAAwB,CAAA;AAEtF,IAAM,UAAA,GAAa,CAAC,EAAE,SAAA,EAAU,KAAuB;AAC5D,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,EAAA;AAAA,QACT,0EAAA;AAAA,QACA;AAAA,OACF;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,EAAA,CAAG,cAAA,EAAgB,wBAAwB,CAAA,EAAG,CAAA;AAAA,4BAC7D,KAAA,EAAA,EAAI,SAAA,EAAW,EAAA,CAAG,cAAA,EAAgB,wBAAwB,CAAA,EAAG,CAAA;AAAA,4BAC7D,KAAA,EAAA,EAAI,SAAA,EAAW,EAAA,CAAG,cAAA,EAAgB,wBAAwB,CAAA,EAAG;AAAA;AAAA;AAAA,GAChE;AAEJ","file":"chunk-6NZBVA4T.js","sourcesContent":["import { cn } from '../utils/classNames';\n\ntype DotsLoaderProps = {\n  className?: string;\n};\n\nconst DOT_CLASS_NAME = cn('tw:h-1.5', 'tw:w-1.5', 'tw:rounded-full', 'tw:bg-muted-foreground');\n\nexport const DotsLoader = ({ className }: DotsLoaderProps) => {\n  return (\n    <div\n      className={cn(\n        'tw:relative tw:-m-0.5 tw:flex tw:items-center tw:justify-center tw:gap-1',\n        className,\n      )}\n    >\n      <div className={cn(DOT_CLASS_NAME, 'tw:animate-dot-pulse-1')} />\n      <div className={cn(DOT_CLASS_NAME, 'tw:animate-dot-pulse-2')} />\n      <div className={cn(DOT_CLASS_NAME, 'tw:animate-dot-pulse-3')} />\n    </div>\n  );\n};\n"]}

package/dist/chunk-6W5BHRCL.js

@@ -0,0 +1,295 @@
+import { Loader2, X, AlertCircle, CircleCheck, Info, AlertTriangle } from './chunk-RQVK4IYC.js';
+import { useArgoDesign } from './chunk-WETKNYZX.js';
+import { cn } from './chunk-LXLIQ2D6.js';
+import { toast as toast$1 } from 'sonner';
+import { cva } from 'class-variance-authority';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var ToastAction = ({ ref, className, ...rest }) => /* @__PURE__ */ jsx(
+  "button",
+  {
+    ...rest,
+    ref,
+    "data-slot": "toast-action",
+    type: "button",
+    className: cn(
+      // layout
+      "tw:col-start-3",
+      "tw:row-start-1",
+      "tw:flex",
+      "tw:items-center",
+      "tw:justify-center",
+      // font
+      "tw:text-xs",
+      "tw:font-medium",
+      "tw:text-primary",
+      // sizing
+      "tw:px-2",
+      "tw:h-6",
+      // styles
+      "tw:bg-primary-foreground",
+      "tw:rounded",
+      className
+    )
+  }
+);
+var ToastDescription = ({ ref, className, children, ...rest }) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    ref,
+    "data-slot": "toast-description",
+    className: cn(
+      "tw:col-start-2",
+      "tw:font-normal",
+      "tw:break-words",
+      "tw:text-white",
+      "tw:group-data-[variant=default]/toast:text-muted-foreground",
+      className
+    ),
+    ...rest,
+    children
+  }
+);
+var ToastDismiss = ({ ref, className, ...rest }) => /* @__PURE__ */ jsxs(
+  "button",
+  {
+    ref,
+    "data-slot": "toast-dismiss",
+    className: cn(
+      "tw:flex",
+      "tw:justify-center",
+      "tw:col-start-4",
+      "tw:row-start-1",
+      "tailwindcss-preflight",
+      "tw:[&_svg]:aspect-square",
+      'tw:[&_svg:not([class*="tw:size-"])]:size-4',
+      "tw:[&_svg]:m-1",
+      "tw:text-white",
+      "tw:group-data-[variant=default]/toast:[&_svg]:text-popover-foreground",
+      "tw:group-data-[variant=default]/toast:group-data-[argo=true]/toast:[&_svg]:text-foreground",
+      className
+    ),
+    type: "button",
+    ...rest,
+    children: [
+      /* @__PURE__ */ jsx(X, {}),
+      /* @__PURE__ */ jsx("span", { className: "tw:sr-only", children: "Dismiss" })
+    ]
+  }
+);
+var ToastDuration = ({ ref, duration, className, style, ...rest }) => /* @__PURE__ */ jsx(
+  "span",
+  {
+    ...rest,
+    ref,
+    className: cn(
+      "tw:bg-white/30",
+      "tw:group-data-[variant=default]/toast:bg-popover-foreground/20",
+      "tw:group-data-[variant=default]/toast:group-data-[argo=true]/toast:bg-foreground/20",
+      "tw:rounded-bl-lg",
+      "tw:mx-px",
+      // positioning
+      "tw:absolute",
+      "tw:bottom-0",
+      "tw:left-0",
+      // sizing
+      "tw:h-1",
+      // animation
+      "tw:animate-toast-progress",
+      "tw:group-hover/toast:[animation-play-state:paused]",
+      className
+    ),
+    style: {
+      animationDuration: `${duration}ms`,
+      ...style
+    }
+  }
+);
+var ToastTitle = ({ ref, className, children, ...rest }) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    ref,
+    "data-slot": "toast-title",
+    className: cn(
+      "tw:col-start-2",
+      "tw:text-sm",
+      "tw:leading-6",
+      "tw:min-h-6",
+      "tw:self-center",
+      "tw:text-white",
+      "tw:group-data-[variant=default]/toast:text-popover-foreground",
+      "tw:group-data-[variant=default]/toast:group-data-[argo=true]/toast:text-foreground",
+      "tw:break-words",
+      "tw:font-medium",
+      className
+    ),
+    ...rest,
+    children
+  }
+);
+var variants = cva(
+  [
+    "tailwindcss-preflight",
+    "tw:group/toast",
+    "tw:relative",
+    // layout
+    "tw:grid",
+    "tw:grid-cols-[0_1fr_auto_auto]",
+    "tw:items-start",
+    "tw:has-[[data-slot=toast-description]]:grid-rows-[auto_auto]",
+    "tw:has-[[data-slot=toast-icon]]:grid-cols-[auto_1fr_auto_auto]",
+    "tw:[&_[data-slot=toast-icon]]:mr-2",
+    "tw:[&_[data-slot=toast-title]]:mr-2.5",
+    "tw:[&_[data-slot=toast-description]]:mr-2.5",
+    "tw:[&_[data-slot=toast-action]]:mr-2",
+    "tw:[&_[data-slot=toast-description]]:col-end-3",
+    "tw:gap-y-0",
+    // styles
+    "tw:p-4",
+    "tw:rounded-lg",
+    "tw:shadow-md"
+  ],
+  {
+    defaultVariants: {
+      variant: "info"
+    },
+    variants: {
+      variant: {
+        default: "tw:border tw:border-border tw:bg-popover",
+        error: "tw:bg-error-550",
+        info: "tw:bg-blue-600",
+        success: "tw:bg-green-700",
+        warning: "tw:bg-warning-550"
+      }
+    }
+  }
+);
+var DEFAULT_VARIANT_ICON = {
+  error: /* @__PURE__ */ jsx(AlertTriangle, {}),
+  info: /* @__PURE__ */ jsx(Info, {}),
+  success: /* @__PURE__ */ jsx(CircleCheck, {}),
+  warning: /* @__PURE__ */ jsx(AlertCircle, {})
+};
+var ToastRoot = ({
+  id,
+  title,
+  description,
+  action,
+  duration = Infinity,
+  variant = "info",
+  loading = false,
+  icon: iconProp
+}) => {
+  const renderArgo = useArgoDesign();
+  const icon = (() => {
+    if (loading) return /* @__PURE__ */ jsx(Loader2, { className: "tw:animate-spin" });
+    if (iconProp) return iconProp;
+    if (variant === "default" || variant === null) return null;
+    return DEFAULT_VARIANT_ICON[variant];
+  })();
+  const handleActionClick = (event) => {
+    toast$1.dismiss(id);
+    action?.onClick(event);
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-variant": variant,
+      "data-argo": renderArgo,
+      className: cn(
+        variants({ variant }),
+        "tw:data-[variant=default]:data-[argo=true]:bg-background"
+      ),
+      children: [
+        icon && /* @__PURE__ */ jsx(
+          "span",
+          {
+            "data-slot": "toast-icon",
+            className: cn(
+              "tw:inline-flex",
+              "tw:items-center",
+              "tw:justify-center",
+              "tw:self-center",
+              "tw:aspect-square",
+              "tw:size-5",
+              "tw:shrink-0",
+              'tw:[&_svg:not([class*="tw:size-"])]:size-5',
+              "tw:text-white",
+              "tw:group-data-[variant=default]/toast:text-popover-foreground",
+              "tw:group-data-[variant=default]/toast:group-data-[argo=true]/toast:text-foreground"
+            ),
+            children: icon
+          }
+        ),
+        /* @__PURE__ */ jsx(ToastTitle, { children: title }),
+        description && /* @__PURE__ */ jsx(ToastDescription, { children: description }),
+        action && /* @__PURE__ */ jsx(ToastAction, { style: action?.actionButtonStyle, onClick: handleActionClick, children: action.label }),
+        /* @__PURE__ */ jsx(ToastDismiss, { onClick: () => toast$1.dismiss(id) }),
+        duration !== Infinity && /* @__PURE__ */ jsx(ToastDuration, { duration })
+      ]
+    }
+  );
+};
+var toast = ({
+  onAutoClose,
+  onDismiss,
+  testId,
+  toasterId,
+  dismissible = true,
+  position,
+  title: titleProp,
+  ...toast2
+}) => {
+  const duration = (() => {
+    if (typeof toast2.duration === "number") return toast2.duration;
+    if (toast2.variant === "error" || toast2.variant === "warning") return Infinity;
+    return toast2.duration ?? 5e3;
+  })();
+  const renderCustomToast = (id) => {
+    const title = typeof titleProp === "function" ? titleProp({ dismiss: () => toast$1.dismiss(id) }) : titleProp;
+    return /* @__PURE__ */ jsx(ToastRoot, { ...toast2, id, title, duration });
+  };
+  return toast$1.custom(renderCustomToast, {
+    // toast generated by sonner will always have an id, but we want to allow users to specify their own id if they want to
+    // can not pass undefined, as it will break dismiss
+    ...toast2.id != null ? { id: toast2.id } : {},
+    unstyled: true,
+    position,
+    onAutoClose,
+    onDismiss,
+    testId,
+    toasterId,
+    dismissible,
+    duration,
+    // override default focus-visible styles to match our design
+    className: cn("tw:rounded-lg", "tw:focus-visible:!ring-4", "tw:focus-visible:!ring-ring/50")
+  });
+};
+toast.success = (title, options) => toast({
+  ...options,
+  title,
+  variant: "success"
+});
+toast.error = (title, options) => toast({
+  ...options,
+  title,
+  variant: "error",
+  duration: options?.duration ?? Infinity
+});
+toast.warning = (title, options) => toast({
+  ...options,
+  title,
+  variant: "warning",
+  duration: options?.duration ?? Infinity
+});
+toast.info = (title, options) => toast({
+  ...options,
+  title,
+  variant: "info"
+});
+toast.dismiss = (toastId) => toast$1.dismiss(toastId);
+toast.dismissAll = () => toast$1.dismiss();
+
+export { toast };
+//# sourceMappingURL=chunk-6W5BHRCL.js.map
+//# sourceMappingURL=chunk-6W5BHRCL.js.map