@dmsi/wedgekit-react 0.0.4 → 0.0.6

package/dist/chunk-F3U3RHIB.js

@@ -1,131 +0,0 @@
-import {
-  Paragraph
-} from "./chunk-I5HKQSF2.js";
-import {
-  Icon
-} from "./chunk-IGQVA7SC.js";
-import {
-  baseTransition,
-  componentGap
-} from "./chunk-JDHZQIFC.js";
-import {
-  __objRest,
-  __spreadValues
-} from "./chunk-ORMEWXMH.js";
-
-// src/components/Checkbox.tsx
-import clsx from "clsx";
-import { jsx, jsxs } from "react/jsx-runtime";
-var Checkbox = (_a) => {
-  var _b = _a, {
-    label,
-    error,
-    disabled,
-    readOnly,
-    checked,
-    onChange,
-    indeterminate,
-    paragraphClassName
-  } = _b, props = __objRest(_b, [
-    "label",
-    "error",
-    "disabled",
-    "readOnly",
-    "checked",
-    "onChange",
-    "indeterminate",
-    "paragraphClassName"
-  ]);
-  const selected = indeterminate || checked;
-  const normalClassName = clsx(
-    !selected && !error && !disabled && !readOnly && "border-border-primary-normal bg-background-action-secondary-normal peer-hover:border-border-action-hover peer-hover:bg-background-action-secondary-hover peer-active:border-border-action-active peer-active:bg-background-action-secondary-active"
-  );
-  const normalSelectedClassName = clsx(
-    selected && !error && !disabled && !readOnly && "bg-background-action-primary-normal border-background-action-primary-normal peer-hover:bg-background-action-primary-hover peer-hover:border-background-action-primary-hover peer-active:bg-background-action-primary-active peer-active:border-background-action-primary-active"
-  );
-  const errorClassName = clsx(
-    error && !selected && "bg-background-action-critical-secondary-normal border-border-action-critical-normal peer-hover:border-border-action-critical-hover peer-hover:bg-background-action-critical-secondary-hover peer-active:border-border-action-critical-active peer-active:bg-background-action-secondary-active"
-  );
-  const errorSelectedClassName = clsx(
-    error && selected && "bg-background-action-critical-primary-normal border-background-action-critical-primary-normal peer-hover:bg-background-action-critical-primary-hover peer-hover:border-background-action-critical-primary-hover peer-active:bg-background-action-critical-primary-active peer-active:border-background-action-critical-primary-active"
-  );
-  const disabledClassName = clsx(
-    disabled && !readOnly && "border-border-primary-normal bg-background-action-secondary-disabled peer-checked:bg-icon-on-action-primary-disabled peer-checked:border-icon-on-action-primary-disabled"
-  );
-  const readOnlyClassName = clsx(
-    readOnly && "border-transparent bg-transparent peer-checked:bg-transparent peer-checked:border-transparent"
-  );
-  const checkColor = clsx(
-    selected && !disabled && !readOnly && "color-icon-on-action-primary-normal peer-hover:color-icon-on-action-primary-hover peer-active:color-icon-on-action-primary-active",
-    selected && disabled && "color-background-action-primary-disabled"
-  );
-  return /* @__PURE__ */ jsxs(
-    "label",
-    {
-      className: clsx(
-        "flex items-center",
-        componentGap,
-        (disabled || readOnly && error || readOnly) && "cursor-default",
-        !(readOnly && error) && !disabled && !readOnly && "cursor-pointer"
-      ),
-      children: [
-        /* @__PURE__ */ jsxs("div", { className: "relative", children: [
-          /* @__PURE__ */ jsx(
-            "input",
-            __spreadValues({
-              type: "checkbox",
-              className: "sr-only peer",
-              disabled,
-              checked: selected,
-              onChange: handleOnChange,
-              id: props.id,
-              "data-indeterminate": indeterminate
-            }, props)
-          ),
-          error && (readOnly || disabled) ? /* @__PURE__ */ jsx("div", { className: clsx("size-6", "flex items-center justify-center"), children: selected ? indeterminate ? /* @__PURE__ */ jsx("span", { className: "text-icon-primary-normal contents", children: /* @__PURE__ */ jsx(Icon, { name: "question_mark" }) }) : readOnly ? /* @__PURE__ */ jsx("span", { className: "text-success-400 contents", children: /* @__PURE__ */ jsx(Icon, { name: "check" }) }) : /* @__PURE__ */ jsx("span", { className: "text-icon-on-action-primary-normal contents", children: /* @__PURE__ */ jsx(Icon, { name: "check", className: "pointer-events-none" }) }) : readOnly && /* @__PURE__ */ jsx("span", { className: "text-icon-primary-normal contents", children: /* @__PURE__ */ jsx(Icon, { name: "close" }) }) }) : /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: clsx(
-                "size-6 border rounded-base",
-                "flex items-center justify-center",
-                baseTransition,
-                normalClassName,
-                normalSelectedClassName,
-                errorClassName,
-                errorSelectedClassName,
-                disabledClassName,
-                readOnlyClassName,
-                checkColor
-              ),
-              children: selected ? indeterminate ? readOnly ? /* @__PURE__ */ jsx("span", { className: "text-icon-primary-normal  contents", children: /* @__PURE__ */ jsx(Icon, { name: "question_mark" }) }) : /* @__PURE__ */ jsx("span", { className: "text-icon-on-action-primary-normal contents", children: /* @__PURE__ */ jsx(Icon, { name: "remove", className: "pointer-events-none" }) }) : readOnly ? /* @__PURE__ */ jsx("span", { className: "text-success-400 contents", children: /* @__PURE__ */ jsx(Icon, { name: "check" }) }) : /* @__PURE__ */ jsx("span", { className: "text-icon-on-action-primary-normal contents", children: /* @__PURE__ */ jsx(Icon, { name: "check", className: "pointer-events-none" }) }) : readOnly && /* @__PURE__ */ jsx("span", { className: "text-icon-primary-normal contents", children: /* @__PURE__ */ jsx(Icon, { name: "close" }) })
-            }
-          )
-        ] }),
-        label && /* @__PURE__ */ jsx(
-          Paragraph,
-          {
-            padded: true,
-            className: clsx(
-              "text-nowrap",
-              disabled && !error && "!text-text-primary-disabled",
-              error && !disabled && !readOnly && "!text-text-primary-error",
-              paragraphClassName
-            ),
-            children: label
-          }
-        )
-      ]
-    }
-  );
-  function handleOnChange(e) {
-    if (disabled || readOnly || readOnly && error || !onChange) {
-      return;
-    }
-    onChange(e);
-  }
-};
-Checkbox.displayName = "Checkbox";
-
-export {
-  Checkbox
-};

