sdaia-ui 1.0.1 → 1.0.2

package/src/components/Dropdown/Dropdown.variants.ts

@@ -1,73 +0,0 @@
-/*
- * Dropdown variant maps
- *
- * Figma source: node 6069:90934 "Dropdown"
- * Variables traced to get_variable_defs / get_design_context output dated 2026-04-14.
- *
- * Trigger layout:
- *   Button/Avatar → h-[40px] (ButtonMenu md size)
- *   Icon          → size-[24px] (more-vertical icon button)
- *
- * Open focus ring (all trigger types):
- *   border-2 border-[rgba(27,131,84,0.7)] rounded-[8px] p-spacing-xxs
- *   Avatar: rounded-full
- *
- * Panel:
- *   absolute bg-white rounded-[8px] shadow-xl w-[250px] py-spacing-xs
- *   Button/Avatar → top-[50px]
- *   Icon          → top-[34px]
- *   Horizontal position determined by alignment prop.
- */
-
-/* ── Open state focus ring ───────────────────────────────────────────────────
- * Figma: 2px border rgba(27,131,84,0.7) with spacing-xxs (2px) gap.
- * Applied as a CSS outline directly on the trigger element so it has zero
- * layout impact — no wrapper div, no height expansion.
- *   outline        = drawn outside the border-box (no size change)
- *   outline-offset = replicates the spacing-xxs (2px) padding of the Figma wrapper
- * ──────────────────────────────────────────────────────────────────────────── */
-export const OPEN_RING =
-  'outline outline-2 outline-[rgba(27,131,84,0.7)] outline-offset-[2px]';
-
-export const OPEN_RING_ROUNDED = 'rounded-[8px]';
-export const OPEN_RING_ROUNDED_FULL = 'rounded-full';
-
-/* ── Icon trigger (more-vertical / ⋮) ───────────────────────────────────────
- * Figma: 24×24 icon button — no background, no border, pure icon.
- * Hover/active states match neutral button interactive states.
- * ──────────────────────────────────────────────────────────────────────────── */
-export const ICON_TRIGGER_BASE =
-  'inline-flex items-center justify-center size-[24px] cursor-pointer motion-feedback';
-
-export const ICON_TRIGGER_RADIUS = 'rounded-[6px]';
-
-export const ICON_TRIGGER_INTERACTIVE =
-  'hover:bg-[rgba(243,244,246,1)] dark:hover:bg-[rgba(255,255,255,0.08)] active:bg-[rgba(229,231,235,1)] dark:active:bg-[rgba(255,255,255,0.13)]';
-
-export const ICON_TRIGGER_FOCUS =
-  'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[rgba(22,22,22,1)] dark:focus-visible:ring-[rgba(229,231,235,1)]';
-
-export const ICON_COLOR =
-  'text-[rgba(108,115,127,1)] dark:text-[rgba(156,163,175,1)]';
-
-export const ICON_DISABLED_COLOR =
-  'text-[rgba(157,164,174,1)] dark:text-[rgba(75,85,99,1)]';
-
-
-/* ── Dropdown panel ──────────────────────────────────────────────────────────
- * Background: Background/background-white
- * Shadow: Shadows/shadow-xl (0px 8px 8px -4px + 0px 20px 24px -4px)
- * Radius: 8px
- * Width: 250px
- * ──────────────────────────────────────────────────────────────────────────── */
-export const PANEL_BG = 'bg-white dark:bg-[rgba(17,25,39,1)]';
-
-export const PANEL_SHADOW =
-  'shadow-[0px_8px_8px_-4px_rgba(16,24,40,0.03),0px_20px_24px_-4px_rgba(16,24,40,0.08)]';
-
-export const PANEL_RADIUS = 'rounded-[8px]';
-
-/* ── Disabled ────────────────────────────────────────────────────────────────
- * Matches ContextMenuDropdown disabled container pattern.
- * ──────────────────────────────────────────────────────────────────────────── */
-export const DISABLED_CONTAINER = 'pointer-events-none cursor-default opacity-50';

