@dmsi/wedgekit-react 0.0.551 → 0.0.552

package/src/index.tsx

@@ -1,5 +0,0 @@
-import "./fonts.css";
-import "./index.css";
-import NoResultsImg from "../static/no-results-image.png";
-
-export { NoResultsImg };

package/src/types.ts

@@ -1,150 +0,0 @@
-import React, { ComponentPropsWithoutRef } from "react";
-
-export type IconSize = 16 | 24 | 32;
-
-export type ValidTags<T = keyof React.ElementType> = Extract<
-  React.ElementType,
-  T | React.JSXElementConstructor<unknown>
->;
-
-export type AsProps<
-  T extends React.ElementType = React.ElementType,
-  K extends ValidTags<T> = ValidTags<T>,
-> = K extends React.ElementType
-  ? { as?: K } & ComponentPropsWithoutRef<K>
-  : never;
-
-export type Elevation = 0 | 2 | 4 | 16;
-
-export type Sizing =
-  | "layout"
-  | "layout-group"
-  | "container"
-  | "component"
-  | "none";
-export type TextAlign = "left" | "right" | "center";
-export type ItemsAlign = "start" | "center" | "end" | "start-center";
-export type JustifyAlign = "start" | "center" | "end" | "between" | "around";
-
-export type TextColorTokens =
-  | "text-primary-normal"
-  | "text-primary-disabled"
-  | "text-primary-error"
-  | "text-secondary-normal"
-  | "text-secondary-disabled"
-  | "text-secondary-error"
-  | "text-action-normal"
-  | "text-action-hover"
-  | "text-action-active"
-  | "text-action-disabled"
-  | "text-on-action-primary-normal"
-  | "text-on-action-primary-hover"
-  | "text-on-action-primary-active"
-  | "text-on-action-primary-disabled"
-  | "text-action-critical-normal"
-  | "text-action-critical-hover"
-  | "text-action-critical-active"
-  | "text-action-critical-disabled"
-  | "text-critical-normal"
-  | "text-critical-disabled"
-  | "text-critical-error"
-  | "text-success-normal"
-  | "text-warning-normal";
-
-export type BorderColorTokens =
-  | "border-primary-normal"
-  | "border-primary-focus"
-  | "border-primary-error"
-  | "border-primary-normal"
-  | "border-action-normal"
-  | "border-action-hover"
-  | "border-action-active"
-  | "border-action-disabled"
-  | "border-action-critical-normal"
-  | "border-action-critical-hover"
-  | "border-action-critical-active"
-  | "border-action-critical-disabled";
-
-export type IconColorTokens =
-  | "icon-primary-normal"
-  | "icon-primary-disabled"
-  | "icon-success-normal"
-  | "icon-success-disabled"
-  | "icon-warning-normal"
-  | "icon-warning-disabled"
-  | "icon-critical-normal"
-  | "icon-critical-disabled"
-  | "icon-action-primary-normal"
-  | "icon-action-primary-hover"
-  | "icon-action-primary-active"
-  | "icon-action-primary-disabled"
-  | "icon-on-action-primary-normal"
-  | "icon-on-action-primary-hover"
-  | "icon-on-action-primary-active"
-  | "icon-on-action-primary-disabled"
-  | "icon-on-action-secondary-normal"
-  | "icon-on-action-secondary-hover"
-  | "icon-on-action-secondary-active"
-  | "icon-on-action-secondary-disabled"
-  | "icon-action-critical-secondary-normal"
-  | "icon-action-critical-secondary-hover"
-  | "icon-action-critical-secondary-active"
-  | "icon-action-critical-secondary-disabled"
-  | "icon-brand-primary-normal"
-  | "icon-brand-primary-hover"
-  | "icon-brand-primary-active"
-  | "icon-brand-primary-disabled";
-
-export type BackgroundColorTokens =
-  | "background-primary-normal"
-  | "background-grouped-primary-normal"
-  | "background-secondary-normal"
-  | "background-grouped-secondary-normal"
-  | "background-success-normal"
-  | "background-warning-normal"
-  | "background-critical-normal"
-  | "background-action-normal"
-  | "background-action-hover"
-  | "background-action-active"
-  | "background-action-disabled"
-  | "background-action-critical-normal"
-  | "background-action-critical-hover"
-  | "background-action-critical-active"
-  | "background-action-critical-disabled"
-  | "background-action-primary-normal"
-  | "background-action-primary-hover"
-  | "background-action-primary-active"
-  | "background-action-primary-disabled"
-  | "background-action-secondary-normal"
-  | "background-action-secondary-hover"
-  | "background-action-secondary-active"
-  | "background-action-secondary-disabled"
-  | "background-action-critical-primary-normal"
-  | "background-action-critical-primary-hover"
-  | "background-action-critical-primary-active"
-  | "background-action-critical-primary-disabled"
-  | "background-action-critical-secondary-normal"
-  | "background-action-critical-secondary-hover"
-  | "background-action-critical-secondary-active"
-  | "background-action-critical-secondary-disabled"
-  | "background-brand-normal";
-
-export type TextAttributes = {
-  color?: TextColorTokens;
-  align?: TextAlign;
-  tall?: boolean;
-  padded?: boolean;
-  addOverflow?: boolean;
-};
-
-export type TypographyProps = {
-  className?: string;
-  children?: React.ReactNode;
-  color?: string;
-};
-
-declare module "react" {
-  interface CSSProperties {
-    [key: `--${string}`]: string | number;
-  }
-}

