@krizaka/ui 3.3.0 → 3.5.0

package/registry/index.json

@@ -1,6 +1,6 @@
 {
   "name": "@krizaka/ui",
-  "version": "3.3.0",
+  "version": "3.5.0",
   "items": [
     {
       "name": "achievement",
@@ -39,6 +39,40 @@
         "cn"
       ]
     },
+    {
+      "name": "action-sheet",
+      "type": "native",
+      "title": "Action sheet",
+      "summary": "A short list of actions on an item from the bottom edge, the destructive one in danger, cancel apart.",
+      "description": "A short list of actions on an item from the bottom edge, the destructive one in danger, cancel apart.",
+      "status": "beta",
+      "category": "overlays",
+      "platforms": "native",
+      "examples": {
+        "web": 0,
+        "native": 1
+      },
+      "dependencies": [],
+      "registryDependencies": []
+    },
+    {
+      "name": "activity-feed",
+      "type": "primitive",
+      "title": "Activity feed",
+      "summary": "What happened, newest first: grouped by day, runs folded (“×3”), “2 min ago” kept fresh, new events announced — and `Timeline`, one thing's history on a rail.",
+      "description": "What happened, newest first: grouped by day, runs folded (“×3”), “2 min ago” kept fresh, new events announced — and `Timeline`, one thing's history on a rail.",
+      "status": "beta",
+      "category": "data-display",
+      "platforms": "both",
+      "examples": {
+        "web": 3,
+        "native": 1
+      },
+      "dependencies": [
+        "tailwind-variants@^3.3.1"
+      ],
+      "registryDependencies": []
+    },
     {
       "name": "alert",
       "type": "primitive",
@@ -146,7 +180,7 @@
       "platforms": "both",
       "examples": {
         "web": 4,
-        "native": 2
+        "native": 3
       },
       "dependencies": [
         "radix-ui@^1.7.0",
@@ -271,6 +305,26 @@
         "page-hero"
       ]
     },
+    {
+      "name": "chat",
+      "type": "primitive",
+      "title": "Chat",
+      "summary": "A conversation's parts — `MessageBubble` (time, receipt, retry), `TypingIndicator`, `MessageComposer`, `ConversationItem` — the same API on the web and React Native.",
+      "description": "A conversation's parts — `MessageBubble` (time, receipt, retry), `TypingIndicator`, `MessageComposer`, `ConversationItem` — the same API on the web and React Native.",
+      "status": "beta",
+      "category": "data-display",
+      "platforms": "both",
+      "examples": {
+        "web": 2,
+        "native": 2
+      },
+      "dependencies": [
+        "tailwind-variants@^3.3.1"
+      ],
+      "registryDependencies": [
+        "avatar"
+      ]
+    },
     {
       "name": "checkbox",
       "type": "primitive",
@@ -602,7 +656,7 @@
         "native": 7
       },
       "dependencies": [
-        "@krizaka/intl@^0.1.0",
+        "@krizaka/intl@^0.1.1",
         "tailwind-variants@^3.3.1"
       ],
       "registryDependencies": [
@@ -628,6 +682,24 @@
         "cn"
       ]
     },
+    {
+      "name": "description-list",
+      "type": "primitive",
+      "title": "Description list",
+      "summary": "Facts about one thing as term and value: stacked, inline like a receipt, or a grid of key figures (`KeyValueGrid`).",
+      "description": "Facts about one thing as term and value: stacked, inline like a receipt, or a grid of key figures (`KeyValueGrid`).",
+      "status": "beta",
+      "category": "data-display",
+      "platforms": "both",
+      "examples": {
+        "web": 3,
+        "native": 1
+      },
+      "dependencies": [
+        "tailwind-variants@^3.3.1"
+      ],
+      "registryDependencies": []
+    },
     {
       "name": "detail-layout",
       "type": "primitive",
@@ -783,6 +855,22 @@
         "cn"
       ]
     },
+    {
+      "name": "fab",
+      "type": "native",
+      "title": "Floating action button",
+      "summary": "The screen's one main action, floating above the content in the accent, clear of the safe area and the tab bar.",
+      "description": "The screen's one main action, floating above the content in the accent, clear of the safe area and the tab bar.",
+      "status": "beta",
+      "category": "actions",
+      "platforms": "native",
+      "examples": {
+        "web": 0,
+        "native": 1
+      },
+      "dependencies": [],
+      "registryDependencies": []
+    },
     {
       "name": "field",
       "type": "primitive",
@@ -817,7 +905,7 @@
         "native": 0
       },
       "dependencies": [
-        "@krizaka/intl@^0.1.0",
+        "@krizaka/intl@^0.1.1",
         "tailwind-variants@^3.3.1"
       ],
       "registryDependencies": [
@@ -860,7 +948,7 @@
         "native": 6
       },
       "dependencies": [
-        "@krizaka/intl@^0.1.0",
+        "@krizaka/intl@^0.1.1",
         "@tanstack/react-form@1.33.5"
       ],
       "registryDependencies": [
@@ -937,6 +1025,22 @@
         "cn"
       ]
     },
