@momo-kits/native-kits 0.158.1-beta.1-debug → 0.158.1-beta.2-debug

package/.claude/skills/design-system/references/components/badge.md

@@ -1,127 +0,0 @@
-# Badge
-
-> Numeric or dot indicator — signal unread counts, notifications, hoặc status trên parent element.
-
-**Package:** `@momo-kits/foundation`
-**Platform:** RN ✅ | Compose ✅
-**Completeness:** need_update — thiếu Figma
-**Figma node:** [VERIFY]
-
----
-
-## Props
-
-| Prop | Type | Values | Default | Description |
-|------|------|--------|---------|-------------|
-| `type` | string | `"badge"` \| `"badgeDot"` \| `"badgeRibbon"` | `"badge"` | Badge variant [VERIFY] |
-| `value` | string/number | — | — | Badge content. Number hoặc text ("Mới"). "99+" for overflow |
-| `size` | string | `"small"` \| `"large"` | `"small"` | Size cho BadgeDot variant [VERIFY] |
-| `backgroundColor` | string | `Colors.*` token | `"Colors.red_03"` | Badge background color [VERIFY] |
-| `visible` | boolean | `true` \| `false` | `true` | Show/hide badge. Count = 0 → auto hide [VERIFY] |
-
----
-
-## Variants
-
-| Variant | Description | Content | Color |
-|---------|-----------|---------|-------|
-| **badge** | Capsule với numeric/text value | Number hoặc short text ("99+", "Mới") | `Colors.red_03` bg, `Colors.white` text |
-| **badgeDot** | Simple circle, no text | — | `Colors.red_03` |
-| **badgeRibbon** | Ribbon-style label trên card/image edge | Short text | `Colors.red_03` bg, `Colors.white` text |
-
----
-
-## States
-
-| State | Appearance | Description |
-|-------|-----------|-------------|
-| **Visible** | Badge displayed | Count > 0 hoặc status active |
-| **Hidden** | Badge removed entirely | Count = 0 → auto hide. Không show "0" |
-
-Badge là non-interactive — chỉ display indicator.
-
----
-
-## Variant-to-Context Map
-
-| Variant | Khi nào dùng | Tránh khi | Ví dụ trong MoMo |
-|---------|-------------|-----------|-------------------|
-| **badge** (numeric) | Unread message/notification count | Count = 0 → hide | Chat tab badge "3", Notification bell "12" |
-| **badgeDot** | Signal new/unread status without count | Cần show số cụ thể → dùng badge | Profile tab có update mới, Setting có item mới |
-| **badgeRibbon** | Promotional label trên card/image | Trong list item đơn giản → dùng Tag | "Giảm 50%" ribbon trên deal card |
-
----
-
-## SSR Pattern
-
-### Badge on Tab Icon
-```json
-{
-  "icon": "chat",
-  "label": "Chat",
-  "screen": "Chat",
-  "badge": "numericBadge",
-  "badgeValue": 3
-}
-```
-
-### Badge Dot on Avatar
-```json
-{
-  "id": "user_avatar",
-  "type": "stack",
-  "children": [
-    {
-      "component": "Avatar",
-      "props": {
-        "source": "{{data.avatar}}",
-        "size": "medium"
-      }
-    },
-    {
-      "component": "Badge",
-      "props": {
-        "type": "badgeDot",
-        "size": "small"
-      }
-    }
-  ]
-}
-```
-
-### Ribbon on Card
-```json
-{
-  "component": "Badge",
-  "props": {
-    "type": "badgeRibbon",
-    "value": "Giảm 50%",
-    "backgroundColor": "Colors.red_03"
-  }
-}
-```
-
----
-
-## Accessibility
-
-- Badge value announce as part of parent element: "Chat, 3 thông báo mới".
-- BadgeDot: convey "mới" hoặc "unread" status to screen readers.
-- Không rely solely on badge color để convey meaning.
-
----
-
-## Usage Guidelines
-
-### Do
-- Dùng Badge cho unread message/notification counts.
-- Dùng BadgeDot cho new/unread status without specific count.
-- Dùng BadgeRibbon cho promotional labels trên cards.
-- Hide badge khi count = 0.
-- Keep badge text short.
-
-### Don't
-- Không dùng Badge cho categorization — dùng **Tag**.
-- Không dùng Badge cho status text ("Active", "Pending") — dùng **Tag**.
-- Không display large strings trong Badge.
-- Không đặt multiple badges trên cùng element.