package/dist/chunk-F433MJII.js

@@ -1,91 +0,0 @@
-import {
-  Button
-} from "./chunk-6Q5NNY5V.js";
-import {
-  Icon
-} from "./chunk-DZLUR2I7.js";
-import {
-  __objRest,
-  __spreadProps,
-  __spreadValues
-} from "./chunk-ORMEWXMH.js";
-
-// src/components/NavigationTab.tsx
-import clsx from "clsx";
-import { jsx } from "react/jsx-runtime";
-var NavigationTab = (_a) => {
-  var _b = _a, {
-    label,
-    onClick,
-    selected = false,
-    className,
-    disabled = false,
-    colorPrimitives = "dmsi"
-  } = _b, props = __objRest(_b, [
-    "label",
-    "onClick",
-    "selected",
-    "className",
-    "disabled",
-    "colorPrimitives"
-  ]);
-  const textClassName = clsx(
-    "!text-text-on-action-primary-normal",
-    "hover:!text-text-on-action-primary-hover",
-    "active:!text-text-on-action-primary-active",
-    "disabled:!text-text-on-action-primary-disabled"
-  );
-  const disabledClassName = clsx(
-    "disabled:!bg-background-on-action-primary-disabled disabled:pointer-events-none"
-  );
-  const paddigClassName = clsx(
-    "p-mobile-component-padding desktop:p-desktop-component-padding compact:p-desktop-compact-component-padding"
-  );
-  const unselectedClassName = clsx(
-    "!bg-background-on-action-primary-normal",
-    "hover:!bg-background-on-action-primary-hover",
-    "active:!bg-background-on-action-primary-active",
-    "shadow-nav-tab"
-  );
-  const selectedClassName = clsx(
-    "!bg-background-on-action-secondary-normal",
-    "hover:!bg-background-on-action-primary-hover",
-    "active:!bg-background-on-action-primary-active"
-  );
-  const tokenOverrides = colorPrimitives === "dmsi" ? {
-    "--color-text-on-action-primary-normal": "var(--color-brand-500)",
-    "--color-text-on-action-primary-hover": "var(--color-brand-500)",
-    "--color-text-on-action-primary-active": "var(--color-brand-300)"
-  } : {
-    "--color-background-on-action-primary-normal": "#D0DDE4",
-    "--color-text-on-action-primary-normal": "#002131",
-    "--color-text-on-action-primary-hover": "#002131",
-    "--color-text-on-action-primary-active": "#1a6280"
-  };
-  return /* @__PURE__ */ jsx("div", { style: tokenOverrides, children: /* @__PURE__ */ jsx(
-    Button,
-    __spreadProps(__spreadValues({
-      variant: "tertiary-critical",
-      className: clsx(
-        "!border-0 !rounded-b-none h-10 min-w-20 relative",
-        paddigClassName,
-        textClassName,
-        disabledClassName,
-        !selected && unselectedClassName,
-        selected && selectedClassName,
-        className
-      ),
-      classNameLabel: "px-1",
-      rightIcon: /* @__PURE__ */ jsx(Icon, { name: "close", size: 16 }),
-      onClick,
-      disabled
-    }, props), {
-      children: label
-    })
-  ) });
-};
-NavigationTab.displayName = "NavigationTab";
-
-export {
-  NavigationTab
-};

