@hanzo/ui 8.9.2 → 8.10.0
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/dist/backends/gui/breadcrumb.cjs +30 -0
- package/dist/backends/gui/breadcrumb.d.ts +32 -0
- package/dist/backends/gui/breadcrumb.d.ts.map +1 -0
- package/dist/backends/gui/breadcrumb.js +21 -0
- package/dist/backends/gui/breadcrumb.js.map +1 -0
- package/dist/backends/gui/button.d.ts +17 -3
- package/dist/backends/gui/button.d.ts.map +1 -1
- package/dist/backends/gui/button.js +1 -1
- package/dist/backends/gui/button.js.map +1 -1
- package/dist/backends/gui/card.d.ts +2 -1
- package/dist/backends/gui/card.d.ts.map +1 -1
- package/dist/backends/gui/card.js.map +1 -1
- package/dist/backends/gui/carousel.cjs +19 -5
- package/dist/backends/gui/carousel.d.ts +2 -0
- package/dist/backends/gui/carousel.d.ts.map +1 -1
- package/dist/backends/gui/carousel.js +19 -5
- package/dist/backends/gui/carousel.js.map +1 -1
- package/dist/backends/gui/drawer.cjs +183 -0
- package/dist/backends/gui/drawer.d.ts +49 -0
- package/dist/backends/gui/drawer.d.ts.map +1 -0
- package/dist/backends/gui/drawer.js +145 -0
- package/dist/backends/gui/drawer.js.map +1 -0
- package/dist/backends/gui/index.cjs +30 -1
- package/dist/backends/gui/index.d.ts +6 -0
- package/dist/backends/gui/index.d.ts.map +1 -1
- package/dist/backends/gui/index.js +6 -0
- package/dist/backends/gui/index.js.map +1 -1
- package/dist/backends/gui/input-otp.cjs +101 -0
- package/dist/backends/gui/input-otp.d.ts +37 -0
- package/dist/backends/gui/input-otp.d.ts.map +1 -0
- package/dist/backends/gui/input-otp.js +62 -0
- package/dist/backends/gui/input-otp.js.map +1 -0
- package/dist/backends/gui/link.cjs +3 -1
- package/dist/backends/gui/link.d.ts +7 -1
- package/dist/backends/gui/link.d.ts.map +1 -1
- package/dist/backends/gui/link.js +3 -1
- package/dist/backends/gui/link.js.map +1 -1
- package/dist/backends/gui/media-stack.cjs +4 -7
- package/dist/backends/gui/media-stack.d.ts.map +1 -1
- package/dist/backends/gui/media-stack.js +4 -7
- package/dist/backends/gui/media-stack.js.map +1 -1
- package/dist/backends/gui/microdata.cjs +2 -0
- package/dist/backends/gui/microdata.d.ts +24 -0
- package/dist/backends/gui/microdata.d.ts.map +1 -0
- package/dist/backends/gui/microdata.js +2 -0
- package/dist/backends/gui/microdata.js.map +1 -0
- package/dist/backends/gui/nav-items.cjs +13 -0
- package/dist/backends/gui/nav-items.d.ts +22 -0
- package/dist/backends/gui/nav-items.d.ts.map +1 -0
- package/dist/backends/gui/nav-items.js +10 -0
- package/dist/backends/gui/nav-items.js.map +1 -0
- package/dist/backends/gui/navigation-menu.cjs +97 -0
- package/dist/backends/gui/navigation-menu.d.ts +25 -0
- package/dist/backends/gui/navigation-menu.d.ts.map +1 -0
- package/dist/backends/gui/navigation-menu.js +55 -0
- package/dist/backends/gui/navigation-menu.js.map +1 -0
- package/dist/backends/gui/step-indicator.cjs +23 -0
- package/dist/backends/gui/step-indicator.d.ts +22 -0
- package/dist/backends/gui/step-indicator.d.ts.map +1 -0
- package/dist/backends/gui/step-indicator.js +20 -0
- package/dist/backends/gui/step-indicator.js.map +1 -0
- package/dist/backends/gui/toggle-group.cjs +1 -1
- package/dist/backends/gui/toggle-group.d.ts +56 -2
- package/dist/backends/gui/toggle-group.d.ts.map +1 -1
- package/dist/backends/gui/toggle-group.js +1 -1
- package/dist/backends/gui/toggle-group.js.map +1 -1
- package/dist/gallery.html +16 -2
- package/dist/index.cjs +26 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/index.node.js +1 -1
- package/dist/primitives/Breadcrumb.cjs +8 -0
- package/dist/primitives/Breadcrumb.d.ts +2 -0
- package/dist/primitives/Breadcrumb.d.ts.map +1 -0
- package/dist/primitives/Breadcrumb.js +5 -0
- package/dist/primitives/Breadcrumb.js.map +1 -0
- package/dist/primitives/BreadcrumbEllipsis.cjs +8 -0
- package/dist/primitives/BreadcrumbEllipsis.d.ts +2 -0
- package/dist/primitives/BreadcrumbEllipsis.d.ts.map +1 -0
- package/dist/primitives/BreadcrumbEllipsis.js +5 -0
- package/dist/primitives/BreadcrumbEllipsis.js.map +1 -0
- package/dist/primitives/BreadcrumbItem.cjs +8 -0
- package/dist/primitives/BreadcrumbItem.d.ts +2 -0
- package/dist/primitives/BreadcrumbItem.d.ts.map +1 -0
- package/dist/primitives/BreadcrumbItem.js +5 -0
- package/dist/primitives/BreadcrumbItem.js.map +1 -0
- package/dist/primitives/BreadcrumbLink.cjs +8 -0
- package/dist/primitives/BreadcrumbLink.d.ts +2 -0
- package/dist/primitives/BreadcrumbLink.d.ts.map +1 -0
- package/dist/primitives/BreadcrumbLink.js +5 -0
- package/dist/primitives/BreadcrumbLink.js.map +1 -0
- package/dist/primitives/BreadcrumbList.cjs +8 -0
- package/dist/primitives/BreadcrumbList.d.ts +2 -0
- package/dist/primitives/BreadcrumbList.d.ts.map +1 -0
- package/dist/primitives/BreadcrumbList.js +5 -0
- package/dist/primitives/BreadcrumbList.js.map +1 -0
- package/dist/primitives/BreadcrumbPage.cjs +8 -0
- package/dist/primitives/BreadcrumbPage.d.ts +2 -0
- package/dist/primitives/BreadcrumbPage.d.ts.map +1 -0
- package/dist/primitives/BreadcrumbPage.js +5 -0
- package/dist/primitives/BreadcrumbPage.js.map +1 -0
- package/dist/primitives/BreadcrumbSeparator.cjs +8 -0
- package/dist/primitives/BreadcrumbSeparator.d.ts +2 -0
- package/dist/primitives/BreadcrumbSeparator.d.ts.map +1 -0
- package/dist/primitives/BreadcrumbSeparator.js +5 -0
- package/dist/primitives/BreadcrumbSeparator.js.map +1 -0
- package/dist/primitives/Drawer.cjs +8 -0
- package/dist/primitives/Drawer.d.ts +2 -0
- package/dist/primitives/Drawer.d.ts.map +1 -0
- package/dist/primitives/Drawer.js +5 -0
- package/dist/primitives/Drawer.js.map +1 -0
- package/dist/primitives/DrawerContent.cjs +8 -0
- package/dist/primitives/DrawerContent.d.ts +2 -0
- package/dist/primitives/DrawerContent.d.ts.map +1 -0
- package/dist/primitives/DrawerContent.js +5 -0
- package/dist/primitives/DrawerContent.js.map +1 -0
- package/dist/primitives/DrawerHandle.cjs +8 -0
- package/dist/primitives/DrawerHandle.d.ts +2 -0
- package/dist/primitives/DrawerHandle.d.ts.map +1 -0
- package/dist/primitives/DrawerHandle.js +5 -0
- package/dist/primitives/DrawerHandle.js.map +1 -0
- package/dist/primitives/InputOTP.cjs +8 -0
- package/dist/primitives/InputOTP.d.ts +2 -0
- package/dist/primitives/InputOTP.d.ts.map +1 -0
- package/dist/primitives/InputOTP.js +5 -0
- package/dist/primitives/InputOTP.js.map +1 -0
- package/dist/primitives/InputOTPGroup.cjs +8 -0
- package/dist/primitives/InputOTPGroup.d.ts +2 -0
- package/dist/primitives/InputOTPGroup.d.ts.map +1 -0
- package/dist/primitives/InputOTPGroup.js +5 -0
- package/dist/primitives/InputOTPGroup.js.map +1 -0
- package/dist/primitives/InputOTPSeparator.cjs +8 -0
- package/dist/primitives/InputOTPSeparator.d.ts +2 -0
- package/dist/primitives/InputOTPSeparator.d.ts.map +1 -0
- package/dist/primitives/InputOTPSeparator.js +5 -0
- package/dist/primitives/InputOTPSeparator.js.map +1 -0
- package/dist/primitives/InputOTPSlot.cjs +8 -0
- package/dist/primitives/InputOTPSlot.d.ts +2 -0
- package/dist/primitives/InputOTPSlot.d.ts.map +1 -0
- package/dist/primitives/InputOTPSlot.js +5 -0
- package/dist/primitives/InputOTPSlot.js.map +1 -0
- package/dist/primitives/NavItems.cjs +8 -0
- package/dist/primitives/NavItems.d.ts +2 -0
- package/dist/primitives/NavItems.d.ts.map +1 -0
- package/dist/primitives/NavItems.js +5 -0
- package/dist/primitives/NavItems.js.map +1 -0
- package/dist/primitives/NavigationMenu.cjs +8 -0
- package/dist/primitives/NavigationMenu.d.ts +2 -0
- package/dist/primitives/NavigationMenu.d.ts.map +1 -0
- package/dist/primitives/NavigationMenu.js +5 -0
- package/dist/primitives/NavigationMenu.js.map +1 -0
- package/dist/primitives/NavigationMenuContent.cjs +8 -0
- package/dist/primitives/NavigationMenuContent.d.ts +2 -0
- package/dist/primitives/NavigationMenuContent.d.ts.map +1 -0
- package/dist/primitives/NavigationMenuContent.js +5 -0
- package/dist/primitives/NavigationMenuContent.js.map +1 -0
- package/dist/primitives/NavigationMenuItem.cjs +8 -0
- package/dist/primitives/NavigationMenuItem.d.ts +2 -0
- package/dist/primitives/NavigationMenuItem.d.ts.map +1 -0
- package/dist/primitives/NavigationMenuItem.js +5 -0
- package/dist/primitives/NavigationMenuItem.js.map +1 -0
- package/dist/primitives/NavigationMenuLink.cjs +8 -0
- package/dist/primitives/NavigationMenuLink.d.ts +2 -0
- package/dist/primitives/NavigationMenuLink.d.ts.map +1 -0
- package/dist/primitives/NavigationMenuLink.js +5 -0
- package/dist/primitives/NavigationMenuLink.js.map +1 -0
- package/dist/primitives/NavigationMenuList.cjs +8 -0
- package/dist/primitives/NavigationMenuList.d.ts +2 -0
- package/dist/primitives/NavigationMenuList.d.ts.map +1 -0
- package/dist/primitives/NavigationMenuList.js +5 -0
- package/dist/primitives/NavigationMenuList.js.map +1 -0
- package/dist/primitives/NavigationMenuTrigger.cjs +8 -0
- package/dist/primitives/NavigationMenuTrigger.d.ts +2 -0
- package/dist/primitives/NavigationMenuTrigger.d.ts.map +1 -0
- package/dist/primitives/NavigationMenuTrigger.js +5 -0
- package/dist/primitives/NavigationMenuTrigger.js.map +1 -0
- package/dist/primitives/StepIndicator.cjs +8 -0
- package/dist/primitives/StepIndicator.d.ts +2 -0
- package/dist/primitives/StepIndicator.d.ts.map +1 -0
- package/dist/primitives/StepIndicator.js +5 -0
- package/dist/primitives/StepIndicator.js.map +1 -0
- package/dist/primitives/navigationMenuTriggerStyle.cjs +8 -0
- package/dist/primitives/navigationMenuTriggerStyle.d.ts +2 -0
- package/dist/primitives/navigationMenuTriggerStyle.d.ts.map +1 -0
- package/dist/primitives/navigationMenuTriggerStyle.js +5 -0
- package/dist/primitives/navigationMenuTriggerStyle.js.map +1 -0
- package/dist/styles.css +15 -1
- package/dist/theme.css +15 -1
- package/dist/types.d.ts +9 -9
- package/dist/types.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
'use client';"use strict";
|
|
2
|
+
'use client';
|
|
3
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
+
exports.BreadcrumbEllipsis = exports.BreadcrumbSeparator = exports.BreadcrumbPage = exports.BreadcrumbLink = exports.BreadcrumbItem = exports.BreadcrumbList = exports.Breadcrumb = void 0;
|
|
5
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
6
|
+
const box_1 = require("../../box.cjs");
|
|
7
|
+
const cn_1 = require("../../core/cn.cjs");
|
|
8
|
+
const Breadcrumb = ({ className, ...props }) => ((0, jsx_runtime_1.jsx)(box_1.Box, { tag: "nav", "aria-label": "Breadcrumb", className: className, ...props }));
|
|
9
|
+
exports.Breadcrumb = Breadcrumb;
|
|
10
|
+
const BreadcrumbList = ({ className, ...props }) => ((0, jsx_runtime_1.jsx)(box_1.Box, { tag: "ol", className: (0, cn_1.cn)('grid grid-flow-col auto-cols-max items-center gap-1.5 text-sm text-muted-foreground', className), ...props }));
|
|
11
|
+
exports.BreadcrumbList = BreadcrumbList;
|
|
12
|
+
const BreadcrumbItem = ({ className, ...props }) => ((0, jsx_runtime_1.jsx)(box_1.Box, { tag: "li", className: (0, cn_1.cn)('grid grid-flow-col auto-cols-max items-center gap-1.5', className), ...props }));
|
|
13
|
+
exports.BreadcrumbItem = BreadcrumbItem;
|
|
14
|
+
/**
|
|
15
|
+
* A step in the trail.
|
|
16
|
+
*
|
|
17
|
+
* With no `href` it renders a span rather than an anchor: a step you cannot go
|
|
18
|
+
* to is not a link, and an anchor without a target is one a keyboard stops on
|
|
19
|
+
* for nothing.
|
|
20
|
+
*/
|
|
21
|
+
const BreadcrumbLink = ({ className, href, ...props }) => href ? ((0, jsx_runtime_1.jsx)(box_1.Box, { tag: "a", href: href, className: (0, cn_1.cn)('hover:text-foreground', className), ...props })) : ((0, jsx_runtime_1.jsx)(box_1.Box, { tag: "span", className: className, ...props }));
|
|
22
|
+
exports.BreadcrumbLink = BreadcrumbLink;
|
|
23
|
+
/** The step you are ON — not a link, and it says so. */
|
|
24
|
+
const BreadcrumbPage = ({ className, ...props }) => ((0, jsx_runtime_1.jsx)(box_1.Box, { tag: "span", role: "link", "aria-disabled": true, "aria-current": "page", className: (0, cn_1.cn)('text-foreground', className), ...props }));
|
|
25
|
+
exports.BreadcrumbPage = BreadcrumbPage;
|
|
26
|
+
const BreadcrumbSeparator = ({ children, className, ...props }) => ((0, jsx_runtime_1.jsx)(box_1.Box, { tag: "li", role: "presentation", "aria-hidden": "true", className: (0, cn_1.cn)('text-muted-foreground', className), ...props, children: children ?? '/' }));
|
|
27
|
+
exports.BreadcrumbSeparator = BreadcrumbSeparator;
|
|
28
|
+
/** A trail too long to show whole. `…` is one character and reads as "more". */
|
|
29
|
+
const BreadcrumbEllipsis = ({ className, ...props }) => ((0, jsx_runtime_1.jsx)(box_1.Box, { tag: "span", role: "presentation", "aria-hidden": "true", className: (0, cn_1.cn)('grid place-items-center', className), ...props, children: "\u2026" }));
|
|
30
|
+
exports.BreadcrumbEllipsis = BreadcrumbEllipsis;
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Breadcrumb — where you are, in a trail.
|
|
3
|
+
*
|
|
4
|
+
* A real `<nav>` around a real `<ol>`: the trail is ORDERED, and a screen
|
|
5
|
+
* reader announces "list, 4 items" and reads the position. Built out of divs it
|
|
6
|
+
* announces nothing, which is most of the point of a breadcrumb gone.
|
|
7
|
+
*
|
|
8
|
+
* The separators are `aria-hidden` and outside the items, because a slash is
|
|
9
|
+
* punctuation, not a step — a reader that voices them says "home slash shop
|
|
10
|
+
* slash bag" instead of counting.
|
|
11
|
+
*/
|
|
12
|
+
import * as React from 'react';
|
|
13
|
+
import { Box, type BoxProps } from '../../box.js';
|
|
14
|
+
export declare const Breadcrumb: ({ className, ...props }: React.ComponentProps<typeof Box>) => import("react/jsx-runtime").JSX.Element;
|
|
15
|
+
export declare const BreadcrumbList: ({ className, ...props }: React.ComponentProps<typeof Box>) => import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
export declare const BreadcrumbItem: ({ className, ...props }: React.ComponentProps<typeof Box>) => import("react/jsx-runtime").JSX.Element;
|
|
17
|
+
/**
|
|
18
|
+
* A step in the trail.
|
|
19
|
+
*
|
|
20
|
+
* With no `href` it renders a span rather than an anchor: a step you cannot go
|
|
21
|
+
* to is not a link, and an anchor without a target is one a keyboard stops on
|
|
22
|
+
* for nothing.
|
|
23
|
+
*/
|
|
24
|
+
export declare const BreadcrumbLink: ({ className, href, ...props }: BoxProps<'a'> & {
|
|
25
|
+
href?: string;
|
|
26
|
+
}) => import("react/jsx-runtime").JSX.Element;
|
|
27
|
+
/** The step you are ON — not a link, and it says so. */
|
|
28
|
+
export declare const BreadcrumbPage: ({ className, ...props }: BoxProps<'span'>) => import("react/jsx-runtime").JSX.Element;
|
|
29
|
+
export declare const BreadcrumbSeparator: ({ children, className, ...props }: React.ComponentProps<typeof Box>) => import("react/jsx-runtime").JSX.Element;
|
|
30
|
+
/** A trail too long to show whole. `…` is one character and reads as "more". */
|
|
31
|
+
export declare const BreadcrumbEllipsis: ({ className, ...props }: React.ComponentProps<typeof Box>) => import("react/jsx-runtime").JSX.Element;
|
|
32
|
+
//# sourceMappingURL=breadcrumb.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"breadcrumb.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/breadcrumb.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;GAUG;AACH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,GAAG,EAAE,KAAK,QAAQ,EAAE,MAAM,WAAW,CAAA;AAG9C,eAAO,MAAM,UAAU,4BAA6B,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,4CAEnF,CAAA;AAED,eAAO,MAAM,cAAc,4BAA6B,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,4CASvF,CAAA;AAED,eAAO,MAAM,cAAc,4BAA6B,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,4CAMvF,CAAA;AAED;;;;;;GAMG;AACH,eAAO,MAAM,cAAc,kCAIxB,QAAQ,CAAC,GAAG,CAAC,GAAG;IAAE,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,4CAKjC,CAAA;AAEH,wDAAwD;AACxD,eAAO,MAAM,cAAc,4BAA6B,QAAQ,CAAC,MAAM,CAAC,4CASvE,CAAA;AAED,eAAO,MAAM,mBAAmB,sCAI7B,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,4CAUlC,CAAA;AAED,gFAAgF;AAChF,eAAO,MAAM,kBAAkB,4BAA6B,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,4CAU3F,CAAA"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import { Box } from '../../box.js';
|
|
4
|
+
import { cn } from '../../core/cn.js';
|
|
5
|
+
export const Breadcrumb = ({ className, ...props }) => (_jsx(Box, { tag: "nav", "aria-label": "Breadcrumb", className: className, ...props }));
|
|
6
|
+
export const BreadcrumbList = ({ className, ...props }) => (_jsx(Box, { tag: "ol", className: cn('grid grid-flow-col auto-cols-max items-center gap-1.5 text-sm text-muted-foreground', className), ...props }));
|
|
7
|
+
export const BreadcrumbItem = ({ className, ...props }) => (_jsx(Box, { tag: "li", className: cn('grid grid-flow-col auto-cols-max items-center gap-1.5', className), ...props }));
|
|
8
|
+
/**
|
|
9
|
+
* A step in the trail.
|
|
10
|
+
*
|
|
11
|
+
* With no `href` it renders a span rather than an anchor: a step you cannot go
|
|
12
|
+
* to is not a link, and an anchor without a target is one a keyboard stops on
|
|
13
|
+
* for nothing.
|
|
14
|
+
*/
|
|
15
|
+
export const BreadcrumbLink = ({ className, href, ...props }) => href ? (_jsx(Box, { tag: "a", href: href, className: cn('hover:text-foreground', className), ...props })) : (_jsx(Box, { tag: "span", className: className, ...props }));
|
|
16
|
+
/** The step you are ON — not a link, and it says so. */
|
|
17
|
+
export const BreadcrumbPage = ({ className, ...props }) => (_jsx(Box, { tag: "span", role: "link", "aria-disabled": true, "aria-current": "page", className: cn('text-foreground', className), ...props }));
|
|
18
|
+
export const BreadcrumbSeparator = ({ children, className, ...props }) => (_jsx(Box, { tag: "li", role: "presentation", "aria-hidden": "true", className: cn('text-muted-foreground', className), ...props, children: children ?? '/' }));
|
|
19
|
+
/** A trail too long to show whole. `…` is one character and reads as "more". */
|
|
20
|
+
export const BreadcrumbEllipsis = ({ className, ...props }) => (_jsx(Box, { tag: "span", role: "presentation", "aria-hidden": "true", className: cn('grid place-items-center', className), ...props, children: "\u2026" }));
|
|
21
|
+
//# sourceMappingURL=breadcrumb.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"breadcrumb.js","sourceRoot":"","sources":["../../../src/backends/gui/breadcrumb.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAeZ,OAAO,EAAE,GAAG,EAAiB,MAAM,WAAW,CAAA;AAC9C,OAAO,EAAE,EAAE,EAAE,MAAM,eAAe,CAAA;AAElC,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAoC,EAAE,EAAE,CAAC,CACvF,KAAC,GAAG,IAAC,GAAG,EAAC,KAAK,gBAAY,YAAY,EAAC,SAAS,EAAE,SAAS,KAAM,KAAK,GAAI,CAC3E,CAAA;AAED,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAoC,EAAE,EAAE,CAAC,CAC3F,KAAC,GAAG,IACF,GAAG,EAAC,IAAI,EACR,SAAS,EAAE,EAAE,CACX,qFAAqF,EACrF,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAA;AAED,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAoC,EAAE,EAAE,CAAC,CAC3F,KAAC,GAAG,IACF,GAAG,EAAC,IAAI,EACR,SAAS,EAAE,EAAE,CAAC,uDAAuD,EAAE,SAAS,CAAC,KAC7E,KAAK,GACT,CACH,CAAA;AAED;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAC7B,SAAS,EACT,IAAI,EACJ,GAAG,KAAK,EAC0B,EAAE,EAAE,CACtC,IAAI,CAAC,CAAC,CAAC,CACL,KAAC,GAAG,IAAC,GAAG,EAAC,GAAG,EAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,CAAC,uBAAuB,EAAE,SAAS,CAAC,KAAM,KAAK,GAAI,CAC1F,CAAC,CAAC,CAAC,CACF,KAAC,GAAG,IAAC,GAAG,EAAC,MAAM,EAAC,SAAS,EAAE,SAAS,KAAM,KAAK,GAAI,CACpD,CAAA;AAEH,wDAAwD;AACxD,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAoB,EAAE,EAAE,CAAC,CAC3E,KAAC,GAAG,IACF,GAAG,EAAC,MAAM,EACV,IAAI,EAAC,MAAM,mBACI,IAAI,kBACN,MAAM,EACnB,SAAS,EAAE,EAAE,CAAC,iBAAiB,EAAE,SAAS,CAAC,KACvC,KAAK,GACT,CACH,CAAA;AAED,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,EAClC,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACyB,EAAE,EAAE,CAAC,CACtC,KAAC,GAAG,IACF,GAAG,EAAC,IAAI,EACR,IAAI,EAAC,cAAc,iBACP,MAAM,EAClB,SAAS,EAAE,EAAE,CAAC,uBAAuB,EAAE,SAAS,CAAC,KAC7C,KAAK,YAER,QAAQ,IAAI,GAAG,GACZ,CACP,CAAA;AAED,gFAAgF;AAChF,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAoC,EAAE,EAAE,CAAC,CAC/F,KAAC,GAAG,IACF,GAAG,EAAC,MAAM,EACV,IAAI,EAAC,cAAc,iBACP,MAAM,EAClB,SAAS,EAAE,EAAE,CAAC,yBAAyB,EAAE,SAAS,CAAC,KAC/C,KAAK,uBAGL,CACP,CAAA"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import { type ComponentProps, type ReactNode } from 'react';
|
|
1
|
+
import { type ComponentProps, type MouseEventHandler, type ReactNode } from 'react';
|
|
2
|
+
import type { Microdata } from './microdata.js';
|
|
2
3
|
export type ButtonVariant = 'default' | 'destructive' | 'outline' | 'secondary' | 'ghost' | 'link' | 'primary' | 'linkFG' | 'linkMuted';
|
|
3
4
|
export type ButtonSize = 'default' | 'sm' | 'lg' | 'icon' | 'icon-sm' | 'icon-lg';
|
|
4
5
|
declare const Frame: import("@hanzogui/web").GuiComponent<import("@hanzogui/web").TamaDefer, import("@hanzogui/web").GuiElement, import("@hanzogui/web").StackNonStyleProps, import("@hanzogui/web").StackStyleBase, {
|
|
@@ -19,11 +20,24 @@ export declare const buttonVariants: ({ variant, size, className, }?: {
|
|
|
19
20
|
size?: ButtonSize | null;
|
|
20
21
|
className?: string;
|
|
21
22
|
}) => string;
|
|
22
|
-
export type ButtonProps = Omit<ComponentProps<typeof Frame>, 'variant' | 'size' | 'children'> & {
|
|
23
|
+
export type ButtonProps = Omit<ComponentProps<typeof Frame>, 'variant' | 'size' | 'children' | 'onClick'> & {
|
|
23
24
|
variant?: ButtonVariant | null;
|
|
24
25
|
size?: ButtonSize | null;
|
|
25
26
|
isLoading?: boolean;
|
|
26
27
|
children?: ReactNode;
|
|
28
|
+
/**
|
|
29
|
+
* The DOM click. Frame types this from the cross-platform stack, where the
|
|
30
|
+
* event carries `currentTarget: number | ReactNativeElement` — so a handler
|
|
31
|
+
* written the way every web caller writes it, `(e: React.MouseEvent) => …`,
|
|
32
|
+
* is a type error on a prop that works perfectly.
|
|
33
|
+
*
|
|
34
|
+
* On web the handler IS a DOM handler: props spread onto Frame, which renders
|
|
35
|
+
* a real <button>, and React hands it a MouseEvent. Declaring what actually
|
|
36
|
+
* arrives is the same trade as `title` below, and for the same reason — the
|
|
37
|
+
* alternative is call sites re-declaring the component as `any`, which hides
|
|
38
|
+
* every real error in the file along with this one.
|
|
39
|
+
*/
|
|
40
|
+
onClick?: MouseEventHandler<HTMLElement>;
|
|
27
41
|
/**
|
|
28
42
|
* The DOM tooltip. Already reached the element -- every unrecognised prop is
|
|
29
43
|
* spread onto Frame, which forwards it -- but the Frame's props come from the
|
|
@@ -43,7 +57,7 @@ export type ButtonProps = Omit<ComponentProps<typeof Frame>, 'variant' | 'size'
|
|
|
43
57
|
* rather than a lost attribute. Reaches the element the same way title does.
|
|
44
58
|
*/
|
|
45
59
|
type?: 'button' | 'submit' | 'reset';
|
|
46
|
-
};
|
|
60
|
+
} & Microdata;
|
|
47
61
|
declare function Button({ className, variant, size, asChild, isLoading, disabled, children, ...props }: ButtonProps): import("react/jsx-runtime").JSX.Element;
|
|
48
62
|
export { Button };
|
|
49
63
|
//# sourceMappingURL=button.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/button.tsx"],"names":[],"mappings":"AAyBA,OAAO,
|
|
1
|
+
{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/button.tsx"],"names":[],"mappings":"AAyBA,OAAO,EAGL,KAAK,cAAc,EACnB,KAAK,iBAAiB,EACtB,KAAK,SAAS,EACf,MAAM,OAAO,CAAA;AAEd,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AAI5C,MAAM,MAAM,aAAa,GACrB,SAAS,GACT,aAAa,GACb,SAAS,GACT,WAAW,GACX,OAAO,GACP,MAAM,GACN,SAAS,GACT,QAAQ,GACR,WAAW,CAAA;AAEf,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,CAAA;AAiCjF,QAAA,MAAM,KAAK;;;;;;;;8CA6FT,CAAA;AAEF;;;GAGG;AACH,eAAO,MAAM,cAAc,mCAIxB;IAAE,OAAO,CAAC,EAAE,aAAa,GAAG,IAAI,CAAC;IAAC,IAAI,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,WAKrE,CAAA;AAEd,MAAM,MAAM,WAAW,GAAG,IAAI,CAC5B,cAAc,CAAC,OAAO,KAAK,CAAC,EAC5B,SAAS,GAAG,MAAM,GAAG,UAAU,GAAG,SAAS,CAC5C,GAAG;IACF,OAAO,CAAC,EAAE,aAAa,GAAG,IAAI,CAAA;IAC9B,IAAI,CAAC,EAAE,UAAU,GAAG,IAAI,CAAA;IACxB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB;;;;;;;;;;;OAWG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC,WAAW,CAAC,CAAA;IACxC;;;;;;;;;;OAUG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;;;;OAKG;IACH,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAA;CACrC,GAAG,SAAS,CAAA;AAEb,iBAAS,MAAM,CAAC,EACd,SAAS,EACT,OAAmB,EACnB,IAAgB,EAChB,OAAe,EACf,SAAiB,EACjB,QAAQ,EACR,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,WAAW,2CAgDb;AAED,OAAO,EAAE,MAAM,EAAE,CAAA"}
|
|
@@ -23,7 +23,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
23
23
|
* as well as native — visual density stays at 36/32/40px.
|
|
24
24
|
*/
|
|
25
25
|
import { Button as GuiButton, Spinner, styled } from '@hanzo/gui';
|
|
26
|
-
import { createElement, isValidElement } from 'react';
|
|
26
|
+
import { createElement, isValidElement, } from 'react';
|
|
27
27
|
import { ink } from './ink.js';
|
|
28
28
|
import { touch } from './gesture.js';
|
|
29
29
|
const HEIGHT = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../src/backends/gui/button.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AACjE,OAAO,
|
|
1
|
+
{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../src/backends/gui/button.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import type { ComponentProps } from 'react';
|
|
2
2
|
import { type AspectRatioProps } from './aspect-ratio.js';
|
|
3
|
+
import type { Microdata } from './microdata.js';
|
|
3
4
|
declare const CardFrame: import("@hanzogui/web").GuiComponent<import("@hanzogui/web").TamaDefer, import("@hanzogui/web").GuiElement, import("@hanzogui/core").RNGuiViewNonStyleProps, import("@hanzogui/web").StackStyleBase, {
|
|
4
5
|
elevation?: number | import("@hanzogui/web").SizeTokens | undefined;
|
|
5
6
|
fullscreen?: boolean | undefined;
|
|
@@ -39,7 +40,7 @@ export type CardProps = ComponentProps<typeof CardFrame> & {
|
|
|
39
40
|
* it.
|
|
40
41
|
*/
|
|
41
42
|
interactive?: boolean;
|
|
42
|
-
};
|
|
43
|
+
} & Microdata;
|
|
43
44
|
export type CardHeaderProps = ComponentProps<typeof HeaderFrame>;
|
|
44
45
|
export type CardTitleProps = ComponentProps<typeof TitleFrame>;
|
|
45
46
|
export type CardDescriptionProps = ComponentProps<typeof DescriptionFrame>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/card.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAC3C,OAAO,EAAe,KAAK,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;
|
|
1
|
+
{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/card.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAC3C,OAAO,EAAe,KAAK,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AAGnE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,aAAa,CAAA;AAI5C,QAAA,MAAM,SAAS;;;8CAQb,CAAA;AASF,QAAA,MAAM,WAAW;;;8CAKf,CAAA;AAEF,QAAA,MAAM,UAAU;;;8CAA4E,CAAA;AAC5F,QAAA,MAAM,gBAAgB;;;8CAAgF,CAAA;AACtG,QAAA,MAAM,WAAW;;;8CAAsE,CAAA;AACvF,QAAA,MAAM,YAAY;;;8CAAmD,CAAA;AACrE,QAAA,MAAM,WAAW;;;8CAAmE,CAAA;AAEpF,MAAM,MAAM,SAAS,GAAG,cAAc,CAAC,OAAO,SAAS,CAAC,GAAG;IACzD;;;;;;;;OAQG;IACH,WAAW,CAAC,EAAE,OAAO,CAAA;CACtB,GAAG,SAAS,CAAA;AACb,MAAM,MAAM,eAAe,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,CAAA;AAChE,MAAM,MAAM,cAAc,GAAG,cAAc,CAAC,OAAO,UAAU,CAAC,CAAA;AAC9D,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAAC,OAAO,gBAAgB,CAAC,CAAA;AAC1E,MAAM,MAAM,eAAe,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,CAAA;AAChE,MAAM,MAAM,gBAAgB,GAAG,cAAc,CAAC,OAAO,YAAY,CAAC,CAAA;AAClE,MAAM,MAAM,eAAe,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,CAAA;AAEhE,QAAA,MAAM,IAAI,mCAAoC,SAAS,4CAuBtD,CAAA;AACD,QAAA,MAAM,UAAU,MAAO,eAAe,4CAAoD,CAAA;AAC1F,QAAA,MAAM,SAAS,MAAO,cAAc,4CAAkD,CAAA;AACtF,QAAA,MAAM,eAAe,MAAO,oBAAoB,4CAA8D,CAAA;AAC9G,QAAA,MAAM,UAAU,MAAO,eAAe,4CAAoD,CAAA;AAC1F,QAAA,MAAM,WAAW,uBAAwB,gBAAgB,4CAExD,CAAA;AACD,QAAA,MAAM,UAAU,uBAAwB,eAAe,4CAEtD,CAAA;AAED;;;;;;;;;;;;GAYG;AACH,MAAM,MAAM,cAAc,GAAG,gBAAgB,CAAA;AAC7C,QAAA,MAAM,SAAS,oBAA+B,cAAc,4CAE3D,CAAA;AAED;;;;;;;;;GASG;AACH,QAAA,MAAM,aAAa;;;;;;;;CAQjB,CAAA;AAEF,OAAO,EACL,aAAa,IAAI,IAAI,EACrB,UAAU,EACV,UAAU,EACV,SAAS,EACT,UAAU,EACV,eAAe,EACf,WAAW,EACX,SAAS,GACV,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"card.js","sourceRoot":"","sources":["../../../src/backends/gui/card.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ;;;;;GAKG;AACH,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,oBAAoB,EAAE,MAAM,YAAY,CAAA;AAEtF,OAAO,EAAE,WAAW,EAAyB,MAAM,gBAAgB,CAAA;AACnE,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA;AAC3B,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;
|
|
1
|
+
{"version":3,"file":"card.js","sourceRoot":"","sources":["../../../src/backends/gui/card.tsx"],"names":[],"mappings":"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"}
|
|
@@ -62,6 +62,14 @@ const cn_1 = require("../../core/cn.cjs");
|
|
|
62
62
|
const sx_1 = require("../../sx.cjs");
|
|
63
63
|
const button_1 = require("./button.cjs");
|
|
64
64
|
const slides = (el) => Array.from(el.children);
|
|
65
|
+
/**
|
|
66
|
+
* Put slide `k` in the middle of scroller `el`.
|
|
67
|
+
*
|
|
68
|
+
* By setting scrollLeft rather than calling `scrollIntoView`, which also scrolls
|
|
69
|
+
* every ancestor — that would jump the PAGE to bring a carousel deep in a
|
|
70
|
+
* document into view.
|
|
71
|
+
*/
|
|
72
|
+
const center = (el, k, behavior) => el.scrollTo({ left: k.offsetLeft - (el.clientWidth - k.offsetWidth) / 2, behavior });
|
|
65
73
|
/**
|
|
66
74
|
* The slide whose centre is nearest the scroller's.
|
|
67
75
|
*
|
|
@@ -122,11 +130,7 @@ const Carousel = ({ options, setApi, onCarouselSelect, className, children, ...p
|
|
|
122
130
|
if (!n)
|
|
123
131
|
return;
|
|
124
132
|
const i = loop ? ((index % n) + n) % n : Math.max(0, Math.min(n - 1, index));
|
|
125
|
-
|
|
126
|
-
// Centre it by setting scrollLeft rather than calling scrollIntoView,
|
|
127
|
-
// which also scrolls every ancestor and would jump the PAGE to bring a
|
|
128
|
-
// carousel deep in a document into view.
|
|
129
|
-
e.scrollTo({ left: k.offsetLeft - (e.clientWidth - k.offsetWidth) / 2, behavior: 'smooth' });
|
|
133
|
+
center(e, kids[i], 'smooth');
|
|
130
134
|
};
|
|
131
135
|
api.current = {
|
|
132
136
|
scrollTo: go,
|
|
@@ -152,6 +156,16 @@ const Carousel = ({ options, setApi, onCarouselSelect, className, children, ...p
|
|
|
152
156
|
const e = scroller.current;
|
|
153
157
|
if (!e)
|
|
154
158
|
return;
|
|
159
|
+
// Where it opens. Instant rather than smooth — this is the carousel's
|
|
160
|
+
// starting position, and animating to it from slide one reads as the page
|
|
161
|
+
// scrolling on its own the moment it loads.
|
|
162
|
+
const start = options?.startIndex;
|
|
163
|
+
if (start) {
|
|
164
|
+
const kids = slides(e);
|
|
165
|
+
const k = kids[Math.max(0, Math.min(kids.length - 1, start))];
|
|
166
|
+
if (k)
|
|
167
|
+
center(e, k, 'auto');
|
|
168
|
+
}
|
|
155
169
|
// Where we already are. Published WITHOUT announcing: a carousel that fires
|
|
156
170
|
// its select handler on mount tells a page the user chose the first slide
|
|
157
171
|
// when all they did was load it — and in a shop that is a selected sku.
|
|
@@ -23,6 +23,8 @@ import { Button } from './button.js';
|
|
|
23
23
|
export type CarouselOptions = {
|
|
24
24
|
/** Past the last slide, go to the first — and the reverse. */
|
|
25
25
|
loop?: boolean;
|
|
26
|
+
/** The slide it opens on. Default 0. */
|
|
27
|
+
startIndex?: number;
|
|
26
28
|
};
|
|
27
29
|
/** What a caller can ask of a mounted carousel. */
|
|
28
30
|
export type CarouselApi = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"carousel.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/carousel.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;GAkBG;AACH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,EAAE,GAAG,EAAE,MAAM,WAAW,CAAA;AAG/B,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAEjC,MAAM,MAAM,eAAe,GAAG;IAC5B,8DAA8D;IAC9D,IAAI,CAAC,EAAE,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"carousel.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/carousel.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;GAkBG;AACH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,EAAE,GAAG,EAAE,MAAM,WAAW,CAAA;AAG/B,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAEjC,MAAM,MAAM,eAAe,GAAG;IAC5B,8DAA8D;IAC9D,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,wCAAwC;IACxC,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB,CAAA;AAED,mDAAmD;AACnD,MAAM,MAAM,WAAW,GAAG;IACxB,uEAAuE;IACvE,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACjC,UAAU,EAAE,MAAM,IAAI,CAAA;IACtB,UAAU,EAAE,MAAM,IAAI,CAAA;IACtB,+DAA+D;IAC/D,kBAAkB,EAAE,MAAM,MAAM,CAAA;IAChC,aAAa,EAAE,MAAM,OAAO,CAAA;IAC5B,aAAa,EAAE,MAAM,OAAO,CAAA;IAC5B,UAAU,EAAE,MAAM,MAAM,CAAA;CACzB,CAAA;AA0DD,MAAM,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,EAAE,UAAU,CAAC,GAAG;IAC/E,OAAO,CAAC,EAAE,eAAe,CAAA;IACzB,qCAAqC;IACrC,MAAM,CAAC,EAAE,CAAC,GAAG,EAAE,WAAW,KAAK,IAAI,CAAA;IACnC,2DAA2D;IAC3D,gBAAgB,CAAC,EAAE,CAAC,GAAG,EAAE,WAAW,KAAK,IAAI,CAAA;CAC9C,CAAA;AAED,eAAO,MAAM,QAAQ,yEAOlB,aAAa,4CAyGf,CAAA;AAED;;;;;;GAMG;AACH,eAAO,MAAM,eAAe,4BAA6B,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,4CAexF,CAAA;AAED,eAAO,MAAM,YAAY,4BAA6B,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,4CAQrF,CAAA;AAED,KAAK,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,MAAM,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC,CAAA;AA+ClF,eAAO,MAAM,gBAAgB;8BAhCa,UAAU;;CAsCnD,CAAA;AAED,eAAO,MAAM,YAAY;8BAxCiB,UAAU;;CA8CnD,CAAA"}
|
|
@@ -26,6 +26,14 @@ import { cn } from '../../core/cn.js';
|
|
|
26
26
|
import { sx } from '../../sx.js';
|
|
27
27
|
import { Button } from './button.js';
|
|
28
28
|
const slides = (el) => Array.from(el.children);
|
|
29
|
+
/**
|
|
30
|
+
* Put slide `k` in the middle of scroller `el`.
|
|
31
|
+
*
|
|
32
|
+
* By setting scrollLeft rather than calling `scrollIntoView`, which also scrolls
|
|
33
|
+
* every ancestor — that would jump the PAGE to bring a carousel deep in a
|
|
34
|
+
* document into view.
|
|
35
|
+
*/
|
|
36
|
+
const center = (el, k, behavior) => el.scrollTo({ left: k.offsetLeft - (el.clientWidth - k.offsetWidth) / 2, behavior });
|
|
29
37
|
/**
|
|
30
38
|
* The slide whose centre is nearest the scroller's.
|
|
31
39
|
*
|
|
@@ -86,11 +94,7 @@ export const Carousel = ({ options, setApi, onCarouselSelect, className, childre
|
|
|
86
94
|
if (!n)
|
|
87
95
|
return;
|
|
88
96
|
const i = loop ? ((index % n) + n) % n : Math.max(0, Math.min(n - 1, index));
|
|
89
|
-
|
|
90
|
-
// Centre it by setting scrollLeft rather than calling scrollIntoView,
|
|
91
|
-
// which also scrolls every ancestor and would jump the PAGE to bring a
|
|
92
|
-
// carousel deep in a document into view.
|
|
93
|
-
e.scrollTo({ left: k.offsetLeft - (e.clientWidth - k.offsetWidth) / 2, behavior: 'smooth' });
|
|
97
|
+
center(e, kids[i], 'smooth');
|
|
94
98
|
};
|
|
95
99
|
api.current = {
|
|
96
100
|
scrollTo: go,
|
|
@@ -116,6 +120,16 @@ export const Carousel = ({ options, setApi, onCarouselSelect, className, childre
|
|
|
116
120
|
const e = scroller.current;
|
|
117
121
|
if (!e)
|
|
118
122
|
return;
|
|
123
|
+
// Where it opens. Instant rather than smooth — this is the carousel's
|
|
124
|
+
// starting position, and animating to it from slide one reads as the page
|
|
125
|
+
// scrolling on its own the moment it loads.
|
|
126
|
+
const start = options?.startIndex;
|
|
127
|
+
if (start) {
|
|
128
|
+
const kids = slides(e);
|
|
129
|
+
const k = kids[Math.max(0, Math.min(kids.length - 1, start))];
|
|
130
|
+
if (k)
|
|
131
|
+
center(e, k, 'auto');
|
|
132
|
+
}
|
|
119
133
|
// Where we already are. Published WITHOUT announcing: a carousel that fires
|
|
120
134
|
// its select handler on mount tells a page the user chose the first slide
|
|
121
135
|
// when all they did was load it — and in a shop that is a selected sku.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"carousel.js","sourceRoot":"","sources":["../../../src/backends/gui/carousel.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ;;;;;;;;;;;;;;;;;;GAkBG;AACH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAEpE,OAAO,EAAE,GAAG,EAAE,MAAM,WAAW,CAAA;AAC/B,OAAO,EAAE,EAAE,EAAE,MAAM,eAAe,CAAA;AAClC,OAAO,EAAE,EAAE,EAAE,MAAM,UAAU,CAAA;AAC7B,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;
|
|
1
|
+
{"version":3,"file":"carousel.js","sourceRoot":"","sources":["../../../src/backends/gui/carousel.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,183 @@
|
|
|
1
|
+
'use client';"use strict";
|
|
2
|
+
'use client';
|
|
3
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
4
|
+
if (k2 === undefined) k2 = k;
|
|
5
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
6
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
7
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
8
|
+
}
|
|
9
|
+
Object.defineProperty(o, k2, desc);
|
|
10
|
+
}) : (function(o, m, k, k2) {
|
|
11
|
+
if (k2 === undefined) k2 = k;
|
|
12
|
+
o[k2] = m[k];
|
|
13
|
+
}));
|
|
14
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
15
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
16
|
+
}) : function(o, v) {
|
|
17
|
+
o["default"] = v;
|
|
18
|
+
});
|
|
19
|
+
var __importStar = (this && this.__importStar) || (function () {
|
|
20
|
+
var ownKeys = function(o) {
|
|
21
|
+
ownKeys = Object.getOwnPropertyNames || function (o) {
|
|
22
|
+
var ar = [];
|
|
23
|
+
for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
|
|
24
|
+
return ar;
|
|
25
|
+
};
|
|
26
|
+
return ownKeys(o);
|
|
27
|
+
};
|
|
28
|
+
return function (mod) {
|
|
29
|
+
if (mod && mod.__esModule) return mod;
|
|
30
|
+
var result = {};
|
|
31
|
+
if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
|
|
32
|
+
__setModuleDefault(result, mod);
|
|
33
|
+
return result;
|
|
34
|
+
};
|
|
35
|
+
})();
|
|
36
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
37
|
+
exports.DrawerContent = exports.DrawerHandle = exports.Drawer = void 0;
|
|
38
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
39
|
+
/**
|
|
40
|
+
* Drawer — a sheet that comes up from the bottom and rests at chosen heights.
|
|
41
|
+
*
|
|
42
|
+
* A snap point IS a height: `'72px'` for a peek, `'620px'` for the whole thing,
|
|
43
|
+
* or a number for a fraction of the viewport. The sheet is always rendered at
|
|
44
|
+
* its TALLEST point and slid down to the active one, so its content has a
|
|
45
|
+
* stable box and does not reflow every time it moves — a cart that re-lays-out
|
|
46
|
+
* mid-drag is the thing this shape is avoiding.
|
|
47
|
+
*
|
|
48
|
+
* Dragging moves that same offset, so the release is a straight question: which
|
|
49
|
+
* point is the sheet nearest now. Dragged below the shortest point it closes,
|
|
50
|
+
* because a sheet flicked away should go away.
|
|
51
|
+
*/
|
|
52
|
+
const React = __importStar(require("react"));
|
|
53
|
+
const box_1 = require("../../box.cjs");
|
|
54
|
+
const cn_1 = require("../../core/cn.cjs");
|
|
55
|
+
const DrawerCtx = /* @__PURE__ */ React.createContext(null);
|
|
56
|
+
const useDrawer = () => {
|
|
57
|
+
const c = React.useContext(DrawerCtx);
|
|
58
|
+
if (!c)
|
|
59
|
+
throw new Error('DrawerContent and DrawerHandle must be inside a <Drawer>');
|
|
60
|
+
return c;
|
|
61
|
+
};
|
|
62
|
+
/** A snap point in pixels. A number is a fraction of the viewport. */
|
|
63
|
+
const px = (p, viewport) => typeof p === 'number' ? p * viewport : parseFloat(p) || 0;
|
|
64
|
+
/** A flick: fast enough that where it was pointing matters more than where it stopped. */
|
|
65
|
+
const FLICK = 0.5; // px per ms
|
|
66
|
+
const Drawer = ({ open = false, onOpenChange, modal = true, snapPoints, activeSnapPoint, setActiveSnapPoint, dragHandleOnly = false, fastDragSkipsToEnd = true, handleHandleClicked, extendHandleDragRegion = false, children, }) => {
|
|
67
|
+
// The viewport is only known in a browser, and a fractional snap point needs
|
|
68
|
+
// it. Zero on the server means those resolve to zero and the sheet renders
|
|
69
|
+
// closed, which is the right thing to send.
|
|
70
|
+
const [viewport, setViewport] = React.useState(0);
|
|
71
|
+
React.useEffect(() => {
|
|
72
|
+
const read = () => setViewport(window.innerHeight);
|
|
73
|
+
read();
|
|
74
|
+
window.addEventListener('resize', read);
|
|
75
|
+
return () => window.removeEventListener('resize', read);
|
|
76
|
+
}, []);
|
|
77
|
+
const points = snapPoints?.length ? snapPoints : [1];
|
|
78
|
+
const heights = points.map((p) => px(p, viewport));
|
|
79
|
+
const tallest = Math.max(...heights, 0);
|
|
80
|
+
const activePx = activeSnapPoint !== undefined ? px(activeSnapPoint, viewport) : tallest;
|
|
81
|
+
const [offset, setOffset] = React.useState(0);
|
|
82
|
+
const [dragging, setDragging] = React.useState(false);
|
|
83
|
+
const snapTo = (target) => {
|
|
84
|
+
let best = heights[0];
|
|
85
|
+
for (const h of heights)
|
|
86
|
+
if (Math.abs(h - target) < Math.abs(best - target))
|
|
87
|
+
best = h;
|
|
88
|
+
// Below the shortest point by more than half of it, this is a dismissal.
|
|
89
|
+
if (target < Math.min(...heights) / 2) {
|
|
90
|
+
onOpenChange?.(false);
|
|
91
|
+
return;
|
|
92
|
+
}
|
|
93
|
+
const i = heights.indexOf(best);
|
|
94
|
+
setActiveSnapPoint?.(points[i]);
|
|
95
|
+
};
|
|
96
|
+
const drag = (start) => {
|
|
97
|
+
const from = start.clientY;
|
|
98
|
+
const began = start.timeStamp;
|
|
99
|
+
const el = start.currentTarget;
|
|
100
|
+
el.setPointerCapture?.(start.pointerId);
|
|
101
|
+
setDragging(true);
|
|
102
|
+
const move = (e) => {
|
|
103
|
+
// Down is positive, and down SHRINKS the sheet.
|
|
104
|
+
setOffset(Math.max(0, e.clientY - from));
|
|
105
|
+
};
|
|
106
|
+
const up = (e) => {
|
|
107
|
+
el.releasePointerCapture?.(start.pointerId);
|
|
108
|
+
document.removeEventListener('pointermove', move);
|
|
109
|
+
document.removeEventListener('pointerup', up);
|
|
110
|
+
setDragging(false);
|
|
111
|
+
setOffset(0);
|
|
112
|
+
const travelled = e.clientY - from;
|
|
113
|
+
const speed = Math.abs(travelled) / Math.max(1, e.timeStamp - began);
|
|
114
|
+
if (fastDragSkipsToEnd && speed > FLICK) {
|
|
115
|
+
// A flick goes all the way in the direction it was thrown.
|
|
116
|
+
snapTo(travelled > 0 ? 0 : tallest);
|
|
117
|
+
return;
|
|
118
|
+
}
|
|
119
|
+
snapTo(activePx - travelled);
|
|
120
|
+
};
|
|
121
|
+
document.addEventListener('pointermove', move);
|
|
122
|
+
document.addEventListener('pointerup', up);
|
|
123
|
+
};
|
|
124
|
+
return ((0, jsx_runtime_1.jsx)(DrawerCtx.Provider, { value: {
|
|
125
|
+
open,
|
|
126
|
+
modal,
|
|
127
|
+
heights,
|
|
128
|
+
active: activePx,
|
|
129
|
+
onOpenChange,
|
|
130
|
+
snapTo,
|
|
131
|
+
handleHandleClicked,
|
|
132
|
+
dragHandleOnly,
|
|
133
|
+
fastDragSkipsToEnd,
|
|
134
|
+
extendHandleDragRegion,
|
|
135
|
+
drag,
|
|
136
|
+
offset,
|
|
137
|
+
dragging,
|
|
138
|
+
}, children: children }));
|
|
139
|
+
};
|
|
140
|
+
exports.Drawer = Drawer;
|
|
141
|
+
/**
|
|
142
|
+
* The grab bar.
|
|
143
|
+
*
|
|
144
|
+
* 44px of grab area around a 4px bar when `extendHandleDragRegion` is on: the
|
|
145
|
+
* drawn size is a visual, and a target the size of the visual is one a thumb
|
|
146
|
+
* misses.
|
|
147
|
+
*/
|
|
148
|
+
const DrawerHandle = ({ className, ...props }) => {
|
|
149
|
+
const { drag, handleHandleClicked, extendHandleDragRegion } = useDrawer();
|
|
150
|
+
return ((0, jsx_runtime_1.jsx)(box_1.Box, { role: "separator", "aria-orientation": "horizontal", "aria-label": "Resize", className: (0, cn_1.cn)('grid place-items-center cursor-grab', className), style: {
|
|
151
|
+
paddingBlock: extendHandleDragRegion ? 20 : 8,
|
|
152
|
+
touchAction: 'none',
|
|
153
|
+
}, onPointerDown: drag, onClick: handleHandleClicked, ...props, children: (0, jsx_runtime_1.jsx)(box_1.Box, { className: "rounded-full bg-muted", style: { width: 48, height: 4 } }) }));
|
|
154
|
+
};
|
|
155
|
+
exports.DrawerHandle = DrawerHandle;
|
|
156
|
+
const DrawerContent = ({ className, children, defaultHandle = true, ...props }) => {
|
|
157
|
+
const { open, modal, heights, active, offset, dragging, onOpenChange, dragHandleOnly, drag } = useDrawer();
|
|
158
|
+
if (!open)
|
|
159
|
+
return null;
|
|
160
|
+
const tallest = Math.max(...heights, 0);
|
|
161
|
+
// Rendered at its tallest and slid down to the active point, so the content
|
|
162
|
+
// keeps one box whatever height the sheet is resting at.
|
|
163
|
+
const down = Math.max(0, tallest - active) + offset;
|
|
164
|
+
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [modal && ((0, jsx_runtime_1.jsx)(box_1.Box
|
|
165
|
+
// The scrim is not a control and must not be in the tab order, but it
|
|
166
|
+
// does dismiss — which is why the sheet also closes on Escape below.
|
|
167
|
+
, { "aria-hidden": "true", onClick: () => onOpenChange?.(false), style: { position: 'fixed', inset: 0, background: 'rgba(0,0,0,.5)', zIndex: 50 } })), (0, jsx_runtime_1.jsxs)(box_1.Box, { role: "dialog", "aria-modal": modal, className: (0, cn_1.cn)('bg-background', className), style: {
|
|
168
|
+
position: 'fixed',
|
|
169
|
+
left: 0,
|
|
170
|
+
right: 0,
|
|
171
|
+
bottom: 0,
|
|
172
|
+
height: tallest || undefined,
|
|
173
|
+
transform: `translateY(${down}px)`,
|
|
174
|
+
// No transition WHILE dragging, or the sheet lags the thumb.
|
|
175
|
+
transition: dragging ? 'none' : 'transform .3s cubic-bezier(.32,.72,0,1)',
|
|
176
|
+
touchAction: 'none',
|
|
177
|
+
zIndex: 50,
|
|
178
|
+
}, onPointerDown: dragHandleOnly ? undefined : drag, onKeyDown: (e) => {
|
|
179
|
+
if (e.key === 'Escape')
|
|
180
|
+
onOpenChange?.(false);
|
|
181
|
+
}, ...props, children: [defaultHandle && (0, jsx_runtime_1.jsx)(exports.DrawerHandle, {}), children] })] }));
|
|
182
|
+
};
|
|
183
|
+
exports.DrawerContent = DrawerContent;
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Drawer — a sheet that comes up from the bottom and rests at chosen heights.
|
|
3
|
+
*
|
|
4
|
+
* A snap point IS a height: `'72px'` for a peek, `'620px'` for the whole thing,
|
|
5
|
+
* or a number for a fraction of the viewport. The sheet is always rendered at
|
|
6
|
+
* its TALLEST point and slid down to the active one, so its content has a
|
|
7
|
+
* stable box and does not reflow every time it moves — a cart that re-lays-out
|
|
8
|
+
* mid-drag is the thing this shape is avoiding.
|
|
9
|
+
*
|
|
10
|
+
* Dragging moves that same offset, so the release is a straight question: which
|
|
11
|
+
* point is the sheet nearest now. Dragged below the shortest point it closes,
|
|
12
|
+
* because a sheet flicked away should go away.
|
|
13
|
+
*/
|
|
14
|
+
import * as React from 'react';
|
|
15
|
+
import { Box } from '../../box.js';
|
|
16
|
+
/** A height: `'620px'`, or a fraction of the viewport. */
|
|
17
|
+
export type SnapPoint = number | string;
|
|
18
|
+
export type DrawerProps = React.PropsWithChildren<{
|
|
19
|
+
open?: boolean;
|
|
20
|
+
onOpenChange?: (open: boolean) => void;
|
|
21
|
+
/** Blocks the page behind it and dims it. */
|
|
22
|
+
modal?: boolean;
|
|
23
|
+
snapPoints?: SnapPoint[];
|
|
24
|
+
activeSnapPoint?: SnapPoint;
|
|
25
|
+
setActiveSnapPoint?: (point: SnapPoint) => void;
|
|
26
|
+
/** Only the handle starts a drag — so the content can scroll. */
|
|
27
|
+
dragHandleOnly?: boolean;
|
|
28
|
+
/** A fast flick goes to the far end rather than the next point along. */
|
|
29
|
+
fastDragSkipsToEnd?: boolean;
|
|
30
|
+
/** A click on the handle, as opposed to a drag. */
|
|
31
|
+
handleHandleClicked?: () => void;
|
|
32
|
+
/** Widen the handle's grab area past its drawn size. */
|
|
33
|
+
extendHandleDragRegion?: boolean;
|
|
34
|
+
}>;
|
|
35
|
+
export declare const Drawer: ({ open, onOpenChange, modal, snapPoints, activeSnapPoint, setActiveSnapPoint, dragHandleOnly, fastDragSkipsToEnd, handleHandleClicked, extendHandleDragRegion, children, }: DrawerProps) => import("react/jsx-runtime").JSX.Element;
|
|
36
|
+
/**
|
|
37
|
+
* The grab bar.
|
|
38
|
+
*
|
|
39
|
+
* 44px of grab area around a 4px bar when `extendHandleDragRegion` is on: the
|
|
40
|
+
* drawn size is a visual, and a target the size of the visual is one a thumb
|
|
41
|
+
* misses.
|
|
42
|
+
*/
|
|
43
|
+
export declare const DrawerHandle: ({ className, ...props }: React.ComponentProps<typeof Box>) => import("react/jsx-runtime").JSX.Element;
|
|
44
|
+
export type DrawerContentProps = React.ComponentProps<typeof Box> & {
|
|
45
|
+
/** The sheet draws its own handle unless the caller draws one. */
|
|
46
|
+
defaultHandle?: boolean;
|
|
47
|
+
};
|
|
48
|
+
export declare const DrawerContent: ({ className, children, defaultHandle, ...props }: DrawerContentProps) => import("react/jsx-runtime").JSX.Element | null;
|
|
49
|
+
//# sourceMappingURL=drawer.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"drawer.d.ts","sourceRoot":"","sources":["../../../src/backends/gui/drawer.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;GAYG;AACH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,GAAG,EAAE,MAAM,WAAW,CAAA;AAG/B,0DAA0D;AAC1D,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,MAAM,CAAA;AAEvC,MAAM,MAAM,WAAW,GAAG,KAAK,CAAC,iBAAiB,CAAC;IAChD,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACtC,6CAA6C;IAC7C,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,UAAU,CAAC,EAAE,SAAS,EAAE,CAAA;IACxB,eAAe,CAAC,EAAE,SAAS,CAAA;IAC3B,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAA;IAC/C,iEAAiE;IACjE,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,yEAAyE;IACzE,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,mDAAmD;IACnD,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAA;IAChC,wDAAwD;IACxD,sBAAsB,CAAC,EAAE,OAAO,CAAA;CACjC,CAAC,CAAA;AA6BF,eAAO,MAAM,MAAM,+KAYhB,WAAW,4CAoFb,CAAA;AAED;;;;;;GAMG;AACH,eAAO,MAAM,YAAY,4BAA6B,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,4CAmBrF,CAAA;AAED,MAAM,MAAM,kBAAkB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,GAAG,CAAC,GAAG;IAClE,kEAAkE;IAClE,aAAa,CAAC,EAAE,OAAO,CAAA;CACxB,CAAA;AAED,eAAO,MAAM,aAAa,qDAKvB,kBAAkB,mDA+CpB,CAAA"}
|