package/.claude/skills/design-system/references/components/bottom-tab.md

@@ -1,177 +0,0 @@
-# BottomTabBar
-
-> Fixed bottom navigation bar cho app-level navigation giữa top-level screens. 3–5 tabs + optional FAB.
-
-**Package:** `@momo-kits/foundation`
-**Platform:** RN ✅ | Compose ❌ (dùng BottomNavigation Material3)
-**Completeness:** need_update — Figma node ID unresolved
-**Figma node:** [VERIFY]
-
----
-
-## Variant Axes
-
-| Property | Type | Values | Description |
-|----------|------|--------|-------------|
-| type | variant | default · special | Default = standard tabs. Special = center FAB elevated |
-| itemCount | variant | 2 · 3 · 4 · 5 | Số tabs. Special type chỉ support 3 hoặc 5 [VERIFY] |
-
----
-
-## Props
-
-| Prop | Type | Values | Default | Description |
-|------|------|--------|---------|-------------|
-| `type` | string | `"default"` \| `"special"` | `"default"` | Tab bar type |
-| `tabs` | array | Tab objects (2-5) | required | Tab configuration. Mỗi tab: `{ icon, label, screen, badge }` |
-| `activeTab` | number | index (0-based) | `0` | Currently active tab index |
-| `itemCount` | number | `2` \| `3` \| `4` \| `5` | — | Số tabs [VERIFY] |
-| `onTabPress` | function | — | — | Callback khi tap tab. `"onTabPress": "navigate://TabScreen"` |
-
-### Tab Object
-
-| Property | Type | Values | Description |
-|----------|------|--------|-------------|
-| `icon` | string | icon name | Tab icon |
-| `label` | string | — | Tab text. 1 word max (2 short words). Nouns, not verbs |
-| `screen` | string | screen name | Navigation target |
-| `badge` | string | `"hidden"` \| `"smallDotBadge"` \| `"largeDotBadge"` \| `"numericBadge"` \| `"textBadge"` | Badge type per tab |
-| `badgeValue` | string/number | — | Badge content. Number hoặc text ("Mới"). "99+" for overflow |
-| `isFAB` | boolean | `true` \| `false` | Center tab là FAB (chỉ dùng với type=special) |
-
----
-
-## Variants
-
-| Type | Description | Tab Count | Center Tab |
-|------|-----------|-----------|------------|
-| **default** | Standard evenly distributed tabs | 2-5 | Normal |
-| **special** | Center tab elevated (FAB-style) cho primary action | 3 hoặc 5 only | Circular, elevated, `Colors.pink_03` background |
-
----
-
-## States
-
-### Tab States
-
-| State | Icon Color | Label Color | Indicator |
-|-------|-----------|------------|-----------|
-| **Active** | `Colors.pink_03` | `Colors.pink_03` | 2px bar, `Colors.pink_03` |
-| **Inactive** | `Colors.black_12` | `Colors.black_12` | Hidden |
-
-- Active indicator: horizontal slide animation khi switch tabs.
-- Chỉ 1 tab active tại mỗi thời điểm.
-
-### Badge Types
-
-| Badge | Color | Text | Use Case |
-|-------|-------|------|----------|
-| `hidden` | — | — | No badge |
-| `smallDotBadge` | `Colors.red_03` | — | Unread/new indicator nhỏ |
-| `largeDotBadge` | `Colors.red_03` | — | Unread indicator lớn hơn |
-| `numericBadge` | `Colors.red_03` | `Colors.white`, count | Notification count. "99+" overflow |
-| `textBadge` | `Colors.red_03` | `Colors.white`, text | Short text ("Mới") |
-
----
-
-## Variant-to-Context Map
-
-| Type + Count | Khi nào dùng | Tránh khi | Ví dụ trong MoMo |
-|-------------|-------------|-----------|-------------------|
-| **Default, 5 tabs** | App chính MoMo với đầy đủ navigation | — | Home / Khám phá / [+] / Chat / Cá nhân |
-| **Special, 5 tabs** | App chính với primary action (tạo mới, scan) | Primary action không cần prominence | Home / Search / [FAB Scan] / Chat / Profile |
-| **Default, 3 tabs** | Feature đơn giản, ít destinations | Cần >3 top-level sections | Sub-feature với 3 sections |
-| **Default, 4 tabs** | Balanced navigation | — | App có 4 main sections rõ ràng |
-
-### Tab Count Rules
-
-| Count | Recommendation |
-|-------|---------------|
-| 2 | Không recommended — dùng segmented control hoặc toggle |
-| 3 | Ideal — clean layout |
-| 4 | Good — balanced |
-| 5 | Maximum — keep labels very short |
-| 6+ | KHÔNG ĐƯỢC — dùng navigation pattern khác |
-
----
-
-## SSR Pattern
-
-### Main App Shell
-```json
-{
-  "navigation": {
-    "headerType": "default",
-    "headerTitle": { "type": "text", "title": "Trang chủ" },
-    "backgroundType": "compact",
-    "bottomTab": {
-      "type": "special",
-      "activeTab": 0,
-      "tabs": [
-        { "icon": "home", "label": "Trang chủ", "screen": "Home", "badge": "hidden" },
-        { "icon": "search", "label": "Khám phá", "screen": "Explore", "badge": "hidden" },
-        { "icon": "scan", "label": "Quét mã", "screen": "Scan", "isFAB": true },
-        { "icon": "chat", "label": "Chat", "screen": "Chat", "badge": "numericBadge", "badgeValue": 3 },
-        { "icon": "user", "label": "Cá nhân", "screen": "Profile", "badge": "smallDotBadge" }
-      ]
-    }
-  }
-}
-```
-
-### Simple 3-tab Navigation
-```json
-{
-  "navigation": {
-    "bottomTab": {
-      "type": "default",
-      "activeTab": 0,
-      "tabs": [
-        { "icon": "list", "label": "Danh sách", "screen": "List", "badge": "hidden" },
-        { "icon": "chart", "label": "Thống kê", "screen": "Stats", "badge": "hidden" },
-        { "icon": "settings", "label": "Cài đặt", "screen": "Settings", "badge": "hidden" }
-      ]
-    }
-  }
-}
-```
-
----
-
-## Composition with Other Components
-
-| Component | Behavior |
-|-----------|----------|
-| **Toast** | Appears above BottomTabBar khi cả 2 visible |
-| **TopNav** | TopNav top + BottomTabBar bottom = standard screen shell |
-| **Popup** | Overlay full screen bao gồm BottomTabBar |
-| **Badge** | Dùng built-in badge system — KHÔNG stack external Badge component lên |
-
----
-
-## Accessibility
-
-- Mỗi tab phải có accessible label: icon label + state ("Trang chủ, tab đang chọn").
-- Badge count announce: "Chat, 3 thông báo mới".
-- FAB: accessible label mô tả action ("Quét mã QR").
-- Tab switch announce: "Đã chuyển sang Chat".
-- Không hide tab bar khi scroll — luôn accessible.
-
----
-
-## Usage Guidelines
-
-### Do
-- Dùng cho primary app-level navigation (3–5 destinations).
-- Keep labels 1 word (max 2 short words). Nouns, not verbs.
-- Show badges CHỈ cho actionable unread notifications.
-- Maintain scroll position per tab khi switching.
-- All icons cùng style (outline HOẶC filled — không mix).
-
-### Don't
-- Không dùng >5 tabs.
-- Không abbreviate labels ("LS.GD" → "Lịch sử").
-- Không mix icon styles across tabs.
-- Không dùng cho secondary/nested navigation — dùng back navigation.
-- Không hide tab bar on scroll.
-- Không đặt destructive actions trong tab bar.