+    {
+      "name": "header",
+      "type": "native",
+      "title": "Header",
+      "summary": "A screen's header: the bar under the status bar, and a large title that folds into it as the content scrolls.",
+      "description": "A screen's header: the bar under the status bar, and a large title that folds into it as the content scrolls.",
+      "status": "beta",
+      "category": "navigation",
+      "platforms": "native",
+      "examples": {
+        "web": 0,
+        "native": 1
+      },
+      "dependencies": [],
+      "registryDependencies": []
+    },
     {
       "name": "how-it-works-page",
       "type": "primitive",
@@ -978,6 +1082,22 @@
         "slider"
       ]
     },
+    {
+      "name": "image-viewer",
+      "type": "native",
+      "title": "Image viewer",
+      "summary": "Images full screen on black: pinch and double tap to zoom, swipe between images, swipe down to close.",
+      "description": "Images full screen on black: pinch and double tap to zoom, swipe between images, swipe down to close.",
+      "status": "beta",
+      "category": "media",
+      "platforms": "native",
+      "examples": {
+        "web": 0,
+        "native": 1
+      },
+      "dependencies": [],
+      "registryDependencies": []
+    },
     {
       "name": "iso",
       "type": "primitive",
@@ -994,6 +1114,24 @@
       "dependencies": [],
       "registryDependencies": []
     },
+    {
+      "name": "kanban",
+      "type": "primitive",
+      "title": "Kanban",
+      "summary": "Cards in columns moved by drag and drop — and by the keyboard (Space, the arrows, Space) — every move announced, column limits in the counts.",
+      "description": "Cards in columns moved by drag and drop — and by the keyboard (Space, the arrows, Space) — every move announced, column limits in the counts.",
+      "status": "beta",
+      "category": "data-display",
+      "platforms": "web",
+      "examples": {
+        "web": 1,
+        "native": 0
+      },
+      "dependencies": [
+        "tailwind-variants@^3.3.1"
+      ],
+      "registryDependencies": []
+    },
     {
       "name": "kbd",
       "type": "primitive",
@@ -1090,19 +1228,23 @@
     },
     {
       "name": "list",
-      "type": "native",
+      "type": "primitive",
       "title": "List",
-      "summary": "A long list for React Native on FlashList v2 — separators, skeleton rows, empty and error states, pull to refresh, the next page loaded near the end through useInfiniteQuery of @krizaka/query.",
-      "description": "A long list for React Native on FlashList v2 — separators, skeleton rows, empty and error states, pull to refresh, the next page loaded near the end through useInfiniteQuery of @krizaka/query.",
+      "summary": "Records read top to bottom — a leading visual, a title and a line, details and actions beside — dense or comfortable, selectable, windowed when long.",
+      "description": "Records read top to bottom — a leading visual, a title and a line, details and actions beside — dense or comfortable, selectable, windowed when long.",
       "status": "beta",
       "category": "data-display",
-      "platforms": "native",
+      "platforms": "both",
       "examples": {
-        "web": 0,
+        "web": 3,
         "native": 3
       },
-      "dependencies": [],
-      "registryDependencies": []
+      "dependencies": [
+        "tailwind-variants@^3.3.1"
+      ],
+      "registryDependencies": [
+        "checkbox"
+      ]
     },
     {
       "name": "loader",
@@ -1112,10 +1254,10 @@
       "description": "A wait from start to end: nothing for the first instants, then the Krizaka glyph with its words, a percentage and an ETA, held long enough to read, ending on a check or a cross that is drawn and announced — and `LoadingRegion`, which hands a region over to a skeleton of its shape.",
       "status": "beta",
       "category": "feedback",
-      "platforms": "web",
+      "platforms": "both",
       "examples": {
         "web": 6,
-        "native": 0
+        "native": 2
       },
       "dependencies": [
         "tailwind-variants@^3.3.1"
@@ -1144,6 +1286,28 @@
         "page-hero"
       ]
     },
