Files
ss-tools/specs/013-unify-frontend-css/data-model.md
2026-01-23 14:56:05 +03:00

1.7 KiB

Data Model: Frontend State & Components

1. i18n State (Client-Side)

The application state for internationalization is transient (in-memory) but initialized from and persisted to localStorage.

Entities

Locale

  • Type: String Enum
  • Values: "ru", "en"
  • Default: "ru"
  • Persistence: localStorage.getItem("locale")

TranslationDictionary

  • Type: JSON Object
  • Structure: Nested key-value pairs where values are strings.
  • Example:
    {
      "common": {
        "save": "Сохранить",
        "cancel": "Отмена"
      },
      "dashboard": {
        "title": "Панель управления"
      }
    }
    

2. Component Props (Contracts)

These define the "API" for the standardized UI components.

Button

  • variant: "primary" | "secondary" | "danger" | "ghost" (default: "primary")
  • size: "sm" | "md" | "lg" (default: "md")
  • isLoading: boolean (default: false)
  • disabled: boolean (default: false)
  • type: "button" | "submit" | "reset" (default: "button")
  • onClick: () => void (optional)

Input

  • label: string (optional)
  • value: string (two-way binding)
  • placeholder: string (optional)
  • error: string (optional)
  • disabled: boolean (default: false)
  • type: "text" | "password" | "email" | "number" (default: "text")

Card

  • title: string (optional)
  • padding: "none" | "sm" | "md" | "lg" (default: "md")

Select

  • options: Array<{ value: string | number, label: string }>
  • value: string | number (two-way binding)
  • label: string (optional)
  • disabled: boolean (default: false)