components-test-pb 0.2.5 → 0.2.7

package/src/theme/themeToCSS.ts

@@ -1,27 +0,0 @@
-import type { Theme } from './types';
-
-let themeStyleElement: HTMLStyleElement | null = null;
-
-export function themeToCSS(theme: Theme): string {
-    return (Object.keys(theme) as (keyof Theme)[])
-        .map((key) => `--${key}: ${theme[key]};`)
-        .join(' ');
-}
-
-export function insertTheme(theme: Theme): void {
-    if (!themeStyleElement) {
-        themeStyleElement = document.createElement('style');
-        themeStyleElement.setAttribute('data-theme', 'default');
-        document.head.appendChild(themeStyleElement);
-    }
-
-    const rule = `:root { ${themeToCSS(theme)} }`;
-
-    const sheet = themeStyleElement.sheet;
-    if (sheet) {
-        while (sheet.cssRules.length > 0) {
-            sheet.deleteRule(0);
-        }
-        sheet.insertRule(rule, 0);
-    }
-}

package/src/theme/tokens.ts

@@ -1,6 +0,0 @@
-import type { Theme } from './types';
-import { defaultTheme } from './defaultTheme';
-
-export const tokens: Record<keyof Theme, string> = Object.fromEntries(
-    (Object.keys(defaultTheme) as (keyof Theme)[]).map((key) => [key, `var(--${key})`]),
-) as Record<keyof Theme, string>;

package/src/theme/types.ts

@@ -1,156 +0,0 @@
-export interface Theme {
-    // Colors — Brand
-    colorBrandBackground: string;
-    colorBrandBackgroundHover: string;
-    colorBrandBackgroundPressed: string;
-    colorBrandBackgroundSelected: string;
-    colorBrandForeground: string;
-    colorBrandForegroundHover: string;
-    colorBrandForegroundPressed: string;
-    colorNeutralForegroundOnBrand: string;
-    colorBrandStroke: string;
-
-    // Colors — Neutral Foreground
-    colorNeutralForeground1: string;
-    colorNeutralForeground1Hover: string;
-    colorNeutralForeground1Pressed: string;
-    colorNeutralForeground2: string;
-    colorNeutralForeground2Hover: string;
-    colorNeutralForeground2Pressed: string;
-    colorNeutralForeground2BrandHover: string;
-    colorNeutralForeground2BrandPressed: string;
-    colorNeutralForeground2BrandSelected: string;
-    colorNeutralForeground3: string;
-    colorNeutralForegroundDisabled: string;
-
-    // Colors — Neutral Background
-    colorNeutralBackground1: string;
-    colorNeutralBackground1Hover: string;
-    colorNeutralBackground1Pressed: string;
-    colorNeutralBackground1Selected: string;
-    colorNeutralBackground2: string;
-    colorNeutralBackground3: string;
-    colorNeutralBackgroundDisabled: string;
-
-    // Colors — Neutral Stroke
-    colorNeutralStroke1: string;
-    colorNeutralStroke1Hover: string;
-    colorNeutralStroke1Pressed: string;
-    colorNeutralStroke2: string;
-    colorNeutralStrokeDisabled: string;
-
-    // Colors — Transparent
-    colorTransparentBackground: string;
-    colorTransparentBackgroundHover: string;
-    colorTransparentBackgroundPressed: string;
-
-    // Colors — Subtle
-    colorSubtleBackground: string;
-    colorSubtleBackgroundHover: string;
-    colorSubtleBackgroundPressed: string;
-    colorSubtleBackgroundSelected: string;
-    colorSubtleForeground: string;
-
-    // Colors — Status
-    colorStatusDangerBackground: string;
-    colorStatusDangerForeground: string;
-    colorStatusDangerStroke: string;
-    colorStatusSuccessBackground: string;
-    colorStatusSuccessForeground: string;
-    colorStatusSuccessStroke: string;
-    colorStatusWarningBackground: string;
-    colorStatusWarningForeground: string;
-    colorStatusWarningStroke: string;
-
-    // Spacing — Horizontal
-    spacingHorizontalXXS: string;
-    spacingHorizontalXS: string;
-    spacingHorizontalSNudge: string;
-    spacingHorizontalS: string;
-    spacingHorizontalMNudge: string;
-    spacingHorizontalM: string;
-    spacingHorizontalL: string;
-    spacingHorizontalXL: string;
-    spacingHorizontalXXL: string;
-    spacingHorizontalXXXL: string;
-
-    // Spacing — Vertical
-    spacingVerticalXXS: string;
-    spacingVerticalXS: string;
-    spacingVerticalSNudge: string;
-    spacingVerticalS: string;
-    spacingVerticalMNudge: string;
-    spacingVerticalM: string;
-    spacingVerticalL: string;
-    spacingVerticalXL: string;
-    spacingVerticalXXL: string;
-    spacingVerticalXXXL: string;
-
-    // Border Radius
-    borderRadiusNone: string;
-    borderRadiusSmall: string;
-    borderRadiusMedium: string;
-    borderRadiusLarge: string;
-    borderRadiusXLarge: string;
-    borderRadiusCircular: string;
-
-    // Font Family
-    fontFamilyBase: string;
-    fontFamilyMonospace: string;
-    fontFamilyNumeric: string;
-
-    // Font Size
-    fontSizeBase100: string;
-    fontSizeBase200: string;
-    fontSizeBase300: string;
-    fontSizeBase400: string;
-    fontSizeBase500: string;
-    fontSizeBase600: string;
-
-    // Font Weight
-    fontWeightRegular: string;
-    fontWeightMedium: string;
-    fontWeightSemibold: string;
-    fontWeightBold: string;
-
-    // Line Height
-    lineHeightBase100: string;
-    lineHeightBase200: string;
-    lineHeightBase300: string;
-    lineHeightBase400: string;
-    lineHeightBase500: string;
-    lineHeightBase600: string;
-
-    // Shadows
-    shadow2: string;
-    shadow4: string;
-    shadow8: string;
-    shadow16: string;
-    shadow28: string;
-    shadow64: string;
-
-    // Stroke Width
-    strokeWidthThin: string;
-    strokeWidthThick: string;
-    strokeWidthThicker: string;
-    strokeWidthThickest: string;
-
-    // Duration
-    durationUltraFast: string;
-    durationFaster: string;
-    durationFast: string;
-    durationNormal: string;
-    durationGentle: string;
-    durationSlow: string;
-    durationSlower: string;
-
-    // Easing
-    curveAccelerateMax: string;
-    curveAccelerateMid: string;
-    curveAccelerateMin: string;
-    curveDecelerateMax: string;
-    curveDecelerateMid: string;
-    curveDecelerateMin: string;
-    curveEasyEase: string;
-    curveLinear: string;
-}

