neba 1.13.0 → 1.16.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +22 -30
- package/dist/a2ui/catalog.json +1466 -0
- package/dist/a2ui/components.d.ts +21 -0
- package/dist/a2ui/components.js +1 -0
- package/dist/a2ui/index.d.ts +62 -0
- package/dist/a2ui/index.js +1 -0
- package/dist/a2ui/schema.d.ts +47 -0
- package/dist/a2ui/schema.js +1 -0
- package/dist/components/accordion/Accordion.d.ts +5 -1
- package/dist/components/accordion/Accordion.js +1 -1
- package/dist/components/agent-steps/AgentSteps.d.ts +80 -0
- package/dist/components/agent-steps/AgentSteps.js +1 -0
- package/dist/components/agent-steps/index.d.ts +2 -0
- package/dist/components/agent-steps/index.js +1 -0
- package/dist/components/alert/Alert.js +1 -1
- package/dist/components/anchor/Anchor.d.ts +3 -2
- package/dist/components/anchor/Anchor.js +1 -1
- package/dist/components/animate-appear/AnimateAppear.js +1 -1
- package/dist/components/animate-blink/AnimateBlink.d.ts +3 -0
- package/dist/components/animate-blink/AnimateBlink.js +1 -1
- package/dist/components/animate-counter/AnimateCounter.d.ts +3 -1
- package/dist/components/animate-counter/AnimateCounter.js +1 -1
- package/dist/components/animate-fade/AnimateFade.js +1 -1
- package/dist/components/animate-float/AnimateFloat.js +1 -1
- package/dist/components/animate-grow/AnimateGrow.js +1 -1
- package/dist/components/animate-headline/AnimateHeadline.d.ts +9 -2
- package/dist/components/animate-headline/AnimateHeadline.js +1 -1
- package/dist/components/animate-lighting/AnimateLighting.d.ts +1 -1
- package/dist/components/animate-lighting/AnimateLighting.js +1 -1
- package/dist/components/animate-marquee/AnimateMarquee.d.ts +15 -6
- package/dist/components/animate-marquee/AnimateMarquee.js +1 -1
- package/dist/components/animate-reveal/AnimateReveal.js +1 -1
- package/dist/components/animate-rotate/AnimateRotate.js +1 -1
- package/dist/components/animate-scramble/AnimateScramble.d.ts +5 -3
- package/dist/components/animate-scramble/AnimateScramble.js +1 -1
- package/dist/components/animate-shake/AnimateShake.js +1 -1
- package/dist/components/animate-slide/AnimateSlide.js +1 -1
- package/dist/components/animate-split/AnimateSplit.d.ts +3 -1
- package/dist/components/animate-split/AnimateSplit.js +1 -1
- package/dist/components/animate-typing/AnimateTyping.d.ts +12 -4
- package/dist/components/animate-typing/AnimateTyping.js +1 -1
- package/dist/components/animate-zoom/AnimateZoom.js +1 -1
- package/dist/components/app-logo/AppLogo.js +1 -1
- package/dist/components/approval/Approval.d.ts +115 -0
- package/dist/components/approval/Approval.js +1 -0
- package/dist/components/approval/index.d.ts +2 -0
- package/dist/components/approval/index.js +1 -0
- package/dist/components/area-chart/AreaChart.d.ts +16 -5
- package/dist/components/area-chart/AreaChart.js +1 -1
- package/dist/components/aspect-ratio/AspectRatio.d.ts +6 -4
- package/dist/components/aspect-ratio/AspectRatio.js +1 -1
- package/dist/components/avatar/Avatar.js +1 -1
- package/dist/components/badge/Badge.js +1 -1
- package/dist/components/bar-chart/BarChart.d.ts +1 -1
- package/dist/components/bar-chart/BarChart.js +1 -1
- package/dist/components/blockquote/Blockquote.js +1 -1
- package/dist/components/bottom-navigation/BottomNavigation.d.ts +2 -1
- package/dist/components/bottom-navigation/BottomNavigation.js +1 -1
- package/dist/components/box/Box.d.ts +5 -0
- package/dist/components/box/Box.js +1 -1
- package/dist/components/breadcrumb/Breadcrumb.d.ts +10 -0
- package/dist/components/breadcrumb/Breadcrumb.js +1 -1
- package/dist/components/button/Button.d.ts +11 -0
- package/dist/components/button/Button.js +1 -1
- package/dist/components/button-group/ButtonGroup.js +1 -1
- package/dist/components/calendar/Calendar.js +1 -1
- package/dist/components/card/Card.js +1 -1
- package/dist/components/carousel/Carousel.d.ts +4 -0
- package/dist/components/carousel/Carousel.js +1 -1
- package/dist/components/chat-bubble/ChatBubble.js +1 -1
- package/dist/components/checkbox/Checkbox.js +1 -1
- package/dist/components/chip/Chip.d.ts +3 -1
- package/dist/components/chip/Chip.js +1 -1
- package/dist/components/code-block/CodeBlock.d.ts +6 -3
- package/dist/components/code-block/CodeBlock.js +1 -1
- package/dist/components/collapsible/Collapsible.d.ts +11 -1
- package/dist/components/collapsible/Collapsible.js +1 -1
- package/dist/components/color-picker/ColorPicker.js +1 -1
- package/dist/components/combobox/Combobox.d.ts +11 -1
- package/dist/components/combobox/Combobox.js +1 -1
- package/dist/components/command-palette/CommandPalette.js +1 -1
- package/dist/components/confirm/Confirm.js +1 -1
- package/dist/components/container/Container.js +1 -1
- package/dist/components/context-window/ContextWindow.d.ts +103 -0
- package/dist/components/context-window/ContextWindow.js +1 -0
- package/dist/components/context-window/index.d.ts +2 -0
- package/dist/components/context-window/index.js +1 -0
- package/dist/components/data-list/DataList.js +1 -1
- package/dist/components/data-table/DataTable.d.ts +12 -1
- package/dist/components/data-table/DataTable.js +1 -1
- package/dist/components/date-picker/DatePicker.js +1 -1
- package/dist/components/date-range-picker/DateRangePicker.js +1 -1
- package/dist/components/date-time-picker/DateTimePicker.js +1 -1
- package/dist/components/dialog/Dialog.d.ts +12 -0
- package/dist/components/dialog/Dialog.js +1 -1
- package/dist/components/divider/Divider.js +1 -1
- package/dist/components/drawer/Drawer.d.ts +7 -0
- package/dist/components/drawer/Drawer.js +1 -1
- package/dist/components/empty/Empty.js +1 -1
- package/dist/components/fieldset/Fieldset.js +1 -1
- package/dist/components/file-picker/FilePicker.d.ts +12 -4
- package/dist/components/file-picker/FilePicker.js +1 -1
- package/dist/components/flex/Flex.d.ts +8 -2
- package/dist/components/flex/Flex.js +1 -1
- package/dist/components/floating-action-button/FloatingActionButton.d.ts +16 -1
- package/dist/components/floating-action-button/FloatingActionButton.js +1 -1
- package/dist/components/floating-bottom-navigation/FloatingBottomNavigation.js +1 -1
- package/dist/components/footer/Footer.d.ts +8 -0
- package/dist/components/footer/Footer.js +1 -1
- package/dist/components/form/Form.d.ts +4 -2
- package/dist/components/form/Form.js +1 -1
- package/dist/components/gallery/Gallery.d.ts +56 -3
- package/dist/components/gallery/Gallery.js +1 -1
- package/dist/components/gallery/GalleryViewer.js +1 -1
- package/dist/components/gauge-chart/GaugeChart.d.ts +1 -1
- package/dist/components/gauge-chart/GaugeChart.js +1 -1
- package/dist/components/grid/Grid.js +1 -1
- package/dist/components/grid-container/GridContainer.js +1 -1
- package/dist/components/header/Header.js +1 -1
- package/dist/components/heatmap-chart/HeatmapChart.d.ts +20 -1
- package/dist/components/heatmap-chart/HeatmapChart.js +1 -1
- package/dist/components/highlight/Highlight.js +1 -1
- package/dist/components/how-to-steps/HowToSteps.d.ts +26 -1
- package/dist/components/how-to-steps/HowToSteps.js +1 -1
- package/dist/components/icon/Icon.js +1 -1
- package/dist/components/icon-button/IconButton.d.ts +0 -20
- package/dist/components/icon-button/IconButton.js +1 -1
- package/dist/components/image/Image.d.ts +137 -11
- package/dist/components/image/Image.js +1 -1
- package/dist/components/image/index.d.ts +1 -1
- package/dist/components/inline-citation/InlineCitation.d.ts +53 -0
- package/dist/components/inline-citation/InlineCitation.js +1 -0
- package/dist/components/inline-citation/index.d.ts +2 -0
- package/dist/components/inline-citation/index.js +1 -0
- package/dist/components/line-chart/LineChart.d.ts +16 -5
- package/dist/components/line-chart/LineChart.js +1 -1
- package/dist/components/list/List.js +1 -1
- package/dist/components/menu/Menu.d.ts +25 -11
- package/dist/components/menu/Menu.js +1 -1
- package/dist/components/menubar/Menubar.js +1 -1
- package/dist/components/meter/Meter.d.ts +6 -0
- package/dist/components/meter/Meter.js +1 -1
- package/dist/components/mockup/Mockup.js +1 -1
- package/dist/components/navigation-menu/NavigationMenu.d.ts +10 -1
- package/dist/components/navigation-menu/NavigationMenu.js +1 -1
- package/dist/components/number-field/NumberField.d.ts +20 -6
- package/dist/components/number-field/NumberField.js +1 -1
- package/dist/components/otp-field/OtpField.d.ts +7 -0
- package/dist/components/otp-field/OtpField.js +1 -1
- package/dist/components/overlay/Overlay.d.ts +1 -1
- package/dist/components/overlay/Overlay.js +1 -1
- package/dist/components/page-layout/PageLayout.d.ts +11 -0
- package/dist/components/page-layout/PageLayout.js +1 -1
- package/dist/components/pagination/Pagination.js +1 -1
- package/dist/components/panes/Panes.d.ts +11 -0
- package/dist/components/panes/Panes.js +1 -1
- package/dist/components/pie-chart/PieChart.d.ts +34 -3
- package/dist/components/pie-chart/PieChart.js +1 -1
- package/dist/components/pill/Pill.d.ts +8 -0
- package/dist/components/pill/Pill.js +1 -1
- package/dist/components/popconfirm/Popconfirm.d.ts +10 -3
- package/dist/components/popconfirm/Popconfirm.js +1 -1
- package/dist/components/popover/Popover.d.ts +8 -1
- package/dist/components/popover/Popover.js +1 -1
- package/dist/components/portal/Portal.js +1 -1
- package/dist/components/progress-box/ProgressBox.js +1 -1
- package/dist/components/progress-circular/ProgressCircular.js +1 -1
- package/dist/components/progress-linear/ProgressLinear.js +1 -1
- package/dist/components/prompt-input/PromptInput.d.ts +104 -0
- package/dist/components/prompt-input/PromptInput.js +1 -0
- package/dist/components/prompt-input/index.d.ts +2 -0
- package/dist/components/prompt-input/index.js +1 -0
- package/dist/components/provider/NebaProvider.d.ts +3 -3
- package/dist/components/provider/NebaProvider.js +1 -1
- package/dist/components/radio-group/RadioGroup.js +1 -1
- package/dist/components/rating/Rating.d.ts +4 -1
- package/dist/components/rating/Rating.js +1 -1
- package/dist/components/reasoning/Reasoning.d.ts +78 -0
- package/dist/components/reasoning/Reasoning.js +1 -0
- package/dist/components/reasoning/index.d.ts +2 -0
- package/dist/components/reasoning/index.js +1 -0
- package/dist/components/scatter-chart/ScatterChart.js +1 -1
- package/dist/components/scroll-area/ScrollArea.js +1 -1
- package/dist/components/scroll-zone/ScrollZone.d.ts +10 -0
- package/dist/components/scroll-zone/ScrollZone.js +1 -1
- package/dist/components/segmented-button/SegmentedButton.js +1 -1
- package/dist/components/select/Select.js +1 -1
- package/dist/components/shortcut/Shortcut.js +1 -1
- package/dist/components/show/Show.d.ts +6 -5
- package/dist/components/show/Show.js +1 -1
- package/dist/components/sidebar/Sidebar.d.ts +7 -5
- package/dist/components/sidebar/Sidebar.js +1 -1
- package/dist/components/sidebar/SidebarTrigger.js +1 -1
- package/dist/components/skeleton/Skeleton.d.ts +1 -1
- package/dist/components/skeleton/Skeleton.js +1 -1
- package/dist/components/slider/Slider.d.ts +13 -1
- package/dist/components/slider/Slider.js +1 -1
- package/dist/components/sources/Sources.d.ts +78 -0
- package/dist/components/sources/Sources.js +1 -0
- package/dist/components/sources/index.d.ts +2 -0
- package/dist/components/sources/index.js +1 -0
- package/dist/components/sparkline/Sparkline.d.ts +14 -1
- package/dist/components/sparkline/Sparkline.js +1 -1
- package/dist/components/spoiler/Spoiler.js +1 -1
- package/dist/components/stack/Stack.d.ts +2 -2
- package/dist/components/stack/Stack.js +1 -1
- package/dist/components/statistic/Statistic.js +1 -1
- package/dist/components/streaming-text/StreamingText.d.ts +75 -0
- package/dist/components/streaming-text/StreamingText.js +1 -0
- package/dist/components/streaming-text/index.d.ts +2 -0
- package/dist/components/streaming-text/index.js +1 -0
- package/dist/components/switch/Switch.js +1 -1
- package/dist/components/table/Table.d.ts +8 -2
- package/dist/components/table/Table.js +1 -1
- package/dist/components/tabs/Tabs.d.ts +17 -1
- package/dist/components/tabs/Tabs.js +1 -1
- package/dist/components/text-field/TextField.js +1 -1
- package/dist/components/text-link/TextLink.js +1 -1
- package/dist/components/time-picker/TimePicker.js +1 -1
- package/dist/components/timeline/Timeline.d.ts +8 -0
- package/dist/components/timeline/Timeline.js +1 -1
- package/dist/components/timeline-chart/TimelineChart.js +1 -1
- package/dist/components/toast/Toast.d.ts +9 -3
- package/dist/components/toast/Toast.js +1 -1
- package/dist/components/toggle/Toggle.js +1 -1
- package/dist/components/toggle-group/ToggleGroup.js +1 -1
- package/dist/components/tool-call/ToolCall.d.ts +104 -0
- package/dist/components/tool-call/ToolCall.js +1 -0
- package/dist/components/tool-call/index.d.ts +2 -0
- package/dist/components/tool-call/index.js +1 -0
- package/dist/components/toolbar/Toolbar.d.ts +8 -0
- package/dist/components/toolbar/Toolbar.js +1 -1
- package/dist/components/tooltip/Tooltip.js +1 -1
- package/dist/components/tour/Tour.d.ts +2 -0
- package/dist/components/tour/Tour.js +1 -1
- package/dist/components/transfer/Transfer.js +1 -1
- package/dist/components/tree-select/TreeSelect.js +1 -1
- package/dist/components/tree-view/TreeView.d.ts +6 -0
- package/dist/components/tree-view/TreeView.js +1 -1
- package/dist/components/typography/Typography.js +1 -1
- package/dist/components/visually-hidden/VisuallyHidden.d.ts +9 -7
- package/dist/components/visually-hidden/VisuallyHidden.js +1 -1
- package/dist/components/window-pane/WindowPane.d.ts +2 -2
- package/dist/components/window-pane/WindowPane.js +1 -1
- package/dist/hooks/useElementSize.d.ts +3 -1
- package/dist/hooks/useElementSize.js +1 -1
- package/dist/hooks/useOnScreen.d.ts +3 -0
- package/dist/hooks/useOnScreen.js +1 -1
- package/dist/index.d.ts +9 -0
- package/dist/index.js +1 -1
- package/dist/internal/animate.d.ts +63 -16
- package/dist/internal/animate.js +1 -1
- package/dist/internal/calendar.d.ts +6 -1
- package/dist/internal/calendar.js +1 -1
- package/dist/internal/chart-brush.d.ts +53 -0
- package/dist/internal/chart-brush.js +1 -0
- package/dist/internal/chart-frame.d.ts +186 -30
- package/dist/internal/chart-frame.js +1 -1
- package/dist/internal/chart-line.js +1 -1
- package/dist/internal/chart.d.ts +133 -6
- package/dist/internal/chart.js +1 -1
- package/dist/internal/children.d.ts +15 -0
- package/dist/internal/children.js +1 -0
- package/dist/internal/color.d.ts +4 -0
- package/dist/internal/color.js +1 -1
- package/dist/internal/csv.d.ts +12 -1
- package/dist/internal/csv.js +1 -1
- package/dist/internal/data-table.d.ts +28 -10
- package/dist/internal/data-table.js +1 -1
- package/dist/internal/date.d.ts +12 -5
- package/dist/internal/date.js +1 -1
- package/dist/internal/defaults.d.ts +6 -1
- package/dist/internal/defaults.js +1 -1
- package/dist/internal/drag.d.ts +13 -1
- package/dist/internal/drag.js +1 -1
- package/dist/internal/drop.d.ts +61 -0
- package/dist/internal/drop.js +1 -0
- package/dist/internal/fieldset.d.ts +13 -0
- package/dist/internal/fieldset.js +1 -0
- package/dist/internal/glow.d.ts +102 -0
- package/dist/internal/glow.js +1 -0
- package/dist/internal/highlight.js +1 -1
- package/dist/internal/i18n.d.ts +232 -11
- package/dist/internal/i18n.js +1 -1
- package/dist/internal/icons.d.ts +13 -2
- package/dist/internal/icons.js +1 -1
- package/dist/internal/inert.d.ts +13 -0
- package/dist/internal/inert.js +1 -0
- package/dist/internal/initials.d.ts +8 -3
- package/dist/internal/initials.js +1 -1
- package/dist/internal/keys.d.ts +13 -0
- package/dist/internal/keys.js +1 -1
- package/dist/internal/link.d.ts +13 -15
- package/dist/internal/link.js +1 -1
- package/dist/internal/media.d.ts +9 -17
- package/dist/internal/media.js +1 -1
- package/dist/internal/menu.d.ts +6 -1
- package/dist/internal/mockup.d.ts +5 -4
- package/dist/internal/mockup.js +1 -1
- package/dist/internal/observe.d.ts +12 -0
- package/dist/internal/observe.js +1 -1
- package/dist/internal/page-layout.d.ts +10 -8
- package/dist/internal/page-layout.js +1 -1
- package/dist/internal/picker.d.ts +1 -1
- package/dist/internal/picker.js +1 -1
- package/dist/internal/progress.d.ts +11 -5
- package/dist/internal/progress.js +1 -1
- package/dist/internal/responsive.d.ts +0 -8
- package/dist/internal/responsive.js +1 -1
- package/dist/internal/run.d.ts +71 -0
- package/dist/internal/run.js +1 -0
- package/dist/internal/screen.d.ts +12 -0
- package/dist/internal/screen.js +1 -0
- package/dist/internal/styles.d.ts +185 -14
- package/dist/internal/styles.js +1 -1
- package/dist/internal/text.d.ts +3 -3
- package/dist/internal/text.js +1 -1
- package/dist/internal/window.js +1 -1
- package/dist/locales/ar.js +1 -1
- package/dist/locales/de.js +1 -1
- package/dist/locales/es.js +1 -1
- package/dist/locales/fr.js +1 -1
- package/dist/locales/hi.js +1 -1
- package/dist/locales/id.js +1 -1
- package/dist/locales/it.js +1 -1
- package/dist/locales/ja.js +1 -1
- package/dist/locales/ko.js +1 -1
- package/dist/locales/nl.js +1 -1
- package/dist/locales/pl.js +1 -1
- package/dist/locales/pt.js +1 -1
- package/dist/locales/ru.js +1 -1
- package/dist/locales/th.js +1 -1
- package/dist/locales/tr.js +1 -1
- package/dist/locales/vi.js +1 -1
- package/dist/locales/zh-hans.js +1 -1
- package/dist/locales/zh-hant.js +1 -1
- package/dist/styles.css +1 -1
- package/dist/tailwind.css +516 -53
- package/dist/types.d.ts +167 -7
- package/dist/types.js +0 -8
- package/package.json +43 -9
package/dist/internal/icons.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as r,jsxs as e}from"react/jsx-runtime";export function CloseIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m4.5 4.5 7 7m0-7-7 7",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function ChevronIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m4.5 6.5 3.5 3.5 3.5-3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export function CheckIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m3.5 8.5 3 3 6-6",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})})}export function MinusIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M3.5 8h9",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function PlusIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M8 3.5v9M3.5 8h9",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function TrendUpIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M3 11 6.5 7.5 9 10l4-4",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"}),r("path",{d:"M9.5 6h3.5v3.5",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function TrendDownIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M3 5 6.5 8.5 9 6l4 4",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"}),r("path",{d:"M9.5 10h3.5V6.5",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function CalendarIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("rect",{x:"2",y:"3.25",width:"12",height:"10.75",rx:"2",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M2 6.75h12",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M5.25 1.75v2.5M10.75 1.75v2.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function ClockIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M8 4.5V8l2.4 1.6",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function ArrowRightIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M3 8h10m-3.5-3.5L13 8l-3.5 3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export function LinkIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M6.5 9.5a2.75 2.75 0 0 0 4 .25l1.75-1.75a2.75 2.75 0 0 0-3.9-3.9L7.75 5.2",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("path",{d:"M9.5 6.5a2.75 2.75 0 0 0-4-.25L3.75 8a2.75 2.75 0 0 0 3.9 3.9l.6-.6",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function ExternalLinkIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M12.75 9.25v2.5a1.5 1.5 0 0 1-1.5 1.5h-7a1.5 1.5 0 0 1-1.5-1.5v-7a1.5 1.5 0 0 1 1.5-1.5h2.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("path",{d:"M9.5 2.75h3.75V6.5M7.25 8.75l5.75-5.75",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function CopyIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("rect",{x:"5.75",y:"5.75",width:"7.5",height:"7.5",rx:"1.75",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M10.25 3.6a1.85 1.85 0 0 0-1.5-.85h-4a2 2 0 0 0-2 2v4c0 .62.28 1.17.72 1.54",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function CodeIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M5.75 4.5 2.5 8l3.25 3.5m4.5-7L13.5 8l-3.25 3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export function RestartIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M13 8a5 5 0 1 1-1.6-3.67",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("path",{d:"M13.25 2.25v3h-3",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function PauseIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"currentColor","aria-hidden":"true",children:[r("rect",{x:"4",y:"3",width:"2.75",height:"10",rx:"1"}),r("rect",{x:"9.25",y:"3",width:"2.75",height:"10",rx:"1"})]})}export function PlayIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"currentColor","aria-hidden":"true",children:r("path",{d:"M5.5 3.6a1 1 0 0 1 1.53-.85l6.1 3.9a1.2 1.2 0 0 1 0 2.02l-6.1 3.9a1 1 0 0 1-1.53-.85V3.6Z"})})}export function EllipsisIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"3.5",cy:"8",r:"1.15",fill:"currentColor"}),r("circle",{cx:"8",cy:"8",r:"1.15",fill:"currentColor"}),r("circle",{cx:"12.5",cy:"8",r:"1.15",fill:"currentColor"})]})}const o="M8 1.4 9.71 5.65 14.28 5.96 10.76 8.9 11.88 13.34 8 10.9 4.12 13.34 5.24 8.9 1.72 5.96 6.29 5.65Z";export function StarIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:o,fill:"currentColor",stroke:"currentColor",strokeLinejoin:"round"})})}export function StarOutlineIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:o,stroke:"currentColor",strokeWidth:"1.25",strokeLinejoin:"round"})})}export function SpinnerIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",className:"animate-spin",children:[r("circle",{cx:"8",cy:"8",r:"6.5",stroke:"currentColor",strokeOpacity:"0.25",strokeWidth:"2"}),r("path",{d:"M14.5 8A6.5 6.5 0 0 0 8 1.5",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round"})]})}export function DotIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("circle",{cx:"8",cy:"8",r:"3.25",fill:"currentColor"})})}export function NoteIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M8 7.25v4",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("circle",{cx:"8",cy:"4.9",r:"0.85",fill:"currentColor"})]})}export function SuccessIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"m5.25 8.25 1.9 1.9 3.6-3.9",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function WarningIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M7.13 2.6 1.9 11.7a1 1 0 0 0 .87 1.5h10.46a1 1 0 0 0 .87-1.5L8.87 2.6a1 1 0 0 0-1.74 0Z",stroke:"currentColor",strokeWidth:"1.5",strokeLinejoin:"round"}),r("path",{d:"M8 6.1v3",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("circle",{cx:"8",cy:"11.2",r:"0.85",fill:"currentColor"})]})}export function DangerIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"m5.9 5.9 4.2 4.2m0-4.2-4.2 4.2",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function severityIcon(e){switch(e){case"success":return r(SuccessIcon,{});case"warning":return r(WarningIcon,{});case"danger":return r(DangerIcon,{});default:return r(NoteIcon,{})}}
|
|
1
|
+
import{jsx as r,jsxs as e}from"react/jsx-runtime";export function CloseIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m4.5 4.5 7 7m0-7-7 7",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function ChevronIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m4.5 6.5 3.5 3.5 3.5-3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export function CheckIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"m3.5 8.5 3 3 6-6",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})})}export function MinusIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M3.5 8h9",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function PlusIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M8 3.5v9M3.5 8h9",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round"})})}export function TrendUpIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M3 11 6.5 7.5 9 10l4-4",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"}),r("path",{d:"M9.5 6h3.5v3.5",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function TrendDownIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M3 5 6.5 8.5 9 6l4 4",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"}),r("path",{d:"M9.5 10h3.5V6.5",stroke:"currentColor",strokeWidth:"1.75",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function CalendarIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("rect",{x:"2",y:"3.25",width:"12",height:"10.75",rx:"2",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M2 6.75h12",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M5.25 1.75v2.5M10.75 1.75v2.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function ClockIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M8 4.5V8l2.4 1.6",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function ArrowRightIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M3 8h10m-3.5-3.5L13 8l-3.5 3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export function LinkIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M6.5 9.5a2.75 2.75 0 0 0 4 .25l1.75-1.75a2.75 2.75 0 0 0-3.9-3.9L7.75 5.2",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("path",{d:"M9.5 6.5a2.75 2.75 0 0 0-4-.25L3.75 8a2.75 2.75 0 0 0 3.9 3.9l.6-.6",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function ExternalLinkIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M12.75 9.25v2.5a1.5 1.5 0 0 1-1.5 1.5h-7a1.5 1.5 0 0 1-1.5-1.5v-7a1.5 1.5 0 0 1 1.5-1.5h2.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("path",{d:"M9.5 2.75h3.75V6.5M7.25 8.75l5.75-5.75",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function CopyIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("rect",{x:"5.75",y:"5.75",width:"7.5",height:"7.5",rx:"1.75",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M10.25 3.6a1.85 1.85 0 0 0-1.5-.85h-4a2 2 0 0 0-2 2v4c0 .62.28 1.17.72 1.54",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function CodeIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:"M5.75 4.5 2.5 8l3.25 3.5m4.5-7L13.5 8l-3.25 3.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})})}export function RestartIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M13 8a5 5 0 1 1-1.6-3.67",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("path",{d:"M13.25 2.25v3h-3",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function PauseIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"currentColor","aria-hidden":"true",children:[r("rect",{x:"4",y:"3",width:"2.75",height:"10",rx:"1"}),r("rect",{x:"9.25",y:"3",width:"2.75",height:"10",rx:"1"})]})}export function PlayIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"currentColor","aria-hidden":"true",children:r("path",{d:"M5.5 3.6a1 1 0 0 1 1.53-.85l6.1 3.9a1.2 1.2 0 0 1 0 2.02l-6.1 3.9a1 1 0 0 1-1.53-.85V3.6Z"})})}export function EllipsisIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"3.5",cy:"8",r:"1.15",fill:"currentColor"}),r("circle",{cx:"8",cy:"8",r:"1.15",fill:"currentColor"}),r("circle",{cx:"12.5",cy:"8",r:"1.15",fill:"currentColor"})]})}const o="M8 1.4 9.71 5.65 14.28 5.96 10.76 8.9 11.88 13.34 8 10.9 4.12 13.34 5.24 8.9 1.72 5.96 6.29 5.65Z";export function StarIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:o,fill:"currentColor",stroke:"currentColor",strokeLinejoin:"round"})})}export function StarOutlineIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("path",{d:o,stroke:"currentColor",strokeWidth:"1.25",strokeLinejoin:"round"})})}export function SpinnerIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",className:"animate-spin",children:[r("circle",{cx:"8",cy:"8",r:"6.5",stroke:"currentColor",strokeOpacity:"0.25",strokeWidth:"2"}),r("path",{d:"M14.5 8A6.5 6.5 0 0 0 8 1.5",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round"})]})}export function DotIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("circle",{cx:"8",cy:"8",r:"3.25",fill:"currentColor"})})}export function CircleIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5",strokeDasharray:"2 2.5",strokeLinecap:"round"})})}export function NoteIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"M8 7.25v4",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("circle",{cx:"8",cy:"4.9",r:"0.85",fill:"currentColor"})]})}export function SuccessIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"m5.25 8.25 1.9 1.9 3.6-3.9",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]})}export function WarningIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("path",{d:"M7.13 2.6 1.9 11.7a1 1 0 0 0 .87 1.5h10.46a1 1 0 0 0 .87-1.5L8.87 2.6a1 1 0 0 0-1.74 0Z",stroke:"currentColor",strokeWidth:"1.5",strokeLinejoin:"round"}),r("path",{d:"M8 6.1v3",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"}),r("circle",{cx:"8",cy:"11.2",r:"0.85",fill:"currentColor"})]})}export function DangerIcon(){return e("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[r("circle",{cx:"8",cy:"8",r:"6.25",stroke:"currentColor",strokeWidth:"1.5"}),r("path",{d:"m5.9 5.9 4.2 4.2m0-4.2-4.2 4.2",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function severityIcon(e){switch(e){case"success":return r(SuccessIcon,{});case"warning":return r(WarningIcon,{});case"danger":return r(DangerIcon,{});default:return r(NoteIcon,{})}}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* The value that puts `inert` on an element in the React the page is running.
|
|
3
|
+
*
|
|
4
|
+
* React 19 knows `inert` as a boolean attribute and writes it for `true`. React
|
|
5
|
+
* 18 does not know it at all: it drops a boolean on an attribute it does not
|
|
6
|
+
* know, with a warning, and writes a string as it is. So under 18 the attribute
|
|
7
|
+
* is only written for `''`, and under 19 an empty string is read as false and
|
|
8
|
+
* warned about. Both are inside the peer range, and a panel that is meant to be
|
|
9
|
+
* out of reach and is not is a keyboard reader tabbing into hidden content.
|
|
10
|
+
*
|
|
11
|
+
* `false` is always `undefined`, which removes the attribute under either.
|
|
12
|
+
*/
|
|
13
|
+
export declare function inertValue(on: boolean, version?: string): boolean | undefined;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import*as r from"react";export function inertValue(e,t=r.version){if(e)return Number.parseInt(t,10)>=19||""}
|
|
@@ -11,14 +11,19 @@
|
|
|
11
11
|
/**
|
|
12
12
|
* The first character of the first word, plus the first of the last.
|
|
13
13
|
*
|
|
14
|
-
*
|
|
15
|
-
*
|
|
16
|
-
*
|
|
14
|
+
* A grapheme rather than `[0]` or a code point, so a name that starts with an
|
|
15
|
+
* emoji is not cut apart: `👩💻` is three code points and `🇰🇷` is two, and
|
|
16
|
+
* taking the first of them drew `👩` and a lone `🇰`. `normalize('NFC')` first, so a name whose accents arrived decomposed —
|
|
17
17
|
* which is what a macOS filename and a good many APIs hand you — yields `Ä`
|
|
18
18
|
* rather than a bare `A`.
|
|
19
19
|
*
|
|
20
20
|
* One word gives one character on purpose. Korean, Japanese and Chinese names
|
|
21
21
|
* are a single token, and two of their characters at 32px is a smudge where one
|
|
22
22
|
* is a name.
|
|
23
|
+
*
|
|
24
|
+
* `toUpperCase()` rather than `toLocaleUpperCase()`, which with no argument
|
|
25
|
+
* takes the runtime's language: a server in one locale and a browser in Turkish
|
|
26
|
+
* would draw `I` and `İ` for the same name, and React reports the difference as
|
|
27
|
+
* a hydration mismatch.
|
|
23
28
|
*/
|
|
24
29
|
export declare function initialsOf(name: string): string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export function initialsOf(
|
|
1
|
+
import{graphemesOf as t}from"./text.js";export function initialsOf(e){const n=e.normalize("NFC").trim().split(/\s+/).filter(Boolean);if(0===n.length)return"";return((t(n[0])[0]??"")+(n.length>1?t(n[n.length-1])[0]??"":"")).toUpperCase()}
|
package/dist/internal/keys.d.ts
CHANGED
|
@@ -69,6 +69,13 @@ export interface KeyPress {
|
|
|
69
69
|
metaKey: boolean;
|
|
70
70
|
altKey: boolean;
|
|
71
71
|
shiftKey: boolean;
|
|
72
|
+
/** On a DOM event. React's synthetic one carries it on `nativeEvent`. */
|
|
73
|
+
isComposing?: boolean;
|
|
74
|
+
nativeEvent?: {
|
|
75
|
+
isComposing?: boolean;
|
|
76
|
+
};
|
|
77
|
+
/** `229` for a key an input method took. */
|
|
78
|
+
keyCode?: number;
|
|
72
79
|
}
|
|
73
80
|
/**
|
|
74
81
|
* Does this keystroke satisfy `Mod+Shift+P`?
|
|
@@ -77,6 +84,12 @@ export interface KeyPress {
|
|
|
77
84
|
* modifiers it wants, so `Enter` does not fire when `Mod+Enter` was pressed.
|
|
78
85
|
* That is what makes a `shortcuts` map unambiguous — at most one entry can
|
|
79
86
|
* match a keystroke, unless a caller spelled the same combination twice.
|
|
87
|
+
*
|
|
88
|
+
* Shift is the one exception, and only for a single key that is neither a
|
|
89
|
+
* letter nor a digit. On most layouts `?` is typed with Shift held, so asking
|
|
90
|
+
* for `?` and requiring Shift to be up was a shortcut that could never fire,
|
|
91
|
+
* and `Shift+/` fails too because `event.key` is already `?`. The character
|
|
92
|
+
* the reader typed says everything Shift did.
|
|
80
93
|
*/
|
|
81
94
|
export declare function matchesShortcut(event: KeyPress, shortcut: string): boolean;
|
|
82
95
|
/**
|
package/dist/internal/keys.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
const t={cmdorctrl:"mod",commandorcontrol:"mod",cmd:"meta",command:"meta",super:"meta",win:"meta",windows:"meta",control:"ctrl",option:"alt",opt:"alt",return:"enter",esc:"escape",del:"delete",caps:"capslock",spacebar:"space",up:"arrowup",down:"arrowdown",left:"arrowleft",right:"arrowright"};export function tokenize(t){return Array.isArray(t)?t.map(t=>t.trim()).filter(Boolean):t.split("+").map(t=>t.trim()).filter(Boolean)}export function canonicalKey(e){if(" "===e)return"space";const r=e.toLowerCase().replace(/[\s_-]/g,"");return t[r]??r}export function resolveOS(t,e,r){const n=t||e||r||"";return/mac|iphone|ipad|ipod/i.test(n)?"mac":/win/i.test(n)?"windows":"linux"}let e=null;export function readOS(){return e??=function(){if("undefined"==typeof navigator)return"windows";const t=navigator.userAgentData;return resolveOS(t?.platform,navigator.platform,navigator.userAgent)}(),e}export function matchesShortcut(t,e){const r=tokenize(e).map(canonicalKey);if(0===r.length)return!1;const n={ctrl:!1,meta:!1,alt:!1,shift:!1},o="mac"===readOS();for(const t of r.slice(0,-1))if("mod"===t)n[
|
|
1
|
+
const t={cmdorctrl:"mod",commandorcontrol:"mod",cmd:"meta",command:"meta",super:"meta",win:"meta",windows:"meta",control:"ctrl",option:"alt",opt:"alt",return:"enter",esc:"escape",del:"delete",caps:"capslock",spacebar:"space",up:"arrowup",down:"arrowdown",left:"arrowleft",right:"arrowright"};export function tokenize(t){return Array.isArray(t)?t.map(t=>t.trim()).filter(Boolean):t.split("+").map(t=>t.trim()).filter(Boolean)}export function canonicalKey(e){if(" "===e)return"space";const r=e.toLowerCase().replace(/[\s_-]/g,"");return t[r]??r}export function resolveOS(t,e,r){const n=t||e||r||"";return/mac|iphone|ipad|ipod/i.test(n)?"mac":/win/i.test(n)?"windows":"linux"}let e=null;export function readOS(){return e??=function(){if("undefined"==typeof navigator)return"windows";const t=navigator.userAgentData;return resolveOS(t?.platform,navigator.platform,navigator.userAgent)}(),e}export function matchesShortcut(t,e){const r=tokenize(e).map(canonicalKey);if(0===r.length||function(t){return!0===t.isComposing||!0===t.nativeEvent?.isComposing||229===t.keyCode}(t))return!1;const n={ctrl:!1,meta:!1,alt:!1,shift:!1},o=r[r.length-1],a=1===o.length&&!/^[a-z0-9]$/.test(o),i="mac"===readOS();for(const t of r.slice(0,-1))if("mod"===t)n[i?"meta":"ctrl"]=!0;else{if("meta"!==t&&"ctrl"!==t&&"alt"!==t&&"shift"!==t)return!1;n[t]=!0}return t.ctrlKey===n.ctrl&&t.metaKey===n.meta&&t.altKey===n.alt&&(a||t.shiftKey===n.shift)&&function(t,e){const r=canonicalKey(t.key);if(r===e)return!0;if(1===e.length&&!/^[a-z0-9]$/.test(r)){if(e>="a"&&e<="z")return t.code===`Key${e.toUpperCase()}`;if(e>="0"&&e<="9")return t.code===`Digit${e}`}return!1}(t,r[r.length-1])}export function keyHandler(t,e){return t?r=>{for(const[e,n]of Object.entries(t))matchesShortcut(r,e)&&n(r);e?.(r)}:e}
|
package/dist/internal/link.d.ts
CHANGED
|
@@ -1,20 +1,18 @@
|
|
|
1
1
|
/**
|
|
2
|
-
*
|
|
2
|
+
* An `href` a component is safe to write, or nothing.
|
|
3
3
|
*
|
|
4
|
-
* A
|
|
5
|
-
*
|
|
6
|
-
*
|
|
7
|
-
*
|
|
8
|
-
*
|
|
9
|
-
*
|
|
10
|
-
*
|
|
11
|
-
*
|
|
12
|
-
* cannot tell which.
|
|
4
|
+
* A link's address very often comes from somebody other than the page's author:
|
|
5
|
+
* the preview under a chat message, a destination read out of a CMS, a page link
|
|
6
|
+
* a router built from a query. React 19 refuses a `javascript:` URL, but React
|
|
7
|
+
* 18 — inside the peer range — writes it as it is, and a press then runs it.
|
|
8
|
+
* So every component that writes an `href` passes it through here, and a scheme
|
|
9
|
+
* outside `http`, `https`, `mailto` and `tel` leaves the element with no
|
|
10
|
+
* `href` at all. A relative URL, a `#fragment` and a `//host` have no scheme and
|
|
11
|
+
* are kept.
|
|
13
12
|
*
|
|
14
|
-
*
|
|
15
|
-
*
|
|
16
|
-
* `
|
|
17
|
-
* with the two tokens above — spelled as a plain default it would silently take
|
|
18
|
-
* the protection off the link that still opens in a new tab.
|
|
13
|
+
* The scheme is read the way a browser reads it: leading spaces and control
|
|
14
|
+
* characters are dropped, and a tab or a newline anywhere in it is ignored, so
|
|
15
|
+
* ` java\tscript:` is caught along with `JavaScript:`.
|
|
19
16
|
*/
|
|
17
|
+
export declare function safeHref(href: string | undefined): string | undefined;
|
|
20
18
|
export declare function safeRel(target: string | undefined, rel: string | undefined): string | undefined;
|
package/dist/internal/link.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export function safeRel(e,
|
|
1
|
+
const e=new Set(["http","https","mailto","tel"]);export function safeHref(t){if(void 0===t)return;let r=0;for(;r<t.length&&t.charCodeAt(r)<=32;)r+=1;const n=t.slice(r).replace(/[\t\n\r]/g,""),o=/^([a-z][a-z\d+.-]*):/i.exec(n);return null===o||e.has(o[1].toLowerCase())?t:void 0}export function safeRel(e,t){return e&&"_self"!==e&&"_parent"!==e&&"_top"!==e?[...new Set([...(t??"").split(/\s+/).filter(Boolean),"noopener","noreferrer"])].join(" "):t}
|
package/dist/internal/media.d.ts
CHANGED
|
@@ -41,23 +41,15 @@ export declare function useMediaQuery(query: string | null): boolean;
|
|
|
41
41
|
/** The query behind every "the reader asked for less motion" decision. */
|
|
42
42
|
export declare const reducedMotionQuery = "(prefers-reduced-motion: reduce)";
|
|
43
43
|
/**
|
|
44
|
-
* Whether
|
|
44
|
+
* Whether this render is past hydration.
|
|
45
45
|
*
|
|
46
|
-
*
|
|
47
|
-
*
|
|
48
|
-
*
|
|
49
|
-
*
|
|
50
|
-
*
|
|
51
|
-
*
|
|
52
|
-
*
|
|
53
|
-
* choice Shortcut makes for the same reason: a media query is an external
|
|
54
|
-
* store, and reading it in an effect means every animated element on the page
|
|
55
|
-
* renders once with the wrong answer and then again with the right one. Here
|
|
56
|
-
* that first render is the one that would start a typewriter a reader asked
|
|
57
|
-
* not to see.
|
|
58
|
-
*
|
|
59
|
-
* It lives beside the query rather than in `animate.ts` so that a Carousel and
|
|
60
|
-
* a ScrollZone can ask without pulling the eleven animation effects in with the
|
|
61
|
-
* answer.
|
|
46
|
+
* `false` on the server and in the render that hydrates what the server sent,
|
|
47
|
+
* `true` in every render after that, and `true` straight away in a tree that
|
|
48
|
+
* was never server-rendered. It is for a value the server cannot know the
|
|
49
|
+
* reader's answer to — the day it is where they are, the scheme they chose last
|
|
50
|
+
* visit — which has to be left out of the hydrating render or React reports the
|
|
51
|
+
* two renders disagreeing. `useSyncExternalStore` rather than an effect, so a
|
|
52
|
+
* client-only tree does not render once without the value and then again with it.
|
|
62
53
|
*/
|
|
54
|
+
export declare function useHydrated(): boolean;
|
|
63
55
|
export declare function usePrefersReducedMotion(): boolean;
|
package/dist/internal/media.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import*as e from"react";import{memoise as t}from"./cache.js";const r=new Map;function n(e){return t(r,e,()=>"undefined"!=typeof window&&window.matchMedia?window.matchMedia(e):null)}export function subscribeToQuery(e,t){const r=n(e);return r?(r.addEventListener("change",t),()=>r.removeEventListener("change",t)):()=>{}}export function queryMatches(e){return n(e)?.matches??!1}export function noMatchOnServer(){return!1}export const breakpointWidths={xs:"0rem",sm:"40rem",md:"48rem",lg:"64rem",xl:"80rem"};let o=null;function u(){if(o)return o;if("undefined"==typeof window||!window.getComputedStyle)return breakpointWidths;const e=getComputedStyle(document.documentElement),t={...breakpointWidths};for(const r of["sm","md","lg","xl"]){const n=e.getPropertyValue(`--neba-breakpoint-${r}`).trim();n&&(t[r]=n)}return o=t,t}export function widthBelow(e){return"xs"===e?null:`(width < ${u()[e]})`}export function widthAtLeast(e){return`(width >= ${u()[e]})`}export function useMediaQuery(t){const r=e.useCallback(e=>t?subscribeToQuery(t,e):()=>{},[t]),n=e.useCallback(()=>!!t&&queryMatches(t),[t]);return e.useSyncExternalStore(r,n,noMatchOnServer)}export const reducedMotionQuery="(prefers-reduced-motion: reduce)";const c=e=>subscribeToQuery(reducedMotionQuery,e),i=()=>queryMatches(reducedMotionQuery);export function usePrefersReducedMotion(){return e.useSyncExternalStore(c,i,noMatchOnServer)}
|
|
1
|
+
"use client";import*as e from"react";import{memoise as t}from"./cache.js";const r=new Map;function n(e){return t(r,e,()=>"undefined"!=typeof window&&window.matchMedia?window.matchMedia(e):null)}export function subscribeToQuery(e,t){const r=n(e);return r?(r.addEventListener("change",t),()=>r.removeEventListener("change",t)):()=>{}}export function queryMatches(e){return n(e)?.matches??!1}export function noMatchOnServer(){return!1}export const breakpointWidths={xs:"0rem",sm:"40rem",md:"48rem",lg:"64rem",xl:"80rem"};let o=null;function u(){if(o)return o;if("undefined"==typeof window||!window.getComputedStyle)return breakpointWidths;const e=getComputedStyle(document.documentElement),t={...breakpointWidths};for(const r of["sm","md","lg","xl"]){const n=e.getPropertyValue(`--neba-breakpoint-${r}`).trim();n&&(t[r]=n)}return o=t,t}export function widthBelow(e){return"xs"===e?null:`(width < ${u()[e]})`}export function widthAtLeast(e){return`(width >= ${u()[e]})`}export function useMediaQuery(t){const r=e.useCallback(e=>t?subscribeToQuery(t,e):()=>{},[t]),n=e.useCallback(()=>!!t&&queryMatches(t),[t]);return e.useSyncExternalStore(r,n,noMatchOnServer)}export const reducedMotionQuery="(prefers-reduced-motion: reduce)";const c=e=>subscribeToQuery(reducedMotionQuery,e),i=()=>queryMatches(reducedMotionQuery),s=()=>()=>{},d=()=>!0,a=()=>!1;export function useHydrated(){return e.useSyncExternalStore(s,d,a)}export function usePrefersReducedMotion(){return e.useSyncExternalStore(c,i,noMatchOnServer)}
|
package/dist/internal/menu.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import type { NebaColor, NebaDensity, NebaSize } from '../types.js';
|
|
2
|
+
import type { NebaColor, NebaDensity, NebaOrientation, NebaSize } from '../types.js';
|
|
3
3
|
/**
|
|
4
4
|
* What a menu item inherits from the menu around it.
|
|
5
5
|
*
|
|
@@ -16,5 +16,10 @@ export interface MenuContextValue {
|
|
|
16
16
|
size: NebaSize;
|
|
17
17
|
color: NebaColor;
|
|
18
18
|
density: NebaDensity;
|
|
19
|
+
/**
|
|
20
|
+
* Which way the bar runs, set only by a Menubar. A menu on a vertical bar
|
|
21
|
+
* opens beside it rather than downward over the next word.
|
|
22
|
+
*/
|
|
23
|
+
orientation?: NebaOrientation;
|
|
19
24
|
}
|
|
20
25
|
export declare const MenuContext: React.Context<MenuContextValue>;
|
|
@@ -161,19 +161,20 @@ export declare function MockupCutout({ notch, screen, landscape }: {
|
|
|
161
161
|
screen: NebaMockupResolution;
|
|
162
162
|
landscape: boolean;
|
|
163
163
|
}): React.JSX.Element | null;
|
|
164
|
-
/**
|
|
164
|
+
/**
|
|
165
|
+
* What a system puts on the screen. Each bar sets its own height on itself, so
|
|
166
|
+
* the room it takes is whatever it draws: the screen lays the bars out in flow
|
|
167
|
+
* and nothing reads the number back.
|
|
168
|
+
*/
|
|
165
169
|
export interface MockupChrome {
|
|
166
170
|
top?: {
|
|
167
|
-
size: number;
|
|
168
171
|
node: React.ReactNode;
|
|
169
172
|
};
|
|
170
173
|
bottom?: {
|
|
171
|
-
size: number;
|
|
172
174
|
node: React.ReactNode;
|
|
173
175
|
};
|
|
174
176
|
/** A dock down the leading edge. Only Linux has one. */
|
|
175
177
|
start?: {
|
|
176
|
-
size: number;
|
|
177
178
|
node: React.ReactNode;
|
|
178
179
|
};
|
|
179
180
|
}
|
package/dist/internal/mockup.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as t}from"react/jsx-runtime";const i={desktop:["macos","windows","linux"],tablet:["ipados","android"],mobile:["ios","android"]};export function resolveOs(e,t){const n=i[e];return t&&n.includes(t)?t:"ios"===t&&"tablet"===e?"ipados":"ipados"===t&&"mobile"===e?"ios":n[0]}export function defaultNotch(e,t){return"mobile"!==e?"none":"android"===t?"punch-hole":"dynamic-island"}export const resolutions={mobile:{xs:{width:320,height:568},sm:{width:360,height:780},md:{width:390,height:844},lg:{width:414,height:896},xl:{width:430,height:932}},tablet:{xs:{width:744,height:1133},sm:{width:768,height:1024},md:{width:820,height:1180},lg:{width:834,height:1194},xl:{width:1024,height:1366}},desktop:{xs:{width:1024,height:640},sm:{width:1280,height:800},md:{width:1440,height:900},lg:{width:1680,height:1050},xl:{width:1920,height:1200}}};const n={mobile:{thin:{bezel:{x:8,top:8,bottom:8},frameRadius:50,screenRadius:42},standard:{bezel:{x:13,top:13,bottom:13},frameRadius:56,screenRadius:43},thick:{bezel:{x:16,top:62,bottom:62},frameRadius:40,screenRadius:4}},tablet:{thin:{bezel:{x:12,top:12,bottom:12},frameRadius:34,screenRadius:22},standard:{bezel:{x:20,top:20,bottom:20},frameRadius:42,screenRadius:22},thick:{bezel:{x:28,top:74,bottom:74},frameRadius:36,screenRadius:4}},desktop:{thin:{bezel:{x:8,top:8,bottom:8},frameRadius:12,screenRadius:4},standard:{bezel:{x:13,top:13,bottom:30},frameRadius:16,screenRadius:4},thick:{bezel:{x:22,top:22,bottom:62},frameRadius:18,screenRadius:3}}},a={mobile:42,tablet:24,desktop:8};export function mockupMetrics(e){const{device:t,size:i,resolution:r,orientation:d,bezel:h,hardware:s}=e,o=r??resolutions[t][i],l="desktop"!==t&&"landscape"===d,c=l?{width:o.height,height:o.width}:o;if("none"===h)return{screen:c,bezel:{x:0,top:0,bottom:0},body:{...c},frame:{...c},frameRadius:a[t],screenRadius:a[t],stand:null,base:null};const u=n[t][h],g=l?{x:u.bezel.top,top:u.bezel.x,bottom:u.bezel.x}:u.bezel,p="desktop"===t&&"laptop"===s,m=p?{...g,bottom:g.top}:g,x={width:c.width+2*m.x,height:c.height+m.top+m.bottom};if("desktop"!==t)return{screen:c,bezel:m,body:x,frame:{...x},frameRadius:u.frameRadius,screenRadius:u.screenRadius,stand:null,base:null};if(p){const e={width:Math.round(1.075*x.width),height:Math.round(.035*x.height),lipWidth:Math.round(.12*x.width)};return{screen:c,bezel:m,body:x,frame:{width:e.width,height:x.height+e.height},frameRadius:u.frameRadius,screenRadius:u.screenRadius,stand:null,base:e}}const b={neckWidth:Math.round(.11*x.width),neckHeight:Math.round(.09*x.height),footWidth:Math.round(.28*x.width),footHeight:Math.round(.018*x.height)};return{screen:c,bezel:m,body:x,frame:{width:x.width,height:x.height+b.neckHeight+b.footHeight},frameRadius:u.frameRadius,screenRadius:u.screenRadius,stand:b,base:null}}export const finishSlots={graphite:{"--n-shell":"oklch(27% 0.008 262)","--n-shell-edge":"rgb(255 255 255 / 0.16)","--n-shell-shade":"oklch(17% 0.008 262)"},silver:{"--n-shell":"oklch(83% 0.004 262)","--n-shell-edge":"rgb(255 255 255 / 0.75)","--n-shell-shade":"oklch(66% 0.006 262)"},white:{"--n-shell":"oklch(96% 0.002 262)","--n-shell-edge":"rgb(255 255 255 / 0.9)","--n-shell-shade":"oklch(80% 0.004 262)"}};export const shellClasses="bg-(--n-shell) [box-shadow:inset_0_1px_0_var(--n-shell-edge),inset_0_0_0_1px_var(--n-shell-shade)]";export const elevationFilters=["none","drop-shadow(0 1px 2px var(--neba-shadow-ambient))","drop-shadow(0 2px 4px var(--neba-shadow-ambient)) drop-shadow(0 8px 12px var(--neba-shadow-ambient))","drop-shadow(0 4px 6px var(--neba-shadow-ambient)) drop-shadow(0 18px 28px var(--neba-shadow-ambient))"];export function MockupCutout({notch:t,screen:i,landscape:n}){if("none"===t)return null;const a=n?i.height:i.width,r={position:"absolute",background:"oklch(12% 0.006 262)",pointerEvents:"none",zIndex:20},d="neba-mockup-cutout";if("punch-hole"===t){const t=Math.max(16,Math.round(.07*a)),i=Math.round(.55*t);return e("div",{"aria-hidden":"true",className:d,style:{...r,width:t,height:t,borderRadius:"50%",...n?{left:i,top:"50%",marginTop:-t/2}:{top:i,left:"50%",marginLeft:-t/2}}})}if("dynamic-island"===t){const t=Math.max(96,Math.round(.32*a)),i=Math.round(.29*t),h=Math.round(.32*i);return e("div",{"aria-hidden":"true",className:d,style:{...r,borderRadius:i,...n?{left:h,top:"50%",width:i,height:t,marginTop:-t/2}:{top:h,left:"50%",width:t,height:i,marginLeft:-t/2}}})}const h=Math.max(120,Math.round(.42*a)),s=Math.round(.23*h),o=Math.round(.6*s);return e("div",{"aria-hidden":"true",className:d,style:{...r,...n?{left:0,top:"50%",width:s,height:h,marginTop:-h/2,borderRadius:`0 ${o}px ${o}px 0`}:{top:0,left:"50%",width:h,height:s,marginLeft:-h/2,borderRadius:`0 0 ${o}px ${o}px`}}})}const r="relative z-10 flex shrink-0 items-center [background:color-mix(in_oklab,var(--neba-surface)_88%,transparent)]",d="font-medium text-(--neba-fg) tabular-nums";function h({width:t,height:i,radius:n,tone:a="muted"}){return e("div",{style:{width:t,height:i??t,borderRadius:n,background:"accent"===a?"var(--n-accent)":"faint"===a?"color-mix(in oklab, var(--neba-fg) 12%, transparent)":"color-mix(in oklab, var(--neba-fg) 26%, transparent)"}})}function s({count:t,size:i,radius:n,gap:a,accent:r=!1}){return e("div",{className:"flex items-center",style:{gap:a},children:Array.from({length:t},(t,a)=>e(h,{width:i,radius:n,tone:r&&0===a?"accent":"muted"},a))})}function o({height:i}){return t("svg",{viewBox:"0 0 17 11",height:i,width:17*i/11,fill:"currentColor","aria-hidden":"true",children:[e("rect",{y:"7.5",width:"3",height:"3.5",rx:"1"}),e("rect",{x:"4.7",y:"5",width:"3",height:"6",rx:"1"}),e("rect",{x:"9.4",y:"2.5",width:"3",height:"8.5",rx:"1"}),e("rect",{x:"14",width:"3",height:"11",rx:"1",opacity:"0.35"})]})}function l({height:i}){return t("svg",{viewBox:"0 0 16 12",height:i,width:16*i/12,fill:"none","aria-hidden":"true",children:[e("path",{d:"M1 4.2a10.5 10.5 0 0 1 14 0",stroke:"currentColor",strokeWidth:"1.8",strokeLinecap:"round"}),e("path",{d:"M3.6 7a6.8 6.8 0 0 1 8.8 0",stroke:"currentColor",strokeWidth:"1.8",strokeLinecap:"round"}),e("circle",{cx:"8",cy:"10.2",r:"1.6",fill:"currentColor"})]})}function c({height:i}){return t("svg",{viewBox:"0 0 25 12",height:i,width:25*i/12,fill:"none","aria-hidden":"true",children:[e("rect",{x:"0.7",y:"0.7",width:"20.6",height:"10.6",rx:"3.2",stroke:"currentColor",strokeWidth:"1.3",opacity:"0.45"}),e("rect",{x:"2.6",y:"2.6",width:"12.8",height:"6.8",rx:"1.8",fill:"currentColor"}),e("rect",{x:"22.8",y:"4",width:"1.8",height:"4",rx:"0.9",fill:"currentColor",opacity:"0.45"})]})}function u({height:i,gap:n}){return t("div",{className:"flex items-center text-(--neba-fg)",style:{gap:n},children:[e(o,{height:i}),e(l,{height:i}),e(c,{height:i})]})}function g({size:i,gap:n}){return t("div",{className:"flex items-center justify-center text-(--neba-fg)",style:{gap:n,opacity:.72},children:[e("svg",{viewBox:"0 0 16 16",width:i,height:i,fill:"none","aria-hidden":"true",children:e("path",{d:"M10 3 5 8l5 5",stroke:"currentColor",strokeWidth:"1.6",strokeLinecap:"round",strokeLinejoin:"round"})}),e("svg",{viewBox:"0 0 16 16",width:i,height:i,fill:"none","aria-hidden":"true",children:e("circle",{cx:"8",cy:"8",r:"5",stroke:"currentColor",strokeWidth:"1.6"})}),e("svg",{viewBox:"0 0 16 16",width:i,height:i,fill:"none","aria-hidden":"true",children:e("rect",{x:"3.5",y:"3.5",width:"9",height:"9",rx:"1.6",stroke:"currentColor",strokeWidth:"1.6"})})]})}function p({size:i}){return t("svg",{viewBox:"0 0 16 16",width:i,height:i,fill:"currentColor","aria-hidden":"true",children:[e("rect",{x:"1",y:"1",width:"6",height:"6",rx:"1.4"}),e("rect",{x:"9",y:"1",width:"6",height:"6",rx:"1.4"}),e("rect",{x:"1",y:"9",width:"6",height:"6",rx:"1.4"}),e("rect",{x:"9",y:"9",width:"6",height:"6",rx:"1.4"})]})}export function mockupChrome(i){const{os:n,notch:a,landscape:o,time:l}=i;if("ios"===n||"ipados"===n){const i="ipados"===n,h=i?30:!i&&!o&&"none"!==a&&"punch-hole"!==a?54:44;return{top:{size:h,node:t("div",{"aria-hidden":"true",className:`${r} justify-between`,style:{height:h,paddingInline:i?22:26},children:[e("span",{className:`${d} text-[15px]`,children:l}),e(u,{height:i?11:12,gap:6})]})},bottom:{size:i?22:34,node:e("div",{"aria-hidden":"true",className:`${r} justify-center`,style:{height:i?22:34,background:"transparent"},children:e("div",{style:{width:i?220:140,height:5,borderRadius:3,background:"color-mix(in oklab, var(--neba-fg) 55%, transparent)"}})})}}}return"android"===n?{top:{size:34,node:t("div",{"aria-hidden":"true",className:`${r} justify-between`,style:{height:34,paddingInline:18},children:[e("span",{className:`${d} text-[13px]`,children:l}),e(u,{height:11,gap:5})]})},bottom:{size:48,node:e("div",{"aria-hidden":"true",className:`${r} justify-center`,style:{height:48},children:e(g,{size:20,gap:72})})}}:"macos"===n?{top:{size:28,node:t("div",{"aria-hidden":"true",className:`${r} justify-between`,style:{height:28,paddingInline:16},children:[t("div",{className:"flex items-center",style:{gap:16},children:[e(h,{width:13,radius:4}),e(h,{width:34,height:7,radius:4}),e(h,{width:26,height:7,radius:4,tone:"faint"}),e(h,{width:30,height:7,radius:4,tone:"faint"}),e(h,{width:22,height:7,radius:4,tone:"faint"})]}),t("div",{className:"flex items-center",style:{gap:14},children:[e(h,{width:11,radius:3,tone:"faint"}),e(h,{width:11,radius:3,tone:"faint"}),e("span",{className:`${d} text-[13px]`,children:l})]})]})},bottom:{size:78,node:e("div",{"aria-hidden":"true",className:"flex shrink-0 items-end justify-center",style:{height:78},children:t("div",{className:`${r} [box-shadow:var(--neba-shadow-2),var(--neba-plate-glass)]`,style:{gap:10,padding:8,marginBottom:10,borderRadius:22},children:[e(s,{count:5,size:52,radius:14,gap:10,accent:!0}),e("div",{style:{width:1,height:44,background:"color-mix(in oklab, var(--neba-fg) 16%, transparent)"}}),e(s,{count:2,size:52,radius:14,gap:10})]})})}}:"windows"===n?{bottom:{size:52,node:t("div",{"aria-hidden":"true",className:`${r} justify-center [border-block-start:1px_solid_var(--neba-border)]`,style:{height:52,paddingInline:16},children:[t("div",{className:"flex items-center",style:{gap:10},children:[e("div",{className:"text-(--neba-fg)",style:{opacity:.7},children:e(p,{size:22})}),e(s,{count:6,size:30,radius:8,gap:10,accent:!0})]}),t("div",{className:"absolute flex items-center",style:{insetInlineEnd:16,gap:12},children:[e(h,{width:11,radius:3,tone:"faint"}),e(h,{width:11,radius:3,tone:"faint"}),e("span",{className:`${d} text-[12px]`,children:l})]})]})}}:{top:{size:34,node:t("div",{"aria-hidden":"true",className:`${r} justify-center`,style:{height:34,paddingInline:14},children:[e("div",{className:"absolute",style:{insetInlineStart:14},children:e(h,{width:52,height:9,radius:5})}),e("span",{className:`${d} text-[13px]`,children:l}),t("div",{className:"absolute flex items-center",style:{insetInlineEnd:14,gap:10},children:[e(h,{width:10,radius:3,tone:"faint"}),e(h,{width:10,radius:3,tone:"faint"}),e(h,{width:10,radius:3,tone:"faint"})]})]})},start:{size:66,node:t("div",{"aria-hidden":"true",className:`${r} flex-col justify-start [border-inline-end:1px_solid_var(--neba-border)]`,style:{width:66,height:"100%",gap:10,paddingBlock:12},children:[e(h,{width:44,radius:12,tone:"accent"}),e(h,{width:44,radius:12}),e(h,{width:44,radius:12}),e(h,{width:44,radius:12})]})}}}
|
|
1
|
+
import{jsx as e,jsxs as t}from"react/jsx-runtime";const i={desktop:["macos","windows","linux"],tablet:["ipados","android"],mobile:["ios","android"]};export function resolveOs(e,t){const a=i[e];return t&&a.includes(t)?t:"ios"===t&&"tablet"===e?"ipados":"ipados"===t&&"mobile"===e?"ios":a[0]}export function defaultNotch(e,t){return"mobile"!==e?"none":"android"===t?"punch-hole":"dynamic-island"}export const resolutions={mobile:{xs:{width:320,height:568},sm:{width:360,height:780},md:{width:390,height:844},lg:{width:414,height:896},xl:{width:430,height:932}},tablet:{xs:{width:744,height:1133},sm:{width:768,height:1024},md:{width:820,height:1180},lg:{width:834,height:1194},xl:{width:1024,height:1366}},desktop:{xs:{width:1024,height:640},sm:{width:1280,height:800},md:{width:1440,height:900},lg:{width:1680,height:1050},xl:{width:1920,height:1200}}};const a={mobile:{thin:{bezel:{x:8,top:8,bottom:8},frameRadius:50,screenRadius:42},standard:{bezel:{x:13,top:13,bottom:13},frameRadius:56,screenRadius:43},thick:{bezel:{x:16,top:62,bottom:62},frameRadius:40,screenRadius:4}},tablet:{thin:{bezel:{x:12,top:12,bottom:12},frameRadius:34,screenRadius:22},standard:{bezel:{x:20,top:20,bottom:20},frameRadius:42,screenRadius:22},thick:{bezel:{x:28,top:74,bottom:74},frameRadius:36,screenRadius:4}},desktop:{thin:{bezel:{x:8,top:8,bottom:8},frameRadius:12,screenRadius:4},standard:{bezel:{x:13,top:13,bottom:30},frameRadius:16,screenRadius:4},thick:{bezel:{x:22,top:22,bottom:62},frameRadius:18,screenRadius:3}}},n={mobile:42,tablet:24,desktop:8};export function mockupMetrics(e){const{device:t,size:i,resolution:r,orientation:h,bezel:d,hardware:s}=e,o=r??resolutions[t][i],l="desktop"!==t&&"landscape"===h,c=l?{width:o.height,height:o.width}:o;if("none"===d)return{screen:c,bezel:{x:0,top:0,bottom:0},body:{...c},frame:{...c},frameRadius:n[t],screenRadius:n[t],stand:null,base:null};const u=a[t][d],p=l?{x:u.bezel.top,top:u.bezel.x,bottom:u.bezel.x}:u.bezel,g="desktop"===t&&"laptop"===s,m=g?{...p,bottom:p.top}:p,x={width:c.width+2*m.x,height:c.height+m.top+m.bottom};if("desktop"!==t)return{screen:c,bezel:m,body:x,frame:{...x},frameRadius:u.frameRadius,screenRadius:u.screenRadius,stand:null,base:null};if(g){const e={width:Math.round(1.075*x.width),height:Math.round(.035*x.height),lipWidth:Math.round(.12*x.width)};return{screen:c,bezel:m,body:x,frame:{width:e.width,height:x.height+e.height},frameRadius:u.frameRadius,screenRadius:u.screenRadius,stand:null,base:e}}const b={neckWidth:Math.round(.11*x.width),neckHeight:Math.round(.09*x.height),footWidth:Math.round(.28*x.width),footHeight:Math.round(.018*x.height)};return{screen:c,bezel:m,body:x,frame:{width:x.width,height:x.height+b.neckHeight+b.footHeight},frameRadius:u.frameRadius,screenRadius:u.screenRadius,stand:b,base:null}}export const finishSlots={graphite:{"--n-shell":"oklch(27% 0.008 262)","--n-shell-edge":"rgb(255 255 255 / 0.16)","--n-shell-shade":"oklch(17% 0.008 262)"},silver:{"--n-shell":"oklch(83% 0.004 262)","--n-shell-edge":"rgb(255 255 255 / 0.75)","--n-shell-shade":"oklch(66% 0.006 262)"},white:{"--n-shell":"oklch(96% 0.002 262)","--n-shell-edge":"rgb(255 255 255 / 0.9)","--n-shell-shade":"oklch(80% 0.004 262)"}};export const shellClasses="bg-(--n-shell) [box-shadow:inset_0_1px_0_var(--n-shell-edge),inset_0_0_0_1px_var(--n-shell-shade)]";export const elevationFilters=["none","drop-shadow(0 1px 2px var(--neba-shadow-ambient))","drop-shadow(0 2px 4px var(--neba-shadow-ambient)) drop-shadow(0 8px 12px var(--neba-shadow-ambient))","drop-shadow(0 4px 6px var(--neba-shadow-ambient)) drop-shadow(0 18px 28px var(--neba-shadow-ambient))"];export function MockupCutout({notch:t,screen:i,landscape:a}){if("none"===t)return null;const n=a?i.height:i.width,r={position:"absolute",background:"oklch(12% 0.006 262)",pointerEvents:"none",zIndex:20},h="neba-mockup-cutout";if("punch-hole"===t){const t=Math.max(16,Math.round(.07*n)),i=Math.round(.55*t);return e("div",{"aria-hidden":"true",className:h,style:{...r,width:t,height:t,borderRadius:"50%",...a?{left:i,top:"50%",marginTop:-t/2}:{top:i,left:"50%",marginLeft:-t/2}}})}if("dynamic-island"===t){const t=Math.max(96,Math.round(.32*n)),i=Math.round(.29*t),d=Math.round(.32*i);return e("div",{"aria-hidden":"true",className:h,style:{...r,borderRadius:i,...a?{left:d,top:"50%",width:i,height:t,marginTop:-t/2}:{top:d,left:"50%",width:t,height:i,marginLeft:-t/2}}})}const d=Math.max(120,Math.round(.42*n)),s=Math.round(.23*d),o=Math.round(.6*s);return e("div",{"aria-hidden":"true",className:h,style:{...r,...a?{left:0,top:"50%",width:s,height:d,marginTop:-d/2,borderRadius:`0 ${o}px ${o}px 0`}:{top:0,left:"50%",width:d,height:s,marginLeft:-d/2,borderRadius:`0 0 ${o}px ${o}px`}}})}const r="relative z-10 flex shrink-0 items-center [background:color-mix(in_oklab,var(--neba-surface)_88%,transparent)]",h="font-medium text-(--neba-fg) tabular-nums";function Tile({width:t,height:i,radius:a,tone:n="muted"}){return e("div",{style:{width:t,height:i??t,borderRadius:a,background:"accent"===n?"var(--n-accent)":"faint"===n?"color-mix(in oklab, var(--neba-fg) 12%, transparent)":"color-mix(in oklab, var(--neba-fg) 26%, transparent)"}})}function Tiles({count:t,size:i,radius:a,gap:n,accent:r=!1}){return e("div",{className:"flex items-center",style:{gap:n},children:Array.from({length:t},(t,n)=>e(Tile,{width:i,radius:a,tone:r&&0===n?"accent":"muted"},n))})}function SignalGlyph({height:i}){return t("svg",{viewBox:"0 0 17 11",height:i,width:17*i/11,fill:"currentColor","aria-hidden":"true",children:[e("rect",{y:"7.5",width:"3",height:"3.5",rx:"1"}),e("rect",{x:"4.7",y:"5",width:"3",height:"6",rx:"1"}),e("rect",{x:"9.4",y:"2.5",width:"3",height:"8.5",rx:"1"}),e("rect",{x:"14",width:"3",height:"11",rx:"1",opacity:"0.35"})]})}function WifiGlyph({height:i}){return t("svg",{viewBox:"0 0 16 12",height:i,width:16*i/12,fill:"none","aria-hidden":"true",children:[e("path",{d:"M1 4.2a10.5 10.5 0 0 1 14 0",stroke:"currentColor",strokeWidth:"1.8",strokeLinecap:"round"}),e("path",{d:"M3.6 7a6.8 6.8 0 0 1 8.8 0",stroke:"currentColor",strokeWidth:"1.8",strokeLinecap:"round"}),e("circle",{cx:"8",cy:"10.2",r:"1.6",fill:"currentColor"})]})}function BatteryGlyph({height:i}){return t("svg",{viewBox:"0 0 25 12",height:i,width:25*i/12,fill:"none","aria-hidden":"true",children:[e("rect",{x:"0.7",y:"0.7",width:"20.6",height:"10.6",rx:"3.2",stroke:"currentColor",strokeWidth:"1.3",opacity:"0.45"}),e("rect",{x:"2.6",y:"2.6",width:"12.8",height:"6.8",rx:"1.8",fill:"currentColor"}),e("rect",{x:"22.8",y:"4",width:"1.8",height:"4",rx:"0.9",fill:"currentColor",opacity:"0.45"})]})}function StatusGlyphs({height:i,gap:a}){return t("div",{className:"flex items-center text-(--neba-fg)",style:{gap:a},children:[e(SignalGlyph,{height:i}),e(WifiGlyph,{height:i}),e(BatteryGlyph,{height:i})]})}function NavGlyphs({size:i,gap:a}){return t("div",{className:"flex items-center justify-center text-(--neba-fg)",style:{gap:a,opacity:.72},children:[e("svg",{viewBox:"0 0 16 16",width:i,height:i,fill:"none","aria-hidden":"true",children:e("path",{d:"M10 3 5 8l5 5",stroke:"currentColor",strokeWidth:"1.6",strokeLinecap:"round",strokeLinejoin:"round"})}),e("svg",{viewBox:"0 0 16 16",width:i,height:i,fill:"none","aria-hidden":"true",children:e("circle",{cx:"8",cy:"8",r:"5",stroke:"currentColor",strokeWidth:"1.6"})}),e("svg",{viewBox:"0 0 16 16",width:i,height:i,fill:"none","aria-hidden":"true",children:e("rect",{x:"3.5",y:"3.5",width:"9",height:"9",rx:"1.6",stroke:"currentColor",strokeWidth:"1.6"})})]})}function StartGlyph({size:i}){return t("svg",{viewBox:"0 0 16 16",width:i,height:i,fill:"currentColor","aria-hidden":"true",children:[e("rect",{x:"1",y:"1",width:"6",height:"6",rx:"1.4"}),e("rect",{x:"9",y:"1",width:"6",height:"6",rx:"1.4"}),e("rect",{x:"1",y:"9",width:"6",height:"6",rx:"1.4"}),e("rect",{x:"9",y:"9",width:"6",height:"6",rx:"1.4"})]})}export function mockupChrome(i){const{os:a,notch:n,landscape:d,time:s}=i;if("ios"===a||"ipados"===a){const i="ipados"===a;return{top:{node:t("div",{"aria-hidden":"true",className:`${r} justify-between`,style:{height:i?30:!i&&!d&&"none"!==n&&"punch-hole"!==n?54:44,paddingInline:i?22:26},children:[e("span",{className:`${h} text-[15px]`,children:s}),e(StatusGlyphs,{height:i?11:12,gap:6})]})},bottom:{node:e("div",{"aria-hidden":"true",className:`${r} justify-center`,style:{height:i?22:34,background:"transparent"},children:e("div",{style:{width:i?220:140,height:5,borderRadius:3,background:"color-mix(in oklab, var(--neba-fg) 55%, transparent)"}})})}}}return"android"===a?{top:{node:t("div",{"aria-hidden":"true",className:`${r} justify-between`,style:{height:34,paddingInline:18},children:[e("span",{className:`${h} text-[13px]`,children:s}),e(StatusGlyphs,{height:11,gap:5})]})},bottom:{node:e("div",{"aria-hidden":"true",className:`${r} justify-center`,style:{height:48},children:e(NavGlyphs,{size:20,gap:72})})}}:"macos"===a?{top:{node:t("div",{"aria-hidden":"true",className:`${r} justify-between`,style:{height:28,paddingInline:16},children:[t("div",{className:"flex items-center",style:{gap:16},children:[e(Tile,{width:13,radius:4}),e(Tile,{width:34,height:7,radius:4}),e(Tile,{width:26,height:7,radius:4,tone:"faint"}),e(Tile,{width:30,height:7,radius:4,tone:"faint"}),e(Tile,{width:22,height:7,radius:4,tone:"faint"})]}),t("div",{className:"flex items-center",style:{gap:14},children:[e(Tile,{width:11,radius:3,tone:"faint"}),e(Tile,{width:11,radius:3,tone:"faint"}),e("span",{className:`${h} text-[13px]`,children:s})]})]})},bottom:{node:e("div",{"aria-hidden":"true",className:"flex shrink-0 items-end justify-center",style:{height:78},children:t("div",{className:`${r} [box-shadow:var(--neba-shadow-2),var(--neba-plate-glass)]`,style:{gap:10,padding:8,marginBottom:10,borderRadius:22},children:[e(Tiles,{count:5,size:52,radius:14,gap:10,accent:!0}),e("div",{style:{width:1,height:44,background:"color-mix(in oklab, var(--neba-fg) 16%, transparent)"}}),e(Tiles,{count:2,size:52,radius:14,gap:10})]})})}}:"windows"===a?{bottom:{node:t("div",{"aria-hidden":"true",className:`${r} justify-center [border-block-start:1px_solid_var(--neba-border)]`,style:{height:52,paddingInline:16},children:[t("div",{className:"flex items-center",style:{gap:10},children:[e("div",{className:"text-(--neba-fg)",style:{opacity:.7},children:e(StartGlyph,{size:22})}),e(Tiles,{count:6,size:30,radius:8,gap:10,accent:!0})]}),t("div",{className:"absolute flex items-center",style:{insetInlineEnd:16,gap:12},children:[e(Tile,{width:11,radius:3,tone:"faint"}),e(Tile,{width:11,radius:3,tone:"faint"}),e("span",{className:`${h} text-[12px]`,children:s})]})]})}}:{top:{node:t("div",{"aria-hidden":"true",className:`${r} justify-center`,style:{height:34,paddingInline:14},children:[e("div",{className:"absolute",style:{insetInlineStart:14},children:e(Tile,{width:52,height:9,radius:5})}),e("span",{className:`${h} text-[13px]`,children:s}),t("div",{className:"absolute flex items-center",style:{insetInlineEnd:14,gap:10},children:[e(Tile,{width:10,radius:3,tone:"faint"}),e(Tile,{width:10,radius:3,tone:"faint"}),e(Tile,{width:10,radius:3,tone:"faint"})]})]})},start:{node:t("div",{"aria-hidden":"true",className:`${r} flex-col justify-start [border-inline-end:1px_solid_var(--neba-border)]`,style:{width:66,height:"100%",gap:10,paddingBlock:12},children:[e(Tile,{width:44,radius:12,tone:"accent"}),e(Tile,{width:44,radius:12}),e(Tile,{width:44,radius:12}),e(Tile,{width:44,radius:12})]})}}}
|
|
@@ -39,4 +39,16 @@ type VisibilityCallback = (visible: boolean) => void;
|
|
|
39
39
|
* caller can make.
|
|
40
40
|
*/
|
|
41
41
|
export declare function observeVisibility(element: Element, threshold: number, onVisible: VisibilityCallback): (() => void) | null;
|
|
42
|
+
/**
|
|
43
|
+
* A ref object that says when an element is put on it or taken off.
|
|
44
|
+
*
|
|
45
|
+
* An effect that reads a `useRef` once watches only the element that was there
|
|
46
|
+
* at the first commit, so a hook whose caller draws a spinner first and the
|
|
47
|
+
* element after it never watches anything. React writes an object ref's
|
|
48
|
+
* `current` on every attach and detach, whichever component renders the
|
|
49
|
+
* element, so a setter hears both.
|
|
50
|
+
*/
|
|
51
|
+
export declare function attachedRef<E>(onChange: (element: E | null) => void): {
|
|
52
|
+
current: E | null;
|
|
53
|
+
};
|
|
42
54
|
export {};
|
package/dist/internal/observe.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
const e=new Map;let t=null;export function observeResize(r,n){const s="undefined"==typeof ResizeObserver?null:(t??=new ResizeObserver(t=>{for(const r of t){const t=e.get(r.target);if(t)for(const e of[...t])e(r)}}),t);if(!s)return()=>{};let o=e.get(r);return o||(o=new Set,e.set(r,o),s.observe(r)),o.add(n),()=>{const t=e.get(r);t&&(t.delete(n),0===t.size&&(e.delete(r),s.unobserve(r)))}}const r=new Map;export function observeVisibility(e,t,n){const s=function(e){if("undefined"==typeof IntersectionObserver)return null;let t=r.get(e);if(!t){const n=new Map;t={watchers:n,observer:new IntersectionObserver(e=>{for(const t of e){const e=n.get(t.target);if(e)for(const r of[...e])r(t.isIntersecting)}},{threshold:e})},r.set(e,t)}return t}(
|
|
1
|
+
const e=new Map;let t=null;export function observeResize(r,n){const s="undefined"==typeof ResizeObserver?null:(t??=new ResizeObserver(t=>{for(const r of t){const t=e.get(r.target);if(t)for(const e of[...t])e(r)}}),t);if(!s)return()=>{};let o=e.get(r);return o||(o=new Set,e.set(r,o),s.observe(r)),o.add(n),()=>{const t=e.get(r);t&&(t.delete(n),0===t.size&&(e.delete(r),s.unobserve(r)))}}const r=new Map;export function observeVisibility(e,t,n){const s=Number.isNaN(t)?0:Math.min(1,Math.max(0,t)),o=function(e){if("undefined"==typeof IntersectionObserver)return null;let t=r.get(e);if(!t){const n=new Map;t={watchers:n,observer:new IntersectionObserver(e=>{for(const t of e){const e=n.get(t.target);if(e)for(const r of[...e])r(t.isIntersecting)}},{threshold:e})},r.set(e,t)}return t}(s);if(!o)return null;let c=o.watchers.get(e);return c||(c=new Set,o.watchers.set(e,c),o.observer.observe(e)),c.add(n),()=>{const t=o.watchers.get(e);t&&(t.delete(n),0===t.size&&(o.watchers.delete(e),o.observer.unobserve(e),0===o.watchers.size&&(o.observer.disconnect(),r.delete(s))))}}export function attachedRef(e){let t=null;return{get current(){return t},set current(r){t=r,e(r)}}}
|
|
@@ -86,6 +86,15 @@ export interface PageLayoutContextValue {
|
|
|
86
86
|
locale?: string;
|
|
87
87
|
}
|
|
88
88
|
export declare const PageLayoutContext: React.Context<PageLayoutContextValue>;
|
|
89
|
+
/**
|
|
90
|
+
* Which bar the element being rendered right now was handed to the layout as.
|
|
91
|
+
*
|
|
92
|
+
* Only the `header` and the `footer` a PageLayout places are its bars. A Header
|
|
93
|
+
* anywhere else in the page, such as an article's own inside `<main>`, is a
|
|
94
|
+
* header of that part, and letting it register too overwrote the site header's
|
|
95
|
+
* height with its own and, once it unmounted, left the layout with none.
|
|
96
|
+
*/
|
|
97
|
+
export declare const PageLayoutSlotContext: React.Context<PageLayoutSlot | null>;
|
|
89
98
|
/**
|
|
90
99
|
* Which end of the band the sidebar being rendered right now takes.
|
|
91
100
|
*
|
|
@@ -97,14 +106,7 @@ export declare const PageLayoutContext: React.Context<PageLayoutContextValue>;
|
|
|
97
106
|
*/
|
|
98
107
|
export declare const SidebarSideContext: React.Context<SidebarSide | null>;
|
|
99
108
|
/**
|
|
100
|
-
* The
|
|
101
|
-
* writes the grid's.
|
|
102
|
-
*
|
|
103
|
-
* `xs` has no query because its floor is zero: there is no width below it, so
|
|
104
|
-
* a sidebar that collapses there never collapses.
|
|
105
|
-
*/
|
|
106
|
-
/**
|
|
107
|
-
* The same five widths as Tailwind variants, for the parts of this that are
|
|
109
|
+
* The five widths as Tailwind variants, for the parts of this that are
|
|
108
110
|
* decided in CSS rather than in JavaScript.
|
|
109
111
|
*
|
|
110
112
|
* The tables themselves are `internal/responsive.ts`', because `Show` asks the
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import*as e from"react";import{useMediaQuery as t,widthBelow as
|
|
1
|
+
"use client";import*as e from"react";import{useMediaQuery as t,widthBelow as o}from"./media.js";import{hiddenBelowClasses as n,hiddenFromClasses as r}from"./responsive.js";export const PageLayoutContext=/*@__PURE__*/e.createContext({present:!1,register:()=>{},collapseBelow:"none",open:{start:!1,end:!1},setOpen:()=>{},scroll:"page"});export const PageLayoutSlotContext=/*@__PURE__*/e.createContext(null);export const SidebarSideContext=/*@__PURE__*/e.createContext(null);export const collapsedOnlyClasses={none:"hidden",...r};export const expandedOnlyClasses={none:"",...n};export function useCollapsed(e){return t("none"===e?null:o(e))}export function drawerSide(e){const t="undefined"!=typeof document&&"rtl"===getComputedStyle(document.documentElement).direction;return"start"===e?t?"right":"left":t?"left":"right"}
|
|
@@ -104,7 +104,7 @@ interface InternalShellProps extends PickerShellProps {
|
|
|
104
104
|
* and the way `invalid` re-points the whole colour family at `danger` so the
|
|
105
105
|
* edge, the ring and the message turn over together.
|
|
106
106
|
*/
|
|
107
|
-
export declare function PickerShell({ variant, size, color, density, elevation, label, description, error, invalid, startIcon, fullWidth, disabled, readOnly, required, id, className, style, display, samples, empty, clearable, onClear, open, onOpenChange, clearLabel, hiddenValues, sideOffset, popupClassName, children, triggerRef, ...props }: InternalShellProps): React.JSX.Element;
|
|
107
|
+
export declare function PickerShell({ variant, size, color, density, elevation, label, description, error, invalid, startIcon, fullWidth, disabled: disabledProp, readOnly, required, id, className, style, display, samples, empty, clearable, onClear, open, onOpenChange, clearLabel, hiddenValues, sideOffset, popupClassName, children, triggerRef, ...props }: InternalShellProps): React.JSX.Element;
|
|
108
108
|
/**
|
|
109
109
|
* The row of shortcuts under a picker's panel.
|
|
110
110
|
*
|
package/dist/internal/picker.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsx as e,jsxs as
|
|
1
|
+
import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as l from"react";import{Field as i}from"@base-ui/react/field";import{Popover as a}from"@base-ui/react/popover";import{CloseIcon as t}from"./icons.js";import{WidthSizer as r}from"./sizer.js";import{chipRemoveClasses as o,controlTextLeadingClasses as s,cx as d,disabledClasses as c,fieldFocusTransitionClasses as p,fieldHeightClasses as u,fieldReadOnlyClasses as m,fieldRestClasses as f,fieldRingClasses as b,gapClasses as h,iconClasses as x,metaTextClasses as v,paddingXClasses as g,popupFadeClasses as N,radiusClasses as y,stackGapClasses as w,surfaceClasses as P,surfaceSlots as $,transitionClasses as j}from"./styles.js";import{fieldSpotlightSlot as C,glowClasses as k,trackPointer as z}from"./glow.js";import{useFieldsetDisabled as I}from"./fieldset.js";export function popupSlots(e,n){return{...$(e,n),"--n-fill":`var(--neba-${e}-fill)`,"--n-fill-hover":`var(--neba-${e}-fill-hover)`,"--n-fill-active":`var(--neba-${e}-fill-active)`,"--n-on-solid":`var(--neba-${e}-on-solid)`}}const O=["group relative flex w-full items-center select-none","[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",j,p,b,x].join(" ");export const pickerPopupClasses=[P,"border bg-(--n-panel-press)","[border-color:var(--n-line)]","[box-shadow:var(--neba-shadow-3),var(--neba-plate-glass)]","[outline:none]",N].join(" ");export const popupPaddingClasses={xs:"p-1.5",sm:"p-2",md:"p-2.5",lg:"p-3",xl:"p-3.5"};export function PickerShell({variant:p="outline",size:b="md",color:x="primary",density:N="default",elevation:P=0,label:j,description:q,error:F,invalid:R,startIcon:S,fullWidth:D=!1,disabled:E,readOnly:L=!1,required:B=!1,id:M,className:T,style:V,display:W,samples:A,empty:G,clearable:H=!1,onClear:J,open:K,onOpenChange:Q,clearLabel:U,hiddenValues:X,sideOffset:Y=6,popupClassName:Z,children:_,triggerRef:ee,...ne}){const le=I(E),ie=l.useId(),ae=M??`${ie}-trigger`,te=`${ie}-label`,re=`${ie}-description`,oe=`${ie}-error`,se=null!=F&&!1!==F&&""!==F,de=R??se,ce=de?"danger":x,pe=le||L,ue=d(q?re:null,se?oe:null)||void 0;return n(i.Root,{disabled:le,invalid:de,className:d("relative flex-col align-top",w[b],D?"flex w-full":"inline-flex",T),style:{...$(ce,P),...pe?void 0:C,...V},...ne,children:[j?e(i.Label,{id:te,htmlFor:ae,className:d(v[b],"font-medium",le?"text-(--neba-disabled-fg)":"text-(--neba-fg)"),children:j}):null,n(a.Root,{open:K,onOpenChange:e=>Q(e),children:[n("span",{onPointerMove:z(void 0,!pe),className:d(O,u[b],s[b],y[b],h[b],g[N][b],le?c[p]:L?m[p]:`${f[p]} ${k}`),children:[n(a.Trigger,{id:ae,ref:ee,disabled:le,"aria-labelledby":j?`${te} ${ae}`:void 0,"aria-describedby":ue,"aria-required":B||void 0,"aria-invalid":de||void 0,className:d("flex min-w-0 flex-1 items-center bg-transparent text-start [font:inherit] text-inherit",h[b],"[outline:none]",pe?"cursor-default":"cursor-pointer"),children:[S?e("span",{className:"flex h-[1lh] shrink-0 items-center text-(--neba-muted-fg) transition-[color] duration-(--neba-duration) group-focus-within:text-(--n-accent)",children:S}):null,n("span",{className:"flex min-w-0 flex-1 flex-col",children:[e("span",{className:d("w-full truncate",G?"text-(--neba-muted-fg)":"text-(--neba-fg)"),children:W}),e(r,{samples:A??[]})]})]}),!H||G||pe?null:e("button",{type:"button","aria-label":U,className:d(o,"text-(--neba-muted-fg)"),onClick:e=>{e.stopPropagation(),J()},children:e(t,{})})]}),e(a.Portal,{children:e(a.Positioner,{className:"neba-portal z-(--neba-z-portal) [outline:none]",sideOffset:Y,align:"start",children:e(a.Popup,{initialFocus:!1,className:d(pickerPopupClasses,y[b],popupPaddingClasses[b],s[b],Z),style:popupSlots(ce,3),children:_})})})]}),q?e(i.Description,{id:re,className:d(v[b],"text-(--neba-muted-fg)"),children:q}):null,se?e(i.Error,{id:oe,match:!0,className:d(v[b],"text-(--n-accent)"),children:F}):null,X?.map((n,l)=>e("input",{type:"hidden",name:n.name,value:n.value,disabled:le},l)),B&&!pe?e("input",{"aria-hidden":"true",tabIndex:-1,required:!0,value:G?"":"chosen",onChange:()=>{},onInvalid:()=>document.getElementById(ae)?.focus(),className:"pointer-events-none absolute start-0 bottom-0 size-px overflow-hidden opacity-0 [clip-path:inset(50%)]"}):null]})}export function PickerFooter({size:n,children:l}){return e("div",{className:d("flex items-center justify-end border-t pt-1.5","[border-color:var(--n-line)]",h[n]),children:l})}export function PickerDivider(){return e("div",{"aria-hidden":"true",className:"w-px self-stretch bg-(--n-line)"})}
|
|
@@ -68,6 +68,12 @@ export interface ProgressSharedProps extends Omit<React.ComponentPropsWithoutRef
|
|
|
68
68
|
* range nobody described.
|
|
69
69
|
*/
|
|
70
70
|
format?: Intl.NumberFormatOptions;
|
|
71
|
+
/**
|
|
72
|
+
* The language the value is written in, as a BCP 47 tag such as `de-DE`. Left
|
|
73
|
+
* out, it is a provider's `locale`, and then the reader's runtime, which a
|
|
74
|
+
* server and a browser do not always share.
|
|
75
|
+
*/
|
|
76
|
+
locale?: string;
|
|
71
77
|
}
|
|
72
78
|
/**
|
|
73
79
|
* The slots a progress indicator reads.
|
|
@@ -131,11 +137,11 @@ export declare function progressFraction(value: number | null | undefined, min:
|
|
|
131
137
|
/**
|
|
132
138
|
* What the value reads as, both on screen and to a screen reader.
|
|
133
139
|
*
|
|
134
|
-
*
|
|
135
|
-
*
|
|
136
|
-
*
|
|
137
|
-
* `format` gets Base UI's formatted string
|
|
138
|
-
* have said what the number means.
|
|
140
|
+
* Without `format` it is the share of the range as a whole percent, computed
|
|
141
|
+
* from the fraction — so step 3 of 4 reads "75%" — and written the same way in
|
|
142
|
+
* every language. (Base UI's own default is that share too, in the locale's
|
|
143
|
+
* percent style.) A caller who passed `format` gets Base UI's formatted string
|
|
144
|
+
* instead, because at that point they have said what the number means.
|
|
139
145
|
*/
|
|
140
146
|
export declare function progressText(fraction: number | null, formatted: string | null, hasFormat: boolean): string | null;
|
|
141
147
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export function thresholdColor(e,r,s){if(!s||0===s.length)return r;let n=r;for(const r of s)e>=r.from&&(n=r.color);return n}export function progressSlots(e){return{"--n-fill":`var(--neba-${e}-fill)`,"--n-accent":`var(--neba-${e}-accent)`,"--n-soft":`var(--neba-${e}-soft)`,"--n-soft-hover":`var(--neba-${e}-soft-hover)`,"--n-soft-press":`var(--neba-${e}-soft-press)`,"--n-line":`var(--neba-${e}-line)`}}export const barThicknessClasses={xs:"h-0.5",sm:"h-[3px]",md:"h-1",lg:"h-1.5",xl:"h-2"};export const ringDiameters={xs:14,sm:16,md:20,lg:26,xl:32};export const ringStrokes={xs:1.5,sm:1.75,md:2,lg:2.5,xl:3};export const plateSizeClasses={xs:"size-2",sm:"size-2.5",md:"size-3",lg:"size-4",xl:"size-5"};export const plateRadiusClasses={xs:"rounded-[0.1875rem]",sm:"rounded-[0.25rem]",md:"rounded-[0.28125rem]",lg:"rounded-[0.375rem]",xl:"rounded-[0.4375rem]"};export const plateGapClasses={xs:"gap-1",sm:"gap-1",md:"gap-1.5",lg:"gap-1.5",xl:"gap-2"};export function progressFraction(e,r,s){return null
|
|
1
|
+
export function thresholdColor(e,r,s){if(!s||0===s.length)return r;let n=r;for(const r of s)e>=r.from&&(n=r.color);return n}export function progressSlots(e){return{"--n-fill":`var(--neba-${e}-fill)`,"--n-accent":`var(--neba-${e}-accent)`,"--n-soft":`var(--neba-${e}-soft)`,"--n-soft-hover":`var(--neba-${e}-soft-hover)`,"--n-soft-press":`var(--neba-${e}-soft-press)`,"--n-line":`var(--neba-${e}-line)`}}export const barThicknessClasses={xs:"h-0.5",sm:"h-[3px]",md:"h-1",lg:"h-1.5",xl:"h-2"};export const ringDiameters={xs:14,sm:16,md:20,lg:26,xl:32};export const ringStrokes={xs:1.5,sm:1.75,md:2,lg:2.5,xl:3};export const plateSizeClasses={xs:"size-2",sm:"size-2.5",md:"size-3",lg:"size-4",xl:"size-5"};export const plateRadiusClasses={xs:"rounded-[0.1875rem]",sm:"rounded-[0.25rem]",md:"rounded-[0.28125rem]",lg:"rounded-[0.375rem]",xl:"rounded-[0.4375rem]"};export const plateGapClasses={xs:"gap-1",sm:"gap-1",md:"gap-1.5",lg:"gap-1.5",xl:"gap-2"};export function progressFraction(e,r,s){return null!=e&&Number.isFinite(e)?s<=r?null:Math.min(1,Math.max(0,(e-r)/(s-r))):null}export function progressText(e,r,s){return null===e?null:s?r:`${Math.round(100*e)}%`}export function progressAriaText(e,r){if(null!==e)return s=>progressText(e,s,r)??""}
|
|
@@ -78,14 +78,6 @@ export declare function valueAt<T>(value: NebaResponsive<T> | undefined, breakpo
|
|
|
78
78
|
* one or two slots rather than five.
|
|
79
79
|
*/
|
|
80
80
|
export declare function overlayResponsive<T>(base: NebaResponsive<T>, override: NebaResponsive<T> | undefined): NebaResponsive<T>;
|
|
81
|
-
/**
|
|
82
|
-
* A number is pixels; a string is already a CSS length.
|
|
83
|
-
*
|
|
84
|
-
* Every length a caller can hand this library goes through here — a Stack's
|
|
85
|
-
* overlap, a Container's measure — so that `640` and `'640px'` mean the same
|
|
86
|
-
* thing everywhere rather than in the components that happened to think of it.
|
|
87
|
-
*/
|
|
88
|
-
export declare function lengthOf(value: number | string): string;
|
|
89
81
|
/** Hidden below this breakpoint: the element exists from here up. */
|
|
90
82
|
export declare const hiddenBelowClasses: Record<NebaBreakpoint, string>;
|
|
91
83
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export const breakpoints=["xs","sm","md","lg","xl"];export function breakpointMap(n){return null==n?{}:"object"==typeof n?n:{xs:n}}export function responsiveSlots(n,e,o){const t=breakpointMap(e),r={};for(const e of breakpoints){const i=t[e];void 0!==i&&(r[`--n-${n}-${e}`]=o(i))}return r}export function withBaseline(n,e){
|
|
1
|
+
export const breakpoints=["xs","sm","md","lg","xl"];export function breakpointMap(n){return null==n?{}:"object"==typeof n?n:{xs:n}}export function responsiveSlots(n,e,o){const t=breakpointMap(e),r={};for(const e of breakpoints){const i=t[e];void 0!==i&&(r[`--n-${n}-${e}`]=o(i))}return r}export function withBaseline(n,e){if(null==n)return e;if("object"==typeof n){const o=n;return{...o,xs:o.xs??e}}return n}export function valueAt(n,e){if(null==n)return;if("object"!=typeof n)return n;const o=n;for(let n=breakpoints.indexOf(e);n>=0;n-=1){const e=o[breakpoints[n]];if(void 0!==e)return e}}export function overlayResponsive(n,e){if(null==e)return n;const o=breakpointMap(n),t=breakpointMap(e),r={};let i,s,d;for(const n of breakpoints){void 0!==o[n]&&(i=o[n]),void 0!==t[n]&&(s=t[n]);const e=void 0!==s?s:i;void 0!==e&&e!==d&&(r[n]=e,d=e)}return r}export const hiddenBelowClasses={xs:"",sm:"max-sm:hidden",md:"max-md:hidden",lg:"max-lg:hidden",xl:"max-xl:hidden"};export const hiddenFromClasses={xs:"hidden",sm:"sm:hidden",md:"md:hidden",lg:"lg:hidden",xl:"xl:hidden"};
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* What a `NebaRunStatus` looks like, and the clock behind an elapsed time.
|
|
3
|
+
*
|
|
4
|
+
* Three components answer the same two questions — ToolCall and AgentSteps ask
|
|
5
|
+
* which mark and which colour family a status is drawn in, ToolCall and
|
|
6
|
+
* Reasoning ask how long something has been going on — and neither answer is
|
|
7
|
+
* one a component should hold on its own. A transcript draws a tool call above
|
|
8
|
+
* a plan above a thinking panel, all three at once, and a library where the
|
|
9
|
+
* tick on one is a different green from the tick on the next is a library whose
|
|
10
|
+
* reader cannot tell whether the difference means anything.
|
|
11
|
+
*
|
|
12
|
+
* The clock is here for a second reason. A component that counts while
|
|
13
|
+
* something runs re-renders on every tick, so how often it ticks is a decision
|
|
14
|
+
* about a whole transcript rather than about one row: a page holding twenty
|
|
15
|
+
* running tool calls at ten frames a second is two hundred renders a second for
|
|
16
|
+
* a number nobody is reading that closely. It ticks once a second, and says
|
|
17
|
+
* nothing at all until the first one has passed.
|
|
18
|
+
*/
|
|
19
|
+
import * as React from 'react';
|
|
20
|
+
import type { NebaColor, NebaRunStatus } from '../types.js';
|
|
21
|
+
/**
|
|
22
|
+
* The mark for a status.
|
|
23
|
+
*
|
|
24
|
+
* A function rather than a `Record` of elements, for the reason `severityIcon`
|
|
25
|
+
* is one: a bundler drops an unused function and cannot drop a key out of an
|
|
26
|
+
* object literal, and nothing should build four React elements at import time
|
|
27
|
+
* for a page that may draw none of them.
|
|
28
|
+
*/
|
|
29
|
+
export declare function runIcon(status: NebaRunStatus): React.ReactElement;
|
|
30
|
+
/**
|
|
31
|
+
* The colour family a status is drawn in, given the component's own.
|
|
32
|
+
*
|
|
33
|
+
* Two of the four are not the caller's to choose: something that failed is
|
|
34
|
+
* `danger` and something that finished is `success`, and a `color` prop that
|
|
35
|
+
* repainted either would be a transcript where a red row and a green row mean
|
|
36
|
+
* whatever the page's accent happens to be. The other two are — `running` takes
|
|
37
|
+
* the component's family, and `pending` is deliberately `secondary`, which is
|
|
38
|
+
* the one family that says "nothing has happened here yet" without saying
|
|
39
|
+
* anything about how it went.
|
|
40
|
+
*/
|
|
41
|
+
export declare function runColor(status: NebaRunStatus, color: NebaColor): NebaColor;
|
|
42
|
+
/**
|
|
43
|
+
* A length of time, in the reader's own language.
|
|
44
|
+
*
|
|
45
|
+
* `Intl` knows the words, so none of this is in `i18n.ts`: what it decides is
|
|
46
|
+
* only the unit and how many digits are worth printing. Under a second the
|
|
47
|
+
* number is milliseconds, because "0.3s" is a measurement written in the wrong
|
|
48
|
+
* unit; over it, seconds, to one decimal place for the first ten and then to
|
|
49
|
+
* none — a step that ran for four minutes is not more informative at 247.3.
|
|
50
|
+
*/
|
|
51
|
+
export declare function formatDuration(ms: number, locale?: string): string;
|
|
52
|
+
/**
|
|
53
|
+
* How long a run has been going, in milliseconds, or `null`.
|
|
54
|
+
*
|
|
55
|
+
* A `duration` the caller knows wins outright; without one the clock counts,
|
|
56
|
+
* and what it counts is *whole seconds*, because a component that re-renders
|
|
57
|
+
* ten times a second is a decision about a whole transcript rather than about
|
|
58
|
+
* one row.
|
|
59
|
+
*
|
|
60
|
+
* `null` is "there is nothing to say", and the first second of every run
|
|
61
|
+
* returns it: a counter that starts at "0s" claims a precision the tick rate
|
|
62
|
+
* does not have, and a tool that answers in 300ms would have spent its whole
|
|
63
|
+
* life saying zero.
|
|
64
|
+
*
|
|
65
|
+
* The last figure is **kept** once the run ends, which is what turns a live
|
|
66
|
+
* count into a total — a thinking panel that says "Thought for 4s" is reading
|
|
67
|
+
* the same number it was ticking a moment ago. It is cleared when a new run
|
|
68
|
+
* starts, so a retried call counts its own attempt rather than carrying the
|
|
69
|
+
* first one's number forward.
|
|
70
|
+
*/
|
|
71
|
+
export declare function useElapsed(running: boolean, duration: number | undefined): number | null;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use client";import{jsx as r}from"react/jsx-runtime";import*as t from"react";import{CircleIcon as e,DangerIcon as n,SpinnerIcon as u,SuccessIcon as s}from"./icons.js";import{numberFormatter as i}from"./format.js";export function runIcon(t){switch(t){case"running":return r(u,{});case"success":return r(s,{});case"error":return r(n,{});default:return r(e,{})}}export function runColor(r,t){switch(r){case"success":return"success";case"error":return"danger";case"pending":return"secondary";default:return t}}export function formatDuration(r,t){if(!Number.isFinite(r)||r<0)return"";if(r<1e3)return i(t,{style:"unit",unit:"millisecond",unitDisplay:"narrow",maximumFractionDigits:0}).format(Math.round(r));const e=r/1e3;return i(t,{style:"unit",unit:"second",unitDisplay:"narrow",maximumFractionDigits:e<10?1:0}).format(e)}export function useElapsed(r,e){const n=r&&void 0===e,[u,s]=t.useState(null),[i,o]=t.useState(n);return i!==n&&(o(n),n&&s(null)),t.useEffect(()=>{if(!n)return;const r=Date.now(),t=setInterval(()=>s(Date.now()-r),1e3);return()=>clearInterval(t)},[n]),e??u}
|