package/src/utils/date.ts

@@ -1,236 +0,0 @@
-/**
- * Shared date utility functions for DateInput and DateRangeInput components
- */
-
-/**
- * Parse MM/DD/YYYY format to YYYY-MM-DD format
- */
-export function parseInputDate(input: string): string | null {
-  const match = input.match(/^(\d{1,2})\/(\d{1,2})\/(\d{4})$/);
-  if (!match) {
-    return null;
-  }
-
-  const [, month, day, year] = match;
-
-  // Pad with zeros if necessary
-  const paddedMonth = month.padStart(2, "0");
-  const paddedDay = day.padStart(2, "0");
-
-  return `${year}-${paddedMonth}-${paddedDay}`;
-}
-
-/**
- * Validate if a date string is a valid date
- */
-export function isValidDate(dateString: string): boolean {
-  const date = new Date(dateString);
-  return (
-    date instanceof Date &&
-    !isNaN(date.getTime()) &&
-    dateString === date.toISOString().split("T")[0]
-  );
-}
-
-/**
- * Format input value with slashes (MM/DD/YYYY)
- */
-export function formatInputValue(value: string): string {
-  // Remove all non-digits
-  const digits = value.replace(/\D/g, "");
-
-  // Return digits as-is if less than 2
-  if (digits.length < 2) {
-    return digits;
-  }
-
-  // Format with full MM/DD/YYYY pattern if 4 or more digits
-  if (digits.length >= 4) {
-    return `${digits.slice(0, 2)}/${digits.slice(2, 4)}/${digits.slice(4, 8)}`;
-  }
-
-  // Format with MM/DD pattern for 2-3 digits
-  return `${digits.slice(0, 2)}/${digits.slice(2)}`;
-}
-
-/**
- * Check if character is a digit
- */
-export function isDigit(character: string): boolean {
-  return /\d/.test(character);
-}
-
-/**
- * Check if character is a slash
- */
-export function isSlash(character: string): boolean {
-  return character === "/";
-}
-
-/**
- * Count digits up to cursor position
- */
-export function countDigitsUpToCursor(
-  value: string,
-  cursorPosition: number,
-): number {
-  let digitCount = 0;
-
-  for (let i = 0; i < cursorPosition && i < value.length; i++) {
-    if (!isDigit(value[i])) {
-      continue;
-    }
-
-    digitCount++;
-  }
-
-  return digitCount;
-}
-
-/**
- * Find position after specific digit count
- */
-export function findPositionAfterDigitCount(
-  formattedValue: string,
-  targetDigitCount: number,
-): number {
-  let currentDigitCount = 0;
-
-  for (let i = 0; i < formattedValue.length; i++) {
-    if (!isDigit(formattedValue[i])) {
-      continue;
-    }
-
-    currentDigitCount++;
-
-    if (currentDigitCount !== targetDigitCount) {
-      continue;
-    }
-
-    const positionAfterDigit = i + 1;
-    const nextCharacter = formattedValue[positionAfterDigit];
-
-    // Place cursor after slash if it follows the target digit
-    if (nextCharacter && isSlash(nextCharacter)) {
-      return positionAfterDigit + 1;
-    }
-
-    return positionAfterDigit;
-  }
-
-  return formattedValue.length;
-}
-
-/**
- * Calculate cursor position after formatting
- */
-export function calculateCursorPosition(
-  originalValue: string,
-  formattedValue: string,
-  originalPosition: number,
-): number {
-  const targetDigitCount = countDigitsUpToCursor(
-    originalValue,
-    originalPosition,
-  );
-  const newPosition = findPositionAfterDigitCount(
-    formattedValue,
-    targetDigitCount,
-  );
-
-  return Math.min(newPosition, formattedValue.length);
-}
-
-/**
- * Parse date parts from YYYY-MM-DD format
- */
-export function parseDateParts(
-  dateString: string,
-): { year: number; month: number; day: number } | null {
-  const [yearStr, monthStr, dayStr] = dateString.split("-");
-
-  if (!yearStr || !monthStr || !dayStr) {
-    return null;
-  }
-
-  const year = parseInt(yearStr, 10);
-  const month = parseInt(monthStr, 10);
-  const day = parseInt(dayStr, 10);
-
-  if (isNaN(year) || isNaN(month) || isNaN(day)) {
-    return null;
-  }
-
-  return { year, month, day };
-}
-
-/**
- * Check if date range is valid (month 1-12, day 1-31)
- */
-export function isValidDateRange(month: number, day: number): boolean {
-  if (month < 1 || month > 12) {
-    return false;
-  }
-  if (day < 1 || day > 31) {
-    return false;
-  }
-  return true;
-}
-
-/**
- * Format date parts to display format (MM/DD/YYYY)
- */
-export function formatDatePartsToDisplay(
-  year: number,
-  month: number,
-  day: number,
-): string {
-  const paddedMonth = month.toString().padStart(2, "0");
-  const paddedDay = day.toString().padStart(2, "0");
-
-  return `${paddedMonth}/${paddedDay}/${year}`;
-}
-
-/**
- * Format date string to display format
- */
-export function formatDate(date: string): string {
-  if (!date) {
-    return "";
-  }
-
-  try {
-    const dateParts = parseDateParts(date);
-    if (!dateParts) {
-      return "";
-    }
-
-    const { year, month, day } = dateParts;
-
-    if (!isValidDateRange(month, day)) {
-      return "";
-    }
-
-    return formatDatePartsToDisplay(year, month, day);
-  } catch (error) {
-    console.error("Error formatting date:", error);
-    return "";
-  }
-}
-
-/**
- * Validate if date range is valid (to >= from)
- */
-export function isValidDateRangeOrder(
-  fromDate: string,
-  toDate: string,
-): boolean {
-  if (!fromDate || !toDate || !isValidDate(fromDate) || !isValidDate(toDate)) {
-    return false;
-  }
-
-  // Check if 'to' date is not earlier than 'from' date
-  const from = new Date(fromDate);
-  const to = new Date(toDate);
-  return to >= from;
-}