package/.claude/skills/design-system/references/components/bottomsheet.md

@@ -1,170 +0,0 @@
-# BottomSheet
-
-> Slides up from bottom — reveals additional content/actions while maintaining parent screen context. Overlay container.
-
-**Package:** `@momo-kits/foundation`
-**Platform:** RN ✅ | Compose ✅
-**Completeness:** need_update — thiếu Figma
-**Figma node:** [VERIFY]
-
----
-
-## Variant Axes
-
-| Axis | Options | Default |
-|------|---------|---------|
-| **Type** | `standard` · `surface` | `standard` |
-
----
-
-## Props
-
-| Prop | Type | Values | Default | Description |
-|------|------|--------|---------|-------------|
-| `type` | string | `"standard"` \| `"surface"` | `"standard"` | Standard: with handle + backdrop. Surface: no handle, integrated feel [VERIFY] |
-| `visible` | boolean | `true` \| `false` | `false` | Controlled visibility |
-| `barrierDismissible` | boolean | `true` \| `false` | `true` | Tap backdrop to dismiss |
-| `showHandle` | boolean | `true` \| `false` | `true` | Show drag handle indicator [VERIFY] |
-| `children` | element | — | required | Sheet content — any components. Scrollable if exceeds height |
-| `onDismiss` | function | — | — | Callback khi dismissed. `"onDismiss": "action://closeSheet"` |
-
----
-
-## Variants
-
-| Type | Handle | Backdrop | Use Case |
-|------|--------|---------|----------|
-| **standard** | Visible (36x4, `Colors.black_06`) | `Colors.black_20` at 40% opacity | Action lists, selections, additional info |
-| **surface** | Hidden | None or minimal | Integrated content that feels part of screen |
-
----
-
-## States
-
-| State | Appearance |
-|-------|-----------|
-| **Hidden** | Not rendered |
-| **Opening** | Slide up from bottom (300ms ease-out), backdrop fade in |
-| **Visible** | Sheet visible, content scrollable if needed. Max 90% screen height |
-| **Closing** | Slide down (250ms ease-in), backdrop fade out |
-
-Dismiss triggers: swipe down on handle/content, tap backdrop (if barrierDismissible), system back button, programmatic.
-
----
-
-## Variant-to-Context Map
-
-| Context | Khi nào dùng | Tránh khi | Ví dụ trong MoMo |
-|---------|-------------|-----------|-------------------|
-| **Action list** | Secondary actions cho list item | Primary actions → show visible | Share, Export, Report options |
-| **Selection** | Choose from <10 options | >10 options → full screen with search | Chọn ngân hàng, chọn lý do |
-| **Filter/Sort** | Filter or sort options | Complex multi-field filter → new screen | Lọc giao dịch, sắp xếp |
-| **Information** | Additional details without leaving context | Critical decisions → dùng PopupNotify | Chi tiết giao dịch, thông tin thêm |
-
----
-
-## SSR Pattern
-
-### Action List BottomSheet
-```json
-{
-  "component": "BottomSheet",
-  "props": {
-    "visible": "{{state.showActions}}",
-    "barrierDismissible": true
-  },
-  "children": [
-    {
-      "component": "Text",
-      "props": {
-        "content": "Chia sẻ",
-        "typography": "body_default_regular"
-      },
-      "onPress": "action://share"
-    },
-    {
-      "component": "Divider",
-      "props": {}
-    },
-    {
-      "component": "Text",
-      "props": {
-        "content": "Báo cáo",
-        "typography": "body_default_regular"
-      },
-      "onPress": "action://report"
-    }
-  ],
-  "onDismiss": "setState://showActions=false"
-}
-```
-
-### Selection BottomSheet
-```json
-{
-  "component": "BottomSheet",
-  "props": {
-    "visible": "{{state.showBankPicker}}"
-  },
-  "children": [
-    {
-      "component": "Text",
-      "props": {
-        "content": "Chọn ngân hàng",
-        "typography": "headline_s_bold"
-      }
-    },
-    {
-      "id": "bank_options",
-      "type": "section",
-      "forEach": "{{data.banks}}",
-      "render": {
-        "component": "Radio",
-        "props": {
-          "value": "{{item.id}}",
-          "groupValue": "{{state.selectedBank}}",
-          "label": "{{item.name}}"
-        },
-        "onChange": "setState://selectedBank={{item.id}}"
-      }
-    },
-    {
-      "component": "Button",
-      "props": {
-        "variant": "primary",
-        "label": "Xác nhận"
-      },
-      "onPress": "action://confirmBank"
-    }
-  ],
-  "onDismiss": "setState://showBankPicker=false"
-}
-```
-
----
-
-## Accessibility
-
-- Focus trap khi sheet open — cannot interact with content behind.
-- Handle: accessible label "Kéo xuống để đóng".
-- Content announces on open.
-- Back button / ESC dismisses.
-- All interactive elements meet 44dp touch target.
-
----
-
-## Usage Guidelines
-
-### Do
-- Dùng cho secondary actions, filter/sort, selections (<10 items).
-- Show handle cho swipe-to-dismiss affordance.
-- Allow backdrop tap to dismiss cho non-critical sheets.
-- Keep content concise and scannable.
-
-### Don't
-- Không nest bottom sheets trong bottom sheets.
-- Không dùng cho lengthy forms → navigate to new screen.
-- Không disable swipe-to-dismiss unless data loss possible.
-- Không >90% screen height.
-- Không dùng cho critical confirmations → dùng **PopupNotify**.
-- Không dùng cho persistent content — sheet is dismissible.