package/dist/chunk-F4JE6AD2.js

@@ -1,160 +0,0 @@
-import {
-  __objRest,
-  __spreadProps,
-  __spreadValues
-} from "./chunk-ORMEWXMH.js";
-
-// src/components/Calendar.tsx
-import clsx from "clsx";
-import { Temporal, toTemporalInstant } from "@js-temporal/polyfill";
-import { useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-Date.prototype.toTemporalInstant = toTemporalInstant;
-function Calendar({
-  value,
-  range,
-  disableWeekends = false,
-  onSelect
-}) {
-  const [startOfRange, setStartOfRange] = useState(null);
-  const [hoveredEndOfRange, setHoveredEndOfRange] = useState(null);
-  const instant = value ? new Date(value).toTemporalInstant() : null;
-  const date = instant == null ? void 0 : instant.toZonedDateTimeISO(Temporal.Now.timeZoneId());
-  const today = Temporal.Now.zonedDateTimeISO();
-  const valueForCalculating = date != null ? date : today;
-  const daysInMonth = valueForCalculating.daysInMonth;
-  const firstDayOfMonth = valueForCalculating.with({ day: 1 });
-  const firstDayOfWeek = firstDayOfMonth.dayOfWeek;
-  const emptyCells = (firstDayOfWeek - 1) % 7;
-  const oneWeek = new Temporal.Duration(0, 0, 0, 7);
-  const monthName = [
-    "January",
-    "February",
-    "March",
-    "April",
-    "May",
-    "June",
-    "July",
-    "August",
-    "September",
-    "October",
-    "November",
-    "December"
-  ][valueForCalculating.month - 1];
-  return /* @__PURE__ */ jsxs("div", { onPointerLeave: () => setHoveredEndOfRange(null), children: [
-    /* @__PURE__ */ jsxs("div", { className: "text-center font-bold text-lg mb-2", children: [
-      monthName,
-      " ",
-      valueForCalculating.year
-    ] }),
-    /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-7", children: [
-      Array.from({ length: oneWeek.days }, (_, index) => /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: "w-full h-full aspect-square flex items-center justify-center text-neutral-500",
-          children: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"][index]
-        },
-        index
-      )),
-      Array.from({ length: emptyCells }, (_, index) => /* @__PURE__ */ jsx(DateCell, { disabled: true }, index)),
-      Array.from({ length: daysInMonth }, (_, index) => {
-        const day = index + 1;
-        const cellDate = valueForCalculating.with({ day });
-        const dateString = cellDate.toString();
-        const isToday = today.toPlainDate().equals(cellDate.toPlainDate());
-        const isStart = range && (startOfRange == null ? void 0 : startOfRange.toPlainDate().equals(cellDate.toPlainDate()));
-        const isEnd = range && startOfRange && (hoveredEndOfRange == null ? void 0 : hoveredEndOfRange.toPlainDate().equals(cellDate.toPlainDate()));
-        const isIntermediate = range && startOfRange && hoveredEndOfRange && isDateInRange(cellDate, startOfRange, hoveredEndOfRange) || false;
-        return /* @__PURE__ */ jsx(
-          DateCell,
-          {
-            disabled: disableWeekends && (cellDate.dayOfWeek === 1 || cellDate.dayOfWeek === 7),
-            start: isStart,
-            end: isEnd != null ? isEnd : void 0,
-            today: isToday,
-            intermediate: isIntermediate,
-            selected: date == null ? void 0 : date.toPlainDate().equals(cellDate.toPlainDate()),
-            onHover: () => {
-              setHoveredEndOfRange(cellDate);
-            },
-            onClick: () => {
-              if (range && startOfRange === null) {
-                setStartOfRange(cellDate);
-              } else if (range) {
-              } else {
-                onSelect == null ? void 0 : onSelect(dateString);
-              }
-            },
-            children: day
-          },
-          day
-        );
-      }),
-      Array.from({ length: 42 - daysInMonth - emptyCells }, (_, index) => /* @__PURE__ */ jsx(DateCell, { disabled: true }, index))
-    ] })
-  ] });
-}
-function DateCell(_a) {
-  var _b = _a, {
-    selected = false,
-    start = false,
-    intermediate = false,
-    end = false,
-    today = false,
-    disabled = false,
-    onClick,
-    onHover,
-    onKeyDown,
-    children,
-    className,
-    ref
-  } = _b, props = __objRest(_b, [
-    "selected",
-    "start",
-    "intermediate",
-    "end",
-    "today",
-    "disabled",
-    "onClick",
-    "onHover",
-    "onKeyDown",
-    "children",
-    "className",
-    "ref"
-  ]);
-  const isDefault = !selected && !start && !intermediate && !end && !today;
-  const isToday = today && !selected && !start && !intermediate && !end;
-  return /* @__PURE__ */ jsx(
-    "button",
-    __spreadProps(__spreadValues({
-      onPointerOver: onHover,
-      onClick,
-      onKeyDown,
-      disabled,
-      ref,
-      className: clsx(
-        "w-full h-full aspect-square flex items-center justify-center ",
-        isDefault && "text-neutral-500 hover:bg-action-100 hover:text-action-500 active:text-action-300 disabled:text-neutral-300 disabled:pointer-events-none rounded",
-        isToday && "rounded-full border border-neutral-300 hover:bg-action-100 hover:text-action-500 active:text-action-300 disabled:text-neutral-300 ",
-        selected && "text-white bg-action-400 hover:bg-action-500 active:bg-action-300 disabled:text-neutral-400 disabled:bg-neutral-200 rounded",
-        start && "bg-action-400 hover:bg-action-500 active:bg-action-300 disabled:text-neutral-400 disabled:bg-neutral-200 rounded-l",
-        end && "bg-action-400 hover:bg-action-500 active:bg-action-300 disabled:text-neutral-400 disabled:bg-neutral-200 rounded-r",
-        intermediate && "bg-action-100 border-y border-action-400",
-        className
-      )
-    }, props), {
-      children
-    })
-  );
-}
-function isDateInRange(date, startDate, endDate) {
-  const plainDate = Temporal.PlainDate.from(date);
-  const startPlainDate = Temporal.PlainDate.from(startDate);
-  const endPlainDate = Temporal.PlainDate.from(endDate);
-  return Temporal.PlainDate.compare(plainDate, startPlainDate) >= 0 && Temporal.PlainDate.compare(plainDate, endPlainDate) <= 0;
-}
-
-export {
-  Calendar,
-  DateCell
-};