package/src/utils/formatting.tsx

@@ -1,81 +0,0 @@
-/**
- * Utility functions for input formatting and value processing
- */
-
-/**
- * Generates placeholder text for decimal inputs based on the number of decimal places
- * @param decimals - Number of decimal places to display
- * @returns Object with placeholder property or empty object if no decimals
- * @example
- * getDecimalPlaceholder(2) // returns { placeholder: "0.00" }
- * getDecimalPlaceholder(0) // returns {}
- */
-export function getDecimalPlaceholder(decimals: number | undefined): {
-  placeholder?: string;
-} {
-  if (!decimals || decimals <= 0) {
-    return {};
-  }
-
-  return {
-    placeholder: `0.${"0".repeat(decimals)}`,
-  };
-}
-
-/**
- * Formats a numeric value to a string with specified decimal places
- * @param value - The value to format (string or number)
- * @param decimals - Number of decimal places to format to
- * @returns Formatted string value
- * @example
- * formatDecimalValue("123.456", 2) // returns "123.46"
- * formatDecimalValue(123, 0) // returns "123"
- * formatDecimalValue("", 2) // returns ""
- */
-export function formatDecimalValue(
-  value: string | number | undefined,
-  decimals: number | undefined,
-): string {
-  if (!value || value === "") {
-    return "";
-  }
-
-  const numValue = typeof value === "string" ? parseFloat(value) : value;
-
-  if (isNaN(numValue)) {
-    return "";
-  }
-
-  if (!decimals || decimals <= 0) {
-    return String(Math.round(numValue));
-  }
-
-  return numValue.toFixed(decimals);
-}
-
-/**
- * Formats a numeric string for currency display by adding thousand separators
- * @param value - The numeric string to format
- * @returns Formatted string with thousand separators
- * @example
- * formatCurrencyDisplay("1234.56") // returns "1,234.56"
- * formatCurrencyDisplay("1000") // returns "1,000"
- * formatCurrencyDisplay("") // returns ""
- */
-export function formatCurrencyDisplay(value: string): string {
-  if (!value || value === "") {
-    return "";
-  }
-
-  const parts = value.split(".");
-  const integerPart = parts[0];
-  const decimalPart = parts[1];
-
-  // Add thousand separators to the integer part
-  const formattedInteger = integerPart.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
-
-  // Combine with decimal part if it exists
-  return decimalPart !== undefined
-    ? `${formattedInteger}.${decimalPart}`
-    : formattedInteger;
-}