package/src/utilities/src/ARIA/index.ts

@@ -1,11 +0,0 @@
-export { useARIAButtonProps } from './useARIAButtonProps';
-
-export type {
-    ARIAButtonType,
-    ARIAButtonElement,
-    ARIAButtonElementIntersection,
-    ARIAButtonProps,
-    ARIAButtonSlotProps,
-    ARIAButtonAlteredProps,
-    ARIAButtonResultProps,
-} from './types';

package/src/utilities/src/ARIA/types.ts

@@ -1,58 +0,0 @@
-import type {
-    DistributiveOmit,
-    ExtractSlotProps,
-    Slot,
-    UnionToIntersection,
-    JSXIntrinsicElement,
-} from '../compose/types';
-
-export type ARIAButtonType = 'button' | 'a' | 'div';
-
-export type ARIAButtonElement<AlternateAs extends 'a' | 'div' = 'a' | 'div'> =
-    | HTMLButtonElement
-    | (AlternateAs extends 'a' ? HTMLAnchorElement : never)
-    | (AlternateAs extends 'div' ? HTMLDivElement : never);
-
-export type ARIAButtonElementIntersection<AlternateAs extends 'a' | 'div' = 'a' | 'div'> = UnionToIntersection<
-    ARIAButtonElement<AlternateAs>
->;
-
-export type ARIAButtonProps<Type extends ARIAButtonType = ARIAButtonType> = DistributiveOmit<
-    JSXIntrinsicElement<Type>,
-    'children'
-> & {
-    disabled?: boolean;
-    /**
-     * When set, allows the button to be focusable even when it has been disabled.
-     * This is used in scenarios where it is important to keep a consistent tab order
-     * for screen reader and keyboard users.
-     *
-     * @default false
-     */
-    disabledFocusable?: boolean;
-};
-
-export type ARIAButtonSlotProps<AlternateAs extends 'a' | 'div' = 'a' | 'div'> = ExtractSlotProps<
-    Slot<'button', AlternateAs>
-> &
-    Pick<ARIAButtonProps<ARIAButtonType>, 'disabled' | 'disabledFocusable'>;
-
-export type ARIAButtonAlteredProps<Type extends ARIAButtonType> =
-    | (Type extends 'button'
-        ? Pick<
-            JSXIntrinsicElement<'button'>,
-            'onClick' | 'onKeyDown' | 'onKeyUp' | 'disabled' | 'aria-disabled' | 'tabIndex'
-        >
-        : never)
-    | (Type extends 'a'
-        ? Pick<
-            JSXIntrinsicElement<'a'>,
-            'onClick' | 'onKeyDown' | 'onKeyUp' | 'aria-disabled' | 'tabIndex' | 'role' | 'href'
-        >
-        : never)
-    | (Type extends 'div'
-        ? Pick<JSXIntrinsicElement<'div'>, 'onClick' | 'onKeyDown' | 'onKeyUp' | 'aria-disabled' | 'tabIndex' | 'role'>
-        : never);
-
-export type ARIAButtonResultProps<Type extends ARIAButtonType, Props> = Props &
-    UnionToIntersection<ARIAButtonAlteredProps<Type>>;