+    {
+      "name": "map",
+      "type": "primitive",
+      "title": "Map",
+      "summary": "Maps that cost nothing per view — MapLibre (open source) over Protomaps tiles on the Krizaka CDN, painted from the tokens in dark or light and in the product's accent — with markers, clusters, the person's position, a radius and a location picker.",
+      "description": "Maps that cost nothing per view — MapLibre (open source) over Protomaps tiles on the Krizaka CDN, painted from the tokens in dark or light and in the product's accent — with markers, clusters, the person's position, a radius and a location picker.",
+      "status": "beta",
+      "category": "data-display",
+      "platforms": "both",
+      "examples": {
+        "web": 4,
+        "native": 2
+      },
+      "dependencies": [
+        "@krizaka/tokens@^3.5.0",
+        "@protomaps/basemaps@5.7.2",
+        "tailwind-variants@^3.3.1"
+      ],
+      "registryDependencies": [
+        "cn"
+      ]
+    },
     {
       "name": "marketing-layout",
       "type": "primitive",
@@ -1235,6 +1399,26 @@
       "dependencies": [],
       "registryDependencies": []
     },
+    {
+      "name": "match-dialog",
+      "type": "primitive",
+      "title": "Match dialog",
+      "summary": "The moment two people choose each other — a match, a pair, a deal: the two avatars meet at a heart in the brand gradient, the next step under them.",
+      "description": "The moment two people choose each other — a match, a pair, a deal: the two avatars meet at a heart in the brand gradient, the next step under them.",
+      "status": "beta",
+      "category": "overlays",
+      "platforms": "both",
+      "examples": {
+        "web": 1,
+        "native": 1
+      },
+      "dependencies": [],
+      "registryDependencies": [
+        "avatar",
+        "button",
+        "dialog"
+      ]
+    },
     {
       "name": "media-capture",
       "type": "primitive",
@@ -1253,6 +1437,22 @@
       ],
       "registryDependencies": []
     },
+    {
+      "name": "media-picker",
+      "type": "native",
+      "title": "Media picker",
+      "summary": "Photos and videos picked from the library or the camera, as a grid of tiles with a remove button and a count.",
+      "description": "Photos and videos picked from the library or the camera, as a grid of tiles with a remove button and a count.",
+      "status": "beta",
+      "category": "media",
+      "platforms": "native",
+      "examples": {
+        "web": 0,
+        "native": 1
+      },
+      "dependencies": [],
+      "registryDependencies": []
+    },
     {
       "name": "meter",
       "type": "primitive",
@@ -1261,10 +1461,10 @@
       "description": "A measure within a known range — a quota, a balance, a share: thresholds turn it to warning then danger (or the reverse when high is good), and split into parts it becomes a stacked bar or ring with its legend.",
       "status": "beta",
       "category": "data-display",
-      "platforms": "web",
+      "platforms": "both",
       "examples": {
         "web": 3,
-        "native": 0
+        "native": 2
       },
       "dependencies": [
         "tailwind-variants@^3.3.1"
@@ -1300,10 +1500,42 @@
       "description": "A figure that climbs into view once, or rolls digit by digit to each new value — server-rendered at its final value, its width held from the first paint, read once by assistive technology.",
       "status": "beta",
       "category": "data-display",
-      "platforms": "web",
+      "platforms": "both",
       "examples": {
         "web": 3,
-        "native": 0
+        "native": 1
+      },
+      "dependencies": [],
+      "registryDependencies": []
+    },
+    {
+      "name": "onboarding",
+      "type": "native",
+      "title": "Onboarding",
+      "summary": "A first launch in a few slides: swipe or tap Next, Skip at any time, dots that say where you are.",
+      "description": "A first launch in a few slides: swipe or tap Next, Skip at any time, dots that say where you are.",
+      "status": "beta",
+      "category": "layout",
+      "platforms": "native",
+      "examples": {
+        "web": 0,
+        "native": 1
+      },
+      "dependencies": [],
+      "registryDependencies": []
+    },
+    {
+      "name": "otp-input",
+      "type": "native",
+      "title": "OTP input",
+      "summary": "A one-time code in boxes over one real input: the keyboard's suggestion of the code and pasting fill every box at once.",
+      "description": "A one-time code in boxes over one real input: the keyboard's suggestion of the code and pasting fill every box at once.",
+      "status": "beta",
+      "category": "forms",
+      "platforms": "native",
+      "examples": {
+        "web": 0,
+        "native": 2
       },
       "dependencies": [],
       "registryDependencies": []
@@ -1383,6 +1615,40 @@
       ],
       "registryDependencies": []
     },