package/src/components/Dropdown/index.ts

@@ -1,9 +0,0 @@
-export { Dropdown } from './Dropdown';
-export type {
-  DropdownProps,
-  DropdownTriggerType,
-  DropdownAlignment,
-  DropdownItem,
-  DropdownNavEntry,
-  DropdownDivider,
-} from './Dropdown.types';

package/src/components/DropdownListHeader/DropdownListHeader.tsx

@@ -1,79 +0,0 @@
-'use client';
-
-import { forwardRef } from 'react';
-import { cn } from '../../lib/cn';
-import { UserIcon } from '../../icons/IconFactory';
-import type { DropdownListHeaderProps } from './DropdownListHeader.types';
-import {
-  CONTAINER_BASE,
-  USER_ROW,
-  AVATAR_WRAPPER,
-  AVATAR_IMG,
-  AVATAR_FALLBACK,
-  AVATAR_ICON_WRAPPER,
-  STATUS_DOT,
-  TEXT_WRAPPER,
-  NAME_CLASS,
-  EMAIL_CLASS,
-  HEADER_ROW,
-  HEADER_LABEL_CLASS,
-} from './DropdownListHeader.variants';
-
-function AvatarSlot({ src, alt }: { src?: string; alt?: string }) {
-  return (
-    <div data-slot="avatar" className={AVATAR_WRAPPER}>
-      {src ? (
-        <img src={src} alt={alt ?? ''} className={AVATAR_IMG} />
-      ) : (
-        <div className={AVATAR_FALLBACK}>
-          <div className={AVATAR_ICON_WRAPPER}>
-            <UserIcon aria-hidden="true" />
-          </div>
-        </div>
-      )}
-      <span data-slot="status-dot" className={STATUS_DOT} aria-hidden="true" />
-    </div>
-  );
-}
-
-export const DropdownListHeader = forwardRef<HTMLDivElement, DropdownListHeaderProps>(
-  function DropdownListHeader(
-    { type = 'User', dir, avatarSrc, avatarAlt, name, email, label, className },
-    ref
-  ) {
-    if (type === 'Header') {
-      return (
-        <div
-          ref={ref}
-          dir={dir}
-          data-slot="dropdown-list-header"
-          className={cn(CONTAINER_BASE, HEADER_ROW, className)}
-        >
-          <p data-slot="label" className={HEADER_LABEL_CLASS}>
-            {label ?? 'Menu'}
-          </p>
-        </div>
-      );
-    }
-
-    return (
-      <div
-        ref={ref}
-        dir={dir}
-        data-slot="dropdown-list-header"
-        className={cn(
-          CONTAINER_BASE,
-          USER_ROW,
-          dir === 'rtl' && 'flex-row-reverse',
-          className
-        )}
-      >
-        <AvatarSlot src={avatarSrc} alt={avatarAlt} />
-        <div data-slot="user-info" className={TEXT_WRAPPER}>
-          <span data-slot="name" className={NAME_CLASS}>{name ?? 'Name Surname'}</span>
-          <span data-slot="email" className={EMAIL_CLASS}>{email ?? 'email@example.com'}</span>
-        </div>
-      </div>
-    );
-  }
-);

package/src/components/DropdownListHeader/DropdownListHeader.types.ts

@@ -1,24 +0,0 @@
-export type DropdownListHeaderType = 'User' | 'Header';
-
-export interface DropdownListHeaderProps {
-  /** Structural variant: 'User' renders avatar + name/email; 'Header' renders a menu section label. */
-  type?: DropdownListHeaderType;
-  /** Layout direction — pass 'rtl' to flip the avatar to the trailing side. */
-  dir?: 'ltr' | 'rtl';
-
-  // ── User type ────────────────────────────────────────────────────────────────
-  /** URL for the user avatar image. When omitted a generic person icon is shown. */
-  avatarSrc?: string;
-  /** Alt text for the avatar image. */
-  avatarAlt?: string;
-  /** User's display name. */
-  name?: string;
-  /** User's email address. */
-  email?: string;
-
-  // ── Header type ──────────────────────────────────────────────────────────────
-  /** Menu section label shown in the Header variant. */
-  label?: string;
-
-  className?: string;
-}