package/src/utils/index.ts

@@ -1,4 +0,0 @@
-export * from "./formatting";
-export * from "./date";
-export { mergeObjectArrays } from "./mergeObjectArrays";
-export const LocalStoragePrefixVersion = `dmsi-acc-v1.1.0`;

package/src/utils/mergeObjectArrays.ts

@@ -1,18 +0,0 @@
-/**
- * Merges two arrays of objects element-wise.
- *
- * @template T The type of the objects in the arrays.
- * @param {T[]} arr1 The first array.
- * @param {T[]} arr2 The second array.
- * @returns {T[]} A new array containing the merged objects.
- */
-export function mergeObjectArrays<T extends object>(arr1: T[], arr2: T[]): T[] {
-  const maxLength = Math.max(arr1.length, arr2.length);
-
-  // Create a new array with a length equal to the longer of the two arrays.
-  // For each index, merge the objects from arr1 and arr2.
-  return Array.from(
-    { length: maxLength },
-    (_, i) => ({ ...(arr1[i] || {}), ...(arr2[i] || {}) }) as T,
-  );
-}

package/src/utils.ts

@@ -1,24 +0,0 @@
-export function findDocumentRoot(
-  element: Node | undefined | null,
-): Element | DocumentFragment {
-  if (typeof window === "undefined" || typeof document === "undefined") {
-    throw new Error(
-      "findDocumentRoot can only be used in a browser environment.",
-    );
-  }
-  if (!element || !(element instanceof Node)) {
-    return window.document.body;
-  }
-  let currentElement = element;
-  while (currentElement && currentElement.parentNode) {
-    if (currentElement.parentNode === document) {
-      return document.body;
-    } else if (currentElement.parentNode instanceof DocumentFragment) {
-      return currentElement.parentNode;
-    } else {
-      currentElement = currentElement.parentNode;
-    }
-  }
-  return window.document.body;
-}
-export * from "./utils/index";