package/src/utilities/src/ARIA/useARIAButtonProps.ts

@@ -1,74 +0,0 @@
-import type { ARIAButtonProps, ARIAButtonResultProps, ARIAButtonType } from './types';
-
-export function useARIAButtonProps<Type extends ARIAButtonType>(
-    type: Type,
-    props: ARIAButtonProps<Type>,
-): ARIAButtonResultProps<Type, ARIAButtonProps<Type>> {
-    const { disabled, disabledFocusable, onClick, onKeyDown, onKeyUp, ...rest } =
-        props as ARIAButtonProps<ARIAButtonType>;
-
-    const isDisabled = disabled || disabledFocusable;
-
-    if (type === 'button') {
-        return {
-            ...rest,
-            disabled: isDisabled && !disabledFocusable,
-            onClick: isDisabled
-                ? (e: MouseEvent) => {
-                    e.preventDefault();
-                    e.stopPropagation();
-                }
-                : onClick,
-            onKeyDown,
-            onKeyUp,
-            ...(isDisabled && { 'aria-disabled': true }),
-        } as unknown as ARIAButtonResultProps<Type, ARIAButtonProps<Type>>;
-    }
-
-    // Non-native: 'a' | 'div'
-    const handleClick = isDisabled
-        ? (e: MouseEvent) => {
-            e.preventDefault();
-            e.stopPropagation();
-        }
-        : onClick;
-
-    const handleKeyDown = (e: KeyboardEvent) => {
-        onKeyDown?.(e);
-
-        if (e.defaultPrevented) return;
-
-        if (isDisabled) return;
-
-        if (e.key === 'Enter') {
-            e.preventDefault();
-            (e.currentTarget as HTMLElement).click();
-        } else if (e.key === ' ') {
-            e.preventDefault(); // Prevent scroll
-        }
-    };
-
-    const handleKeyUp = (e: KeyboardEvent) => {
-        onKeyUp?.(e);
-
-        if (e.defaultPrevented) return;
-
-        if (isDisabled) return;
-
-        if (e.key === ' ') {
-            e.preventDefault();
-            (e.currentTarget as HTMLElement).click();
-        }
-    };
-
-    return {
-        ...rest,
-        role: 'button',
-        tabIndex: isDisabled && !disabledFocusable ? undefined : (rest as Record<string, unknown>).tabIndex ?? 0,
-        onClick: handleClick,
-        onKeyDown: handleKeyDown,
-        onKeyUp: handleKeyUp,
-        ...(isDisabled && { 'aria-disabled': true }),
-        ...(type === 'a' && isDisabled && { href: undefined }),
-    } as unknown as ARIAButtonResultProps<Type, ARIAButtonProps<Type>>;
-}