package/.claude/skills/design-system/references/components/button.md

@@ -1,206 +0,0 @@
-# Button
-
-> Interactive element trigger action — CTA chính và phụ cho mọi screen trong MoMo.
-
-**Package:** `@momo-kits/foundation`
-**Platform:** RN ✅ | Compose ✅
-**Completeness:** need_update — Figma variant naming typo known ("sencondary")
-**Figma node:** [VERIFY]
-
----
-
-## Variant Axes
-
-| Property | Type | Values | Description |
-|----------|------|--------|-------------|
-| type | variant | primary · secondary · tonal · outline · danger · textlink · disabled | Visual variant — determines colors and emphasis |
-| size | variant | large · medium · small | Button size |
-| full | boolean | true · false | Full-width mode |
-
-> **Note:** Figma treats `disabled` as variant trong `type`. Logically nó là state. ui-composer có thể dùng `type: "disabled"` hoặc `disabled: true` [VERIFY].
-
----
-
-## Props
-
-| Prop | Type | Values | Default | Description |
-|------|------|--------|---------|-------------|
-| `title` | string | — | required | Button label text. Sentence case. Max 20 chars. Start with verb |
-| `type` | string | `"primary"` \| `"secondary"` \| `"tonal"` \| `"outline"` \| `"danger"` \| `"textlink"` \| `"disabled"` | `"primary"` | Visual variant |
-| `size` | string | `"large"` \| `"medium"` \| `"small"` | `"large"` | Button size |
-| `full` | boolean | `true` \| `false` | `false` | Full-width mode — stretches to parent width |
-| `disabled` | boolean | `true` \| `false` | `false` | Non-interactive. Overrides variant colors |
-| `loading` | boolean | `true` \| `false` | `false` | Spinner replaces label. Non-interactive during loading |
-| `iconLeft` | string | icon name | — | Optional icon before label |
-| `iconRight` | string | icon name | — | Optional icon after label |
-| `onPress` | function | — | — | Tap handler. `"onPress": "action://submit"` |
-
----
-
-## Variants
-
-| Variant | Background | Text Color | Border | Emphasis | Usage |
-|---------|-----------|-----------|--------|----------|-------|
-| **primary** | `Colors.pink_03` | `Colors.white` | none | Highest | Main CTA. Chỉ 1 per screen |
-| **secondary** | `Colors.white` | `Colors.pink_03` | `Colors.pink_03` | High | Supporting action. Pair với Primary |
-| **tonal** | `Colors.pink_09` | `Colors.pink_03` | none | Medium | Soft emphasis. Grouped actions |
-| **outline** | `Colors.white` | `Colors.black_17` | `Colors.black_04` | Low | Neutral, optional actions |
-| **danger** | `Colors.red_03` | `Colors.white` | none | Override | Destructive/irreversible only |
-| **textlink** | transparent | `Colors.pink_03` | none | Lowest | Inline text action. Skip, Show all |
-
-**Variant hierarchy:** primary > secondary > tonal/outline > textlink. Danger overrides all — dùng độc lập.
-
----
-
-## States
-
-| State | Background | Text Color | Border | Opacity | Spinner | Interactive |
-|-------|-----------|-----------|--------|---------|---------|-------------|
-| **Default** | per variant | per variant | per variant | 1 | — | true |
-| **Pressed** | per variant | per variant | per variant | 0.8 | — | true |
-| **Disabled** | `Colors.black_04` | `Colors.black_08` | none | 1 | — | false |
-| **Loading** | per variant | — | per variant | 1 | matches text color | false |
-
-- Pressed: entire button opacity 0.8. Immediate transition.
-- Loading: spinner replaces label text. Button maintains exact size. Prevents double-tap.
-- Disabled: overrides ALL variant colors → grey.
-
----
-
-## Variant-to-Context Map
-
-| Variant | Khi nào dùng | Tránh khi | Ví dụ trong MoMo |
-|---------|-------------|-----------|-------------------|
-| **primary** | Main action trên screen. Max 1 per view | Có 2+ primary actions — hạ bớt xuống secondary | "Chuyển tiền" button trên form transfer |
-| **secondary** | Supporting action alongside Primary | Standalone không có Primary kèm — dùng Primary | "Hủy" bên cạnh "Xác nhận" trên popup confirm |
-| **tonal** | Grouped actions cần soft emphasis | Action quan trọng cần nổi bật — dùng Primary | "Chọn phương thức" trên màn thanh toán |
-| **outline** | Neutral, optional, low-emphasis | Action chính — quá subtle | "Xem chi tiết" trên card giao dịch |
-| **danger** | Destructive, irreversible action | Non-destructive actions | "Xóa tài khoản" trên Settings, "Hủy giao dịch" |
-| **textlink** | Inline text action, lowest emphasis | Primary action — quá subtle | "Bỏ qua" trên onboarding, "Xem tất cả" trên section |
-
----
-
-## SSR Pattern
-
-### Fixed Bottom CTA
-```json
-{
-  "id": "bottom_cta",
-  "type": "footer",
-  "children": [
-    {
-      "component": "Button",
-      "props": {
-        "title": "Chuyển tiền",
-        "type": "primary",
-        "size": "large",
-        "full": true,
-        "loading": "{{state.isSubmitting}}"
-      },
-      "onPress": "action://transfer"
-    }
-  ]
-}
-```
-
-### Horizontal Pair (Confirm/Cancel)
-```json
-{
-  "id": "action_pair",
-  "type": "row",
-  "spacing": "Spacing.S",
-  "children": [
-    {
-      "component": "Button",
-      "props": {
-        "title": "Hủy",
-        "type": "secondary",
-        "size": "medium"
-      },
-      "onPress": "action://cancel"
-    },
-    {
-      "component": "Button",
-      "props": {
-        "title": "Xác nhận",
-        "type": "primary",
-        "size": "medium"
-      },
-      "onPress": "action://confirm"
-    }
-  ]
-}
-```
-
-### Destructive Confirmation
-```json
-{
-  "id": "destructive_pair",
-  "type": "row",
-  "spacing": "Spacing.S",
-  "children": [
-    {
-      "component": "Button",
-      "props": {
-        "title": "Giữ lại",
-        "type": "outline",
-        "size": "medium"
-      },
-      "onPress": "action://keep"
-    },
-    {
-      "component": "Button",
-      "props": {
-        "title": "Xóa tài khoản",
-        "type": "danger",
-        "size": "medium"
-      },
-      "onPress": "action://deleteAccount"
-    }
-  ]
-}
-```
-
-### Loading Action
-```json
-{
-  "component": "Button",
-  "props": {
-    "title": "Đang xử lý...",
-    "type": "primary",
-    "size": "large",
-    "full": true,
-    "loading": true
-  }
-}
-```
-
----
-
-## Accessibility
-
-- Screen reader announce: label + role (button) + state (disabled/loading).
-- Icon-only buttons: PHẢI có text accessible label.
-- Loading state: announce "Đang xử lý" hoặc equivalent.
-- Color contrast: tất cả variant text-on-background meet WCAG AA (4.5:1).
-
----
-
-## Usage Guidelines
-
-### Do
-- Dùng Primary cho 1 action quan trọng nhất trên screen.
-- Sentence case: "Chuyển tiền" không phải "CHUYỂN TIỀN".
-- Label 1-3 words, bắt đầu bằng verb.
-- Loading state cho async actions — prevent double-tap.
-- Pair Primary + Secondary khi có 2 choices.
-- Danger CHỈ cho destructive/irreversible.
-
-### Don't
-- Không đặt 2+ Primary buttons trên cùng 1 view area.
-- Không mix sizes trong cùng button group.
-- Không dùng Danger cho non-destructive actions.
-- Không dùng TextLink cho primary actions — quá subtle.
-- Không disable button mà không communicate lý do.
-- Không mix Primary + Danger trong cùng group.
-- Label không quá 20 ký tự, không dùng "!" hay ".".