package/src/components/DropdownListHeader/DropdownListHeader.variants.ts

@@ -1,65 +0,0 @@
-/**
- * DropdownListHeader.variants.ts
- *
- * Class-name constants traced from Figma node 6069:90551.
- *
- * Color tokens:
- *   Border/border-neutral-secondary   → #e5e7eb  / dark: rgba(56,66,80)
- *   Background/background-primary     → #1b8354  (status dot background)
- *   Border/border-neutral-tertiary    → #f3f4f6  (status dot ring) / dark: rgba(31,42,55) card bg
- *   Text/text-display                 → #1f2a37  / dark: rgba(229,231,235)
- *   Text/text-secondary-paragraph     → #6c737f  / dark: rgba(156,163,175)
- *   Text/text-primary-paragraph       → #384250  / dark: rgba(156,163,175)
- */
-
-// ─── Container ────────────────────────────────────────────────────────────────
-// Width 220px, padding spacing-lg, bottom divider border
-
-export const CONTAINER_BASE =
-  'border-b border-[rgba(229,231,235,1)] dark:border-[rgba(56,66,80,1)] p-spacing-lg w-[220px]';
-
-// ─── User layout ──────────────────────────────────────────────────────────────
-
-export const USER_ROW = 'flex items-center gap-spacing-md';
-
-// ─── Avatar ───────────────────────────────────────────────────────────────────
-// 40×40px circular image + 12px green status dot at bottom-right (RTL: bottom-left)
-
-export const AVATAR_WRAPPER = 'relative shrink-0 size-[40px]';
-
-export const AVATAR_IMG =
-  'size-[40px] rounded-full object-cover block';
-
-export const AVATAR_FALLBACK =
-  'size-[40px] rounded-full flex items-center justify-center ' +
-  'bg-[rgba(243,244,246,1)] dark:bg-[rgba(56,66,80,1)]';
-
-export const AVATAR_ICON_WRAPPER =
-  'size-[16px] text-[rgba(108,115,127,1)] dark:text-[rgba(156,163,175,1)]';
-
-// Status dot: absolute, 12px, green bg, 2px white ring
-// Uses inset-inline-end (logical) so it flips to the correct corner in RTL
-export const STATUS_DOT =
-  'absolute bottom-[-4px] end-[-4px] size-[12px] rounded-full ' +
-  'bg-[rgba(27,131,84,1)] ring-2 ring-[rgba(243,244,246,1)] dark:ring-[rgba(31,42,55,1)]';
-
-// ─── Text content ─────────────────────────────────────────────────────────────
-
-export const TEXT_WRAPPER = 'flex flex-col min-w-0';
-
-export const NAME_CLASS =
-  'text-text-sm font-semibold truncate ' +
-  'text-[rgba(31,42,55,1)] dark:text-[rgba(229,231,235,1)]';
-
-export const EMAIL_CLASS =
-  'text-text-sm font-normal truncate ' +
-  'text-[rgba(108,115,127,1)] dark:text-[rgba(156,163,175,1)]';
-
-// ─── Header variant ───────────────────────────────────────────────────────────
-// 44px height, single semibold label, no avatar
-
-export const HEADER_ROW = 'flex items-center h-[44px]';
-
-export const HEADER_LABEL_CLASS =
-  'text-text-sm font-semibold ' +
-  'text-[rgba(56,66,80,1)] dark:text-[rgba(156,163,175,1)]';

package/src/components/DropdownListHeader/index.ts

@@ -1,2 +0,0 @@
-export { DropdownListHeader } from './DropdownListHeader';
-export type { DropdownListHeaderProps, DropdownListHeaderType } from './DropdownListHeader.types';