package/dist/chunk-FCYGYC7R.js

@@ -1,30 +0,0 @@
-import {
-  Heading2
-} from "./chunk-ASSOOV4N.js";
-import {
-  Button
-} from "./chunk-4TH2SUHQ.js";
-import {
-  Icon
-} from "./chunk-DZLUR2I7.js";
-
-// src/components/ModalHeader.tsx
-import { jsx, jsxs } from "react/jsx-runtime";
-var ModalHeader = ({ title, onClose }) => {
-  return /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center p-4", children: [
-    title && /* @__PURE__ */ jsx(Heading2, { as: "p", children: title }),
-    /* @__PURE__ */ jsx(
-      Button,
-      {
-        variant: "icon-only",
-        onClick: onClose,
-        leftIcon: /* @__PURE__ */ jsx("span", { className: "text-icon-primary-normal contents", children: /* @__PURE__ */ jsx(Icon, { name: "close", size: 24 }) })
-      }
-    )
-  ] });
-};
-ModalHeader.displayName = "ModalHeader";
-
-export {
-  ModalHeader
-};

package/dist/chunk-FEEMBYZR.js

@@ -1,98 +0,0 @@
-import {
-  Label
-} from "./chunk-BENTHNAQ.js";
-import {
-  Paragraph
-} from "./chunk-IJ6AAL4W.js";
-import {
-  baseTransition,
-  componentGap,
-  componentPadding
-} from "./chunk-6XDXJ3Z3.js";
-import {
-  __spreadProps,
-  __spreadValues
-} from "./chunk-ORMEWXMH.js";
-
-// src/components/MenuOption.tsx
-import clsx from "clsx";
-import { useId, useRef } from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var MenuOption = ({
-  children,
-  disabled = false,
-  variant = "normal",
-  value,
-  before,
-  after,
-  subMenu,
-  onClick,
-  selected,
-  ref
-}) => {
-  const uniqueId = useId();
-  const internalRef = useRef(null);
-  const actualRef = ref || internalRef;
-  const menuId = useRef(`menu-${uniqueId}`);
-  const additionalAttributes = {
-    "data-selected": selected || null
-  };
-  const svgStyles = clsx(
-    "[&>svg]:shrink-0 [&>svg]:fill-icon-action-primary-normal"
-  );
-  const textLabelStyles = clsx("w-full whitespace-nowrap !leading-6");
-  const normalStyles = variant === "normal" && !disabled && clsx(
-    "bg-transparent text-text-primary-normal",
-    "hover:bg-background-action-secondary-hover",
-    "focus:bg-background-action-secondary-hover",
-    "data-selected:bg-background-action-secondary-hover",
-    "active:bg-background-action-secondary-active"
-  );
-  const normalDisabledStyles = variant === "normal" && disabled && clsx("text-text-primary-disabled");
-  const actionStyles = variant === "action" && !disabled && clsx(
-    "text-action-400 bg-transparent",
-    "hover:bg-background-action-secondary-hover hover:text-text-action-hover",
-    "focus:bg-background-action-secondary-hover focus:text-text-action-hover",
-    "data-selected:bg-background-action-secondary-active data-selected:text-text-action-active",
-    "active:bg-background-action-secondary-active active:text-text-action-active"
-  );
-  const actionDisabledStyles = variant === "action" && disabled && clsx("text-text-action-disabled");
-  const disabledStyles = disabled && clsx("bg-transparent cursor-default pointer-events-none");
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsxs(
-      "div",
-      __spreadProps(__spreadValues({
-        ref: actualRef,
-        className: clsx(
-          "flex items-center cursor-pointer w-full text-left relative outline-none",
-          svgStyles,
-          componentGap,
-          componentPadding,
-          baseTransition,
-          normalStyles,
-          normalDisabledStyles,
-          actionStyles,
-          actionDisabledStyles,
-          disabledStyles
-        ),
-        "data-value": value || children,
-        onClick: () => {
-          onClick == null ? void 0 : onClick(menuId.current, value || children);
-        }
-      }, additionalAttributes), {
-        tabIndex: -1,
-        children: [
-          before,
-          variant === "action" ? /* @__PURE__ */ jsx(Label, { padded: true, className: textLabelStyles, children }) : /* @__PURE__ */ jsx(Paragraph, { padded: true, className: textLabelStyles, children }),
-          after
-        ]
-      })
-    ),
-    subMenu == null ? void 0 : subMenu(menuId.current, actualRef)
-  ] });
-};
-MenuOption.displayName = "MenuOption";
-
-export {
-  MenuOption
-};

