@kanso-labs/kanso-ui 0.44.0 → 0.44.1
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/components/app-bar/index.d.ts +9 -5
- package/dist/components/app-bar/index.js +400 -170
- package/dist/components/app-bar/index.js.map +1 -1
- package/dist/components/checkbox/index.js +2 -1
- package/dist/components/checkbox/index.js.map +1 -1
- package/dist/components/dialog/index.js +65 -71
- package/dist/components/dialog/index.js.map +1 -1
- package/dist/components/sheet/index.js +39 -46
- package/dist/components/sheet/index.js.map +1 -1
- package/dist/components/switch/index.js +1 -0
- package/dist/components/switch/index.js.map +1 -1
- package/dist/components/time-picker/index.js +37 -41
- package/dist/components/time-picker/index.js.map +1 -1
- package/dist/control/index.js +1 -1
- package/dist/control/index.js.map +1 -1
- package/dist/control/styles.js +0 -1
- package/dist/control/styles.js.map +1 -1
- package/dist/field/index.js +148 -139
- package/dist/field/index.js.map +1 -1
- package/dist/field/styles.js +50 -7
- package/dist/field/styles.js.map +1 -1
- package/dist/hooks/useRipple.js +1 -1
- package/dist/layout.d.ts +4 -1
- package/dist/layout.js +4 -1
- package/dist/layout.js.map +1 -1
- package/dist/row/styles.js +2 -1
- package/dist/row/styles.js.map +1 -1
- package/dist/styles/overlay.js +0 -5
- package/dist/styles/overlay.js.map +1 -1
- package/dist/styles.css +123 -22
- package/package.json +1 -1
- package/dist/overlay/modal.js +0 -7
- package/dist/overlay/modal.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["c","_c","HTMLAttributes","ReactNode","RefAttributes","ClassNameOrFunction","DialogTriggerProps","HeadingProps","ModalOverlayProps","ModalRenderProps","DialogProps","RACDialogProps","StyleOrFunction","stylex","createContext","useContext","useId","useLayoutEffect","useMemo","useRef","useState","useSyncExternalStore","DialogTrigger","Heading","HeadingContext","Modal","ModalOverlay","Dialog","RACDialog","useSlottedContext","useHoldBottomEdge","useScrollStop","OverlayScope","InsideModalContext","mergeRefs","mergeStatefulStyles","mergeStyles","overlay","colors","media","motion","radii","shadows","spacing","typography","FORCED_COLORS","FULL_SCREEN","scaleIn","slideInFromBottom","styles","body","kB7OPa","kMwMTN","k1xSpc","kXwgrk","kzQI83","kMv6JI","kGuDYH","k63SB2","kOIVth","kb6lSQ","kLWn49","kHjlTd","kORKVm","kGO01o","kLKAdn","kg3NbH","$$css","centre","kGNEyG","kjj79g","kmVPX3","basic","BasicContext","DescriptionContext","id","Omit","children","t0","$","props","t1","DialogBody","ref","callerRef","isBasic","describe","generated","undefined","title","scrollStop","label","t2","merged","t3","modalBodyRing","t4","DialogContent","className","container","defaultOpen","isKeyboardDismissDisabled","isOpen","onOpenChange","style","isDismissable","role","setBody","overModal","scrim","scrimOverModal","0","1","t5","t6","Symbol","for","modalDialog","t7","t8","t9","t10","t11","DialogFooter","useFullScreen","DialogHeader","DialogTitle","isFullScreen","window","matchMedia","matches","isFullScreenOnServer","subscribeToFullScreen","listener","query","addEventListener","removeEventListener","Body","Content","Footer","Header","Title","DialogContentProps","Element","Pick","DialogTitleProps","Dialog","_c","props","stylex.props","RACDialog"],"sources":["../../../src/components/dialog/index.tsx"],"sourcesContent":["'use client';\n\nimport type { HTMLAttributes, ReactNode, RefAttributes } from 'react';\nimport type { ClassNameOrFunction, DialogTriggerProps, HeadingProps, ModalOverlayProps, ModalRenderProps, DialogProps as RACDialogProps, StyleOrFunction } from 'react-aria-components';\nimport * as stylex from '@stylexjs/stylex';\nimport { createContext, useContext, useId, useLayoutEffect, useMemo, useRef, useState, useSyncExternalStore } from 'react';\nimport { DialogTrigger, Heading, HeadingContext, Modal, ModalOverlay, Dialog as RACDialog, useSlottedContext } from 'react-aria-components';\nimport { useHoldBottomEdge } from '../../hooks/useBottomEdge';\nimport { useScrollStop } from '../../hooks/useScrollStop';\nimport { OverlayScope } from '../../overlay';\nimport { InsideModalContext } from '../../overlay/modal';\nimport { mergeRefs } from '../../render/ref';\nimport { mergeStatefulStyles, mergeStyles } from '../../styles/merge';\nimport { overlay } from '../../styles/overlay';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, media, motion, radii, shadows, spacing, typography } from '../../tokens/design.tokens.stylex';\n\n// Windows High Contrast and the rest of the forced-colours modes. Spelled\n// here rather than imported, for the reason src/field/styles.ts records: the\n// StyleX compiler resolves a constant across files only out of a `.stylex.ts`\n// module, and the generated one holds design tokens rather than queries.\nconst FORCED_COLORS = '@media (forced-colors: active)';\n\n// The window size the full-screen dialog is drawn at, which the styles read\n// as `media.belowMedium`. Spelled again for `matchMedia`, which is the one\n// thing in this file that has to know it outside a stylesheet: the footer\n// holds the window's bottom edge only there. See `useFullScreen`.\nconst FULL_SCREEN = '(width < 600px)';\n\n// The dialogs page's two dialogs, which are one component here for the same\n// reason Sheet's two presentations are: the page pairs them by window size\n// rather than offering a choice. Above the medium breakpoint it is the basic\n// dialog — a container on surface container high with a 28dp corner, between\n// 280 and 560dp wide, centred over the scrim, with 24dp of padding all round,\n// 16dp between the headline and the body and 24dp between the body and the\n// actions. Below it the same dialog fills the window as the page's\n// full-screen dialog: square corners, a 56dp header with the headline and a\n// divider under it, and a 56dp action bar with a divider over it.\n//\n// The pairing is for a dialog that is a task, which needs the room. An alert\n// dialog is a question with two or three answers, and the page keeps the\n// full-screen dialog for tasks, so `role=\"alertdialog\"` stays the basic dialog\n// at every width. Filled to a phone's window it read as a headline at the top\n// of the screen and its answers at the bottom, with nothing between them but\n// the chrome. The `basic` styles below are how: each restates, without the\n// breakpoint, the properties the paired styles change below it.\n//\n// The headline is headline-small on surface, the body body-medium on surface\n// variant, and the buttons are the call site's — the page draws text buttons\n// there, which is `Button`'s `text` variant.\n//\n// Two things the page draws are the call site's rather than the component's.\n// The optional icon above the headline, which the page centres the headline\n// and body with when it is there, is anything a `Dialog.Header` is given; a\n// dialog that wants it centres its own header. And the dividers a basic\n// dialog may show around a scrolling body are left out, since the page has\n// them only for that case and the body here scrolls with the header and\n// footer pinned either side of it, which is what they were marking.\n//\n// React Aria's overlay is three nested elements — the scrim, the container,\n// and the dialog inside it — so the styles split the same way, and the scrim\n// and the element carrying the dialog role are the ones every modal overlay\n// shares.\nconst scaleIn = \"xnirehn-B\";\nconst slideInFromBottom = \"x1itx4s0-B\";\nconst styles = {\n body: {\n kB7OPa: \"x9f619\",\n kMwMTN: \"x1w5n3ug\",\n k1xSpc: \"x78zum5\",\n kXwgrk: \"xdt5ytf\",\n kzQI83: \"x1iyjqo2\",\n kMv6JI: \"xpo2rfv\",\n kGuDYH: \"x193rfdd\",\n k63SB2: \"x1hews6w\",\n kOIVth: \"xxj4525\",\n kb6lSQ: \"xn43zvd\",\n kLWn49: \"xv61bfh\",\n kHjlTd: \"xj0a0fe\",\n kORKVm: \"x1odjw0f\",\n kGO01o: \"x1az23kl x18d9i69\",\n kLKAdn: \"x886u18 xexx8yu x3reb9c\",\n kg3NbH: \"xg0ps1x\",\n $$css: true\n },\n centre: {\n kGNEyG: \"x6s0dn4\",\n k1xSpc: \"x78zum5\",\n kjj79g: \"xl56j7k\",\n kmVPX3: \"x1apw6a7 xd76zvj\",\n $$css: true\n }\n};\n\n// The basic dialog at every width, for an alert dialog. Each entry is the\n// above-breakpoint value of every property its namesake in `styles` changes\n// below the breakpoint, laid over that namesake, so a property it leaves out\n// is the same in both presentations already. A value changed above the\n// breakpoint there has to change here too, which `index.test.tsx` checks by\n// comparing an alert dialog on a phone with any dialog on a desktop.\nconst basic = {\n body: {\n kLKAdn: \"x886u18 xexx8yu\",\n $$css: true\n },\n centre: {\n kmVPX3: \"x1apw6a7\",\n $$css: true\n }\n};\n\n// Whether this dialog is the basic one at every width. Content decides it from\n// the role and the parts read it, since each part carries its own share of\n// the full-screen presentation.\nconst BasicContext = createContext(false);\n\n// Where an alert dialog's body hands Content its id, so the dialog can name\n// the body as its description: the message an alert dialog interrupts with\n// is what a screen reader should read out with the title. Null in a dialog\n// of any other role, whose body may hold a form or a long document rather\n// than one message.\nconst DescriptionContext = createContext<((id: string | undefined) => void) | null>(null);\ntype DialogProps = Omit<DialogTriggerProps, 'children'> & {\n children?: ReactNode;\n};\n\n/**\n * A modal dialog centred over the page, and the same dialog filling the\n * window below the medium breakpoint — the dialogs page's basic and\n * full-screen dialogs, paired by window size as the page pairs them. An\n * alert dialog stays the basic one at every width. Open state is React\n * Aria's: pass `isOpen` with `onOpenChange` to control it, or\n * `defaultOpen` to let it keep its own.\n *\n * Composed rather than configured by props, as `Sheet` is, since a dialog's\n * header, body and actions all take arbitrary content — the parts are\n * `Dialog.Content`, `Dialog.Header`, `Dialog.Title`, `Dialog.Body` and\n * `Dialog.Footer`. A `Button` or `IconButton` placed directly inside\n * `Dialog` opens it, and one given `slot=\"close\"` anywhere inside the\n * content closes it; neither needs a part of its own.\n *\n * `Dialog` is the trigger's half, so a dialog nothing on the page opens — one\n * a route shows, or a menu item raises — leaves it out and passes `isOpen`\n * and `onOpenChange` to `Dialog.Content` instead. Wrapped in `Dialog` with no\n * button inside it, React Aria warns that its press responder found nothing\n * to press.\n */\nfunction Dialog({\n children,\n ...props\n}: DialogProps) {\n return <DialogTrigger {...props}>{children}</DialogTrigger>;\n}\nfunction DialogBody({\n ref: callerRef,\n ...props\n}: HTMLAttributes<HTMLDivElement> & RefAttributes<HTMLDivElement>) {\n const isBasic = useContext(BasicContext);\n const describe = useContext(DescriptionContext);\n const generated = useId();\n // An alert dialog's body describes the dialog, so it carries an id for the\n // dialog to point at: the call site's own, or one of its own. In a layout\n // effect, so the dialog carries its description from its first paint.\n const id = props.id ?? (describe === null ? undefined : generated);\n useLayoutEffect(() => {\n if (describe === null || id === undefined) {\n return undefined;\n }\n describe(id);\n return () => {\n describe(undefined);\n };\n }, [describe, id]);\n const ref = useRef<HTMLDivElement>(null);\n // A body its content runs past is a tab stop named by the title, so a\n // keyboard can scroll it, when nothing inside it takes focus; a call\n // site's own name, role and tabIndex still win. See useScrollStop.\n const title = useSlottedContext(HeadingContext, 'title');\n const scrollStop = useScrollStop(ref, {\n label: props['aria-label'],\n title: title?.id\n });\n // The body measures itself through its own ref, and the call site's lands\n // on the same element.\n const merged = useMemo(() => mergeRefs(ref, callerRef ?? undefined), [callerRef]);\n return <div {...scrollStop} id={id} {...props} ref={merged} {...mergeStyles(stylex.props(styles.body, isBasic && basic.body, overlay.modalBodyRing), props)} />;\n}\n\n/**\n * The dialog itself, and the scrim behind it. Everything the dialog shows\n * goes in here; the trigger stays outside it, since the trigger lives in the\n * page while this is portalled out to the end of the body.\n *\n * `role=\"alertdialog\"` is React Aria's, for a dialog interrupting with\n * something that has to be answered before the page carries on — a screen\n * reader announces it rather than waiting to be asked. It also keeps the\n * dialog the basic one below the medium breakpoint, centred and sized to its\n * content, where a dialog of the default role fills the window. Its\n * `Dialog.Body` is its description, so the message is read out with the\n * title; an `aria-describedby` of the call site's own names another.\n *\n * A press on the scrim closes the dialog unless `isDismissable` says\n * otherwise, which is the same default `Sheet` takes and the reverse of\n * React Aria's own. Escape is a separate prop, `isKeyboardDismissDisabled`,\n * and `isDismissable` says nothing about it — so a dialog that has to be\n * answered from one of its actions, as an alert dialog usually does, turns\n * off both.\n *\n * Inside `Dialog`, the open state is the trigger's. On its own, with no\n * trigger, it is this part's: `isOpen` with `onOpenChange` controls it, and\n * a `slot=\"close\"` button, Escape and the scrim all report through\n * `onOpenChange`, as they would to `Dialog`.\n *\n * The scrim draws at `z-index: 900`, over any page content layered below\n * that, such as a sticky header, and the panel draws inside it. A\n * `Snackbar` draws at 1000, so a toast raised from inside the dialog is read\n * over it, and React Aria's popovers and menus draw above both.\n */\nfunction DialogContent({\n children,\n className,\n container,\n defaultOpen,\n isDismissable = true,\n isKeyboardDismissDisabled,\n isOpen,\n onOpenChange,\n ref,\n style,\n ...props\n}: DialogContentProps & RefAttributes<HTMLDivElement>) {\n const isBasic = props.role === 'alertdialog';\n // The id of the body, which an alert dialog is described by unless the\n // call site names a description of its own.\n const [body, setBody] = useState<string>();\n const overModal = useContext(InsideModalContext);\n return <BasicContext value={isBasic}>\n <DescriptionContext value={isBasic ? setBody : null}>\n <OverlayScope>\n <ModalOverlay defaultOpen={defaultOpen} isDismissable={isDismissable} isKeyboardDismissDisabled={isKeyboardDismissDisabled} isOpen={isOpen} onOpenChange={onOpenChange}\n // oxlint-disable-next-line typescript/no-deprecated -- its replacement, UNSAFE_PortalProvider, is not exported by react-aria-components\n UNSTABLE_portalContainer={container} {...stylex.props(overlay.scrim, overModal && overlay.scrimOverModal, styles.centre, isBasic && basic.centre)}>\n <Modal\n // The panel, where the call site's class and style land, rather\n // than the dialog inside it, which takes the rest of the props.\n ref={ref} {...mergeStatefulStyles({\n 0: {\n className: \"x1n1nwrg x1u6grsq xbhiib0 x1ebxanj x16dv9tl xvkjz1l xt7dq6l x1ju3lih x1w1tqly x19pkqky x1f120ba xx61lck x1gb867b x13rsnn2 x1udv5rz x9f619 x139gbkf x78zum5 xdt5ytf xh8yej3 xmz0i5r x27kpxv x6iovhr x1u2d2a2 xxzqys8 xb3r6kr x9xqwrn xg8iv3o x19b5e0v xsds98l\"\n },\n 1: {\n className: \"x1n1nwrg x1u6grsq x16dv9tl xvkjz1l x1w1tqly x13rsnn2 x1udv5rz x9f619 x139gbkf x78zum5 xdt5ytf xh8yej3 xmz0i5r xb3r6kr xbhiib0 xt7dq6l x19pkqky xx61lck x27kpxv x1u2d2a2\"\n }\n }[!!isBasic << 0], {\n className,\n style\n })}>\n <InsideModalContext value>\n <RACDialog {...props} aria-describedby={props['aria-describedby'] ?? (isBasic ? body : undefined)} {...stylex.props(overlay.modalDialog)}>\n {children}\n </RACDialog>\n </InsideModalContext>\n </Modal>\n </ModalOverlay>\n </OverlayScope>\n </DescriptionContext>\n </BasicContext>;\n}\n\n/**\n * The dialog's actions. Full screen they are the action bar on the window's\n * bottom edge, which a toast rises clear of while the dialog is open, so a\n * tap meant for one of them never lands on the toast's own action instead.\n */\nfunction DialogFooter({\n ref: callerRef,\n ...props\n}: HTMLAttributes<HTMLDivElement> & RefAttributes<HTMLDivElement>) {\n const isBasic = useContext(BasicContext);\n const ref = useRef<HTMLDivElement>(null);\n useHoldBottomEdge(ref, useFullScreen() && !isBasic);\n // The footer measures itself through its own ref, and the call site's\n // lands on the same element.\n const merged = useMemo(() => mergeRefs(ref, callerRef ?? undefined), [callerRef]);\n return <div {...props} ref={merged} {...mergeStyles({\n 0: {\n className: \"x6s0dn4 x12smttz x1ejq31n x1vv4zg8 x178xt8z x9f619 x78zum5 x2lah0s x1a02dak x126z3so x13a6bvl xnvi70j x8i8c5o x1pr6p50 x13h71tw xs3zajk xg0ps1x\"\n },\n 1: {\n className: \"x6s0dn4 x12smttz x178xt8z x9f619 x78zum5 x2lah0s x1a02dak x126z3so x13a6bvl xg0ps1x x1ejq31n x8i8c5o x13h71tw\"\n }\n }[!!isBasic << 0], props)} />;\n}\nfunction DialogHeader(props: HTMLAttributes<HTMLDivElement> & RefAttributes<HTMLDivElement>) {\n const isBasic = useContext(BasicContext);\n return <div {...props} {...mergeStyles({\n 0: {\n className: \"x6s0dn4 x1j6faob x1sy0etr xf6te7g xso031l x9f619 x78zum5 x2lah0s x1gka490 x1qughib xnvi70j xzfxn0k x1pr6p50 x13h71tw xs3zajk xg0ps1x\"\n },\n 1: {\n className: \"x6s0dn4 x1j6faob xso031l x9f619 x78zum5 x2lah0s x1gka490 x1qughib xg0ps1x x1sy0etr xzfxn0k x13h71tw\"\n }\n }[!!isBasic << 0], props)} />;\n}\n\n/**\n * Names the dialog. Rendered through React Aria's title slot, which is what\n * points the dialog's `aria-labelledby` at it — a dialog without one\n * announces itself unnamed.\n */\nfunction DialogTitle(props: DialogTitleProps & RefAttributes<HTMLHeadingElement>) {\n const isBasic = useContext(BasicContext);\n return <Heading slot=\"title\" {...props} {...mergeStyles({\n 0: {\n className: \"x9f619 x139gbkf x1fz0g89 xl849ld xkb6epg xcji80f x76yrz5 x6ksu6j x1s1qhaa x1khanjg x1voeury xrr2tf9 x1ghz6dp xeuugli xj0a0fe\"\n },\n 1: {\n className: \"x9f619 x139gbkf x1ghz6dp xeuugli xj0a0fe x1fz0g89 xkb6epg x76yrz5 x1s1qhaa x1voeury\"\n }\n }[!!isBasic << 0], props)} />;\n}\n\n// Whether the window is at the size the full-screen dialog is drawn at, kept\n// current as it resizes. False on the server, where there is no window and\n// nothing is open.\nfunction isFullScreen() {\n return window.matchMedia(FULL_SCREEN).matches;\n}\nfunction isFullScreenOnServer() {\n return false;\n}\nfunction subscribeToFullScreen(listener: () => void) {\n const query = window.matchMedia(FULL_SCREEN);\n query.addEventListener('change', listener);\n return () => {\n query.removeEventListener('change', listener);\n };\n}\nfunction useFullScreen() {\n return useSyncExternalStore(subscribeToFullScreen, isFullScreen, isFullScreenOnServer);\n}\nDialog.Body = DialogBody;\nDialog.Content = DialogContent;\nDialog.Footer = DialogFooter;\nDialog.Header = DialogHeader;\nDialog.Title = DialogTitle;\n\n// The dialog's own props, plus the scrim's open state and dismissal settings\n// and the container's styling. A call site has no reason to know there are\n// three elements: `className` and `style` reach the container, which is the\n// one worth restyling, the open state and the dismissal settings reach the\n// scrim, and everything else lands on the dialog.\n//\n// `isDismissable` is declared here rather than picked with its siblings,\n// since the picked one carries React Aria's documentation, whose default is\n// the reverse of this component's.\ntype DialogContentProps = {\n /** A function may compute the class from the container's render state. */\n className?: ClassNameOrFunction<ModalRenderProps>;\n /**\n * Where to portal the dialog and scrim. Defaults to the container of the\n * `ThemeScope` around it, which keeps the dialog on that scope's tokens, or\n * to the end of `<body>` where there is none. A subtree themed through the\n * `themeScope` class has no container of its own, so point this inside it, or\n * the dialog renders outside and keeps the page's tokens.\n */\n container?: Element;\n /**\n * Whether a press on the scrim, outside the container, closes the\n * dialog. `true` here where React Aria's own default is `false`, the\n * same default `Sheet` takes. Escape is `isKeyboardDismissDisabled`'s,\n * and this says nothing about it — an alert dialog, which has to be\n * answered from one of its actions, turns off both.\n * @default true\n */\n isDismissable?: boolean;\n /** A function may compute the style from the container's render state. */\n style?: StyleOrFunction<ModalRenderProps>;\n} & Omit<RACDialogProps, 'className' | 'style'> & Pick<ModalOverlayProps, 'defaultOpen' | 'isKeyboardDismissDisabled' | 'isOpen' | 'onOpenChange'>;\ntype DialogTitleProps = HeadingProps;\nexport type { DialogContentProps, DialogProps, DialogTitleProps };\nexport { DialogBody, DialogContent, DialogFooter, DialogHeader, DialogTitle };\nexport default Dialog;"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":["c","_c","HTMLAttributes","ReactNode","RefAttributes","ClassNameOrFunction","DialogTriggerProps","HeadingProps","ModalOverlayProps","ModalRenderProps","DialogProps","RACDialogProps","StyleOrFunction","stylex","createContext","useContext","useId","useLayoutEffect","useMemo","useRef","useState","useSyncExternalStore","DialogTrigger","Heading","HeadingContext","Modal","ModalOverlay","Dialog","RACDialog","useSlottedContext","useHoldBottomEdge","useScrollStop","OverlayScope","mergeRefs","mergeStatefulStyles","mergeStyles","overlay","colors","media","motion","radii","shadows","spacing","typography","FORCED_COLORS","FULL_SCREEN","scaleIn","slideInFromBottom","styles","body","kB7OPa","kMwMTN","k1xSpc","kXwgrk","kzQI83","kMv6JI","kGuDYH","k63SB2","kOIVth","kb6lSQ","kLWn49","kHjlTd","kORKVm","kGO01o","kLKAdn","kg3NbH","$$css","centre","kGNEyG","kjj79g","kmVPX3","basic","BasicContext","DescriptionContext","id","Omit","children","t0","$","props","t1","DialogBody","ref","callerRef","isBasic","describe","generated","undefined","title","scrollStop","label","t2","merged","t3","modalBodyRing","t4","DialogContent","className","container","defaultOpen","isKeyboardDismissDisabled","isOpen","onOpenChange","style","isDismissable","role","setBody","scrim","0","1","t5","t6","Symbol","for","modalDialog","t7","t8","t9","t10","t11","DialogFooter","useFullScreen","DialogHeader","DialogTitle","isFullScreen","window","matchMedia","matches","isFullScreenOnServer","subscribeToFullScreen","listener","query","addEventListener","removeEventListener","Body","Content","Footer","Header","Title","DialogContentProps","Element","Pick","DialogTitleProps","Dialog","_c","props","stylex.props","RACDialog"],"sources":["../../../src/components/dialog/index.tsx"],"sourcesContent":["'use client';\n\nimport type { HTMLAttributes, ReactNode, RefAttributes } from 'react';\nimport type { ClassNameOrFunction, DialogTriggerProps, HeadingProps, ModalOverlayProps, ModalRenderProps, DialogProps as RACDialogProps, StyleOrFunction } from 'react-aria-components';\nimport * as stylex from '@stylexjs/stylex';\nimport { createContext, useContext, useId, useLayoutEffect, useMemo, useRef, useState, useSyncExternalStore } from 'react';\nimport { DialogTrigger, Heading, HeadingContext, Modal, ModalOverlay, Dialog as RACDialog, useSlottedContext } from 'react-aria-components';\nimport { useHoldBottomEdge } from '../../hooks/useBottomEdge';\nimport { useScrollStop } from '../../hooks/useScrollStop';\nimport { OverlayScope } from '../../overlay';\nimport { mergeRefs } from '../../render/ref';\nimport { mergeStatefulStyles, mergeStyles } from '../../styles/merge';\nimport { overlay } from '../../styles/overlay';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, media, motion, radii, shadows, spacing, typography } from '../../tokens/design.tokens.stylex';\n\n// Windows High Contrast and the rest of the forced-colours modes. Spelled\n// here rather than imported, for the reason src/field/styles.ts records: the\n// StyleX compiler resolves a constant across files only out of a `.stylex.ts`\n// module, and the generated one holds design tokens rather than queries.\nconst FORCED_COLORS = '@media (forced-colors: active)';\n\n// The window size the full-screen dialog is drawn at, which the styles read\n// as `media.belowMedium`. Spelled again for `matchMedia`, which is the one\n// thing in this file that has to know it outside a stylesheet: the footer\n// holds the window's bottom edge only there. See `useFullScreen`.\nconst FULL_SCREEN = '(width < 600px)';\n\n// The dialogs page's two dialogs, which are one component here for the same\n// reason Sheet's two presentations are: the page pairs them by window size\n// rather than offering a choice. Above the medium breakpoint it is the basic\n// dialog — a container on surface container high with a 28dp corner, between\n// 280 and 560dp wide, centred over the scrim, with 24dp of padding all round,\n// 16dp between the headline and the body and 24dp between the body and the\n// actions. Below it the same dialog fills the window as the page's\n// full-screen dialog: square corners, a 56dp header with the headline and a\n// divider under it, and a 56dp action bar with a divider over it.\n//\n// The pairing is for a dialog that is a task, which needs the room. An alert\n// dialog is a question with two or three answers, and the page keeps the\n// full-screen dialog for tasks, so `role=\"alertdialog\"` stays the basic dialog\n// at every width. Filled to a phone's window it read as a headline at the top\n// of the screen and its answers at the bottom, with nothing between them but\n// the chrome. The `basic` styles below are how: each restates, without the\n// breakpoint, the properties the paired styles change below it.\n//\n// The headline is headline-small on surface, the body body-medium on surface\n// variant, and the buttons are the call site's — the page draws text buttons\n// there, which is `Button`'s `text` variant.\n//\n// Two things the page draws are the call site's rather than the component's.\n// The optional icon above the headline, which the page centres the headline\n// and body with when it is there, is anything a `Dialog.Header` is given; a\n// dialog that wants it centres its own header. And the dividers a basic\n// dialog may show around a scrolling body are left out, since the page has\n// them only for that case and the body here scrolls with the header and\n// footer pinned either side of it, which is what they were marking.\n//\n// React Aria's overlay is three nested elements — the scrim, the container,\n// and the dialog inside it — so the styles split the same way, and the scrim\n// and the element carrying the dialog role are the ones every modal overlay\n// shares.\nconst scaleIn = \"xnirehn-B\";\nconst slideInFromBottom = \"x1itx4s0-B\";\nconst styles = {\n body: {\n kB7OPa: \"x9f619\",\n kMwMTN: \"x1w5n3ug\",\n k1xSpc: \"x78zum5\",\n kXwgrk: \"xdt5ytf\",\n kzQI83: \"x1iyjqo2\",\n kMv6JI: \"xpo2rfv\",\n kGuDYH: \"x193rfdd\",\n k63SB2: \"x1hews6w\",\n kOIVth: \"xxj4525\",\n kb6lSQ: \"xn43zvd\",\n kLWn49: \"xv61bfh\",\n kHjlTd: \"xj0a0fe\",\n kORKVm: \"x1odjw0f\",\n kGO01o: \"x1az23kl x18d9i69\",\n kLKAdn: \"x886u18 xexx8yu x3reb9c\",\n kg3NbH: \"xg0ps1x\",\n $$css: true\n },\n centre: {\n kGNEyG: \"x6s0dn4\",\n k1xSpc: \"x78zum5\",\n kjj79g: \"xl56j7k\",\n kmVPX3: \"x1apw6a7 xd76zvj\",\n $$css: true\n }\n};\n\n// The basic dialog at every width, for an alert dialog. Each entry is the\n// above-breakpoint value of every property its namesake in `styles` changes\n// below the breakpoint, laid over that namesake, so a property it leaves out\n// is the same in both presentations already. A value changed above the\n// breakpoint there has to change here too, which `index.test.tsx` checks by\n// comparing an alert dialog on a phone with any dialog on a desktop.\nconst basic = {\n body: {\n kLKAdn: \"x886u18 xexx8yu\",\n $$css: true\n },\n centre: {\n kmVPX3: \"x1apw6a7\",\n $$css: true\n }\n};\n\n// Whether this dialog is the basic one at every width. Content decides it from\n// the role and the parts read it, since each part carries its own share of\n// the full-screen presentation.\nconst BasicContext = createContext(false);\n\n// Where an alert dialog's body hands Content its id, so the dialog can name\n// the body as its description: the message an alert dialog interrupts with\n// is what a screen reader should read out with the title. Null in a dialog\n// of any other role, whose body may hold a form or a long document rather\n// than one message.\nconst DescriptionContext = createContext<((id: string | undefined) => void) | null>(null);\ntype DialogProps = Omit<DialogTriggerProps, 'children'> & {\n children?: ReactNode;\n};\n\n/**\n * A modal dialog centred over the page, and the same dialog filling the\n * window below the medium breakpoint — the dialogs page's basic and\n * full-screen dialogs, paired by window size as the page pairs them. An\n * alert dialog stays the basic one at every width. Open state is React\n * Aria's: pass `isOpen` with `onOpenChange` to control it, or\n * `defaultOpen` to let it keep its own.\n *\n * Composed rather than configured by props, as `Sheet` is, since a dialog's\n * header, body and actions all take arbitrary content — the parts are\n * `Dialog.Content`, `Dialog.Header`, `Dialog.Title`, `Dialog.Body` and\n * `Dialog.Footer`. A `Button` or `IconButton` placed directly inside\n * `Dialog` opens it, and one given `slot=\"close\"` anywhere inside the\n * content closes it; neither needs a part of its own.\n *\n * `Dialog` is the trigger's half, so a dialog nothing on the page opens — one\n * a route shows, or a menu item raises — leaves it out and passes `isOpen`\n * and `onOpenChange` to `Dialog.Content` instead. Wrapped in `Dialog` with no\n * button inside it, React Aria warns that its press responder found nothing\n * to press.\n */\nfunction Dialog({\n children,\n ...props\n}: DialogProps) {\n return <DialogTrigger {...props}>{children}</DialogTrigger>;\n}\nfunction DialogBody({\n ref: callerRef,\n ...props\n}: HTMLAttributes<HTMLDivElement> & RefAttributes<HTMLDivElement>) {\n const isBasic = useContext(BasicContext);\n const describe = useContext(DescriptionContext);\n const generated = useId();\n // An alert dialog's body describes the dialog, so it carries an id for the\n // dialog to point at: the call site's own, or one of its own. In a layout\n // effect, so the dialog carries its description from its first paint.\n const id = props.id ?? (describe === null ? undefined : generated);\n useLayoutEffect(() => {\n if (describe === null || id === undefined) {\n return undefined;\n }\n describe(id);\n return () => {\n describe(undefined);\n };\n }, [describe, id]);\n const ref = useRef<HTMLDivElement>(null);\n // A body its content runs past is a tab stop named by the title, so a\n // keyboard can scroll it, when nothing inside it takes focus; a call\n // site's own name, role and tabIndex still win. See useScrollStop.\n const title = useSlottedContext(HeadingContext, 'title');\n const scrollStop = useScrollStop(ref, {\n label: props['aria-label'],\n title: title?.id\n });\n // The body measures itself through its own ref, and the call site's lands\n // on the same element.\n const merged = useMemo(() => mergeRefs(ref, callerRef ?? undefined), [callerRef]);\n return <div {...scrollStop} id={id} {...props} ref={merged} {...mergeStyles(stylex.props(styles.body, isBasic && basic.body, overlay.modalBodyRing), props)} />;\n}\n\n/**\n * The dialog itself, and the scrim behind it. Everything the dialog shows\n * goes in here; the trigger stays outside it, since the trigger lives in the\n * page while this is portalled out to the end of the body.\n *\n * `role=\"alertdialog\"` is React Aria's, for a dialog interrupting with\n * something that has to be answered before the page carries on — a screen\n * reader announces it rather than waiting to be asked. It also keeps the\n * dialog the basic one below the medium breakpoint, centred and sized to its\n * content, where a dialog of the default role fills the window. Its\n * `Dialog.Body` is its description, so the message is read out with the\n * title; an `aria-describedby` of the call site's own names another.\n *\n * A press on the scrim closes the dialog unless `isDismissable` says\n * otherwise, which is the same default `Sheet` takes and the reverse of\n * React Aria's own. Escape is a separate prop, `isKeyboardDismissDisabled`,\n * and `isDismissable` says nothing about it — so a dialog that has to be\n * answered from one of its actions, as an alert dialog usually does, turns\n * off both.\n *\n * Inside `Dialog`, the open state is the trigger's. On its own, with no\n * trigger, it is this part's: `isOpen` with `onOpenChange` controls it, and\n * a `slot=\"close\"` button, Escape and the scrim all report through\n * `onOpenChange`, as they would to `Dialog`.\n *\n * The scrim draws at `z-index: 900`, over any page content layered below\n * that, such as a sticky header, and the panel draws inside it. A\n * `Snackbar` draws at 1000, so a toast raised from inside the dialog is read\n * over it, and React Aria's popovers and menus draw above both.\n */\nfunction DialogContent({\n children,\n className,\n container,\n defaultOpen,\n isDismissable = true,\n isKeyboardDismissDisabled,\n isOpen,\n onOpenChange,\n ref,\n style,\n ...props\n}: DialogContentProps & RefAttributes<HTMLDivElement>) {\n const isBasic = props.role === 'alertdialog';\n // The id of the body, which an alert dialog is described by unless the\n // call site names a description of its own.\n const [body, setBody] = useState<string>();\n return <BasicContext value={isBasic}>\n <DescriptionContext value={isBasic ? setBody : null}>\n <OverlayScope>\n <ModalOverlay defaultOpen={defaultOpen} isDismissable={isDismissable} isKeyboardDismissDisabled={isKeyboardDismissDisabled} isOpen={isOpen} onOpenChange={onOpenChange}\n // oxlint-disable-next-line typescript/no-deprecated -- its replacement, UNSAFE_PortalProvider, is not exported by react-aria-components\n UNSTABLE_portalContainer={container} {...stylex.props(overlay.scrim, styles.centre, isBasic && basic.centre)}>\n <Modal\n // The panel, where the call site's class and style land, rather\n // than the dialog inside it, which takes the rest of the props.\n ref={ref} {...mergeStatefulStyles({\n 0: {\n className: \"x1n1nwrg x1u6grsq xbhiib0 x1ebxanj x16dv9tl xvkjz1l xt7dq6l x1ju3lih x1w1tqly x19pkqky x1f120ba xx61lck x1gb867b x13rsnn2 x1udv5rz x9f619 x139gbkf x78zum5 xdt5ytf xh8yej3 xmz0i5r x27kpxv x6iovhr x1u2d2a2 xxzqys8 xb3r6kr x9xqwrn xg8iv3o x19b5e0v xsds98l\"\n },\n 1: {\n className: \"x1n1nwrg x1u6grsq x16dv9tl xvkjz1l x1w1tqly x13rsnn2 x1udv5rz x9f619 x139gbkf x78zum5 xdt5ytf xh8yej3 xmz0i5r xb3r6kr xbhiib0 xt7dq6l x19pkqky xx61lck x27kpxv x1u2d2a2\"\n }\n }[!!isBasic << 0], {\n className,\n style\n })}>\n <RACDialog {...props} aria-describedby={props['aria-describedby'] ?? (isBasic ? body : undefined)} {...stylex.props(overlay.modalDialog)}>\n {children}\n </RACDialog>\n </Modal>\n </ModalOverlay>\n </OverlayScope>\n </DescriptionContext>\n </BasicContext>;\n}\n\n/**\n * The dialog's actions. Full screen they are the action bar on the window's\n * bottom edge, which a toast rises clear of while the dialog is open, so a\n * tap meant for one of them never lands on the toast's own action instead.\n */\nfunction DialogFooter({\n ref: callerRef,\n ...props\n}: HTMLAttributes<HTMLDivElement> & RefAttributes<HTMLDivElement>) {\n const isBasic = useContext(BasicContext);\n const ref = useRef<HTMLDivElement>(null);\n useHoldBottomEdge(ref, useFullScreen() && !isBasic);\n // The footer measures itself through its own ref, and the call site's\n // lands on the same element.\n const merged = useMemo(() => mergeRefs(ref, callerRef ?? undefined), [callerRef]);\n return <div {...props} ref={merged} {...mergeStyles({\n 0: {\n className: \"x6s0dn4 x12smttz x1ejq31n x1vv4zg8 x178xt8z x9f619 x78zum5 x2lah0s x1a02dak x126z3so x13a6bvl xnvi70j x8i8c5o x1pr6p50 x13h71tw xs3zajk xg0ps1x\"\n },\n 1: {\n className: \"x6s0dn4 x12smttz x178xt8z x9f619 x78zum5 x2lah0s x1a02dak x126z3so x13a6bvl xg0ps1x x1ejq31n x8i8c5o x13h71tw\"\n }\n }[!!isBasic << 0], props)} />;\n}\nfunction DialogHeader(props: HTMLAttributes<HTMLDivElement> & RefAttributes<HTMLDivElement>) {\n const isBasic = useContext(BasicContext);\n return <div {...props} {...mergeStyles({\n 0: {\n className: \"x6s0dn4 x1j6faob x1sy0etr xf6te7g xso031l x9f619 x78zum5 x2lah0s x1gka490 x1qughib xnvi70j xzfxn0k x1pr6p50 x13h71tw xs3zajk xg0ps1x\"\n },\n 1: {\n className: \"x6s0dn4 x1j6faob xso031l x9f619 x78zum5 x2lah0s x1gka490 x1qughib xg0ps1x x1sy0etr xzfxn0k x13h71tw\"\n }\n }[!!isBasic << 0], props)} />;\n}\n\n/**\n * Names the dialog. Rendered through React Aria's title slot, which is what\n * points the dialog's `aria-labelledby` at it — a dialog without one\n * announces itself unnamed.\n */\nfunction DialogTitle(props: DialogTitleProps & RefAttributes<HTMLHeadingElement>) {\n const isBasic = useContext(BasicContext);\n return <Heading slot=\"title\" {...props} {...mergeStyles({\n 0: {\n className: \"x9f619 x139gbkf x1fz0g89 xl849ld xkb6epg xcji80f x76yrz5 x6ksu6j x1s1qhaa x1khanjg x1voeury xrr2tf9 x1ghz6dp xeuugli xj0a0fe\"\n },\n 1: {\n className: \"x9f619 x139gbkf x1ghz6dp xeuugli xj0a0fe x1fz0g89 xkb6epg x76yrz5 x1s1qhaa x1voeury\"\n }\n }[!!isBasic << 0], props)} />;\n}\n\n// Whether the window is at the size the full-screen dialog is drawn at, kept\n// current as it resizes. False on the server, where there is no window and\n// nothing is open.\nfunction isFullScreen() {\n return window.matchMedia(FULL_SCREEN).matches;\n}\nfunction isFullScreenOnServer() {\n return false;\n}\nfunction subscribeToFullScreen(listener: () => void) {\n const query = window.matchMedia(FULL_SCREEN);\n query.addEventListener('change', listener);\n return () => {\n query.removeEventListener('change', listener);\n };\n}\nfunction useFullScreen() {\n return useSyncExternalStore(subscribeToFullScreen, isFullScreen, isFullScreenOnServer);\n}\nDialog.Body = DialogBody;\nDialog.Content = DialogContent;\nDialog.Footer = DialogFooter;\nDialog.Header = DialogHeader;\nDialog.Title = DialogTitle;\n\n// The dialog's own props, plus the scrim's open state and dismissal settings\n// and the container's styling. A call site has no reason to know there are\n// three elements: `className` and `style` reach the container, which is the\n// one worth restyling, the open state and the dismissal settings reach the\n// scrim, and everything else lands on the dialog.\n//\n// `isDismissable` is declared here rather than picked with its siblings,\n// since the picked one carries React Aria's documentation, whose default is\n// the reverse of this component's.\ntype DialogContentProps = {\n /** A function may compute the class from the container's render state. */\n className?: ClassNameOrFunction<ModalRenderProps>;\n /**\n * Where to portal the dialog and scrim. Defaults to the container of the\n * `ThemeScope` around it, which keeps the dialog on that scope's tokens, or\n * to the end of `<body>` where there is none. A subtree themed through the\n * `themeScope` class has no container of its own, so point this inside it, or\n * the dialog renders outside and keeps the page's tokens.\n */\n container?: Element;\n /**\n * Whether a press on the scrim, outside the container, closes the\n * dialog. `true` here where React Aria's own default is `false`, the\n * same default `Sheet` takes. Escape is `isKeyboardDismissDisabled`'s,\n * and this says nothing about it — an alert dialog, which has to be\n * answered from one of its actions, turns off both.\n * @default true\n */\n isDismissable?: boolean;\n /** A function may compute the style from the container's render state. */\n style?: StyleOrFunction<ModalRenderProps>;\n} & Omit<RACDialogProps, 'className' | 'style'> & Pick<ModalOverlayProps, 'defaultOpen' | 'isKeyboardDismissDisabled' | 'isOpen' | 'onOpenChange'>;\ntype DialogTitleProps = HeadingProps;\nexport type { DialogContentProps, DialogProps, DialogTitleProps };\nexport { DialogBody, DialogContent, DialogFooter, DialogHeader, DialogTitle };\nexport default Dialog;"],"mappings":"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"}
|
|
@@ -6,9 +6,8 @@ import { overlay } from "../../styles/overlay.js";
|
|
|
6
6
|
import { useHoldBottomEdge } from "../../hooks/useBottomEdge.js";
|
|
7
7
|
import { useScrollStop } from "../../hooks/useScrollStop.js";
|
|
8
8
|
import { OverlayScope } from "../../overlay/index.js";
|
|
9
|
-
import { InsideModalContext } from "../../overlay/modal.js";
|
|
10
9
|
import { c } from "react/compiler-runtime";
|
|
11
|
-
import {
|
|
10
|
+
import { useRef } from "react";
|
|
12
11
|
import { jsx } from "react/jsx-runtime";
|
|
13
12
|
import { Dialog, DialogTrigger, Heading, HeadingContext, Modal, ModalOverlay, useSlottedContext } from "react-aria-components";
|
|
14
13
|
//#region src/components/sheet/index.tsx
|
|
@@ -122,7 +121,7 @@ function SheetBody(t0) {
|
|
|
122
121
|
* over it, and React Aria's popovers and menus draw above both.
|
|
123
122
|
*/
|
|
124
123
|
function SheetContent(t0) {
|
|
125
|
-
const $ = c(
|
|
124
|
+
const $ = c(32);
|
|
126
125
|
let children;
|
|
127
126
|
let className;
|
|
128
127
|
let container;
|
|
@@ -162,56 +161,51 @@ function SheetContent(t0) {
|
|
|
162
161
|
t1 = $[11];
|
|
163
162
|
}
|
|
164
163
|
const isDismissable = t1 === void 0 ? true : t1;
|
|
165
|
-
const overModal = useContext(InsideModalContext);
|
|
166
164
|
let t2;
|
|
167
|
-
if ($[12]
|
|
168
|
-
t2 = props(overlay.scrim
|
|
169
|
-
$[12] =
|
|
170
|
-
|
|
171
|
-
} else t2 = $[13];
|
|
165
|
+
if ($[12] === Symbol.for("react.memo_cache_sentinel")) {
|
|
166
|
+
t2 = props(overlay.scrim);
|
|
167
|
+
$[12] = t2;
|
|
168
|
+
} else t2 = $[12];
|
|
172
169
|
let t3;
|
|
173
|
-
if ($[
|
|
170
|
+
if ($[13] !== className || $[14] !== style) {
|
|
174
171
|
t3 = mergeStatefulStyles({ className: "x1n1nwrg x1u6grsq x1ioi8j8 xu2fq7p x18ihq2d x16dv9tl x1vnz5z6 x19dwuzr xuz63mn x1lym3mf xkducg2 xrzall9 xb0nsol xjslfuv x1gbqego x1cfajip xjg5lhu x1a37zkv xys6ro8 x6xk272 x9t1vth x19efjv6 x9f619 x139gbkf x78zum5 xdt5ytf x1l2rt3b xwvxfow x1ey2m1c x13vifvy xmpip4z xtijo5x xhi6v0a x1upgybz x7ab17h x11ijow0 xb3r6kr x1a148e8 x1mrd0q x5ubeis x1lodr2j x1uhho1l x19b5e0v xg4bq00 xg4jtgg xsds98l xixxii4" }, {
|
|
175
172
|
className,
|
|
176
173
|
style
|
|
177
174
|
});
|
|
178
|
-
$[
|
|
179
|
-
$[
|
|
180
|
-
$[
|
|
181
|
-
} else t3 = $[
|
|
175
|
+
$[13] = className;
|
|
176
|
+
$[14] = style;
|
|
177
|
+
$[15] = t3;
|
|
178
|
+
} else t3 = $[15];
|
|
182
179
|
let t4;
|
|
183
|
-
if ($[
|
|
180
|
+
if ($[16] === Symbol.for("react.memo_cache_sentinel")) {
|
|
184
181
|
t4 = props(overlay.modalDialog);
|
|
185
|
-
$[
|
|
186
|
-
} else t4 = $[
|
|
182
|
+
$[16] = t4;
|
|
183
|
+
} else t4 = $[16];
|
|
187
184
|
let t5;
|
|
188
|
-
if ($[
|
|
189
|
-
t5 = /* @__PURE__ */ jsx(
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
...t4,
|
|
194
|
-
children
|
|
195
|
-
})
|
|
185
|
+
if ($[17] !== children || $[18] !== props$1) {
|
|
186
|
+
t5 = /* @__PURE__ */ jsx(Dialog, {
|
|
187
|
+
...props$1,
|
|
188
|
+
...t4,
|
|
189
|
+
children
|
|
196
190
|
});
|
|
197
|
-
$[
|
|
198
|
-
$[
|
|
199
|
-
$[
|
|
200
|
-
} else t5 = $[
|
|
191
|
+
$[17] = children;
|
|
192
|
+
$[18] = props$1;
|
|
193
|
+
$[19] = t5;
|
|
194
|
+
} else t5 = $[19];
|
|
201
195
|
let t6;
|
|
202
|
-
if ($[
|
|
196
|
+
if ($[20] !== ref || $[21] !== t3 || $[22] !== t5) {
|
|
203
197
|
t6 = /* @__PURE__ */ jsx(Modal, {
|
|
204
198
|
ref,
|
|
205
199
|
...t3,
|
|
206
200
|
children: t5
|
|
207
201
|
});
|
|
208
|
-
$[
|
|
209
|
-
$[
|
|
210
|
-
$[
|
|
211
|
-
$[
|
|
212
|
-
} else t6 = $[
|
|
202
|
+
$[20] = ref;
|
|
203
|
+
$[21] = t3;
|
|
204
|
+
$[22] = t5;
|
|
205
|
+
$[23] = t6;
|
|
206
|
+
} else t6 = $[23];
|
|
213
207
|
let t7;
|
|
214
|
-
if ($[
|
|
208
|
+
if ($[24] !== container || $[25] !== defaultOpen || $[26] !== isDismissable || $[27] !== isKeyboardDismissDisabled || $[28] !== isOpen || $[29] !== onOpenChange || $[30] !== t6) {
|
|
215
209
|
t7 = /* @__PURE__ */ jsx(OverlayScope, { children: /* @__PURE__ */ jsx(ModalOverlay, {
|
|
216
210
|
defaultOpen,
|
|
217
211
|
isDismissable,
|
|
@@ -222,16 +216,15 @@ function SheetContent(t0) {
|
|
|
222
216
|
...t2,
|
|
223
217
|
children: t6
|
|
224
218
|
}) });
|
|
225
|
-
$[
|
|
226
|
-
$[
|
|
227
|
-
$[
|
|
228
|
-
$[
|
|
229
|
-
$[
|
|
230
|
-
$[
|
|
231
|
-
$[
|
|
232
|
-
$[
|
|
233
|
-
|
|
234
|
-
} else t7 = $[33];
|
|
219
|
+
$[24] = container;
|
|
220
|
+
$[25] = defaultOpen;
|
|
221
|
+
$[26] = isDismissable;
|
|
222
|
+
$[27] = isKeyboardDismissDisabled;
|
|
223
|
+
$[28] = isOpen;
|
|
224
|
+
$[29] = onOpenChange;
|
|
225
|
+
$[30] = t6;
|
|
226
|
+
$[31] = t7;
|
|
227
|
+
} else t7 = $[31];
|
|
235
228
|
return t7;
|
|
236
229
|
}
|
|
237
230
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["c","_c","HTMLAttributes","ReactNode","RefAttributes","ClassNameOrFunction","DialogProps","DialogTriggerProps","HeadingProps","ModalOverlayProps","ModalRenderProps","StyleOrFunction","stylex","useContext","useMemo","useRef","Dialog","DialogTrigger","Heading","HeadingContext","Modal","ModalOverlay","useSlottedContext","useHoldBottomEdge","useScrollStop","OverlayScope","InsideModalContext","mergeRefs","mergeStatefulStyles","mergeStyles","overlay","colors","media","motion","radii","shadows","spacing","typography","FORCED_COLORS","slideInFromEnd","slideInFromStart","slideInFromBottom","styles","body","kB7OPa","k1xSpc","kXwgrk","kzQI83","kOIVth","kHjlTd","kORKVm","k8WAf4","kg3NbH","$$css","SheetProps","Omit","children","Sheet","t0","$","props","t1","SheetBody","ref","callerRef","title","scrollStop","label","id","undefined","t2","merged","t3","modalBodyRing","t4","SheetContent","className","container","defaultOpen","isKeyboardDismissDisabled","isOpen","onOpenChange","style","isDismissable","overModal","scrim","scrimOverModal","Symbol","for","modalDialog","t5","t6","t7","SheetFooter","SheetHandle","SheetHeader","SheetTitle","Body","Content","Footer","Handle","Header","Title","SheetContentProps","Pick","Element","SheetTitleProps","_c","props","stylex.props"],"sources":["../../../src/components/sheet/index.tsx"],"sourcesContent":["'use client';\n\nimport type { HTMLAttributes, ReactNode, RefAttributes } from 'react';\nimport type { ClassNameOrFunction, DialogProps, DialogTriggerProps, HeadingProps, ModalOverlayProps, ModalRenderProps, StyleOrFunction } from 'react-aria-components';\nimport * as stylex from '@stylexjs/stylex';\nimport { useContext, useMemo, useRef } from 'react';\nimport { Dialog, DialogTrigger, Heading, HeadingContext, Modal, ModalOverlay, useSlottedContext } from 'react-aria-components';\nimport { useHoldBottomEdge } from '../../hooks/useBottomEdge';\nimport { useScrollStop } from '../../hooks/useScrollStop';\nimport { OverlayScope } from '../../overlay';\nimport { InsideModalContext } from '../../overlay/modal';\nimport { mergeRefs } from '../../render/ref';\nimport { mergeStatefulStyles, mergeStyles } from '../../styles/merge';\nimport { overlay } from '../../styles/overlay';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, media, motion, radii, shadows, spacing, typography } from '../../tokens/design.tokens.stylex';\n\n// Windows High Contrast and the rest of the forced-colours modes. Spelled\n// here rather than imported, for the reason src/field/styles.ts records: the\n// StyleX compiler resolves a constant across files only out of a `.stylex.ts`\n// module, and the generated one holds design tokens rather than queries.\nconst FORCED_COLORS = '@media (forced-colors: active)';\n\n// One component, two presentations. Above the medium breakpoint it is a side\n// sheet pinned to the inline end of the viewport; below it, the same panel\n// becomes a bottom sheet. That is the pairing the Material Design pages draw\n// rather than two components: a sheet that stayed on the right at 375px would\n// be a drawer covering the whole screen.\n//\n// The two differ in five things and no more: which edges they are pinned to,\n// which two corners are rounded, which axis they arrive along, how much of\n// the viewport they may take, and the drag handle, which is the bottom\n// sheets page's element alone. Everything inside the panel — the 24 of start\n// and end padding, the 12 between the header's elements, the actions area —\n// comes from the side sheets page and is drawn the same in both.\n\n// The side sheet arrives along the inline axis, and it takes two keyframes to\n// do that rather than one. Which edge the panel rests against is logical —\n// `insetInlineEnd` puts it on the right under a left-to-right document and on\n// the left under a right-to-left one — but `translateX` is physical and flips\n// with nothing. One keyframe would therefore have the panel arrive from the\n// far side of where it comes to rest under one of the two.\nconst slideInFromEnd = \"x17cjob-B\";\nconst slideInFromStart = \"x18x3npg-B\";\nconst slideInFromBottom = \"x15b941j-B\";\n\n// Entry only, so there is no exit animation to wait for and closing is\n// immediate: React Aria keeps a closing panel mounted only while an animation\n// is running on it, and finds none. See the comment on `SheetContent` for why\n// that is a design call rather than a limit of StyleX.\n//\n// React Aria's overlay is three nested elements — the scrim, the panel, and\n// the dialog inside it — so the styles are split the same way: the overlay\n// module's scrim on the first, `content` on the panel, its modal dialog style\n// on the element that carries the role. The scrim and that dialog style are\n// shared with every modal overlay; the panel is the sheet's own, since which\n// edge it is pinned to is what makes it a sheet.\nconst styles = {\n body: {\n kB7OPa: \"x9f619\",\n k1xSpc: \"x78zum5\",\n kXwgrk: \"xdt5ytf\",\n kzQI83: \"x1iyjqo2\",\n kOIVth: \"xxj4525\",\n kHjlTd: \"xj0a0fe\",\n kORKVm: \"x1odjw0f\",\n k8WAf4: \"xp6hjv6\",\n kg3NbH: \"xg0ps1x\",\n $$css: true\n }\n};\ntype SheetProps = Omit<DialogTriggerProps, 'children'> & {\n children?: ReactNode;\n};\n\n/**\n * A modal panel that arrives from the edge of the screen — a side sheet on a\n * wide viewport, a bottom sheet on a narrow one. Open state is React Aria's:\n * pass `isOpen` with `onOpenChange` to control it, or `defaultOpen` to let it\n * keep its own.\n *\n * Composed rather than configured by props, because a sheet's header, body,\n * and footer all take arbitrary content — the parts are `Sheet.Content`,\n * `Sheet.Header`, `Sheet.Title`, `Sheet.Body`, and `Sheet.Footer`. A\n * `Button` or `IconButton` placed directly inside `Sheet` opens it, and one\n * given `slot=\"close\"` anywhere inside the content closes it; neither needs\n * a part of its own.\n *\n * `Sheet` is the trigger's half, so a sheet nothing on the page opens — one\n * a route shows, or a menu item raises — leaves it out and passes `isOpen`\n * and `onOpenChange` to `Sheet.Content` instead. Wrapped in `Sheet` with no\n * button inside it, React Aria warns that its press responder found nothing\n * to press.\n */\nfunction Sheet({\n children,\n ...props\n}: SheetProps) {\n return <DialogTrigger {...props}>{children}</DialogTrigger>;\n}\nfunction SheetBody({\n ref: callerRef,\n ...props\n}: HTMLAttributes<HTMLDivElement> & RefAttributes<HTMLDivElement>) {\n const ref = useRef<HTMLDivElement>(null);\n // A body its content runs past is a tab stop named by the title, so a\n // keyboard can scroll it, when nothing inside it takes focus; a call\n // site's own name, role and tabIndex still win. See useScrollStop.\n const title = useSlottedContext(HeadingContext, 'title');\n const scrollStop = useScrollStop(ref, {\n label: props['aria-label'],\n title: title?.id\n });\n // The body measures itself through its own ref, and the call site's lands\n // on the same element.\n const merged = useMemo(() => mergeRefs(ref, callerRef ?? undefined), [callerRef]);\n return <div {...scrollStop} {...props} ref={merged} {...mergeStyles(stylex.props(styles.body, overlay.modalBodyRing), props)} />;\n}\n\n/**\n * The panel itself, and the scrim behind it. Everything the sheet shows goes\n * in here; the trigger stays outside it, since the trigger lives in the page\n * while this is portalled out to the end of the body.\n *\n * A press on the scrim closes the sheet unless `isDismissable` says\n * otherwise — React Aria's own default is the reverse, and a sheet that\n * ignores a tap outside it reads as stuck.\n *\n * Inside `Sheet`, the open state is the trigger's. On its own, with no\n * trigger, it is this part's: `isOpen` with `onOpenChange` controls it, and\n * a `slot=\"close\"` button, Escape and the scrim all report through\n * `onOpenChange`, as they would to `Sheet`.\n *\n * The scrim draws at `z-index: 900`, over any page content layered below\n * that, such as a sticky header, and the panel draws inside it. A\n * `Snackbar` draws at 1000, so a toast raised from inside the sheet is read\n * over it, and React Aria's popovers and menus draw above both.\n */\nfunction SheetContent({\n children,\n className,\n container,\n defaultOpen,\n isDismissable = true,\n isKeyboardDismissDisabled,\n isOpen,\n onOpenChange,\n ref,\n style,\n ...props\n}: RefAttributes<HTMLDivElement> & SheetContentProps) {\n const overModal = useContext(InsideModalContext);\n return <OverlayScope>\n <ModalOverlay defaultOpen={defaultOpen} isDismissable={isDismissable} isKeyboardDismissDisabled={isKeyboardDismissDisabled} isOpen={isOpen} onOpenChange={onOpenChange}\n // oxlint-disable-next-line typescript/no-deprecated -- its replacement, UNSAFE_PortalProvider, is not exported by react-aria-components\n UNSTABLE_portalContainer={container} {...stylex.props(overlay.scrim, overModal && overlay.scrimOverModal)}>\n <Modal\n // The panel, where the call site's class and style land, rather than\n // the dialog inside it, which takes the rest of the props.\n ref={ref} {...mergeStatefulStyles({\n className: \"x1n1nwrg x1u6grsq x1ioi8j8 xu2fq7p x18ihq2d x16dv9tl x1vnz5z6 x19dwuzr xuz63mn x1lym3mf xkducg2 xrzall9 xb0nsol xjslfuv x1gbqego x1cfajip xjg5lhu x1a37zkv xys6ro8 x6xk272 x9t1vth x19efjv6 x9f619 x139gbkf x78zum5 xdt5ytf x1l2rt3b xwvxfow x1ey2m1c x13vifvy xmpip4z xtijo5x xhi6v0a x1upgybz x7ab17h x11ijow0 xb3r6kr x1a148e8 x1mrd0q x5ubeis x1lodr2j x1uhho1l x19b5e0v xg4bq00 xg4jtgg xsds98l xixxii4\"\n }, {\n className,\n style\n })}>\n <InsideModalContext value>\n <Dialog {...props} {...stylex.props(overlay.modalDialog)}>\n {children}\n </Dialog>\n </InsideModalContext>\n </Modal>\n </ModalOverlay>\n </OverlayScope>;\n}\n\n/**\n * The sheet's actions. The panel is pinned to the window's bottom edge in\n * both presentations, so they sit on that edge, and a toast rises clear of\n * them while the sheet is open rather than lying over its buttons. A side\n * sheet's are included: the toast is centred in the window, and on any\n * window narrower than about 1376px its 576 reach into the sheet's 400.\n */\nfunction SheetFooter({\n ref: callerRef,\n ...props\n}: HTMLAttributes<HTMLDivElement> & RefAttributes<HTMLDivElement>) {\n const ref = useRef<HTMLDivElement>(null);\n useHoldBottomEdge(ref, true);\n // The footer measures itself through its own ref, and the call site's\n // lands on the same element.\n const merged = useMemo(() => mergeRefs(ref, callerRef ?? undefined), [callerRef]);\n return <div {...props} ref={merged} {...mergeStyles({\n className: \"x12smttz x13fuv20 x178xt8z x9f619 x78zum5 x2lah0s x1a02dak x126z3so x1nhvcw1 x1qafhyn x8i8c5o x1clyivc xg0ps1x\"\n }, props)} />;\n}\n\n/**\n * The bottom sheets page's drag handle: a short bar above the sheet's\n * content, saying the panel is a bottom sheet. Place it first inside\n * `Sheet.Content`; above the medium breakpoint the panel is a side sheet and\n * this draws nothing.\n *\n * It is decoration rather than a control, and hidden from assistive\n * technology. Material's own handle drags a sheet between a collapsed and an\n * expanded height and dismisses it from the collapsed one; this panel has\n * one height and cannot be dragged, so a control that only looked draggable\n * would promise what it cannot do. Closing is already the scrim, Escape, and\n * any button given `slot=\"close\"`.\n */\nfunction SheetHandle(props: HTMLAttributes<HTMLDivElement> & RefAttributes<HTMLDivElement>) {\n return <div aria-hidden=\"true\" {...props} {...mergeStyles({\n className: \"x6s0dn4 x9f619 x1s85apg x37i4ze x2lah0s xl56j7k x1xg6qyv\"\n }, props)}>\n <span className=\"x1ccu2yh xwvh9j7 xqu0tyb x1dkaolv x9f619 x1g12otp x1td3qas\" />\n </div>;\n}\nfunction SheetHeader(props: HTMLAttributes<HTMLDivElement> & RefAttributes<HTMLDivElement>) {\n return <div {...props} {...mergeStyles({\n className: \"x6s0dn4 x1j6faob x1q0q8m5 xso031l x9f619 x78zum5 x2lah0s x1gka490 x1qughib x1cmllll xg0ps1x\"\n }, props)} />;\n}\n\n/**\n * Names the sheet. Rendered through React Aria's title slot, which is what\n * points the dialog's `aria-labelledby` at it — a sheet without one announces\n * itself as an unnamed dialog.\n */\nfunction SheetTitle(props: RefAttributes<HTMLHeadingElement> & SheetTitleProps) {\n return <Heading slot=\"title\" {...props} {...mergeStyles({\n className: \"x9f619 x1w5n3ug xdy5w5q xete2z3 x14ijtet xug9e1u x2divse x1ghz6dp xeuugli xj0a0fe\"\n }, props)} />;\n}\nSheet.Body = SheetBody;\nSheet.Content = SheetContent;\nSheet.Footer = SheetFooter;\nSheet.Handle = SheetHandle;\nSheet.Header = SheetHeader;\nSheet.Title = SheetTitle;\n\n// The dialog's own props, plus the scrim's open state and dismissal settings\n// and the panel's styling. A call site has no reason to know there are three\n// elements: `className` and `style` reach the panel, which is the one worth\n// restyling and positioning, the open state and the dismissal settings reach\n// the scrim, and everything else lands on the dialog.\n//\n// `isDismissable` is declared here rather than picked with its siblings,\n// since the picked one carries React Aria's documentation, whose default is\n// the reverse of this component's.\ntype SheetContentProps = Omit<DialogProps, 'className' | 'style'> & Pick<ModalOverlayProps, 'defaultOpen' | 'isKeyboardDismissDisabled' | 'isOpen' | 'onOpenChange'> & {\n /** A function may compute the class from the panel's render state. */\n className?: ClassNameOrFunction<ModalRenderProps>;\n /**\n * Where to portal the panel and scrim. Defaults to the container of the\n * `ThemeScope` around it, which keeps the sheet on that scope's tokens, or\n * to the end of `<body>` where there is none. A subtree themed through the\n * `themeScope` class has no container of its own, so point this inside it,\n * or the sheet renders outside and keeps the page's tokens.\n */\n container?: Element;\n /**\n * Whether a press on the scrim, outside the panel, closes the sheet.\n * `true` here where React Aria's own default is `false`, since a sheet\n * that ignores a tap outside it reads as stuck. Escape is\n * `isKeyboardDismissDisabled`'s, and this says nothing about it.\n * @default true\n */\n isDismissable?: boolean;\n /** A function may compute the style from the panel's render state. */\n style?: StyleOrFunction<ModalRenderProps>;\n};\ntype SheetTitleProps = HeadingProps;\nexport type { SheetContentProps, SheetProps, SheetTitleProps };\nexport { SheetBody, SheetContent, SheetFooter, SheetHandle, SheetHeader, SheetTitle };\nexport default Sheet;"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":["c","_c","HTMLAttributes","ReactNode","RefAttributes","ClassNameOrFunction","DialogProps","DialogTriggerProps","HeadingProps","ModalOverlayProps","ModalRenderProps","StyleOrFunction","stylex","useMemo","useRef","Dialog","DialogTrigger","Heading","HeadingContext","Modal","ModalOverlay","useSlottedContext","useHoldBottomEdge","useScrollStop","OverlayScope","mergeRefs","mergeStatefulStyles","mergeStyles","overlay","colors","media","motion","radii","shadows","spacing","typography","FORCED_COLORS","slideInFromEnd","slideInFromStart","slideInFromBottom","styles","body","kB7OPa","k1xSpc","kXwgrk","kzQI83","kOIVth","kHjlTd","kORKVm","k8WAf4","kg3NbH","$$css","SheetProps","Omit","children","Sheet","t0","$","props","t1","SheetBody","ref","callerRef","title","scrollStop","label","id","undefined","t2","merged","t3","modalBodyRing","t4","SheetContent","className","container","defaultOpen","isKeyboardDismissDisabled","isOpen","onOpenChange","style","isDismissable","Symbol","for","scrim","modalDialog","t5","t6","t7","SheetFooter","SheetHandle","SheetHeader","SheetTitle","Body","Content","Footer","Handle","Header","Title","SheetContentProps","Pick","Element","SheetTitleProps","_c","props","stylex.props"],"sources":["../../../src/components/sheet/index.tsx"],"sourcesContent":["'use client';\n\nimport type { HTMLAttributes, ReactNode, RefAttributes } from 'react';\nimport type { ClassNameOrFunction, DialogProps, DialogTriggerProps, HeadingProps, ModalOverlayProps, ModalRenderProps, StyleOrFunction } from 'react-aria-components';\nimport * as stylex from '@stylexjs/stylex';\nimport { useMemo, useRef } from 'react';\nimport { Dialog, DialogTrigger, Heading, HeadingContext, Modal, ModalOverlay, useSlottedContext } from 'react-aria-components';\nimport { useHoldBottomEdge } from '../../hooks/useBottomEdge';\nimport { useScrollStop } from '../../hooks/useScrollStop';\nimport { OverlayScope } from '../../overlay';\nimport { mergeRefs } from '../../render/ref';\nimport { mergeStatefulStyles, mergeStyles } from '../../styles/merge';\nimport { overlay } from '../../styles/overlay';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, media, motion, radii, shadows, spacing, typography } from '../../tokens/design.tokens.stylex';\n\n// Windows High Contrast and the rest of the forced-colours modes. Spelled\n// here rather than imported, for the reason src/field/styles.ts records: the\n// StyleX compiler resolves a constant across files only out of a `.stylex.ts`\n// module, and the generated one holds design tokens rather than queries.\nconst FORCED_COLORS = '@media (forced-colors: active)';\n\n// One component, two presentations. Above the medium breakpoint it is a side\n// sheet pinned to the inline end of the viewport; below it, the same panel\n// becomes a bottom sheet. That is the pairing the Material Design pages draw\n// rather than two components: a sheet that stayed on the right at 375px would\n// be a drawer covering the whole screen.\n//\n// The two differ in five things and no more: which edges they are pinned to,\n// which two corners are rounded, which axis they arrive along, how much of\n// the viewport they may take, and the drag handle, which is the bottom\n// sheets page's element alone. Everything inside the panel — the 24 of start\n// and end padding, the 12 between the header's elements, the actions area —\n// comes from the side sheets page and is drawn the same in both.\n\n// The side sheet arrives along the inline axis, and it takes two keyframes to\n// do that rather than one. Which edge the panel rests against is logical —\n// `insetInlineEnd` puts it on the right under a left-to-right document and on\n// the left under a right-to-left one — but `translateX` is physical and flips\n// with nothing. One keyframe would therefore have the panel arrive from the\n// far side of where it comes to rest under one of the two.\nconst slideInFromEnd = \"x17cjob-B\";\nconst slideInFromStart = \"x18x3npg-B\";\nconst slideInFromBottom = \"x15b941j-B\";\n\n// Entry only, so there is no exit animation to wait for and closing is\n// immediate: React Aria keeps a closing panel mounted only while an animation\n// is running on it, and finds none. See the comment on `SheetContent` for why\n// that is a design call rather than a limit of StyleX.\n//\n// React Aria's overlay is three nested elements — the scrim, the panel, and\n// the dialog inside it — so the styles are split the same way: the overlay\n// module's scrim on the first, `content` on the panel, its modal dialog style\n// on the element that carries the role. The scrim and that dialog style are\n// shared with every modal overlay; the panel is the sheet's own, since which\n// edge it is pinned to is what makes it a sheet.\nconst styles = {\n body: {\n kB7OPa: \"x9f619\",\n k1xSpc: \"x78zum5\",\n kXwgrk: \"xdt5ytf\",\n kzQI83: \"x1iyjqo2\",\n kOIVth: \"xxj4525\",\n kHjlTd: \"xj0a0fe\",\n kORKVm: \"x1odjw0f\",\n k8WAf4: \"xp6hjv6\",\n kg3NbH: \"xg0ps1x\",\n $$css: true\n }\n};\ntype SheetProps = Omit<DialogTriggerProps, 'children'> & {\n children?: ReactNode;\n};\n\n/**\n * A modal panel that arrives from the edge of the screen — a side sheet on a\n * wide viewport, a bottom sheet on a narrow one. Open state is React Aria's:\n * pass `isOpen` with `onOpenChange` to control it, or `defaultOpen` to let it\n * keep its own.\n *\n * Composed rather than configured by props, because a sheet's header, body,\n * and footer all take arbitrary content — the parts are `Sheet.Content`,\n * `Sheet.Header`, `Sheet.Title`, `Sheet.Body`, and `Sheet.Footer`. A\n * `Button` or `IconButton` placed directly inside `Sheet` opens it, and one\n * given `slot=\"close\"` anywhere inside the content closes it; neither needs\n * a part of its own.\n *\n * `Sheet` is the trigger's half, so a sheet nothing on the page opens — one\n * a route shows, or a menu item raises — leaves it out and passes `isOpen`\n * and `onOpenChange` to `Sheet.Content` instead. Wrapped in `Sheet` with no\n * button inside it, React Aria warns that its press responder found nothing\n * to press.\n */\nfunction Sheet({\n children,\n ...props\n}: SheetProps) {\n return <DialogTrigger {...props}>{children}</DialogTrigger>;\n}\nfunction SheetBody({\n ref: callerRef,\n ...props\n}: HTMLAttributes<HTMLDivElement> & RefAttributes<HTMLDivElement>) {\n const ref = useRef<HTMLDivElement>(null);\n // A body its content runs past is a tab stop named by the title, so a\n // keyboard can scroll it, when nothing inside it takes focus; a call\n // site's own name, role and tabIndex still win. See useScrollStop.\n const title = useSlottedContext(HeadingContext, 'title');\n const scrollStop = useScrollStop(ref, {\n label: props['aria-label'],\n title: title?.id\n });\n // The body measures itself through its own ref, and the call site's lands\n // on the same element.\n const merged = useMemo(() => mergeRefs(ref, callerRef ?? undefined), [callerRef]);\n return <div {...scrollStop} {...props} ref={merged} {...mergeStyles(stylex.props(styles.body, overlay.modalBodyRing), props)} />;\n}\n\n/**\n * The panel itself, and the scrim behind it. Everything the sheet shows goes\n * in here; the trigger stays outside it, since the trigger lives in the page\n * while this is portalled out to the end of the body.\n *\n * A press on the scrim closes the sheet unless `isDismissable` says\n * otherwise — React Aria's own default is the reverse, and a sheet that\n * ignores a tap outside it reads as stuck.\n *\n * Inside `Sheet`, the open state is the trigger's. On its own, with no\n * trigger, it is this part's: `isOpen` with `onOpenChange` controls it, and\n * a `slot=\"close\"` button, Escape and the scrim all report through\n * `onOpenChange`, as they would to `Sheet`.\n *\n * The scrim draws at `z-index: 900`, over any page content layered below\n * that, such as a sticky header, and the panel draws inside it. A\n * `Snackbar` draws at 1000, so a toast raised from inside the sheet is read\n * over it, and React Aria's popovers and menus draw above both.\n */\nfunction SheetContent({\n children,\n className,\n container,\n defaultOpen,\n isDismissable = true,\n isKeyboardDismissDisabled,\n isOpen,\n onOpenChange,\n ref,\n style,\n ...props\n}: RefAttributes<HTMLDivElement> & SheetContentProps) {\n return <OverlayScope>\n <ModalOverlay defaultOpen={defaultOpen} isDismissable={isDismissable} isKeyboardDismissDisabled={isKeyboardDismissDisabled} isOpen={isOpen} onOpenChange={onOpenChange}\n // oxlint-disable-next-line typescript/no-deprecated -- its replacement, UNSAFE_PortalProvider, is not exported by react-aria-components\n UNSTABLE_portalContainer={container} {...stylex.props(overlay.scrim)}>\n <Modal\n // The panel, where the call site's class and style land, rather than\n // the dialog inside it, which takes the rest of the props.\n ref={ref} {...mergeStatefulStyles({\n className: \"x1n1nwrg x1u6grsq x1ioi8j8 xu2fq7p x18ihq2d x16dv9tl x1vnz5z6 x19dwuzr xuz63mn x1lym3mf xkducg2 xrzall9 xb0nsol xjslfuv x1gbqego x1cfajip xjg5lhu x1a37zkv xys6ro8 x6xk272 x9t1vth x19efjv6 x9f619 x139gbkf x78zum5 xdt5ytf x1l2rt3b xwvxfow x1ey2m1c x13vifvy xmpip4z xtijo5x xhi6v0a x1upgybz x7ab17h x11ijow0 xb3r6kr x1a148e8 x1mrd0q x5ubeis x1lodr2j x1uhho1l x19b5e0v xg4bq00 xg4jtgg xsds98l xixxii4\"\n }, {\n className,\n style\n })}>\n <Dialog {...props} {...stylex.props(overlay.modalDialog)}>\n {children}\n </Dialog>\n </Modal>\n </ModalOverlay>\n </OverlayScope>;\n}\n\n/**\n * The sheet's actions. The panel is pinned to the window's bottom edge in\n * both presentations, so they sit on that edge, and a toast rises clear of\n * them while the sheet is open rather than lying over its buttons. A side\n * sheet's are included: the toast is centred in the window, and on any\n * window narrower than about 1376px its 576 reach into the sheet's 400.\n */\nfunction SheetFooter({\n ref: callerRef,\n ...props\n}: HTMLAttributes<HTMLDivElement> & RefAttributes<HTMLDivElement>) {\n const ref = useRef<HTMLDivElement>(null);\n useHoldBottomEdge(ref, true);\n // The footer measures itself through its own ref, and the call site's\n // lands on the same element.\n const merged = useMemo(() => mergeRefs(ref, callerRef ?? undefined), [callerRef]);\n return <div {...props} ref={merged} {...mergeStyles({\n className: \"x12smttz x13fuv20 x178xt8z x9f619 x78zum5 x2lah0s x1a02dak x126z3so x1nhvcw1 x1qafhyn x8i8c5o x1clyivc xg0ps1x\"\n }, props)} />;\n}\n\n/**\n * The bottom sheets page's drag handle: a short bar above the sheet's\n * content, saying the panel is a bottom sheet. Place it first inside\n * `Sheet.Content`; above the medium breakpoint the panel is a side sheet and\n * this draws nothing.\n *\n * It is decoration rather than a control, and hidden from assistive\n * technology. Material's own handle drags a sheet between a collapsed and an\n * expanded height and dismisses it from the collapsed one; this panel has\n * one height and cannot be dragged, so a control that only looked draggable\n * would promise what it cannot do. Closing is already the scrim, Escape, and\n * any button given `slot=\"close\"`.\n */\nfunction SheetHandle(props: HTMLAttributes<HTMLDivElement> & RefAttributes<HTMLDivElement>) {\n return <div aria-hidden=\"true\" {...props} {...mergeStyles({\n className: \"x6s0dn4 x9f619 x1s85apg x37i4ze x2lah0s xl56j7k x1xg6qyv\"\n }, props)}>\n <span className=\"x1ccu2yh xwvh9j7 xqu0tyb x1dkaolv x9f619 x1g12otp x1td3qas\" />\n </div>;\n}\nfunction SheetHeader(props: HTMLAttributes<HTMLDivElement> & RefAttributes<HTMLDivElement>) {\n return <div {...props} {...mergeStyles({\n className: \"x6s0dn4 x1j6faob x1q0q8m5 xso031l x9f619 x78zum5 x2lah0s x1gka490 x1qughib x1cmllll xg0ps1x\"\n }, props)} />;\n}\n\n/**\n * Names the sheet. Rendered through React Aria's title slot, which is what\n * points the dialog's `aria-labelledby` at it — a sheet without one announces\n * itself as an unnamed dialog.\n */\nfunction SheetTitle(props: RefAttributes<HTMLHeadingElement> & SheetTitleProps) {\n return <Heading slot=\"title\" {...props} {...mergeStyles({\n className: \"x9f619 x1w5n3ug xdy5w5q xete2z3 x14ijtet xug9e1u x2divse x1ghz6dp xeuugli xj0a0fe\"\n }, props)} />;\n}\nSheet.Body = SheetBody;\nSheet.Content = SheetContent;\nSheet.Footer = SheetFooter;\nSheet.Handle = SheetHandle;\nSheet.Header = SheetHeader;\nSheet.Title = SheetTitle;\n\n// The dialog's own props, plus the scrim's open state and dismissal settings\n// and the panel's styling. A call site has no reason to know there are three\n// elements: `className` and `style` reach the panel, which is the one worth\n// restyling and positioning, the open state and the dismissal settings reach\n// the scrim, and everything else lands on the dialog.\n//\n// `isDismissable` is declared here rather than picked with its siblings,\n// since the picked one carries React Aria's documentation, whose default is\n// the reverse of this component's.\ntype SheetContentProps = Omit<DialogProps, 'className' | 'style'> & Pick<ModalOverlayProps, 'defaultOpen' | 'isKeyboardDismissDisabled' | 'isOpen' | 'onOpenChange'> & {\n /** A function may compute the class from the panel's render state. */\n className?: ClassNameOrFunction<ModalRenderProps>;\n /**\n * Where to portal the panel and scrim. Defaults to the container of the\n * `ThemeScope` around it, which keeps the sheet on that scope's tokens, or\n * to the end of `<body>` where there is none. A subtree themed through the\n * `themeScope` class has no container of its own, so point this inside it,\n * or the sheet renders outside and keeps the page's tokens.\n */\n container?: Element;\n /**\n * Whether a press on the scrim, outside the panel, closes the sheet.\n * `true` here where React Aria's own default is `false`, since a sheet\n * that ignores a tap outside it reads as stuck. Escape is\n * `isKeyboardDismissDisabled`'s, and this says nothing about it.\n * @default true\n */\n isDismissable?: boolean;\n /** A function may compute the style from the panel's render state. */\n style?: StyleOrFunction<ModalRenderProps>;\n};\ntype SheetTitleProps = HeadingProps;\nexport type { SheetContentProps, SheetProps, SheetTitleProps };\nexport { SheetBody, SheetContent, SheetFooter, SheetHandle, SheetHeader, SheetTitle };\nexport default Sheet;"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["c","_c","MouseEvent","ReactMouseEvent","ReactNode","PointerEvent","ReactPointerEvent","RefAttributes","SwitchFieldProps","RACSwitchFieldProps","SwitchButtonRenderProps","SwitchFieldRenderProps","stylex","useCallback","useRef","useState","SwitchButton","SwitchField","AccessibleName","ControlLabel","controlStyles","FieldMessage","invalidFrom","useFieldValidationBehavior","CheckGlyph","CloseGlyph","useRipple","focus","mergeStatefulStyles","colors","motion","radii","stateLayerOpacity","FORCED_COLORS","_temp","kLqNvP","styles","control","kgeoSG","kGOzcv","kpsdNU","kEoFBp","kGNEyG","kZKoxP","kB7OPa","kkrTdU","k1xSpc","kmuXW","kzqmXN","kjj79g","kVAEAm","$$css","handle","k6CgDc","kWkggS","kaIpWk","kMwMTN","kGuDYH","kIyJzY","k1ekBW","kAMwcw","handleActive","handleDisabled","handleError","handleOn","handleOnActive","handleOnDisabled","handlePressed","handleWithIcon","layer","kpwlN0","seat","k87sOh","seatAt","offset","val","undefined","seatDraggable","kFalU9","seatDragging","seatOn","track","kVAM5u","ksu8eU","kMzoRj","trackDisabled","trackError","trackOn","trackOnDisabled","trackOnError","hoverLayers","error","off","on","focusLayers","pressedLayers","TRAVEL","MOUSE_SLOP","TOUCH_SLOP","Drag","ReturnType","useHandleDrag","Ripple","HTMLSpanElement","SwitchProps","children","description","icon","unselectedIcon","Omit","buttonContent","icons","ripple","drag","state","interactive","isDisabled","isReadOnly","isSelected","tone","isInvalid","dragging","active","isHovered","isPressed","isFocusVisible","iconShown","props","controlReadOnly","controlDisabled","ringVisible","handlers","surface","drawsIcon","fieldContent","button","messages","Switch","t0","$","t1","t2","validationBehavior","T0","t3","t4","field","t5","t6","t7","t8","t9","t10","setOffset","origin","settled","cancelClick","Symbol","for","current","onPointerCancel","event","preventDefault","stopPropagation","onClickCapture","event_0","from","along","rtl","x","clientX","Math","abs","slop","next","min","max","base","onPointerMove","event_1","from_0","stopped","currentTarget","dispatchEvent","bubbles","pointerId","pointerType","input","closest","querySelector","focuses","preventScroll","click","onPointerUp","onPointerDown","event_2","touch","getComputedStyle","direction","setPointerCapture","stylex.props","_c","props"],"sources":["../../../src/components/switch/index.tsx"],"sourcesContent":["'use client';\n\n// React's event types are aliased because `useHandleDrag` also constructs a\n// DOM `PointerEvent`. Imported unaliased, the name shadows that constructor:\n// TypeScript still resolves the call to the global, since a type-only import\n// takes no value name, but a reader and a static analyser alike read it as\n// React's type, which has no runtime value behind it at all.\nimport type { MouseEvent as ReactMouseEvent, ReactNode, PointerEvent as ReactPointerEvent, RefAttributes } from 'react';\nimport type { SwitchFieldProps as RACSwitchFieldProps, SwitchButtonRenderProps, SwitchFieldRenderProps } from 'react-aria-components';\nimport * as stylex from '@stylexjs/stylex';\nimport { useCallback, useRef, useState } from 'react';\nimport { SwitchButton, SwitchField } from 'react-aria-components';\nimport type { AccessibleName } from '../../render/name';\nimport { ControlLabel } from '../../control';\nimport { controlStyles } from '../../control/styles';\nimport { FieldMessage } from '../../field';\nimport { invalidFrom, useFieldValidationBehavior } from '../../field/root';\nimport { CheckGlyph, CloseGlyph } from '../../glyphs';\nimport { useRipple } from '../../hooks/useRipple';\nimport { focus } from '../../styles/focus';\nimport { mergeStatefulStyles } from '../../styles/merge';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, motion, radii, stateLayerOpacity } from '../../tokens/design.tokens.stylex';\n\n// The switch page: a 52 by 32dp track with a 2dp outline and a full corner,\n// a handle that is 16dp off, 24dp on and 28dp while pressed, a 16dp icon in\n// the handle when asked for, a 40dp state layer around the handle and a 48dp\n// target. Off, the track is surface container highest inside an outline\n// rule and the handle is outline, turning on surface variant while hovered,\n// pressed or focused; on, the track is primary and the handle on primary,\n// turning primary container in the same states, with the icon in on primary\n// container. Disabled, the track and its rule are on surface at the\n// disabled container opacity and the handle on surface at the disabled\n// content opacity, or surface when on. The state layer is on surface off and\n// primary on.\n//\n// The page draws the icon in two forms: on the selected handle alone, which\n// is `icon`, and in both states, which adds `unselectedIcon`. An off handle\n// holding an icon is 24dp, as an on one is, and the icon in it is surface\n// container highest, faded to the disabled content opacity while disabled.\n// Either prop takes `true` for the page's own glyph, the check on and the\n// cross off, or a node to draw in its place. The handle sets the 16dp as a\n// font size and the colour as `color`, so a `1em` icon in `currentColor`\n// takes both, as the README asks of every icon.\n//\n// The page gives no error state, so an invalid switch takes the checkbox's\n// error colours rather than showing its problem in the message alone. The\n// track's rule is error, and so is the handle while the switch is off; on,\n// the track keeps its primary fill and the handle its on primary, so the\n// switch still reads as on inside an error rule. The state layer is error\n// either way, as the checkbox's is, and a disabled switch keeps its disabled\n// colours. Under forced colours the error colour goes with every other, and\n// the switch keeps the mapping below, so there the message says what is\n// wrong.\n//\n// React Aria's `SwitchField` is the root, a div holding the description and\n// error slots; its `SwitchButton` is the label around a visually hidden\n// input, and everything drawn is that label's children, chosen from the\n// render state React Aria hands them. The field is the two-column grid the\n// checkbox uses, with the label `display: contents`, so the description and\n// error line up under the text.\n//\n// The handle travels between the two ends of the track and grows between\n// its three sizes on the same transition, `motion.durationShort2` with the\n// standard easing; the state layer and the ripple sit on a 40dp disc centred\n// on the handle, so they move with it. The adjacent label is body-large on\n// surface, which the page keeps the same whichever way the switch is.\n//\n// The page's pressed handle follows the pointer: it grows, travels with the\n// drag, and the switch flips when it is released past the middle of the\n// track or springs back when it is not. React Aria's `SwitchButton` has no\n// drag of its own, so the travel is this component's — see `useHandleDrag`.\n//\n// Under forced colours the switch names system colours for its fills. That\n// mode paints an author's fill in the page's own `Canvas`, so the handle\n// vanished and on and off drew the same empty pill; a system colour is kept\n// rather than repainted. Off is a `ButtonText` handle in an empty track with\n// a `ButtonText` rule. On is a `HighlightText` handle in a track filled with\n// `Highlight`, the pair the mode gives whatever is chosen, with the check in\n// `Highlight` over the handle. Disabled, the same shapes are `GrayText`, and\n// the handle of a switch that is on is emptied to `Canvas` so it still shows\n// against its track. Every style that sets a fill repeats its branch, since\n// one written without the query replaces the property whole, branch and all.\n\n// Windows High Contrast and the rest of the forced-colours modes. Spelled\n// here rather than imported, for the reason src/field/styles.ts records: the\n// StyleX compiler resolves a constant across files only out of a `.stylex.ts`\n// module, and the generated one holds design tokens rather than queries.\nconst FORCED_COLORS = '@media (forced-colors: active)';\nconst _temp = {\n kLqNvP: \"x1lxsm33\",\n \"$$css\": true\n};\nconst styles = {\n control: {\n kgeoSG: \"x1cpjm7i\",\n kGOzcv: \"x1fb0czk\",\n kpsdNU: \"xm4btww\",\n kEoFBp: \"x1hmns74\",\n kGNEyG: \"x6s0dn4\",\n kZKoxP: \"x1vqgdyp\",\n kB7OPa: \"x9f619\",\n kkrTdU: \"x1ypdohk\",\n k1xSpc: \"x78zum5\",\n kmuXW: \"x2lah0s\",\n kzqmXN: \"xvni27\",\n kjj79g: \"xl56j7k\",\n kVAEAm: \"x1n2onr6\",\n $$css: true\n },\n handle: {\n k6CgDc: \"x12w9bfk\",\n kGNEyG: \"x6s0dn4\",\n kWkggS: \"xp2scj5 x1tt9vl1\",\n kZKoxP: \"xlup9mm\",\n kaIpWk: \"x16fbrrb\",\n kB7OPa: \"x9f619\",\n kMwMTN: \"x5yhsjm x1q5838n\",\n k1xSpc: \"x78zum5\",\n kGuDYH: \"x1j61zf2\",\n kzqmXN: \"x1kky2od\",\n kjj79g: \"xl56j7k\",\n kIyJzY: \"x1qno0dh\",\n k1ekBW: \"x7okvu4\",\n kAMwcw: \"xpc4ca7\",\n $$css: true\n },\n handleActive: {\n kWkggS: \"x1ccu2yh x1tt9vl1\",\n $$css: true\n },\n handleDisabled: {\n kWkggS: \"x1crcgwy x1o55y2u\",\n kMwMTN: \"xx09jb7 x1a46atw\",\n $$css: true\n },\n handleError: {\n kWkggS: \"xwi4nbo x1tt9vl1\",\n $$css: true\n },\n handleOn: {\n kWkggS: \"x1ntwmx2 x1sir5s4\",\n kZKoxP: \"xxk0z11\",\n kMwMTN: \"xscdzaa x6jt684\",\n kzqmXN: \"xvy4d1p\",\n $$css: true\n },\n handleOnActive: {\n kWkggS: \"xp89om9 x1sir5s4\",\n $$css: true\n },\n handleOnDisabled: {\n kWkggS: \"x14s9m32 x9yvj25\",\n kMwMTN: \"x1gpw424 x1bhcspo\",\n $$css: true\n },\n handlePressed: {\n kZKoxP: \"x1fgtraw\",\n kzqmXN: \"xgd8bvy\",\n $$css: true\n },\n handleWithIcon: {\n kZKoxP: \"xxk0z11\",\n kzqmXN: \"xvy4d1p\",\n $$css: true\n },\n layer: {\n k6CgDc: \"x12w9bfk\",\n kWkggS: \"xjbqb8w\",\n kZKoxP: \"x1vqgdyp\",\n kaIpWk: \"x16fbrrb\",\n kB7OPa: \"x9f619\",\n kzqmXN: \"x100vrsf\",\n kpwlN0: \"x1qx2jxi\",\n kVAEAm: \"x10l6tqk\",\n kIyJzY: \"x1qno0dh\",\n k1ekBW: \"x15406qy\",\n kAMwcw: \"xpc4ca7\",\n $$css: true\n },\n seat: {\n k6CgDc: \"x12w9bfk\",\n kGNEyG: \"x6s0dn4\",\n kZKoxP: \"x1fgtraw\",\n kB7OPa: \"x9f619\",\n k1xSpc: \"x78zum5\",\n kzqmXN: \"xgd8bvy\",\n k87sOh: \"x13vifvy\",\n kLqNvP: \"x1o0tod\",\n kjj79g: \"xl56j7k\",\n kVAEAm: \"x10l6tqk\",\n kIyJzY: \"x1qno0dh\",\n k1ekBW: \"x2hifos\",\n kAMwcw: \"xpc4ca7\",\n $$css: true\n },\n seatAt: (offset: number) => [_temp, {\n \"--x-insetInlineStart\": (val => typeof val === \"number\" ? val + \"px\" : val != null ? val : undefined)(`${offset}px`)\n }],\n seatDraggable: {\n kFalU9: \"x5ve5x3\",\n $$css: true\n },\n seatDragging: {\n kIyJzY: \"x1mq3mr6\",\n $$css: true\n },\n seatOn: {\n kLqNvP: \"x1n8ud3w\",\n $$css: true\n },\n track: {\n k6CgDc: \"x12w9bfk\",\n kWkggS: \"x1rrhr5q x9yvj25\",\n kZKoxP: \"x10w6t97\",\n kVAM5u: \"x1fwvt7v x1ylmb6m\",\n kaIpWk: \"x1dkaolv\",\n ksu8eU: \"x1y0btm7\",\n kMzoRj: \"xdh2fpr\",\n kB7OPa: \"x9f619\",\n kmuXW: \"x2lah0s\",\n kzqmXN: \"xvni27\",\n kVAEAm: \"x1n2onr6\",\n kIyJzY: \"x1qno0dh\",\n k1ekBW: \"xts7igz\",\n kAMwcw: \"xpc4ca7\",\n $$css: true\n },\n trackDisabled: {\n kWkggS: \"x1trd85j x9yvj25\",\n kVAM5u: \"xrh88j3 xmnqt3w\",\n $$css: true\n },\n trackError: {\n kVAM5u: \"xx78ee7 x1ylmb6m\",\n $$css: true\n },\n trackOn: {\n kWkggS: \"xnety89 x1jzqe4\",\n kVAM5u: \"x1uajy3w x1n2ykn\",\n $$css: true\n },\n trackOnDisabled: {\n kWkggS: \"x19v6zzp x1o55y2u\",\n kVAM5u: \"x9r1u3d xmnqt3w\",\n $$css: true\n },\n trackOnError: {\n kVAM5u: \"xx78ee7 x1n2ykn\",\n $$css: true\n }\n};\n\n// The state layer over the handle: on surface while the switch is off and\n// primary while it is on, at the hover or the pressed opacity, and error\n// either way while it is invalid.\nconst hoverLayers = {\n error: {\n kWkggS: \"x55e1u4\",\n $$css: true\n },\n off: {\n kWkggS: \"x1b18xnh\",\n $$css: true\n },\n on: {\n kWkggS: \"x659ado\",\n $$css: true\n }\n};\n\n// A keyboard's focus draws the hover layer's colour at the focus opacity.\nconst focusLayers = {\n error: {\n kWkggS: \"xyn212m\",\n $$css: true\n },\n off: {\n kWkggS: \"xwqhyid\",\n $$css: true\n },\n on: {\n kWkggS: \"x1sog3nf\",\n $$css: true\n }\n};\nconst pressedLayers = {\n error: {\n kWkggS: \"x3czxiy\",\n $$css: true\n },\n off: {\n kWkggS: \"xjeeohs\",\n $$css: true\n },\n on: {\n kWkggS: \"x1dvjsmr\",\n $$css: true\n }\n};\n\n// How far the seat travels: the track's 48dp inside its 2dp rule, less the\n// seat's own 28dp.\nconst TRAVEL = 20;\n\n// How far a press has to move before it is a drag, by the pointer making it.\n// Anything moves a little between pressing and lifting, and a press inside\n// this is still a tap, which flips the switch. A mouse moves a pixel or two,\n// so a quarter of the travel is room enough. A finger drifts further on an\n// ordinary tap — 6 to 10px was common — and under that same 5px the tap was\n// read as a drag let go before the middle, which settled where it began and\n// dropped the tap without a sign. A finger and a pen take half the travel,\n// the platforms' own touch slop; a drag past it is past the middle too.\nconst MOUSE_SLOP = TRAVEL / 4;\nconst TOUCH_SLOP = TRAVEL / 2;\ntype Drag = ReturnType<typeof useHandleDrag>;\ntype Ripple = ReturnType<typeof useRipple<HTMLSpanElement>>;\ntype SwitchProps = {\n /**\n * The label, beside the switch. A switch that a row labels some other way\n * leaves it out and passes `aria-label` or `aria-labelledby` instead — one\n * of the three is required, since a switch with none is announced as an\n * unnamed switch.\n *\n * A link or a button in it acts on its own, as in a native label, and\n * leaves the switch as it was. A press anywhere else in the label toggles\n * it.\n */\n children?: ReactNode;\n /**\n * A hint under the label. Replaced by `error` when there is one, so the\n * two never stack.\n */\n description?: string;\n /**\n * The problem with the current value, in words. Its presence is what puts\n * the switch in its error state — the error colours on the track and the\n * handle, the message and `aria-invalid` follow from it.\n *\n * Outside a `Form` the message line arrives with the message, so the\n * field grows when this does and moves what is under it. A `Form` holds\n * that space from the start; so does a permanent `description`.\n */\n error?: string;\n /**\n * The icon in the handle while the switch is on: `true` for the check, the\n * page's \"icon on selected switch\" form, or a node to draw in its place.\n * The handle draws it at 16px in its icon colour, so give a node `1em`\n * square in `currentColor`.\n * @default false\n */\n icon?: ReactNode;\n /**\n * The icon in the handle while the switch is off: `true` for the cross, or a\n * node to draw in its place. Given with `icon`, it is the page's form with\n * an icon in both states, and the off handle grows to the on handle's 24dp\n * to hold it.\n * @default false\n */\n unselectedIcon?: ReactNode;\n} & AccessibleName & Omit<RACSwitchFieldProps, 'children' | 'isInvalid' | 'validationBehavior'>;\n\n// What the label draws, chosen from the render state React Aria hands it.\n// Built by a call rather than written inline at the prop, which is what\n// react-perf's no-new-function-as-prop is after; the React Compiler memoises\n// the result on its inputs. The ripple's handlers and surface go on the\n// state layer while the switch can change, and are left off while it\n// cannot, since a press that changes nothing should not look like one.\nfunction buttonContent(children: ReactNode, icons: {\n off: ReactNode;\n on: ReactNode;\n}, ripple: Ripple, drag: Drag) {\n return (state: SwitchButtonRenderProps) => {\n const interactive = !state.isDisabled && !state.isReadOnly;\n const on = state.isSelected;\n const tone = state.isInvalid ? 'error' : on ? 'on' : 'off';\n const dragging = interactive && drag.offset !== null;\n const active = interactive && (state.isHovered || state.isPressed || state.isFocusVisible);\n const iconShown = on ? icons.on : icons.off;\n return <>\n <span {...stylex.props(styles.control, state.isReadOnly && controlStyles.controlReadOnly, state.isDisabled && controlStyles.controlDisabled)}>\n <span {...stylex.props(styles.track, on && styles.trackOn, state.isInvalid && (on ? styles.trackOnError : styles.trackError), state.isDisabled && (on ? styles.trackOnDisabled : styles.trackDisabled), state.isFocusVisible && focus.ringVisible)}>\n <span {...interactive ? drag.handlers(on) : {}} {...stylex.props(styles.seat, on && styles.seatOn, interactive && styles.seatDraggable, dragging && styles.seatDragging, dragging && styles.seatAt(drag.offset ?? 0))}>\n <span {...interactive ? ripple.handlers : {}} {...stylex.props(styles.layer, interactive && state.isHovered && hoverLayers[tone], interactive && state.isFocusVisible && focusLayers[tone], interactive && state.isPressed && pressedLayers[tone])}>\n {interactive ? ripple.surface : null}\n </span>\n <span {...stylex.props(styles.handle, on && styles.handleOn, active && (on ? styles.handleOnActive : styles.handleActive), !on && state.isInvalid && styles.handleError, !on && drawsIcon(icons.off) && styles.handleWithIcon, (dragging || interactive && state.isPressed) && styles.handlePressed, state.isDisabled && (on ? styles.handleOnDisabled : styles.handleDisabled))}>\n {iconShown}\n </span>\n </span>\n </span>\n </span>\n <ControlLabel state={state}>{children}</ControlLabel>\n </>;\n };\n}\n\n// Whether a handle icon prop draws anything: `false`, `null` and `undefined`\n// leave the handle empty, and so at its own size.\nfunction drawsIcon(icon: ReactNode) {\n return icon !== false && icon !== null && icon !== undefined;\n}\n\n// The button and the line under it, from the field's render state: the\n// description fades with a disabled switch, as its label does. Built by a\n// call for the same reason as `buttonContent`.\nfunction fieldContent(button: ReactNode, description: string | undefined, error: string | undefined) {\n return ({\n isDisabled\n }: SwitchFieldRenderProps) => <>\n {button}\n <div {...stylex.props(controlStyles.messages)}>\n <FieldMessage description={description} error={error} inset={false} isDisabled={isDisabled} />\n </div>\n </>;\n}\n\n/**\n * A switch that turns a setting on or off, with its label and optionally a\n * description or an error under it. Its state is React Aria's: pass\n * `isSelected` with `onChange` to control it, or `defaultSelected` to let it\n * keep its own. A switch takes effect as it is flipped, which is what sets\n * it apart from a checkbox in a form.\n *\n * The call site's `className` and `style` land on the field as a whole,\n * which is the element a layout positions.\n */\nfunction Switch({\n children,\n description,\n error,\n icon = false,\n unselectedIcon = false,\n ...props\n}: RefAttributes<HTMLDivElement> & SwitchProps) {\n const ripple = useRipple<HTMLSpanElement>();\n const drag = useHandleDrag();\n const validationBehavior = useFieldValidationBehavior();\n return <SwitchField isInvalid={invalidFrom(error)} validationBehavior={validationBehavior} {...props} {...mergeStatefulStyles(stylex.props(controlStyles.field), props)}>\n {fieldContent(<SwitchButton className=\"xjp7ctv\">\n {buttonContent(children, {\n off: unselectedIcon === true ? <CloseGlyph className=\"xlup9mm x1lliihq x1kky2od\" /> : unselectedIcon,\n on: icon === true ? <CheckGlyph className=\"xlup9mm x1lliihq x1kky2od\" /> : icon\n }, ripple, drag)}\n </SwitchButton>, description, error)}\n </SwitchField>;\n}\n\n/**\n * The handle following a pointer across the track, as the switch page draws\n * a pressed switch. The seat's inset comes from the drag while one is under\n * way, and the switch settles from where the handle was let go: on past the\n * middle of the track, off before it.\n *\n * What flips the switch on an ordinary tap is React Aria's own press, which\n * ends on the pointer being released and pays no attention to where the\n * handle was dragged to — so a drag has to end that press before releasing,\n * which is what the pointer cancel is for, and settle the switch itself.\n * Settling means clicking the field's own input, the same element a tap\n * reaches in the end: the change goes through React Aria, and a controlled\n * switch stays controlled, since nothing here calls `onChange` or holds any\n * state of the switch's own. The click the pointer's release sends after\n * that is cancelled too, so nothing flips the switch a second time.\n *\n * A press that moves no further than the slop is left alone entirely, so a\n * tap flips the switch however still the pointer was — a drag starts only\n * once the pointer passes it, and from then on the handle follows every move.\n * The slop is the pointer's own: a finger and a pen drift further on a tap\n * than a mouse does. A mouse or pen drag then focuses the input, as a tap\n * does.\n *\n * The guard for the click after a drag is cleared by the next press, not by\n * that click, since the click may never come: a touch dragged past the\n * browser's own slop sends none, and a guard left armed swallowed the next\n * tap instead.\n */\nfunction useHandleDrag() {\n const [offset, setOffset] = useState<null | number>(null);\n const origin = useRef<null | {\n base: number;\n focuses: boolean;\n on: boolean;\n rtl: boolean;\n slop: number;\n x: number;\n }>(null);\n const settled = useRef<null | number>(null);\n const cancelClick = useRef(false);\n const onPointerCancel = useCallback(() => {\n origin.current = null;\n settled.current = null;\n setOffset(null);\n }, []);\n const onClickCapture = useCallback((event: ReactMouseEvent<HTMLSpanElement>) => {\n if (!cancelClick.current) {\n return;\n }\n cancelClick.current = false;\n // The label's activation is the browser's own, so this is what stops the\n // input being flipped by a drag that settled where it began.\n event.preventDefault();\n event.stopPropagation();\n }, []);\n const onPointerMove = useCallback((event: ReactPointerEvent<HTMLSpanElement>) => {\n const from = origin.current;\n if (from === null) {\n return;\n }\n const along = from.rtl ? from.x - event.clientX : event.clientX - from.x;\n if (settled.current === null && Math.abs(along) <= from.slop) {\n return;\n }\n const next = Math.min(TRAVEL, Math.max(0, from.base + along));\n settled.current = next;\n setOffset(next);\n }, []);\n const onPointerUp = useCallback((event: ReactPointerEvent<HTMLSpanElement>) => {\n const from = origin.current;\n const stopped = settled.current;\n const seat = event.currentTarget;\n origin.current = null;\n settled.current = null;\n setOffset(null);\n // A press that never moved is a tap, which React Aria flips on its own.\n if (from === null || stopped === null) {\n return;\n }\n // React Aria's press is about to flip the switch from wherever it\n // started, so it is cancelled first — a pointer cancel is what ends a\n // press without firing it — and the drag settles the switch instead.\n seat.dispatchEvent(new PointerEvent('pointercancel', {\n bubbles: true,\n pointerId: event.pointerId,\n pointerType: event.pointerType\n }));\n // The pointer's own click follows this, by which time the switch has\n // already settled.\n cancelClick.current = true;\n const input = seat.closest('label')?.querySelector('input');\n // Where a tap leaves focus, a drag leaves it too, whichever side it\n // settles on. A tap reaches the input through the label, which focuses\n // it; the click below is programmatic and moves nothing, and React\n // Aria's press, which would, was cancelled above — so a mouse drag left\n // focus on the page, and a Space after it did nothing. A touch is left\n // alone, as a touch tap leaves no ring to find.\n if (from.focuses) {\n input?.focus({\n preventScroll: true\n });\n }\n if (stopped > TRAVEL / 2 === from.on) {\n return;\n }\n input?.click();\n }, []);\n const handlers = useCallback((on: boolean) => ({\n onClickCapture,\n onPointerCancel,\n onPointerDown: (event: ReactPointerEvent<HTMLSpanElement>) => {\n cancelClick.current = false;\n if (event.pointerType === 'mouse' && event.button !== 0) {\n return;\n }\n const touch = event.pointerType === 'touch';\n origin.current = {\n base: on ? TRAVEL : 0,\n focuses: !touch,\n on,\n rtl: getComputedStyle(event.currentTarget).direction === 'rtl',\n slop: touch || event.pointerType === 'pen' ? TOUCH_SLOP : MOUSE_SLOP,\n x: event.clientX\n };\n settled.current = null;\n try {\n event.currentTarget.setPointerCapture(event.pointerId);\n } catch {\n // A pointer the browser is not tracking has no capture to take —\n // a synthetic event in a test, where the moves are dispatched on\n // this element anyway.\n }\n },\n onPointerMove,\n onPointerUp\n }), [onClickCapture, onPointerCancel, onPointerMove, onPointerUp]);\n return {\n handlers,\n offset\n };\n}\nexport type { SwitchProps };\nexport default Switch;"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":["c","_c","MouseEvent","ReactMouseEvent","ReactNode","PointerEvent","ReactPointerEvent","RefAttributes","SwitchFieldProps","RACSwitchFieldProps","SwitchButtonRenderProps","SwitchFieldRenderProps","stylex","useCallback","useRef","useState","SwitchButton","SwitchField","AccessibleName","ControlLabel","controlStyles","FieldMessage","invalidFrom","useFieldValidationBehavior","CheckGlyph","CloseGlyph","useRipple","focus","mergeStatefulStyles","colors","motion","radii","stateLayerOpacity","FORCED_COLORS","_temp","kLqNvP","styles","control","kgeoSG","kGOzcv","kpsdNU","kEoFBp","kGNEyG","kZKoxP","kB7OPa","kkrTdU","k1xSpc","kmuXW","kzqmXN","kjj79g","kVAEAm","$$css","handle","k6CgDc","kWkggS","kaIpWk","kMwMTN","kGuDYH","kIyJzY","k1ekBW","kAMwcw","handleActive","handleDisabled","handleError","handleOn","handleOnActive","handleOnDisabled","handlePressed","handleWithIcon","layer","kpwlN0","seat","k87sOh","seatAt","offset","val","undefined","seatDraggable","kFalU9","seatDragging","seatOn","track","kVAM5u","ksu8eU","kMzoRj","trackDisabled","trackError","trackOn","trackOnDisabled","trackOnError","hoverLayers","error","off","on","focusLayers","pressedLayers","TRAVEL","MOUSE_SLOP","TOUCH_SLOP","Drag","ReturnType","useHandleDrag","Ripple","HTMLSpanElement","SwitchProps","children","description","icon","unselectedIcon","Omit","buttonContent","icons","ripple","drag","state","interactive","isDisabled","isReadOnly","isSelected","tone","isInvalid","dragging","active","isHovered","isPressed","isFocusVisible","iconShown","props","controlReadOnly","controlDisabled","ringVisible","handlers","surface","drawsIcon","fieldContent","button","messages","Switch","t0","$","t1","t2","validationBehavior","T0","t3","t4","field","t5","t6","t7","t8","t9","t10","setOffset","origin","settled","cancelClick","Symbol","for","current","onPointerCancel","event","preventDefault","stopPropagation","onClickCapture","event_0","from","along","rtl","x","clientX","Math","abs","slop","next","min","max","base","onPointerMove","event_1","from_0","stopped","currentTarget","dispatchEvent","bubbles","pointerId","pointerType","input","closest","querySelector","focuses","preventScroll","click","onPointerUp","onPointerDown","event_2","touch","getComputedStyle","direction","setPointerCapture","stylex.props","_c","props"],"sources":["../../../src/components/switch/index.tsx"],"sourcesContent":["'use client';\n\n// React's event types are aliased because `useHandleDrag` also constructs a\n// DOM `PointerEvent`. Imported unaliased, the name shadows that constructor:\n// TypeScript still resolves the call to the global, since a type-only import\n// takes no value name, but a reader and a static analyser alike read it as\n// React's type, which has no runtime value behind it at all.\nimport type { MouseEvent as ReactMouseEvent, ReactNode, PointerEvent as ReactPointerEvent, RefAttributes } from 'react';\nimport type { SwitchFieldProps as RACSwitchFieldProps, SwitchButtonRenderProps, SwitchFieldRenderProps } from 'react-aria-components';\nimport * as stylex from '@stylexjs/stylex';\nimport { useCallback, useRef, useState } from 'react';\nimport { SwitchButton, SwitchField } from 'react-aria-components';\nimport type { AccessibleName } from '../../render/name';\nimport { ControlLabel } from '../../control';\nimport { controlStyles } from '../../control/styles';\nimport { FieldMessage } from '../../field';\nimport { invalidFrom, useFieldValidationBehavior } from '../../field/root';\nimport { CheckGlyph, CloseGlyph } from '../../glyphs';\nimport { useRipple } from '../../hooks/useRipple';\nimport { focus } from '../../styles/focus';\nimport { mergeStatefulStyles } from '../../styles/merge';\nimport '../../tokens/design.tokens.stylex';\nimport { colors, motion, radii, stateLayerOpacity } from '../../tokens/design.tokens.stylex';\n\n// The switch page: a 52 by 32dp track with a 2dp outline and a full corner,\n// a handle that is 16dp off, 24dp on and 28dp while pressed, a 16dp icon in\n// the handle when asked for, a 40dp state layer around the handle and a 48dp\n// target. Off, the track is surface container highest inside an outline\n// rule and the handle is outline, turning on surface variant while hovered,\n// pressed or focused; on, the track is primary and the handle on primary,\n// turning primary container in the same states, with the icon in on primary\n// container. Disabled, the track and its rule are on surface at the\n// disabled container opacity and the handle on surface at the disabled\n// content opacity, or surface when on. The state layer is on surface off and\n// primary on.\n//\n// The page draws the icon in two forms: on the selected handle alone, which\n// is `icon`, and in both states, which adds `unselectedIcon`. An off handle\n// holding an icon is 24dp, as an on one is, and the icon in it is surface\n// container highest, faded to the disabled content opacity while disabled.\n// Either prop takes `true` for the page's own glyph, the check on and the\n// cross off, or a node to draw in its place. The handle sets the 16dp as a\n// font size and the colour as `color`, so a `1em` icon in `currentColor`\n// takes both, as the README asks of every icon.\n//\n// The page gives no error state, so an invalid switch takes the checkbox's\n// error colours rather than showing its problem in the message alone. The\n// track's rule is error, and so is the handle while the switch is off; on,\n// the track keeps its primary fill and the handle its on primary, so the\n// switch still reads as on inside an error rule. The state layer is error\n// either way, as the checkbox's is, and a disabled switch keeps its disabled\n// colours. Under forced colours the error colour goes with every other, and\n// the switch keeps the mapping below, so there the message says what is\n// wrong.\n//\n// React Aria's `SwitchField` is the root, a div holding the description and\n// error slots; its `SwitchButton` is the label around a visually hidden\n// input, and everything drawn is that label's children, chosen from the\n// render state React Aria hands them. The field is the two-column grid the\n// checkbox uses, with the label `display: contents`, so the description and\n// error line up under the text.\n//\n// The handle travels between the two ends of the track and grows between\n// its three sizes on the same transition, `motion.durationShort2` with the\n// standard easing; the state layer and the ripple sit on a 40dp disc centred\n// on the handle, so they move with it. The adjacent label is body-large on\n// surface, which the page keeps the same whichever way the switch is.\n//\n// The page's pressed handle follows the pointer: it grows, travels with the\n// drag, and the switch flips when it is released past the middle of the\n// track or springs back when it is not. React Aria's `SwitchButton` has no\n// drag of its own, so the travel is this component's — see `useHandleDrag`.\n//\n// Under forced colours the switch names system colours for its fills. That\n// mode paints an author's fill in the page's own `Canvas`, so the handle\n// vanished and on and off drew the same empty pill; a system colour is kept\n// rather than repainted. Off is a `ButtonText` handle in an empty track with\n// a `ButtonText` rule. On is a `HighlightText` handle in a track filled with\n// `Highlight`, the pair the mode gives whatever is chosen, with the check in\n// `Highlight` over the handle. Disabled, the same shapes are `GrayText`, and\n// the handle of a switch that is on is emptied to `Canvas` so it still shows\n// against its track. Every style that sets a fill repeats its branch, since\n// one written without the query replaces the property whole, branch and all.\n\n// Windows High Contrast and the rest of the forced-colours modes. Spelled\n// here rather than imported, for the reason src/field/styles.ts records: the\n// StyleX compiler resolves a constant across files only out of a `.stylex.ts`\n// module, and the generated one holds design tokens rather than queries.\nconst FORCED_COLORS = '@media (forced-colors: active)';\nconst _temp = {\n kLqNvP: \"x1lxsm33\",\n \"$$css\": true\n};\nconst styles = {\n control: {\n kgeoSG: \"x1cpjm7i\",\n kGOzcv: \"x1fb0czk\",\n kpsdNU: \"xm4btww\",\n kEoFBp: \"x1hmns74\",\n kGNEyG: \"x6s0dn4\",\n kZKoxP: \"x1vqgdyp\",\n kB7OPa: \"x9f619\",\n kkrTdU: \"x1ypdohk\",\n k1xSpc: \"x78zum5\",\n kmuXW: \"x2lah0s\",\n kzqmXN: \"xvni27\",\n kjj79g: \"xl56j7k\",\n kVAEAm: \"x1n2onr6\",\n $$css: true\n },\n handle: {\n k6CgDc: \"x12w9bfk\",\n kGNEyG: \"x6s0dn4\",\n kWkggS: \"xp2scj5 x1tt9vl1\",\n kZKoxP: \"xlup9mm\",\n kaIpWk: \"x16fbrrb\",\n kB7OPa: \"x9f619\",\n kMwMTN: \"x5yhsjm x1q5838n\",\n k1xSpc: \"x78zum5\",\n kGuDYH: \"x1j61zf2\",\n kzqmXN: \"x1kky2od\",\n kjj79g: \"xl56j7k\",\n kIyJzY: \"x1qno0dh\",\n k1ekBW: \"x7okvu4\",\n kAMwcw: \"xpc4ca7\",\n $$css: true\n },\n handleActive: {\n kWkggS: \"x1ccu2yh x1tt9vl1\",\n $$css: true\n },\n handleDisabled: {\n kWkggS: \"x1crcgwy x1o55y2u\",\n kMwMTN: \"xx09jb7 x1a46atw\",\n $$css: true\n },\n handleError: {\n kWkggS: \"xwi4nbo x1tt9vl1\",\n $$css: true\n },\n handleOn: {\n kWkggS: \"x1ntwmx2 x1sir5s4\",\n kZKoxP: \"xxk0z11\",\n kMwMTN: \"xscdzaa x6jt684\",\n kzqmXN: \"xvy4d1p\",\n $$css: true\n },\n handleOnActive: {\n kWkggS: \"xp89om9 x1sir5s4\",\n $$css: true\n },\n handleOnDisabled: {\n kWkggS: \"x14s9m32 x9yvj25\",\n kMwMTN: \"x1gpw424 x1bhcspo\",\n $$css: true\n },\n handlePressed: {\n kZKoxP: \"x1fgtraw\",\n kzqmXN: \"xgd8bvy\",\n $$css: true\n },\n handleWithIcon: {\n kZKoxP: \"xxk0z11\",\n kzqmXN: \"xvy4d1p\",\n $$css: true\n },\n layer: {\n k6CgDc: \"x12w9bfk\",\n kWkggS: \"xjbqb8w\",\n kZKoxP: \"x1vqgdyp\",\n kaIpWk: \"x16fbrrb\",\n kB7OPa: \"x9f619\",\n kzqmXN: \"x100vrsf\",\n kpwlN0: \"x1qx2jxi\",\n kVAEAm: \"x10l6tqk\",\n kIyJzY: \"x1qno0dh\",\n k1ekBW: \"x15406qy\",\n kAMwcw: \"xpc4ca7\",\n $$css: true\n },\n seat: {\n k6CgDc: \"x12w9bfk\",\n kGNEyG: \"x6s0dn4\",\n kZKoxP: \"x1fgtraw\",\n kB7OPa: \"x9f619\",\n k1xSpc: \"x78zum5\",\n kzqmXN: \"xgd8bvy\",\n k87sOh: \"x13vifvy\",\n kLqNvP: \"x1o0tod\",\n kjj79g: \"xl56j7k\",\n kVAEAm: \"x10l6tqk\",\n kIyJzY: \"x1qno0dh\",\n k1ekBW: \"x2hifos\",\n kAMwcw: \"xpc4ca7\",\n $$css: true\n },\n seatAt: (offset: number) => [_temp, {\n \"--x-insetInlineStart\": (val => typeof val === \"number\" ? val + \"px\" : val != null ? val : undefined)(`${offset}px`)\n }],\n seatDraggable: {\n kFalU9: \"x5ve5x3\",\n $$css: true\n },\n seatDragging: {\n kIyJzY: \"x1mq3mr6\",\n $$css: true\n },\n seatOn: {\n kLqNvP: \"x1n8ud3w\",\n $$css: true\n },\n track: {\n k6CgDc: \"x12w9bfk\",\n kWkggS: \"x1rrhr5q x9yvj25\",\n kZKoxP: \"x10w6t97\",\n kVAM5u: \"x1fwvt7v x1ylmb6m\",\n kaIpWk: \"x1dkaolv\",\n ksu8eU: \"x1y0btm7\",\n kMzoRj: \"xdh2fpr\",\n kB7OPa: \"x9f619\",\n kmuXW: \"x2lah0s\",\n kzqmXN: \"xvni27\",\n kVAEAm: \"x1n2onr6\",\n kIyJzY: \"x1qno0dh\",\n k1ekBW: \"xts7igz\",\n kAMwcw: \"xpc4ca7\",\n $$css: true\n },\n trackDisabled: {\n kWkggS: \"x1trd85j x9yvj25\",\n kVAM5u: \"xrh88j3 xmnqt3w\",\n $$css: true\n },\n trackError: {\n kVAM5u: \"xx78ee7 x1ylmb6m\",\n $$css: true\n },\n trackOn: {\n kWkggS: \"xnety89 x1jzqe4\",\n kVAM5u: \"x1uajy3w x1n2ykn\",\n $$css: true\n },\n trackOnDisabled: {\n kWkggS: \"x19v6zzp x1o55y2u\",\n kVAM5u: \"x9r1u3d xmnqt3w\",\n $$css: true\n },\n trackOnError: {\n kVAM5u: \"xx78ee7 x1n2ykn\",\n $$css: true\n }\n};\n\n// The state layer over the handle: on surface while the switch is off and\n// primary while it is on, at the hover or the pressed opacity, and error\n// either way while it is invalid.\nconst hoverLayers = {\n error: {\n kWkggS: \"x55e1u4\",\n $$css: true\n },\n off: {\n kWkggS: \"x1b18xnh\",\n $$css: true\n },\n on: {\n kWkggS: \"x659ado\",\n $$css: true\n }\n};\n\n// A keyboard's focus draws the hover layer's colour at the focus opacity.\nconst focusLayers = {\n error: {\n kWkggS: \"xyn212m\",\n $$css: true\n },\n off: {\n kWkggS: \"xwqhyid\",\n $$css: true\n },\n on: {\n kWkggS: \"x1sog3nf\",\n $$css: true\n }\n};\nconst pressedLayers = {\n error: {\n kWkggS: \"x3czxiy\",\n $$css: true\n },\n off: {\n kWkggS: \"xjeeohs\",\n $$css: true\n },\n on: {\n kWkggS: \"x1dvjsmr\",\n $$css: true\n }\n};\n\n// How far the seat travels: the track's 48dp inside its 2dp rule, less the\n// seat's own 28dp.\nconst TRAVEL = 20;\n\n// How far a press has to move before it is a drag, by the pointer making it.\n// Anything moves a little between pressing and lifting, and a press inside\n// this is still a tap, which flips the switch. A mouse moves a pixel or two,\n// so a quarter of the travel is room enough. A finger drifts further on an\n// ordinary tap — 6 to 10px was common — and under that same 5px the tap was\n// read as a drag let go before the middle, which settled where it began and\n// dropped the tap without a sign. A finger and a pen take half the travel,\n// the platforms' own touch slop; a drag past it is past the middle too.\nconst MOUSE_SLOP = TRAVEL / 4;\nconst TOUCH_SLOP = TRAVEL / 2;\ntype Drag = ReturnType<typeof useHandleDrag>;\ntype Ripple = ReturnType<typeof useRipple<HTMLSpanElement>>;\ntype SwitchProps = {\n /**\n * The label, beside the switch. A switch that a row labels some other way\n * leaves it out and passes `aria-label` or `aria-labelledby` instead — one\n * of the three is required, since a switch with none is announced as an\n * unnamed switch.\n *\n * A link or a button in it acts on its own, as in a native label, and\n * leaves the switch as it was. A press anywhere else in the label toggles\n * it.\n */\n children?: ReactNode;\n /**\n * A hint under the label. Replaced by `error` when there is one, so the\n * two never stack.\n */\n description?: string;\n /**\n * The problem with the current value, in words. Its presence is what puts\n * the switch in its error state — the error colours on the track and the\n * handle, the message and `aria-invalid` follow from it.\n *\n * Outside a `Form` the message line arrives with the message, so the\n * field grows when this does and moves what is under it. A `Form` holds\n * that space from the start; so does a permanent `description`.\n */\n error?: string;\n /**\n * The icon in the handle while the switch is on: `true` for the check, the\n * page's \"icon on selected switch\" form, or a node to draw in its place.\n * The handle draws it at 16px in its icon colour, so give a node `1em`\n * square in `currentColor`.\n * @default false\n */\n icon?: ReactNode;\n /**\n * The icon in the handle while the switch is off: `true` for the cross, or a\n * node to draw in its place. Given with `icon`, it is the page's form with\n * an icon in both states, and the off handle grows to the on handle's 24dp\n * to hold it.\n * @default false\n */\n unselectedIcon?: ReactNode;\n} & AccessibleName & Omit<RACSwitchFieldProps, 'children' | 'isInvalid' | 'validationBehavior'>;\n\n// What the label draws, chosen from the render state React Aria hands it.\n// Built by a call rather than written inline at the prop, which is what\n// react-perf's no-new-function-as-prop is after; the React Compiler memoises\n// the result on its inputs. The ripple's handlers and surface go on the\n// state layer while the switch can change, and are left off while it\n// cannot, since a press that changes nothing should not look like one.\nfunction buttonContent(children: ReactNode, icons: {\n off: ReactNode;\n on: ReactNode;\n}, ripple: Ripple, drag: Drag) {\n return (state: SwitchButtonRenderProps) => {\n const interactive = !state.isDisabled && !state.isReadOnly;\n const on = state.isSelected;\n const tone = state.isInvalid ? 'error' : on ? 'on' : 'off';\n const dragging = interactive && drag.offset !== null;\n const active = interactive && (state.isHovered || state.isPressed || state.isFocusVisible);\n const iconShown = on ? icons.on : icons.off;\n return <>\n <span {...stylex.props(styles.control, state.isReadOnly && controlStyles.controlReadOnly, state.isDisabled && controlStyles.controlDisabled)}>\n <span {...stylex.props(styles.track, on && styles.trackOn, state.isInvalid && (on ? styles.trackOnError : styles.trackError), state.isDisabled && (on ? styles.trackOnDisabled : styles.trackDisabled), state.isFocusVisible && focus.ringVisible)}>\n <span {...interactive ? drag.handlers(on) : {}} {...stylex.props(styles.seat, on && styles.seatOn, interactive && styles.seatDraggable, dragging && styles.seatDragging, dragging && styles.seatAt(drag.offset ?? 0))}>\n <span {...interactive ? ripple.handlers : {}} {...stylex.props(styles.layer, interactive && state.isHovered && hoverLayers[tone], interactive && state.isFocusVisible && focusLayers[tone], interactive && state.isPressed && pressedLayers[tone])}>\n {interactive ? ripple.surface : null}\n </span>\n <span {...stylex.props(styles.handle, on && styles.handleOn, active && (on ? styles.handleOnActive : styles.handleActive), !on && state.isInvalid && styles.handleError, !on && drawsIcon(icons.off) && styles.handleWithIcon, (dragging || interactive && state.isPressed) && styles.handlePressed, state.isDisabled && (on ? styles.handleOnDisabled : styles.handleDisabled))}>\n {iconShown}\n </span>\n </span>\n </span>\n </span>\n <ControlLabel state={state}>{children}</ControlLabel>\n </>;\n };\n}\n\n// Whether a handle icon prop draws anything: `false`, `null` and `undefined`\n// leave the handle empty, and so at its own size.\nfunction drawsIcon(icon: ReactNode) {\n return icon !== false && icon !== null && icon !== undefined;\n}\n\n// The button and the line under it, from the field's render state: the\n// description fades with a disabled switch, as its label does. Built by a\n// call for the same reason as `buttonContent`.\nfunction fieldContent(button: ReactNode, description: string | undefined, error: string | undefined) {\n return ({\n isDisabled\n }: SwitchFieldRenderProps) => <>\n {button}\n <div {...stylex.props(controlStyles.messages)}>\n <FieldMessage description={description} error={error} indent inset={false} isDisabled={isDisabled} />\n </div>\n </>;\n}\n\n/**\n * A switch that turns a setting on or off, with its label and optionally a\n * description or an error under it. Its state is React Aria's: pass\n * `isSelected` with `onChange` to control it, or `defaultSelected` to let it\n * keep its own. A switch takes effect as it is flipped, which is what sets\n * it apart from a checkbox in a form.\n *\n * The call site's `className` and `style` land on the field as a whole,\n * which is the element a layout positions.\n */\nfunction Switch({\n children,\n description,\n error,\n icon = false,\n unselectedIcon = false,\n ...props\n}: RefAttributes<HTMLDivElement> & SwitchProps) {\n const ripple = useRipple<HTMLSpanElement>();\n const drag = useHandleDrag();\n const validationBehavior = useFieldValidationBehavior();\n return <SwitchField isInvalid={invalidFrom(error)} validationBehavior={validationBehavior} {...props} {...mergeStatefulStyles(stylex.props(controlStyles.field), props)}>\n {fieldContent(<SwitchButton className=\"xjp7ctv\">\n {buttonContent(children, {\n off: unselectedIcon === true ? <CloseGlyph className=\"xlup9mm x1lliihq x1kky2od\" /> : unselectedIcon,\n on: icon === true ? <CheckGlyph className=\"xlup9mm x1lliihq x1kky2od\" /> : icon\n }, ripple, drag)}\n </SwitchButton>, description, error)}\n </SwitchField>;\n}\n\n/**\n * The handle following a pointer across the track, as the switch page draws\n * a pressed switch. The seat's inset comes from the drag while one is under\n * way, and the switch settles from where the handle was let go: on past the\n * middle of the track, off before it.\n *\n * What flips the switch on an ordinary tap is React Aria's own press, which\n * ends on the pointer being released and pays no attention to where the\n * handle was dragged to — so a drag has to end that press before releasing,\n * which is what the pointer cancel is for, and settle the switch itself.\n * Settling means clicking the field's own input, the same element a tap\n * reaches in the end: the change goes through React Aria, and a controlled\n * switch stays controlled, since nothing here calls `onChange` or holds any\n * state of the switch's own. The click the pointer's release sends after\n * that is cancelled too, so nothing flips the switch a second time.\n *\n * A press that moves no further than the slop is left alone entirely, so a\n * tap flips the switch however still the pointer was — a drag starts only\n * once the pointer passes it, and from then on the handle follows every move.\n * The slop is the pointer's own: a finger and a pen drift further on a tap\n * than a mouse does. A mouse or pen drag then focuses the input, as a tap\n * does.\n *\n * The guard for the click after a drag is cleared by the next press, not by\n * that click, since the click may never come: a touch dragged past the\n * browser's own slop sends none, and a guard left armed swallowed the next\n * tap instead.\n */\nfunction useHandleDrag() {\n const [offset, setOffset] = useState<null | number>(null);\n const origin = useRef<null | {\n base: number;\n focuses: boolean;\n on: boolean;\n rtl: boolean;\n slop: number;\n x: number;\n }>(null);\n const settled = useRef<null | number>(null);\n const cancelClick = useRef(false);\n const onPointerCancel = useCallback(() => {\n origin.current = null;\n settled.current = null;\n setOffset(null);\n }, []);\n const onClickCapture = useCallback((event: ReactMouseEvent<HTMLSpanElement>) => {\n if (!cancelClick.current) {\n return;\n }\n cancelClick.current = false;\n // The label's activation is the browser's own, so this is what stops the\n // input being flipped by a drag that settled where it began.\n event.preventDefault();\n event.stopPropagation();\n }, []);\n const onPointerMove = useCallback((event: ReactPointerEvent<HTMLSpanElement>) => {\n const from = origin.current;\n if (from === null) {\n return;\n }\n const along = from.rtl ? from.x - event.clientX : event.clientX - from.x;\n if (settled.current === null && Math.abs(along) <= from.slop) {\n return;\n }\n const next = Math.min(TRAVEL, Math.max(0, from.base + along));\n settled.current = next;\n setOffset(next);\n }, []);\n const onPointerUp = useCallback((event: ReactPointerEvent<HTMLSpanElement>) => {\n const from = origin.current;\n const stopped = settled.current;\n const seat = event.currentTarget;\n origin.current = null;\n settled.current = null;\n setOffset(null);\n // A press that never moved is a tap, which React Aria flips on its own.\n if (from === null || stopped === null) {\n return;\n }\n // React Aria's press is about to flip the switch from wherever it\n // started, so it is cancelled first — a pointer cancel is what ends a\n // press without firing it — and the drag settles the switch instead.\n seat.dispatchEvent(new PointerEvent('pointercancel', {\n bubbles: true,\n pointerId: event.pointerId,\n pointerType: event.pointerType\n }));\n // The pointer's own click follows this, by which time the switch has\n // already settled.\n cancelClick.current = true;\n const input = seat.closest('label')?.querySelector('input');\n // Where a tap leaves focus, a drag leaves it too, whichever side it\n // settles on. A tap reaches the input through the label, which focuses\n // it; the click below is programmatic and moves nothing, and React\n // Aria's press, which would, was cancelled above — so a mouse drag left\n // focus on the page, and a Space after it did nothing. A touch is left\n // alone, as a touch tap leaves no ring to find.\n if (from.focuses) {\n input?.focus({\n preventScroll: true\n });\n }\n if (stopped > TRAVEL / 2 === from.on) {\n return;\n }\n input?.click();\n }, []);\n const handlers = useCallback((on: boolean) => ({\n onClickCapture,\n onPointerCancel,\n onPointerDown: (event: ReactPointerEvent<HTMLSpanElement>) => {\n cancelClick.current = false;\n if (event.pointerType === 'mouse' && event.button !== 0) {\n return;\n }\n const touch = event.pointerType === 'touch';\n origin.current = {\n base: on ? TRAVEL : 0,\n focuses: !touch,\n on,\n rtl: getComputedStyle(event.currentTarget).direction === 'rtl',\n slop: touch || event.pointerType === 'pen' ? TOUCH_SLOP : MOUSE_SLOP,\n x: event.clientX\n };\n settled.current = null;\n try {\n event.currentTarget.setPointerCapture(event.pointerId);\n } catch {\n // A pointer the browser is not tracking has no capture to take —\n // a synthetic event in a test, where the moves are dispatched on\n // this element anyway.\n }\n },\n onPointerMove,\n onPointerUp\n }), [onClickCapture, onPointerCancel, onPointerMove, onPointerUp]);\n return {\n handlers,\n offset\n };\n}\nexport type { SwitchProps };\nexport default Switch;"],"mappings":"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"}
|