package/src/components/EmptyState/EmptyState.tsx

@@ -1,221 +0,0 @@
-'use client';
-
-import { forwardRef } from 'react';
-import { cn } from '../../lib/cn';
-import { Button } from '../Button';
-import { IllustrationInstance } from '../IllustrationInstance';
-import type { EmptyStateProps, EmptyStateType } from './EmptyState.types';
-import {
-  CONNECTION_LOST_DESC,
-  CONNECTION_LOST_TEXT_WRAP,
-  CONNECTION_LOST_TITLE,
-  CONTENT_CENTER,
-  DESCRIPTION_LG,
-  DESCRIPTION_MD,
-  DESCRIPTION_SM,
-  PAGE_NOT_FOUND_404,
-  PAGE_NOT_FOUND_CONTENT,
-  PAGE_NOT_FOUND_DESC,
-  PAGE_NOT_FOUND_STACK,
-  PAGE_NOT_FOUND_TITLE,
-  ROOT_BASE,
-  ROOT_BY_TYPE,
-  SPLIT_ILLUSTRATION_WRAP,
-  SPLIT_ITEM,
-  TEXT_STACK,
-  TITLE_DISPLAY_XS,
-  TITLE_XL,
-} from './EmptyState.variants';
-
-type Copy = { title: string; description: string; buttonLabel?: string };
-
-const COPY_BY_TYPE: Record<EmptyStateType, Copy> = {
-  'no-data': {
-    title: 'No items yet',
-    description: 'You don’t have anything here yet. Start by creating a new item.',
-    buttonLabel: 'Create New',
-  },
-  'no-connection': {
-    title: 'No Connection',
-    description: 'Your internet connection was interrupted, Please retry.',
-    buttonLabel: 'Retry',
-  },
-  error: {
-    title: 'Page not found',
-    description: 'The page you were looking for does not exist',
-    buttonLabel: 'Back Home',
-  },
-  'no-notifications': {
-    title: 'No Notifications',
-    description: 'You currently have no notifications',
-    buttonLabel: 'Back Home',
-  },
-  'connection-lost': {
-    title: 'Connection Lost',
-    description: 'The page you were looking for does not exist',
-    buttonLabel: 'Retry',
-  },
-  'page-not-found': {
-    title: 'Page not found!',
-    description: 'The page you were looking for does not exist',
-    buttonLabel: 'Back Home',
-  },
-};
-
-const ILLUSTRATION_SIZE_BY_TYPE: Record<EmptyStateType, { width: number; height: number }> = {
-  'no-data': { width: 80, height: 80 },
-  'no-connection': { width: 340, height: 203 },
-  error: { width: 200, height: 90 },
-  'no-notifications': { width: 155, height: 155 },
-  'connection-lost': { width: 400, height: 400 },
-  'page-not-found': { width: 490, height: 490 },
-};
-
-export const EmptyState = forwardRef<HTMLDivElement, EmptyStateProps>(function EmptyState(
-  {
-    type = 'no-data',
-    dir: dirProp,
-    rtl = false,
-    illustration,
-    heading = true,
-    helperText = true,
-    button = true,
-    headingContent,
-    helperTextContent,
-    buttonLabel,
-    onButtonClick,
-    className,
-    ...rest
-  },
-  ref,
-) {
-  const resolvedDir = dirProp ?? (rtl ? 'rtl' : undefined);
-  const copy = COPY_BY_TYPE[type];
-  const resolvedTitle = headingContent ?? copy.title;
-  const resolvedDescription = helperTextContent ?? copy.description;
-  const resolvedButtonLabel = buttonLabel ?? copy.buttonLabel;
-
-  const illustrationNode =
-    illustration ??
-    (() => {
-      const { width, height } = ILLUSTRATION_SIZE_BY_TYPE[type];
-      return <IllustrationInstance width={width} height={height} />;
-    })();
-
-  return (
-    <div
-      ref={ref}
-      dir={resolvedDir}
-      data-slot="empty-state"
-      className={cn(ROOT_BASE, ROOT_BY_TYPE[type], className)}
-      {...rest}
-    >
-      {/* Order matches Figma per type */}
-      {(type === 'no-data' || type === 'no-connection' || type === 'error' || type === 'no-notifications') && (
-        <div data-slot="illustration" className="w-full flex justify-center shrink-0">
-          {illustrationNode}
-        </div>
-      )}
-
-      {(type === 'page-not-found' || type === 'error' || type === 'no-notifications') && (
-        <div data-slot="content" className={type === 'page-not-found' ? PAGE_NOT_FOUND_CONTENT : CONTENT_CENTER}>
-          {type === 'page-not-found' && (
-            <>
-              <p
-                data-slot="status-code"
-                className={PAGE_NOT_FOUND_404}
-                style={{
-                  backgroundImage:
-                    'linear-gradient(0.04162157269563238deg, rgba(255, 255, 255, 0) 9.2005%, rgba(31, 42, 55, 1) 102.07%)',
-                }}
-              >
-                404
-              </p>
-              <div data-slot="text-and-button" className={PAGE_NOT_FOUND_STACK}>
-                <div data-slot="text" className={cn('flex flex-col gap-spacing-md items-start w-full text-center')}>
-                  {heading && <div data-slot="title" className={PAGE_NOT_FOUND_TITLE}>{resolvedTitle}</div>}
-                  {helperText && <div data-slot="description" className={PAGE_NOT_FOUND_DESC}>{resolvedDescription}</div>}
-                </div>
-                {button && resolvedButtonLabel ? (
-                  <Button data-slot="button" variant="neutral" size="lg" onClick={onButtonClick}>
-                    {resolvedButtonLabel}
-                  </Button>
-                ) : null}
-              </div>
-            </>
-          )}
-
-          {(type === 'error' || type === 'no-notifications') && (
-            <>
-              <div data-slot="text" className={cn('flex flex-col gap-spacing-lg items-start w-full text-center')}>
-                {heading && <div data-slot="title" className={TITLE_DISPLAY_XS}>{resolvedTitle}</div>}
-                {helperText && <div data-slot="description" className={DESCRIPTION_LG}>{resolvedDescription}</div>}
-              </div>
-              {button && resolvedButtonLabel ? (
-                <Button data-slot="button" variant="neutral" size="lg" onClick={onButtonClick}>
-                  {resolvedButtonLabel}
-                </Button>
-              ) : null}
-            </>
-          )}
-        </div>
-      )}
-
-      {(type === 'no-data' || type === 'no-connection') && (
-        <>
-          <div data-slot="text" className={TEXT_STACK}>
-            {heading && <div data-slot="title" className={TITLE_XL}>{resolvedTitle}</div>}
-            {helperText && (
-              <div
-                data-slot="description"
-                className={cn(type === 'no-data' ? DESCRIPTION_SM : DESCRIPTION_MD)}
-              >
-                {resolvedDescription}
-              </div>
-            )}
-          </div>
-          {button && resolvedButtonLabel ? (
-            <Button
-              data-slot="button"
-              variant="primary"
-              size="lg"
-              onClick={onButtonClick}
-            >
-              {resolvedButtonLabel}
-            </Button>
-          ) : null}
-        </>
-      )}
-
-      {type === 'connection-lost' && (
-        <>
-          <div data-slot="content" className={cn(CONNECTION_LOST_TEXT_WRAP, SPLIT_ITEM, resolvedDir === 'rtl' && 'items-end')}>
-            <div data-slot="text" className={cn('flex flex-col gap-spacing-lg items-start w-full')}>
-              {heading && <div data-slot="title" className={CONNECTION_LOST_TITLE}>{resolvedTitle}</div>}
-              {helperText && <div data-slot="description" className={CONNECTION_LOST_DESC}>{resolvedDescription}</div>}
-            </div>
-            {button && resolvedButtonLabel ? (
-              <Button data-slot="button" variant="neutral" size="lg" onClick={onButtonClick}>
-                {resolvedButtonLabel}
-              </Button>
-            ) : null}
-          </div>
-
-          <div data-slot="illustration" className={cn(SPLIT_ILLUSTRATION_WRAP, 'shrink-0')}>
-            {illustrationNode}
-          </div>
-        </>
-      )}
-
-      {type === 'page-not-found' && (
-        <>
-          {/* content block is already rendered above in the "page-not-found" group */}
-          <div data-slot="illustration" className={cn(SPLIT_ILLUSTRATION_WRAP, 'shrink-0')}>
-            {illustrationNode}
-          </div>
-        </>
-      )}
-    </div>
-  );
-});
-