package/dist/chunk-FKQ63FLW.js

@@ -1,91 +0,0 @@
-import {
-  Button
-} from "./chunk-NA4H2JQX.js";
-import {
-  Icon
-} from "./chunk-DZLUR2I7.js";
-import {
-  __objRest,
-  __spreadProps,
-  __spreadValues
-} from "./chunk-ORMEWXMH.js";
-
-// src/components/NavigationTab.tsx
-import clsx from "clsx";
-import { jsx } from "react/jsx-runtime";
-var NavigationTab = (_a) => {
-  var _b = _a, {
-    label,
-    onClick,
-    selected = false,
-    className,
-    disabled = false,
-    colorPrimitives = "dmsi"
-  } = _b, props = __objRest(_b, [
-    "label",
-    "onClick",
-    "selected",
-    "className",
-    "disabled",
-    "colorPrimitives"
-  ]);
-  const textClassName = clsx(
-    "!text-text-on-action-primary-normal",
-    "hover:!text-text-on-action-primary-hover",
-    "active:!text-text-on-action-primary-active",
-    "disabled:!text-text-on-action-primary-disabled"
-  );
-  const disabledClassName = clsx(
-    "disabled:!bg-background-on-action-primary-disabled disabled:pointer-events-none"
-  );
-  const paddigClassName = clsx(
-    "p-mobile-component-padding desktop:p-desktop-component-padding compact:p-desktop-compact-component-padding"
-  );
-  const unselectedClassName = clsx(
-    "!bg-background-on-action-primary-normal",
-    "hover:!bg-background-on-action-primary-hover",
-    "active:!bg-background-on-action-primary-active",
-    "shadow-nav-tab"
-  );
-  const selectedClassName = clsx(
-    "!bg-background-on-action-secondary-normal",
-    "hover:!bg-background-on-action-primary-hover",
-    "active:!bg-background-on-action-primary-active"
-  );
-  const tokenOverrides = colorPrimitives === "dmsi" ? {
-    "--color-text-on-action-primary-normal": "var(--color-brand-500)",
-    "--color-text-on-action-primary-hover": "var(--color-brand-500)",
-    "--color-text-on-action-primary-active": "var(--color-brand-300)"
-  } : {
-    "--color-background-on-action-primary-normal": "#D0DDE4",
-    "--color-text-on-action-primary-normal": "#002131",
-    "--color-text-on-action-primary-hover": "#002131",
-    "--color-text-on-action-primary-active": "#1a6280"
-  };
-  return /* @__PURE__ */ jsx("div", { style: tokenOverrides, children: /* @__PURE__ */ jsx(
-    Button,
-    __spreadProps(__spreadValues({
-      variant: "tertiary-critical",
-      className: clsx(
-        "!border-0 !rounded-b-none h-10 min-w-20 relative",
-        paddigClassName,
-        textClassName,
-        disabledClassName,
-        !selected && unselectedClassName,
-        selected && selectedClassName,
-        className
-      ),
-      classNameLabel: "px-1",
-      rightIcon: /* @__PURE__ */ jsx(Icon, { name: "close", size: 16 }),
-      onClick,
-      disabled
-    }, props), {
-      children: label
-    })
-  ) });
-};
-NavigationTab.displayName = "NavigationTab";
-
-export {
-  NavigationTab
-};