+    {
+      "name": "permission-prompt",
+      "type": "native",
+      "title": "Permission prompt",
+      "summary": "Before the system's permission dialog, the app says why: a bird, what it is for, the button that asks — and the way to the settings once refused.",
+      "description": "Before the system's permission dialog, the app says why: a bird, what it is for, the button that asks — and the way to the settings once refused.",
+      "status": "beta",
+      "category": "feedback",
+      "platforms": "native",
+      "examples": {
+        "web": 0,
+        "native": 2
+      },
+      "dependencies": [],
+      "registryDependencies": []
+    },
+    {
+      "name": "photo-grid",
+      "type": "primitive",
+      "title": "Photo grid",
+      "summary": "A profile's photos in slots: the first is the main one, empty slots invite to add, photos reorder by drag (web), by their menu (React Native) or by buttons — every move announced.",
+      "description": "A profile's photos in slots: the first is the main one, empty slots invite to add, photos reorder by drag (web), by their menu (React Native) or by buttons — every move announced.",
+      "status": "beta",
+      "category": "media",
+      "platforms": "both",
+      "examples": {
+        "web": 1,
+        "native": 1
+      },
+      "dependencies": [
+        "tailwind-variants@^3.3.1"
+      ],
+      "registryDependencies": []
+    },
     {
       "name": "pointer-light",
       "type": "primitive",
@@ -1520,6 +1786,22 @@
         "cn"
       ]
     },
+    {
+      "name": "pull-to-refresh",
+      "type": "native",
+      "title": "Pull to refresh",
+      "summary": "The platform's pull to refresh in the theme's accent, for any ScrollView or FlatList.",
+      "description": "The platform's pull to refresh in the theme's accent, for any ScrollView or FlatList.",
+      "status": "beta",
+      "category": "feedback",
+      "platforms": "native",
+      "examples": {
+        "web": 0,
+        "native": 1
+      },
+      "dependencies": [],
+      "registryDependencies": []
+    },
     {
       "name": "radio-group",
       "type": "primitive",
@@ -1541,6 +1823,22 @@
         "cn"
       ]
     },
+    {
+      "name": "screen",
+      "type": "native",
+      "title": "Screen",
+      "summary": "A screen of the app — a header, the content (scrolling, rising with the keyboard), a footer — and the templates built on it: app shell, sign-in, profile, feed, chat, settings.",
+      "description": "A screen of the app — a header, the content (scrolling, rising with the keyboard), a footer — and the templates built on it: app shell, sign-in, profile, feed, chat, settings.",
+      "status": "beta",
+      "category": "layout",
+      "platforms": "native",
+      "examples": {
+        "web": 0,
+        "native": 6
+      },
+      "dependencies": [],
+      "registryDependencies": []
+    },
     {
       "name": "scroll-stage",
       "type": "primitive",
@@ -1570,7 +1868,7 @@
       "platforms": "both",
       "examples": {
         "web": 3,
-        "native": 1
+        "native": 2
       },
       "dependencies": [
         "tailwind-variants@^3.3.1"
@@ -1771,7 +2069,7 @@
       "category": "data-display",
       "platforms": "web",
       "examples": {
-        "web": 5,
+        "web": 6,
         "native": 0
       },
       "dependencies": [
@@ -1798,6 +2096,22 @@
         "page-hero"
       ]
     },
+    {
+      "name": "step-progress",
+      "type": "primitive",
+      "title": "Step progress",
+      "summary": "The head of a multi-step flow — a sign-up, a profile to fill: back, segments that fill, the position in words.",
+      "description": "The head of a multi-step flow — a sign-up, a profile to fill: back, segments that fill, the position in words.",
+      "status": "beta",
+      "category": "navigation",
+      "platforms": "both",
+      "examples": {
+        "web": 1,
+        "native": 1
+      },
+      "dependencies": [],
+      "registryDependencies": []
+    },
     {
       "name": "stepper",
       "type": "primitive",
@@ -1806,10 +2120,10 @@
       "description": "The steps of a journey or a job: done steps checked, the current one traced by the Krizaka glyph (growing to its value), failures crossed, connectors that fill — and every state said in words.",
       "status": "beta",
       "category": "navigation",
-      "platforms": "web",
+      "platforms": "both",
       "examples": {
         "web": 3,
-        "native": 0
+        "native": 1
       },
       "dependencies": [
         "tailwind-variants@^3.3.1"
@@ -1818,6 +2132,40 @@
         "spinner"
       ]
     },
+    {
+      "name": "swipe-deck",
+      "type": "primitive",
+      "title": "Swipe deck",
+      "summary": "Cards decided one by one — drag right to like, left to pass, or the buttons (← → on the web) — with `PersonCard`: a person's photos, name, age, seal, distance, bio and interests.",
+      "description": "Cards decided one by one — drag right to like, left to pass, or the buttons (← → on the web) — with `PersonCard`: a person's photos, name, age, seal, distance, bio and interests.",
+      "status": "beta",
+      "category": "data-display",
+      "platforms": "both",
+      "examples": {
+        "web": 1,
+        "native": 1
+      },
+      "dependencies": [
+        "tailwind-variants@^3.3.1"
+      ],
+      "registryDependencies": []
+    },
+    {
+      "name": "swipeable-row",
+      "type": "native",
+      "title": "Swipeable row",
+      "summary": "A row whose actions show under a swipe: left for the trailing ones, right for the leading ones, a full swipe runs the outermost.",
+      "description": "A row whose actions show under a swipe: left for the trailing ones, right for the leading ones, a full swipe runs the outermost.",
+      "status": "beta",
+      "category": "data-display",
+      "platforms": "native",
+      "examples": {
+        "web": 0,
+        "native": 1
+      },
+      "dependencies": [],
+      "registryDependencies": []
+    },
     {
       "name": "switch",
       "type": "primitive",
@@ -1837,6 +2185,22 @@
       ],
       "registryDependencies": []
     },