package/src/components/EmptyState/EmptyState.types.ts

@@ -1,48 +0,0 @@
-import type { HTMLAttributes, ReactNode } from 'react';
-
-export type EmptyStateType =
-  | 'no-data'
-  | 'no-connection'
-  | 'error'
-  | 'no-notifications'
-  | 'connection-lost'
-  | 'page-not-found';
-
-export interface EmptyStateProps extends HTMLAttributes<HTMLDivElement> {
-  /** Content/layout preset from Figma (State Types). */
-  type?: EmptyStateType;
-
-  /**
-   * Direction override. Prefer this over the deprecated `rtl` boolean.
-   * Inherited from HTMLAttributes but narrowed here for clarity.
-   * If both are provided, `dir` takes precedence.
-   */
-  dir?: 'ltr' | 'rtl';
-
-  /**
-   * @deprecated Use `dir="rtl"` instead.
-   * Kept for backwards compatibility — sets `dir="rtl"` on the root element.
-   */
-  rtl?: boolean;
-
-  /** Optional illustration element. If omitted, renders the Figma placeholder. */
-  illustration?: ReactNode;
-
-  /** Shows the heading/title area. */
-  heading?: boolean;
-  /** Shows the supporting/helper text. */
-  helperText?: boolean;
-  /** Shows the call-to-action button. */
-  button?: boolean;
-
-  /** Heading content. If omitted, a Figma-aligned default is used for the selected `type`. */
-  headingContent?: ReactNode;
-  /** Supporting text content. If omitted, a Figma-aligned default is used for the selected `type`. */
-  helperTextContent?: ReactNode;
-
-  /** Button label. If omitted, a Figma-aligned default is used for the selected `type`. */
-  buttonLabel?: string;
-  /** Click handler for the built-in button. */
-  onButtonClick?: () => void;
-}
-

