@zappie/kit 0.1.4 → 0.1.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,11 @@
|
|
|
1
1
|
# @zappie/kit
|
|
2
2
|
|
|
3
|
+
## 0.1.5
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- 576a319: The cart button's accessible name now starts with its visible text. It used to be "Open cart, 2 items" while the button showed "Cart" and the subtotal, so people who use voice control couldn't say what they saw. The name is now the visible text followed by a visually hidden count, for example "Cart ₦4,500, 2 items". The `cart-button` registry item is 1.1.1. If your tests find the button by the name "Open cart", find it by "Cart" instead. A cart button you built yourself needs an accessible name that includes its visible text to pass `zappie verify`.
|
|
8
|
+
|
|
3
9
|
## 0.1.4
|
|
4
10
|
|
|
5
11
|
### Patch Changes
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":"2026-10-10","items":[{"name":"account-page","type":"block","version":"1.0.0","title":"Account page","description":"Show your profile and manage saved addresses."},{"name":"address-picker","type":"component","version":"1.0.0","title":"Address picker","description":"Find delivery addresses and show them on a map."},{"name":"cart-button","type":"component","version":"1.1.
|
|
1
|
+
{"version":"2026-10-10","items":[{"name":"account-page","type":"block","version":"1.0.0","title":"Account page","description":"Show your profile and manage saved addresses."},{"name":"address-picker","type":"component","version":"1.0.0","title":"Address picker","description":"Find delivery addresses and show them on a map."},{"name":"cart-button","type":"component","version":"1.1.1","title":"Cart button","description":"Open the cart from a floating or inline button with count and subtotal."},{"name":"cart-drawer","type":"component","version":"1.1.0","title":"Cart drawer","description":"Show cart lines, issues and totals in a responsive drawer."},{"name":"cart-line","type":"component","version":"1.0.0","title":"Cart line","description":"Show options and let shoppers change quantity or remove a line."},{"name":"category-nav","type":"component","version":"1.0.0","title":"Category navigation","description":"Navigate categories with tabs that follow scrolling."},{"name":"checkout-button","type":"component","version":"1.0.2","title":"Checkout button","description":"Open checkout with quote checks, safe retries and visit attribution."},{"name":"checkout-page","type":"block","version":"1.0.0","title":"Checkout page","description":"Collect contact and delivery details, resolve cart issues and continue to payment."},{"name":"checkout-return","type":"block","version":"1.0.0","title":"Checkout return","description":"Confirm payment and link to the completed order."},{"name":"consent","type":"component","version":"1.0.0","title":"Consent","description":"Save your privacy choice and withdraw consent when you choose."},{"name":"fulfilment-switch","type":"component","version":"1.0.0","title":"Fulfilment switch","description":"Choose pickup or delivery from the branch options."},{"name":"item-card","type":"component","version":"1.1.0","title":"Item card","description":"Show an item, its price, availability and cart feedback."},{"name":"item-sheet","type":"component","version":"1.0.0","title":"Item sheet","description":"Let shoppers configure an item, with optional v2 URL navigation."},{"name":"menu-page","type":"block","version":"1.0.0","title":"Menu page","description":"Combine the catalogue, item view and cart in your framework."},{"name":"money","type":"component","version":"1.0.0","title":"Money","description":"Format SDK money with your theme styles."},{"name":"open-status","type":"component","version":"1.0.0","title":"Open status","description":"Show whether a branch is open and when that changes."},{"name":"order-page","type":"block","version":"1.0.0","title":"Order page","description":"Show order progress and your support links."},{"name":"order-status","type":"component","version":"1.0.0","title":"Order status","description":"Show live order progress, items and totals."},{"name":"orders-page","type":"block","version":"1.0.0","title":"Orders page","description":"Browse your orders and load older orders."},{"name":"provider","type":"component","version":"1.0.0","title":"Zappie provider","description":"Create a storefront client and apply scoped tokens and fonts."},{"name":"quantity","type":"component","version":"1.0.0","title":"Quantity","description":"Adjust quantity within its limits."},{"name":"schedule-picker","type":"component","version":"1.0.0","title":"Schedule picker","description":"Choose ASAP or an available time for the cart."},{"name":"search","type":"component","version":"1.0.0","title":"Search","description":"Search the menu as shoppers type and discard outdated results."},{"name":"sign-in-button","type":"component","version":"1.0.0","title":"Sign-in button","description":"Show customer sign-in and sign-out controls."},{"name":"store-footer","type":"component","version":"1.0.0","title":"Store footer","description":"Show branch contacts, social links and your legal links."},{"name":"store-header","type":"component","version":"1.1.0","title":"Store header","description":"Show store details, opening status and fulfilment."}]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"$schema":"https://registry.zappie.ai/v1/schema/item.json","name":"cart-button","type":"component","version":"1.1.
|
|
1
|
+
{"$schema":"https://registry.zappie.ai/v1/schema/item.json","name":"cart-button","type":"component","version":"1.1.1","title":"Cart button","description":"Open the cart from a floating or inline button with count and subtotal.","requires":{"@zappie/sdk":"^0.1.0","@zappie/tokens":"^0.1.0"},"dependencies":{"lucide-react":"^0.546.0"},"registryDependencies":["money"],"files":[{"path":"cart-button.tsx","target":"components/zappie/cart-button.tsx","sha256":"c8e0c73c1383d39637a00fa67c05b96ab99ffe8bac78b2677fc9671b0d47fd4e","content":"\"use client\";\n\nimport { Money } from \"@/components/zappie/money\";\nimport { useCart } from \"@zappie/sdk/react\";\nimport { ShoppingBag } from \"lucide-react\";\nimport \"./cart-button.css\";\n\nexport type CartButtonProps = {\n onOpen: () => void;\n /** Called when the shopper reaches for the button, to start loading the cart's code. */\n onIntent?: () => void;\n variant?: \"floating\" | \"inline\";\n};\n\nexport function CartButton({\n onOpen,\n onIntent,\n variant = \"floating\",\n}: CartButtonProps) {\n const cart = useCart();\n return (\n <button\n type=\"button\"\n className=\"z-kit-cart-button\"\n data-variant={variant}\n data-zappie-cart-trigger=\"\"\n data-zappie-overlay-trigger=\"bag\"\n disabled={!cart.isHydrated}\n onClick={onOpen}\n onPointerEnter={onIntent}\n onPointerDown={onIntent}\n onFocus={onIntent}\n >\n <ShoppingBag aria-hidden=\"true\" />\n <span>Cart</span>\n <span aria-hidden=\"true\">{cart.count}</span>\n {cart.subtotal && <Money value={cart.subtotal} />}\n {/* The accessible name starts with the visible label, so voice control matches it (WCAG 2.5.3). */}\n <span className=\"z-kit-cart-button__hidden\">\n {`, ${cart.count} ${cart.count === 1 ? \"item\" : \"items\"}`}\n </span>\n </button>\n );\n}\n"},{"path":"cart-button.css","target":"components/zappie/cart-button.css","sha256":"1ee35ea1b85c7d96c5901885822749068123bf96a088f210c86c1e76c197320a","content":".z-kit-cart-button {\n display: inline-flex;\n align-items: center;\n gap: var(--z-space-2);\n border: 0;\n border-radius: var(--z-radius-pill);\n padding: var(--z-space-3) var(--z-space-5);\n background: var(--z-accent);\n color: var(--z-accent-contrast);\n font-family: var(--z-font-body);\n font-size: var(--z-text-md);\n cursor: pointer;\n}\n\n.z-kit-cart-button[data-variant=\"floating\"] {\n position: fixed;\n right: var(--z-space-4);\n bottom: var(--z-space-4);\n border: 1px solid var(--z-border);\n}\n\n.z-kit-cart-button:focus-visible {\n outline: 2px solid var(--z-focus-ring);\n outline-offset: 2px;\n}\n\n.z-kit-cart-button:disabled {\n background: var(--z-border);\n color: var(--z-text-muted);\n cursor: not-allowed;\n}\n\n.z-kit-cart-button svg {\n width: var(--z-text-lg);\n height: var(--z-text-lg);\n}\n\n.z-kit-cart-button__hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n overflow: hidden;\n clip-path: inset(50%);\n white-space: nowrap;\n}\n"}],"tokens":["--z-space-2","--z-space-3","--z-space-4","--z-space-5","--z-border","--z-radius-pill","--z-accent","--z-accent-contrast","--z-text-muted","--z-focus-ring","--z-font-body","--z-text-md","--z-text-lg"],"frameworks":["react-router","next","vite","astro-react"],"docs":"https://docs.zappie.ai/kit/cart-button"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"$schema":"https://registry.zappie.ai/v1/schema/item.json","name":"cart-button","type":"component","version":"1.1.1","title":"Cart button","description":"Open the cart from a floating or inline button with count and subtotal.","requires":{"@zappie/sdk":"^0.1.0","@zappie/tokens":"^0.1.0"},"dependencies":{"lucide-react":"^0.546.0"},"registryDependencies":["money"],"files":[{"path":"cart-button.tsx","target":"components/zappie/cart-button.tsx","sha256":"c8e0c73c1383d39637a00fa67c05b96ab99ffe8bac78b2677fc9671b0d47fd4e","content":"\"use client\";\n\nimport { Money } from \"@/components/zappie/money\";\nimport { useCart } from \"@zappie/sdk/react\";\nimport { ShoppingBag } from \"lucide-react\";\nimport \"./cart-button.css\";\n\nexport type CartButtonProps = {\n onOpen: () => void;\n /** Called when the shopper reaches for the button, to start loading the cart's code. */\n onIntent?: () => void;\n variant?: \"floating\" | \"inline\";\n};\n\nexport function CartButton({\n onOpen,\n onIntent,\n variant = \"floating\",\n}: CartButtonProps) {\n const cart = useCart();\n return (\n <button\n type=\"button\"\n className=\"z-kit-cart-button\"\n data-variant={variant}\n data-zappie-cart-trigger=\"\"\n data-zappie-overlay-trigger=\"bag\"\n disabled={!cart.isHydrated}\n onClick={onOpen}\n onPointerEnter={onIntent}\n onPointerDown={onIntent}\n onFocus={onIntent}\n >\n <ShoppingBag aria-hidden=\"true\" />\n <span>Cart</span>\n <span aria-hidden=\"true\">{cart.count}</span>\n {cart.subtotal && <Money value={cart.subtotal} />}\n {/* The accessible name starts with the visible label, so voice control matches it (WCAG 2.5.3). */}\n <span className=\"z-kit-cart-button__hidden\">\n {`, ${cart.count} ${cart.count === 1 ? \"item\" : \"items\"}`}\n </span>\n </button>\n );\n}\n"},{"path":"cart-button.css","target":"components/zappie/cart-button.css","sha256":"1ee35ea1b85c7d96c5901885822749068123bf96a088f210c86c1e76c197320a","content":".z-kit-cart-button {\n display: inline-flex;\n align-items: center;\n gap: var(--z-space-2);\n border: 0;\n border-radius: var(--z-radius-pill);\n padding: var(--z-space-3) var(--z-space-5);\n background: var(--z-accent);\n color: var(--z-accent-contrast);\n font-family: var(--z-font-body);\n font-size: var(--z-text-md);\n cursor: pointer;\n}\n\n.z-kit-cart-button[data-variant=\"floating\"] {\n position: fixed;\n right: var(--z-space-4);\n bottom: var(--z-space-4);\n border: 1px solid var(--z-border);\n}\n\n.z-kit-cart-button:focus-visible {\n outline: 2px solid var(--z-focus-ring);\n outline-offset: 2px;\n}\n\n.z-kit-cart-button:disabled {\n background: var(--z-border);\n color: var(--z-text-muted);\n cursor: not-allowed;\n}\n\n.z-kit-cart-button svg {\n width: var(--z-text-lg);\n height: var(--z-text-lg);\n}\n\n.z-kit-cart-button__hidden {\n position: absolute;\n width: 1px;\n height: 1px;\n overflow: hidden;\n clip-path: inset(50%);\n white-space: nowrap;\n}\n"}],"tokens":["--z-space-2","--z-space-3","--z-space-4","--z-space-5","--z-border","--z-radius-pill","--z-accent","--z-accent-contrast","--z-text-muted","--z-focus-ring","--z-font-body","--z-text-md","--z-text-lg"],"frameworks":["react-router","next","vite","astro-react"],"docs":"https://docs.zappie.ai/kit/cart-button"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zappie/kit",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.5",
|
|
4
4
|
"description": "The registry of copy-in Zappie storefront components, installed with the zappie CLI.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"repository": {
|
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
"directory": "packages/kit"
|
|
10
10
|
},
|
|
11
11
|
"devDependencies": {
|
|
12
|
-
"zod": "^4.6.
|
|
12
|
+
"zod": "^4.6.7"
|
|
13
13
|
},
|
|
14
14
|
"license": "MIT",
|
|
15
15
|
"homepage": "https://github.com/zappie/storefront#readme",
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"$schema":"https://registry.zappie.ai/v1/schema/item.json","name":"cart-button","type":"component","version":"1.1.0","title":"Cart button","description":"Open the cart from a floating or inline button with count and subtotal.","requires":{"@zappie/sdk":"^0.1.0","@zappie/tokens":"^0.1.0"},"dependencies":{"lucide-react":"^0.546.0"},"registryDependencies":["money"],"files":[{"path":"cart-button.tsx","target":"components/zappie/cart-button.tsx","sha256":"082c691b672dc1c6e4838980a3d6d62b8cb7d8320ad061862bf02288b33dadd7","content":"\"use client\";\n\nimport { Money } from \"@/components/zappie/money\";\nimport { useCart } from \"@zappie/sdk/react\";\nimport { ShoppingBag } from \"lucide-react\";\nimport \"./cart-button.css\";\n\nexport type CartButtonProps = {\n onOpen: () => void;\n /** Called when the shopper reaches for the button, to start loading the cart's code. */\n onIntent?: () => void;\n variant?: \"floating\" | \"inline\";\n};\n\nexport function CartButton({\n onOpen,\n onIntent,\n variant = \"floating\",\n}: CartButtonProps) {\n const cart = useCart();\n return (\n <button\n type=\"button\"\n className=\"z-kit-cart-button\"\n data-variant={variant}\n data-zappie-cart-trigger=\"\"\n data-zappie-overlay-trigger=\"bag\"\n aria-label={`Open cart, ${cart.count} ${cart.count === 1 ? \"item\" : \"items\"}`}\n disabled={!cart.isHydrated}\n onClick={onOpen}\n onPointerEnter={onIntent}\n onPointerDown={onIntent}\n onFocus={onIntent}\n >\n <ShoppingBag aria-hidden=\"true\" />\n <span>Cart</span>\n <span aria-hidden=\"true\">{cart.count}</span>\n {cart.subtotal && <Money value={cart.subtotal} />}\n </button>\n );\n}\n"},{"path":"cart-button.css","target":"components/zappie/cart-button.css","sha256":"0e6879dbab4158f6fd1979696663cdc7c80621867a90acf8a4040987bf3e9216","content":".z-kit-cart-button {\n display: inline-flex;\n align-items: center;\n gap: var(--z-space-2);\n border: 0;\n border-radius: var(--z-radius-pill);\n padding: var(--z-space-3) var(--z-space-5);\n background: var(--z-accent);\n color: var(--z-accent-contrast);\n font-family: var(--z-font-body);\n font-size: var(--z-text-md);\n cursor: pointer;\n}\n\n.z-kit-cart-button[data-variant=\"floating\"] {\n position: fixed;\n right: var(--z-space-4);\n bottom: var(--z-space-4);\n border: 1px solid var(--z-border);\n}\n\n.z-kit-cart-button:focus-visible {\n outline: 2px solid var(--z-focus-ring);\n outline-offset: 2px;\n}\n\n.z-kit-cart-button:disabled {\n background: var(--z-border);\n color: var(--z-text-muted);\n cursor: not-allowed;\n}\n\n.z-kit-cart-button svg {\n width: var(--z-text-lg);\n height: var(--z-text-lg);\n}\n"}],"tokens":["--z-space-2","--z-space-3","--z-space-4","--z-space-5","--z-border","--z-radius-pill","--z-accent","--z-accent-contrast","--z-text-muted","--z-focus-ring","--z-font-body","--z-text-md","--z-text-lg"],"frameworks":["react-router","next","vite","astro-react"],"docs":"https://docs.zappie.ai/kit/cart-button"}
|