+    {
+      "name": "tab-bar",
+      "type": "native",
+      "title": "Tab bar",
+      "summary": "The app's main sections at the bottom of the screen: an icon and a word each, a badge for what is new, clear of the home indicator.",
+      "description": "The app's main sections at the bottom of the screen: an icon and a word each, a badge for what is new, clear of the home indicator.",
+      "status": "beta",
+      "category": "navigation",
+      "platforms": "native",
+      "examples": {
+        "web": 0,
+        "native": 1
+      },
+      "dependencies": [],
+      "registryDependencies": []
+    },
     {
       "name": "tabs",
       "type": "primitive",
@@ -1845,10 +2209,10 @@
       "description": "Views of the same page, one at a time: underlined sections, a segmented switch or pills — one light glides from the active tab to the next, in every variant.",
       "status": "beta",
       "category": "navigation",
-      "platforms": "web",
+      "platforms": "both",
       "examples": {
         "web": 4,
-        "native": 0
+        "native": 2
       },
       "dependencies": [
         "radix-ui@^1.7.0",
@@ -1874,6 +2238,24 @@
         "combobox"
       ]
     },
+    {
+      "name": "tag-selector",
+      "type": "primitive",
+      "title": "Tag selector",
+      "summary": "Interests, languages, what one is looking for: toggle chips with a limit and a count — the others rest once the limit is reached.",
+      "description": "Interests, languages, what one is looking for: toggle chips with a limit and a count — the others rest once the limit is reached.",
+      "status": "beta",
+      "category": "forms",
+      "platforms": "both",
+      "examples": {
+        "web": 1,
+        "native": 1
+      },
+      "dependencies": [],
+      "registryDependencies": [
+        "chip"
+      ]
+    },
     {
       "name": "terminal-replay",
       "type": "primitive",
@@ -1921,7 +2303,7 @@
       "platforms": "both",
       "examples": {
         "web": 5,
-        "native": 2
+        "native": 3
       },
       "dependencies": [
         "sonner@^2.0.8"
@@ -1969,6 +2351,24 @@
         "cn"
       ]
     },
+    {
+      "name": "tree-view",
+      "type": "primitive",
+      "title": "Tree view",
+      "summary": "A hierarchy the keyboard walks — the ARIA tree: one tab stop, the arrows move and open, a letter jumps, branches load on demand.",
+      "description": "A hierarchy the keyboard walks — the ARIA tree: one tab stop, the arrows move and open, a letter jumps, branches load on demand.",
+      "status": "beta",
+      "category": "navigation",
+      "platforms": "web",
+      "examples": {
+        "web": 2,
+        "native": 0
+      },
+      "dependencies": [
+        "tailwind-variants@^3.3.1"
+      ],
+      "registryDependencies": []
+    },
     {
       "name": "txt",
       "type": "native",
@@ -1985,6 +2385,22 @@
       "dependencies": [],
       "registryDependencies": []
     },
+    {
+      "name": "verified-badge",
+      "type": "primitive",
+      "title": "Verified badge",
+      "summary": "A seal that says the person or the account was verified (a selfie, an ID) — the accent, named in words.",
+      "description": "A seal that says the person or the account was verified (a selfie, an ID) — the accent, named in words.",
+      "status": "beta",
+      "category": "feedback",
+      "platforms": "both",
+      "examples": {
+        "web": 1,
+        "native": 1
+      },
+      "dependencies": [],
+      "registryDependencies": []
+    },
     {
       "name": "video-player",
       "type": "primitive",