package/src/components/EmptyState/EmptyState.variants.ts

@@ -1,122 +0,0 @@
-import type { EmptyStateType } from './EmptyState.types';
-
-/* All class-name constants mapped from Figma node 6479:94141 (Empty State). */
-
-export const ROOT_BASE = ['flex items-center', 'p-spacing-2xl', 'relative'].join(' ');
-
-export const ROOT_BY_TYPE: Record<EmptyStateType, string> = {
-  'no-data': [
-    'flex-col justify-center',
-    'gap-spacing-3xl',
-    'w-full max-w-[388px]',
-    'text-center',
-  ].join(' '),
-  'no-connection': [
-    'flex-col',
-    'gap-spacing-3xl',
-    'w-full max-w-[679px]',
-    'text-center',
-  ].join(' '),
-  error: [
-    'flex-col justify-center',
-    'gap-spacing-5xl',
-    'w-full max-w-[547px]',
-    'text-center',
-  ].join(' '),
-  'no-notifications': [
-    'flex-col justify-center',
-    'gap-spacing-5xl',
-    'w-full max-w-[547px]',
-    'text-center',
-  ].join(' '),
-  'connection-lost': [
-    'flex-row flex-wrap items-center justify-center',
-    'gap-spacing-lg',
-    'w-full max-w-[735px]',
-    'rtl:flex-row-reverse',
-  ].join(' '),
-  'page-not-found': [
-    'flex-row flex-wrap items-center justify-center',
-    'gap-spacing-xl',
-    'w-full max-w-[1225px]',
-    'rtl:flex-row-reverse',
-  ].join(' '),
-};
-
-export const TEXT_STACK = ['flex flex-col', 'gap-spacing-md', 'items-start', 'w-full', 'text-center'].join(' ');
-
-export const TITLE_XL = [
-  'text-text-xl font-[600]',
-  'text-[rgba(31,42,55,1)] dark:text-[rgba(229,231,235,1)]',
-  'w-full',
-].join(' ');
-
-export const DESCRIPTION_SM = [
-  'text-text-sm font-[400]',
-  'text-[rgba(56,66,80,1)] dark:text-[rgba(156,163,175,1)]',
-  'w-full',
-].join(' ');
-
-export const DESCRIPTION_MD = [
-  'text-text-md font-[400]',
-  'text-[rgba(56,66,80,1)] dark:text-[rgba(156,163,175,1)]',
-  'w-full',
-].join(' ');
-
-export const TITLE_DISPLAY_XS = [
-  'text-display-xs font-[600]',
-  'text-[rgba(31,42,55,1)] dark:text-[rgba(229,231,235,1)]',
-  'w-full',
-].join(' ');
-
-export const DESCRIPTION_LG = [
-  'text-text-lg font-[400]',
-  'text-[rgba(56,66,80,1)] dark:text-[rgba(156,163,175,1)]',
-  'w-full',
-].join(' ');
-
-export const CONNECTION_LOST_TEXT_WRAP = ['flex flex-col', 'gap-spacing-3xl', 'items-start', 'justify-center', 'w-full'].join(' ');
-export const CONNECTION_LOST_TITLE = [
-  'text-display-sm font-[500]',
-  'text-[rgba(31,42,55,1)] dark:text-[rgba(229,231,235,1)]',
-  'w-full',
-].join(' ');
-export const CONNECTION_LOST_DESC = [
-  'text-text-lg font-[400]',
-  'text-[rgba(56,66,80,1)] dark:text-[rgba(156,163,175,1)]',
-  'break-words',
-].join(' ');
-
-export const CONTENT_CENTER = [
-  'flex flex-col items-center justify-center',
-  'gap-spacing-3xl',
-  'w-full',
-].join(' ');
-
-/* For split layouts that must be responsive to container width (not viewport). */
-export const SPLIT_ITEM = 'flex-1 min-w-[300px]';
-export const SPLIT_ILLUSTRATION_WRAP = 'flex-1 min-w-[300px] flex justify-center';
-
-export const PAGE_NOT_FOUND_CONTENT = ['flex flex-[1_0_0] flex-col', 'items-center', 'min-w-[300px]', 'pb-[70px]'].join(' ');
-
-export const PAGE_NOT_FOUND_404 = [
-  'w-full',
-  'text-center',
-  'text-[clamp(120px,20vw,302px)] leading-[2.07]',
-  'font-[600]',
-  'h-[clamp(160px,24vw,350px)]',
-  'text-[transparent] bg-clip-text',
-].join(' ');
-
-export const PAGE_NOT_FOUND_STACK = ['flex flex-col', 'items-center', 'gap-spacing-2xl', 'w-full', 'mb-[-70px]'].join(' ');
-export const PAGE_NOT_FOUND_TITLE = [
-  'text-display-sm font-[600]',
-  'text-[rgba(31,42,55,1)] dark:text-[rgba(229,231,235,1)]',
-  'w-full',
-].join(' ');
-export const PAGE_NOT_FOUND_DESC = [
-  'text-text-lg font-[400]',
-  'text-[rgba(56,66,80,1)] dark:text-[rgba(156,163,175,1)]',
-  'w-full',
-].join(' ');
-

package/src/components/EmptyState/index.ts

@@ -1,3 +0,0 @@
-export { EmptyState } from './EmptyState';
-export type { EmptyStateProps, EmptyStateType } from './EmptyState.types';
-