@keboola/design 15.0.0 → 15.1.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/CHANGELOG.md +25 -0
- package/dist/{AIKit-CaAW4GLx.js → AIKit-BR6jfsdI.js} +60 -21
- package/dist/AIKit-BR6jfsdI.js.map +1 -0
- package/dist/{AlertModal-D4AtpvLS.js → AlertModal-DMsn62JJ.js} +3 -3
- package/dist/AlertModal-DMsn62JJ.js.map +1 -0
- package/dist/{Badge-5GHIsgRS.js → Badge-CqlOE5A2.js} +10 -10
- package/dist/Badge-CqlOE5A2.js.map +1 -0
- package/dist/{BrandEditor-CTGtQUFZ.js → BrandEditor-D61pzWRq.js} +3 -3
- package/dist/{BrandEditor-CTGtQUFZ.js.map → BrandEditor-D61pzWRq.js.map} +1 -1
- package/dist/{Breadcrumb-B2YSNON4.js → Breadcrumb-DbqvDnYl.js} +2 -2
- package/dist/{Breadcrumb-B2YSNON4.js.map → Breadcrumb-DbqvDnYl.js.map} +1 -1
- package/dist/{ColorModeSwitch-B6UEzG0H.js → ColorModeSwitch-BlrH8jAi.js} +2 -2
- package/dist/{ColorModeSwitch-B6UEzG0H.js.map → ColorModeSwitch-BlrH8jAi.js.map} +1 -1
- package/dist/{Combobox-CaKqgstG.js → Combobox-BLqX-Tdh.js} +3 -3
- package/dist/Combobox-BLqX-Tdh.js.map +1 -0
- package/dist/{DateInput-BgbMDJkm.js → DateInput-duinbI9_.js} +2 -2
- package/dist/{DateInput-BgbMDJkm.js.map → DateInput-duinbI9_.js.map} +1 -1
- package/dist/{DatePicker-BXpDRo-R.js → DatePicker-Cg_aG_N4.js} +2 -2
- package/dist/{DatePicker-BXpDRo-R.js.map → DatePicker-Cg_aG_N4.js.map} +1 -1
- package/dist/{DateRangeInput-BW0-_jV0.js → DateRangeInput-BYVHf9zo.js} +2 -2
- package/dist/{DateRangeInput-BW0-_jV0.js.map → DateRangeInput-BYVHf9zo.js.map} +1 -1
- package/dist/{DateRangePicker-C4-DoWac.js → DateRangePicker-m47cSV1r.js} +3 -3
- package/dist/{DateRangePicker-C4-DoWac.js.map → DateRangePicker-m47cSV1r.js.map} +1 -1
- package/dist/{DropdownMenu-CcVbZ_5u.js → DropdownMenu-Bum99mVf.js} +2 -2
- package/dist/DropdownMenu-Bum99mVf.js.map +1 -0
- package/dist/{Form-CAofWyMI.js → Form-Dqbt_tIs.js} +2 -2
- package/dist/{Form-CAofWyMI.js.map → Form-Dqbt_tIs.js.map} +1 -1
- package/dist/HoverCard-Cf9iYyaW.js +26 -0
- package/dist/HoverCard-Cf9iYyaW.js.map +1 -0
- package/dist/{MermaidDiagram-Te-5gOCU.js → MermaidDiagram-2-EuNu1i.js} +2 -2
- package/dist/{MermaidDiagram-Te-5gOCU.js.map → MermaidDiagram-2-EuNu1i.js.map} +1 -1
- package/dist/{Modal-CbUz-5YH.js → Modal-DwuvuiUx.js} +3 -3
- package/dist/Modal-DwuvuiUx.js.map +1 -0
- package/dist/{ModalTitle-cy0Ht9VY.js → ModalTitle-RGWwIMU6.js} +2 -2
- package/dist/ModalTitle-RGWwIMU6.js.map +1 -0
- package/dist/{PageToolbar-DJ5tdYla.js → PageToolbar-LKP6PiP_.js} +3 -3
- package/dist/{PageToolbar-DJ5tdYla.js.map → PageToolbar-LKP6PiP_.js.map} +1 -1
- package/dist/{Popconfirm-DwLCYNaF.js → Popconfirm-p72DiagN.js} +2 -2
- package/dist/{Popconfirm-DwLCYNaF.js.map → Popconfirm-p72DiagN.js.map} +1 -1
- package/dist/{Popover-DtUDwUVO.js → Popover-DnBw5Uay.js} +2 -2
- package/dist/Popover-DnBw5Uay.js.map +1 -0
- package/dist/{SectionNav-tLK3iF6c.js → SectionNav-6hcIpZLO.js} +3 -3
- package/dist/{SectionNav-tLK3iF6c.js.map → SectionNav-6hcIpZLO.js.map} +1 -1
- package/dist/{Select-B22hB_-w.js → Select-C6zKeip5.js} +2 -2
- package/dist/Select-C6zKeip5.js.map +1 -0
- package/dist/{Sheet-0TWKTqid.js → Sheet-DKG20J7W.js} +3 -3
- package/dist/Sheet-DKG20J7W.js.map +1 -0
- package/dist/{Sidebar-C5hdANBU.js → Sidebar-BlYqasnX.js} +4 -4
- package/dist/{Sidebar-C5hdANBU.js.map → Sidebar-BlYqasnX.js.map} +1 -1
- package/dist/{TimePicker-CoRpiEM3.js → TimePicker-lk3NGqeK.js} +2 -2
- package/dist/{TimePicker-CoRpiEM3.js.map → TimePicker-lk3NGqeK.js.map} +1 -1
- package/dist/Workbench-CxgNCs3I.js.map +1 -1
- package/dist/{ZoomableSvg-DnFXo2L4.js → ZoomableSvg-CxXKanUR.js} +2 -2
- package/dist/{ZoomableSvg-DnFXo2L4.js.map → ZoomableSvg-CxXKanUR.js.map} +1 -1
- package/dist/flint.js +1 -1
- package/dist/index.d.ts +42 -8
- package/dist/index.js +26 -25
- package/dist/internal/blocks/AIKit.js +1 -1
- package/dist/internal/blocks/BrandEditor.js +1 -1
- package/dist/internal/blocks/ChipEditor.js +1 -1
- package/dist/internal/blocks/ColorModeSwitch.js +1 -1
- package/dist/internal/blocks/DateInput.js +1 -1
- package/dist/internal/blocks/DateRangeInput.js +1 -1
- package/dist/internal/blocks/ExportMenu.js +1 -1
- package/dist/internal/blocks/Form/connectors/ComboboxField.js +1 -1
- package/dist/internal/blocks/Form.js +1 -1
- package/dist/internal/blocks/MultiCombobox.js +1 -1
- package/dist/internal/blocks/PageToolbar.js +1 -1
- package/dist/internal/blocks/SectionNav.js +1 -1
- package/dist/internal/blocks/SplitButton.js +1 -1
- package/dist/internal/blocks/TimeInput.js +1 -1
- package/dist/internal/components/AlertModal.js +1 -1
- package/dist/internal/components/Badge.js +1 -1
- package/dist/internal/components/Breadcrumb.js +1 -1
- package/dist/internal/components/Combobox.js +1 -1
- package/dist/internal/components/DatePicker.js +1 -1
- package/dist/internal/components/DateRangePicker.js +1 -1
- package/dist/internal/components/DropdownMenu.js +1 -1
- package/dist/internal/components/HoverCard.js +1 -1
- package/dist/internal/components/Modal.js +1 -1
- package/dist/internal/components/Popconfirm.js +1 -1
- package/dist/internal/components/Popover.js +1 -1
- package/dist/internal/components/Select.js +1 -1
- package/dist/internal/components/Sheet.js +1 -1
- package/dist/internal/components/Sidebar.js +1 -1
- package/dist/internal/components/TimePicker.js +1 -1
- package/dist/internal/components/ZoomableSvg.js +1 -1
- package/dist/internal/hooks/useTimeout.js +19 -0
- package/dist/internal/hooks/useTimeout.js.map +1 -0
- package/dist/markdown-editor.js +3 -3
- package/dist/mermaid.js +1 -1
- package/dist/rjsf.js +2 -2
- package/dist/styles.css +1 -1
- package/dist/utils-DwC9u0tM.js.map +1 -1
- package/package.json +1 -1
- package/src/theme.css +4 -0
- package/dist/AIKit-CaAW4GLx.js.map +0 -1
- package/dist/AlertModal-D4AtpvLS.js.map +0 -1
- package/dist/Badge-5GHIsgRS.js.map +0 -1
- package/dist/Combobox-CaKqgstG.js.map +0 -1
- package/dist/DropdownMenu-CcVbZ_5u.js.map +0 -1
- package/dist/HoverCard-Cv5rmvJq.js +0 -26
- package/dist/HoverCard-Cv5rmvJq.js.map +0 -1
- package/dist/Modal-CbUz-5YH.js.map +0 -1
- package/dist/ModalTitle-cy0Ht9VY.js.map +0 -1
- package/dist/Popover-DtUDwUVO.js.map +0 -1
- package/dist/Select-B22hB_-w.js.map +0 -1
- package/dist/Sheet-0TWKTqid.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Workbench-CxgNCs3I.js","names":[],"sources":["../src/components/Workbench/constants.ts","../src/components/Workbench/context.ts","../src/components/Workbench/WorkbenchBar/WorkbenchBarEnd.tsx","../src/components/Workbench/WorkbenchBar/WorkbenchBarMiddle.tsx","../src/components/Workbench/WorkbenchBar/WorkbenchBarStart.tsx","../src/components/Workbench/WorkbenchBar/WorkbenchBar.tsx","../src/components/Workbench/WorkbenchFullScreenTrigger.tsx","../src/components/Workbench/WorkbenchPanel/WorkbenchPanelResizeHandle.tsx","../src/components/Workbench/WorkbenchPanel/WorkbenchPanel.tsx","../src/components/Workbench/WorkbenchPanel/WorkbenchPanelActions.tsx","../src/components/Workbench/WorkbenchPanel/WorkbenchPanelContent.tsx","../src/components/Workbench/WorkbenchPanel/WorkbenchPanelHeader.tsx","../src/components/Workbench/WorkbenchPanel/WorkbenchPanelTitle.tsx","../src/components/Workbench/Workbench.tsx"],"sourcesContent":["export const DEFAULT_WORKBENCH_BAR_HEIGHT_IN_REM = 2.75;\n\nexport const MIN_WORKBENCH_BAR_HEIGHT_IN_REM = 1;\n\nexport const DEFAULT_WORKBENCH_PANEL_HEIGHT_IN_PX = 320;\n\nexport const MIN_WORKBENCH_PANEL_HEIGHT_IN_PX = 120;\n\nexport const WORKBENCH_PANEL_RESIZE_STEP_IN_PX = 24;\n\nexport const WORKBENCH_PANEL_FULL_SCREEN_EXIT_RATIO = 0.8;\n","import { createContext, use } from 'react';\nimport type { Dispatch, SetStateAction } from 'react';\n\n/**\n * Full screen is a mode of the open panel, not a flag beside it — as two booleans the fourth\n * combination (collapsed *and* full screen) is expressible but meaningless.\n */\nexport type WorkbenchState = 'collapsed' | 'expanded' | 'full-screen';\n\ntype WorkbenchActions = {\n expand: () => void;\n collapse: () => void;\n toggleExpanded: () => void;\n enterFullScreen: () => void;\n exitFullScreen: () => void;\n toggleFullScreen: () => void;\n};\n\ntype WorkbenchContextValue = WorkbenchActions & {\n state: WorkbenchState;\n setState: Dispatch<SetStateAction<WorkbenchState>>;\n panelHeight: number;\n setPanelHeight: Dispatch<SetStateAction<number>>;\n isResizing: boolean;\n setIsResizing: (isResizing: boolean) => void;\n};\n\nexport const createWorkbenchActions = (\n setState: Dispatch<SetStateAction<WorkbenchState>>,\n): WorkbenchActions => ({\n // Opening an already-open panel leaves full screen alone.\n expand: () => setState((state) => (state === 'collapsed' ? 'expanded' : state)),\n collapse: () => setState('collapsed'),\n toggleExpanded: () => setState((state) => (state === 'collapsed' ? 'expanded' : 'collapsed')),\n\n enterFullScreen: () => setState('full-screen'),\n // Exiting returns to the open panel, never to a closed one — this is a restore, not a collapse.\n exitFullScreen: () => setState((state) => (state === 'full-screen' ? 'expanded' : state)),\n toggleFullScreen: () =>\n setState((state) => (state === 'full-screen' ? 'expanded' : 'full-screen')),\n});\n\nexport const WorkbenchContext = createContext<WorkbenchContextValue | null>(null);\n\n/**\n * The parts sit at arbitrary depth under `<Workbench>` — a trigger lives inside the panel header,\n * three levels down — so the state travels by context rather than props.\n */\nexport const useWorkbench = (): WorkbenchContextValue => {\n const context = use(WorkbenchContext);\n\n if (context === null) {\n throw new Error('Workbench compound components must be rendered inside <Workbench>.');\n }\n\n return context;\n};\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../../utils';\n\ntype Props = ComponentProps<'div'>;\n\nexport const WorkbenchBarEnd = ({ className, ...props }: Props) => (\n <div\n {...props}\n data-slot=\"workbench-bar-end\"\n className={cn(\n // grid placement\n 'tw:col-start-3',\n 'tw:row-start-1',\n\n // layout\n 'tw:flex',\n 'tw:items-center',\n 'tw:justify-end',\n 'tw:gap-2',\n\n className,\n )}\n />\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../../utils';\n\ntype Props = ComponentProps<'div'>;\n\nexport const WorkbenchBarMiddle = ({ className, ...props }: Props) => (\n <div\n {...props}\n data-slot=\"workbench-bar-middle\"\n className={cn(\n // grid placement\n 'tw:col-start-2',\n 'tw:row-start-1',\n\n // layout\n 'tw:flex',\n 'tw:items-center',\n 'tw:justify-center',\n 'tw:gap-2',\n\n className,\n )}\n />\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../../utils';\n\ntype Props = ComponentProps<'div'>;\n\nexport const WorkbenchBarStart = ({ className, ...props }: Props) => (\n <div\n {...props}\n data-slot=\"workbench-bar-start\"\n className={cn(\n // grid placement\n 'tw:col-start-1',\n 'tw:row-start-1',\n\n // layout\n 'tw:flex',\n 'tw:items-center',\n 'tw:gap-2',\n\n className,\n )}\n />\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../../utils';\n\nimport { WorkbenchBarEnd } from './WorkbenchBarEnd';\nimport { WorkbenchBarMiddle } from './WorkbenchBarMiddle';\nimport { WorkbenchBarStart } from './WorkbenchBarStart';\n\ntype Props = ComponentProps<'div'>;\n\nexport const WorkbenchBar = ({ className, children, ...props }: Props) => (\n <div\n // Marked so a floating surface (kbc-ui's Kai widget) can measure the dock; the root's rect is the bar alone.\n data-workbench-slot=\"bar\"\n className={cn(\n // layout\n 'tw:grid',\n 'tw:grid-cols-[auto_1fr_auto]',\n 'tw:items-center',\n 'tw:gap-x-2',\n\n // sizing\n 'tw:h-(--workbench-bar-height)',\n 'tw:shrink-0',\n 'tw:pointer-events-auto',\n\n // surface\n 'tw:border-t',\n 'tw:border-sidebar-border',\n 'tw:bg-sidebar',\n\n // spacing\n 'tw:px-3',\n\n // typography\n 'tw:text-xs',\n\n className,\n )}\n {...props}\n >\n {children}\n </div>\n);\n\nWorkbenchBar.Start = WorkbenchBarStart;\nWorkbenchBar.Middle = WorkbenchBarMiddle;\nWorkbenchBar.End = WorkbenchBarEnd;\n","import type { ComponentProps, MouseEvent } from 'react';\nimport { Slot } from '@radix-ui/react-slot';\n\nimport { useWorkbench } from './context';\n\ntype Props = ComponentProps<'button'> & {\n asChild?: boolean;\n};\n\nexport const WorkbenchFullScreenTrigger = ({ asChild = false, onClick, ...props }: Props) => {\n const { state, toggleFullScreen } = useWorkbench();\n const isFullScreen = state === 'full-screen';\n const Comp = asChild ? Slot : 'button';\n\n const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n onClick?.(event);\n\n if (!event.defaultPrevented) {\n toggleFullScreen();\n }\n };\n\n return (\n <Comp\n {...(asChild ? {} : { type: 'button' as const })}\n {...props}\n data-slot=\"workbench-full-screen-trigger\"\n data-state={isFullScreen ? 'on' : 'off'}\n onClick={handleClick}\n />\n );\n};\n","import { useEffect, useRef } from 'react';\nimport type { KeyboardEvent, PointerEvent, RefObject } from 'react';\n\nimport { cn } from '../../../utils';\nimport {\n MIN_WORKBENCH_PANEL_HEIGHT_IN_PX,\n WORKBENCH_PANEL_FULL_SCREEN_EXIT_RATIO,\n WORKBENCH_PANEL_RESIZE_STEP_IN_PX,\n} from '../constants';\nimport { useWorkbench } from '../context';\n\ntype Props = {\n panelRef: RefObject<HTMLDivElement | null>;\n};\n\nconst getMaxHeight = (panel: HTMLDivElement) => {\n const hostTop = panel.offsetParent?.getBoundingClientRect().top ?? 0;\n\n return Math.max(panel.getBoundingClientRect().bottom - hostTop, MIN_WORKBENCH_PANEL_HEIGHT_IN_PX);\n};\n\nconst clampHeight = (height: number, panel: HTMLDivElement) =>\n Math.min(Math.max(height, MIN_WORKBENCH_PANEL_HEIGHT_IN_PX), getMaxHeight(panel));\n\nexport const WorkbenchPanelResizeHandle = ({ panelRef }: Props) => {\n const {\n state,\n panelHeight,\n setPanelHeight,\n isResizing,\n setIsResizing,\n enterFullScreen,\n exitFullScreen,\n } = useWorkbench();\n const grabOffsetRef = useRef(0);\n const previousStateRef = useRef(state);\n const isFullScreenRequestedRef = useRef(state === 'full-screen');\n const enteredFullScreenByDragRef = useRef(false);\n const exitedFullScreenByDragRef = useRef(false);\n\n useEffect(() => {\n if (!isResizing) return;\n\n const { body } = document;\n const { cursor, userSelect } = body.style;\n\n body.style.cursor = 'ns-resize';\n body.style.userSelect = 'none';\n\n return () => {\n body.style.cursor = cursor;\n body.style.userSelect = userSelect;\n };\n }, [isResizing]);\n\n useEffect(() => {\n const previous = previousStateRef.current;\n const panel = panelRef.current;\n\n previousStateRef.current = state;\n isFullScreenRequestedRef.current = state === 'full-screen';\n\n if (previous !== 'full-screen' || state !== 'expanded' || !panel) return;\n\n const draggedIntoFullScreen = enteredFullScreenByDragRef.current;\n const draggedOutOfFullScreen = exitedFullScreenByDragRef.current;\n\n enteredFullScreenByDragRef.current = false;\n exitedFullScreenByDragRef.current = false;\n\n if (!draggedIntoFullScreen || draggedOutOfFullScreen) return;\n\n setPanelHeight(\n clampHeight(getMaxHeight(panel) * WORKBENCH_PANEL_FULL_SCREEN_EXIT_RATIO, panel),\n );\n }, [state, panelRef, setPanelHeight]);\n\n const applyHeight = (height: number, panel: HTMLDivElement) => {\n const isFullScreen = isFullScreenRequestedRef.current;\n\n if (height >= getMaxHeight(panel)) {\n if (!isFullScreen) {\n isFullScreenRequestedRef.current = true;\n enteredFullScreenByDragRef.current = true;\n enterFullScreen();\n }\n\n return;\n }\n\n if (isFullScreen) {\n isFullScreenRequestedRef.current = false;\n exitedFullScreenByDragRef.current = true;\n exitFullScreen();\n }\n\n setPanelHeight(Math.max(height, MIN_WORKBENCH_PANEL_HEIGHT_IN_PX));\n };\n\n const handlePointerDown = (event: PointerEvent<HTMLDivElement>) => {\n const panel = panelRef.current;\n\n if (event.button !== 0 || !panel) return;\n\n event.preventDefault();\n event.currentTarget.setPointerCapture(event.pointerId);\n grabOffsetRef.current = panel.getBoundingClientRect().top - event.clientY;\n setIsResizing(true);\n };\n\n const handlePointerMove = (event: PointerEvent<HTMLDivElement>) => {\n const panel = panelRef.current;\n\n if (!panel || !event.currentTarget.hasPointerCapture(event.pointerId)) return;\n\n const top = event.clientY + grabOffsetRef.current;\n\n applyHeight(panel.getBoundingClientRect().bottom - top, panel);\n };\n\n const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n const panel = panelRef.current;\n\n if (!panel) return;\n\n const step = event.shiftKey\n ? WORKBENCH_PANEL_RESIZE_STEP_IN_PX * 4\n : WORKBENCH_PANEL_RESIZE_STEP_IN_PX;\n const delta = event.key === 'ArrowUp' ? step : event.key === 'ArrowDown' ? -step : 0;\n\n if (delta === 0) return;\n\n event.preventDefault();\n applyHeight(\n (isFullScreenRequestedRef.current ? getMaxHeight(panel) : panelHeight) + delta,\n panel,\n );\n };\n\n return (\n <div\n role=\"separator\"\n aria-orientation=\"horizontal\"\n aria-label=\"Resize panel\"\n aria-valuenow={Math.round(panelHeight)}\n aria-valuemin={MIN_WORKBENCH_PANEL_HEIGHT_IN_PX}\n tabIndex={0}\n onPointerDown={handlePointerDown}\n onPointerMove={handlePointerMove}\n onLostPointerCapture={() => setIsResizing(false)}\n onKeyDown={handleKeyDown}\n className={cn(\n // group\n 'tw:group/workbench-resize',\n\n // positioning — the panel is the positioned ancestor\n 'tw:absolute',\n 'tw:inset-x-0',\n 'tw:top-0',\n 'tw:z-10',\n\n // sizing\n 'tw:h-2',\n\n // layout — the whole strip grabs, only the pill shows\n 'tw:flex',\n 'tw:justify-center',\n\n // affordance\n 'tw:cursor-ns-resize',\n 'tw:touch-none',\n\n // focus\n 'tw:outline-none',\n )}\n >\n <span\n className={cn(\n // layout — hangs below the strip so the pill sits clear of the top edge, and\n // grabs there too since the events bubble to the strip\n 'tw:flex',\n 'tw:h-3',\n 'tw:w-16',\n 'tw:items-end',\n 'tw:justify-center',\n )}\n >\n <span\n className={cn(\n // sizing\n 'tw:h-1.5',\n 'tw:w-16',\n\n // surface\n 'tw:rounded-full',\n 'tw:bg-input',\n 'tw:transition-colors',\n 'tw:group-hover/workbench-resize:bg-muted-foreground',\n 'tw:group-focus-visible/workbench-resize:bg-muted-foreground',\n 'tw:group-data-[workbench-resizing=true]/workbench:bg-muted-foreground',\n )}\n />\n </span>\n </div>\n );\n};\n","import { useEffect, useRef } from 'react';\nimport type { ComponentProps, CSSProperties } from 'react';\n\nimport { cn } from '../../../utils';\nimport { Collapsible } from '../../Collapsible';\n\nimport { WorkbenchPanelResizeHandle } from './WorkbenchPanelResizeHandle';\n\ntype Props = ComponentProps<'div'>;\n\nconst clearRadixMeasurementTransitionBlock = (panel: HTMLDivElement | null) => {\n if (panel) panel.style.transitionDuration = '';\n};\n\nexport const WorkbenchPanel = ({ className, children, ...props }: Props) => {\n const panelRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => clearRadixMeasurementTransitionBlock(panelRef.current), []);\n\n return (\n <Collapsible.Content\n ref={panelRef}\n // See `WorkbenchBar` — the other half of the dock's measurable area.\n data-workbench-slot=\"panel\"\n style={{ '--workbench-panel-shadow': '0 -8px 24px -6px rgb(0 0 0 / 0.08)' } as CSSProperties}\n className={cn(\n // positioning — against the host, which must be a positioned element\n 'tw:absolute',\n 'tw:inset-x-0',\n 'tw:bottom-(--workbench-bar-height)',\n 'tw:pointer-events-auto',\n\n // height — the drag-controlled var, capped at the space above the bar so the panel\n // never covers it, whatever height was dragged or restored\n 'tw:h-(--workbench-panel-height)',\n 'tw:max-h-[calc(100%-var(--workbench-bar-height))]',\n 'tw:group-data-[workbench-state=full-screen]/workbench:h-[calc(100%-var(--workbench-bar-height))]',\n\n // height transition\n 'tw:transition-[height]',\n 'tw:duration-200',\n 'tw:ease-out',\n 'tw:group-data-[workbench-resizing=true]/workbench:transition-none',\n\n // surface\n 'tw:border-x',\n 'tw:border-t',\n 'tw:border-border',\n\n // clipping\n 'tw:overflow-hidden',\n\n // raised edge\n 'tw:group-not-data-[workbench-state=full-screen]/workbench:rounded-t-2xl',\n 'tw:group-not-data-[workbench-state=full-screen]/workbench:shadow-(--workbench-panel-shadow)',\n )}\n >\n <WorkbenchPanelResizeHandle panelRef={panelRef} />\n\n <div\n className={cn(\n // layout\n 'tw:flex',\n 'tw:flex-col',\n 'tw:h-full',\n\n // surface\n 'tw:bg-background',\n\n className,\n )}\n {...props}\n >\n {children}\n </div>\n </Collapsible.Content>\n );\n};\n","import type { ComponentProps } from 'react';\nimport { Slot } from '@radix-ui/react-slot';\n\nimport { cn } from '../../../utils';\n\ntype Props = ComponentProps<'div'> & {\n asChild?: boolean;\n};\n\nexport const WorkbenchPanelActions = ({ className, asChild = false, ...props }: Props) => {\n const Comp = asChild ? Slot : 'div';\n\n return (\n <Comp\n {...props}\n data-slot=\"workbench-panel-actions\"\n className={cn(\n // grid placement\n 'tw:col-start-2',\n 'tw:row-start-1',\n\n // layout\n 'tw:flex',\n 'tw:items-center',\n 'tw:gap-2',\n\n className,\n )}\n />\n );\n};\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../../utils';\n\ntype Props = ComponentProps<'div'>;\n\nexport const WorkbenchPanelContent = ({ className, children, ...props }: Props) => (\n <div\n className={cn(\n // layout\n 'tw:min-h-0',\n 'tw:flex-1',\n 'tw:overflow-auto',\n\n className,\n )}\n {...props}\n >\n {children}\n </div>\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../../utils';\n\ntype Props = ComponentProps<'div'>;\n\nexport const WorkbenchPanelHeader = ({ className, children, ...props }: Props) => (\n <div\n className={cn(\n // layout\n 'tw:grid',\n 'tw:grid-cols-[1fr_auto]',\n 'tw:items-center',\n 'tw:gap-x-2',\n\n // sizing\n 'tw:shrink-0',\n\n // surface\n 'tw:bg-sidebar',\n\n // spacing\n 'tw:px-3',\n 'tw:py-2',\n\n // typography\n 'tw:text-xs',\n\n className,\n )}\n {...props}\n >\n {children}\n </div>\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../../utils';\n\ntype Props = ComponentProps<'div'>;\n\nexport const WorkbenchPanelTitle = ({ className, ...props }: Props) => (\n <div\n {...props}\n data-slot=\"workbench-panel-title\"\n className={cn(\n // grid placement\n 'tw:col-start-1',\n\n // layout\n 'tw:flex',\n 'tw:items-center',\n\n // typography\n 'tw:text-sm',\n 'tw:font-semibold',\n 'tw:text-foreground',\n\n className,\n )}\n />\n);\n","import { useMemo, useState } from 'react';\nimport type { CSSProperties, ReactNode } from 'react';\n\nimport { useControllableState } from '../../hooks/useControllableState';\nimport { cn } from '../../utils';\nimport { Collapsible } from '../Collapsible';\n\nimport {\n DEFAULT_WORKBENCH_BAR_HEIGHT_IN_REM,\n DEFAULT_WORKBENCH_PANEL_HEIGHT_IN_PX,\n MIN_WORKBENCH_BAR_HEIGHT_IN_REM,\n MIN_WORKBENCH_PANEL_HEIGHT_IN_PX,\n} from './constants';\nimport type { WorkbenchState } from './context';\nimport { createWorkbenchActions, WorkbenchContext } from './context';\nimport {\n WorkbenchBar,\n WorkbenchBarEnd,\n WorkbenchBarMiddle,\n WorkbenchBarStart,\n} from './WorkbenchBar';\nimport { WorkbenchFullScreenTrigger } from './WorkbenchFullScreenTrigger';\nimport {\n WorkbenchPanel,\n WorkbenchPanelActions,\n WorkbenchPanelContent,\n WorkbenchPanelHeader,\n WorkbenchPanelTitle,\n} from './WorkbenchPanel';\n\ntype Props = {\n className?: string;\n children: ReactNode;\n state?: WorkbenchState;\n defaultState?: WorkbenchState;\n onStateChange?: (state: WorkbenchState) => void;\n barHeight?: number;\n panelHeight?: number;\n defaultPanelHeight?: number;\n onPanelHeightChange?: (panelHeight: number) => void;\n};\n\nexport const Workbench = ({\n className,\n children,\n state: stateProp,\n defaultState = 'collapsed',\n onStateChange,\n barHeight = DEFAULT_WORKBENCH_BAR_HEIGHT_IN_REM,\n panelHeight: panelHeightProp,\n defaultPanelHeight = DEFAULT_WORKBENCH_PANEL_HEIGHT_IN_PX,\n onPanelHeightChange,\n}: Props) => {\n const [state, setState] = useControllableState<WorkbenchState>({\n prop: stateProp,\n defaultProp: defaultState,\n onChange: onStateChange,\n });\n const [panelHeight, setPanelHeight] = useControllableState<number>({\n prop: panelHeightProp,\n defaultProp: defaultPanelHeight,\n onChange: onPanelHeightChange,\n });\n const [isResizing, setIsResizing] = useState(false);\n\n const actions = useMemo(() => createWorkbenchActions(setState), [setState]);\n const value = useMemo(\n () => ({\n state,\n setState,\n panelHeight,\n setPanelHeight,\n isResizing,\n setIsResizing,\n ...actions,\n }),\n [state, setState, panelHeight, setPanelHeight, isResizing, actions],\n );\n\n const clampedBarHeight = Math.max(barHeight, MIN_WORKBENCH_BAR_HEIGHT_IN_REM);\n const clampedPanelHeight = Math.max(panelHeight, MIN_WORKBENCH_PANEL_HEIGHT_IN_PX);\n\n return (\n <WorkbenchContext value={value}>\n <Collapsible\n open={state !== 'collapsed'}\n onOpenChange={(open) => setState(open ? 'expanded' : 'collapsed')}\n data-workbench-state={state}\n data-workbench-resizing={isResizing ? 'true' : undefined}\n style={\n {\n '--workbench-bar-height': `${clampedBarHeight}rem`,\n '--workbench-panel-height': `${clampedPanelHeight}px`,\n } as CSSProperties\n }\n className={cn(\n // reset\n 'tailwindcss-preflight',\n\n // group\n 'tw:group/workbench',\n\n // positioning — above the chrome layer (`z-50`) *and* above a `Sidebar` in\n // `expand-on-hover`, which takes `z-51` to float over content; the dock outranks both.\n // Overlays (Modal / Sheet / Popover / Tooltip) live at 1051+, so they still win.\n 'tw:z-[52]',\n\n // layout\n 'tw:shrink-0',\n\n className,\n )}\n >\n {children}\n </Collapsible>\n </WorkbenchContext>\n );\n};\n\nWorkbench.Bar = WorkbenchBar;\nWorkbench.BarStart = WorkbenchBarStart;\nWorkbench.BarMiddle = WorkbenchBarMiddle;\nWorkbench.BarEnd = WorkbenchBarEnd;\n\nWorkbench.Panel = WorkbenchPanel;\nWorkbench.PanelHeader = WorkbenchPanelHeader;\nWorkbench.PanelTitle = WorkbenchPanelTitle;\nWorkbench.PanelActions = WorkbenchPanelActions;\nWorkbench.PanelContent = WorkbenchPanelContent;\n\nWorkbench.Trigger = Collapsible.Trigger;\nWorkbench.FullScreenTrigger = WorkbenchFullScreenTrigger;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Workbench-CxgNCs3I.js","names":[],"sources":["../src/components/Workbench/constants.ts","../src/components/Workbench/context.ts","../src/components/Workbench/WorkbenchBar/WorkbenchBarEnd.tsx","../src/components/Workbench/WorkbenchBar/WorkbenchBarMiddle.tsx","../src/components/Workbench/WorkbenchBar/WorkbenchBarStart.tsx","../src/components/Workbench/WorkbenchBar/WorkbenchBar.tsx","../src/components/Workbench/WorkbenchFullScreenTrigger.tsx","../src/components/Workbench/WorkbenchPanel/WorkbenchPanelResizeHandle.tsx","../src/components/Workbench/WorkbenchPanel/WorkbenchPanel.tsx","../src/components/Workbench/WorkbenchPanel/WorkbenchPanelActions.tsx","../src/components/Workbench/WorkbenchPanel/WorkbenchPanelContent.tsx","../src/components/Workbench/WorkbenchPanel/WorkbenchPanelHeader.tsx","../src/components/Workbench/WorkbenchPanel/WorkbenchPanelTitle.tsx","../src/components/Workbench/Workbench.tsx"],"sourcesContent":["export const DEFAULT_WORKBENCH_BAR_HEIGHT_IN_REM = 2.75;\n\nexport const MIN_WORKBENCH_BAR_HEIGHT_IN_REM = 1;\n\nexport const DEFAULT_WORKBENCH_PANEL_HEIGHT_IN_PX = 320;\n\nexport const MIN_WORKBENCH_PANEL_HEIGHT_IN_PX = 120;\n\nexport const WORKBENCH_PANEL_RESIZE_STEP_IN_PX = 24;\n\nexport const WORKBENCH_PANEL_FULL_SCREEN_EXIT_RATIO = 0.8;\n","import { createContext, use } from 'react';\nimport type { Dispatch, SetStateAction } from 'react';\n\n/**\n * Full screen is a mode of the open panel, not a flag beside it — as two booleans the fourth\n * combination (collapsed *and* full screen) is expressible but meaningless.\n */\nexport type WorkbenchState = 'collapsed' | 'expanded' | 'full-screen';\n\ntype WorkbenchActions = {\n expand: () => void;\n collapse: () => void;\n toggleExpanded: () => void;\n enterFullScreen: () => void;\n exitFullScreen: () => void;\n toggleFullScreen: () => void;\n};\n\ntype WorkbenchContextValue = WorkbenchActions & {\n state: WorkbenchState;\n setState: Dispatch<SetStateAction<WorkbenchState>>;\n panelHeight: number;\n setPanelHeight: Dispatch<SetStateAction<number>>;\n isResizing: boolean;\n setIsResizing: (isResizing: boolean) => void;\n};\n\nexport const createWorkbenchActions = (\n setState: Dispatch<SetStateAction<WorkbenchState>>,\n): WorkbenchActions => ({\n // Opening an already-open panel leaves full screen alone.\n expand: () => setState((state) => (state === 'collapsed' ? 'expanded' : state)),\n collapse: () => setState('collapsed'),\n toggleExpanded: () => setState((state) => (state === 'collapsed' ? 'expanded' : 'collapsed')),\n\n enterFullScreen: () => setState('full-screen'),\n // Exiting returns to the open panel, never to a closed one — this is a restore, not a collapse.\n exitFullScreen: () => setState((state) => (state === 'full-screen' ? 'expanded' : state)),\n toggleFullScreen: () =>\n setState((state) => (state === 'full-screen' ? 'expanded' : 'full-screen')),\n});\n\nexport const WorkbenchContext = createContext<WorkbenchContextValue | null>(null);\n\n/**\n * The parts sit at arbitrary depth under `<Workbench>` — a trigger lives inside the panel header,\n * three levels down — so the state travels by context rather than props.\n */\nexport const useWorkbench = (): WorkbenchContextValue => {\n const context = use(WorkbenchContext);\n\n if (context === null) {\n throw new Error('Workbench compound components must be rendered inside <Workbench>.');\n }\n\n return context;\n};\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../../utils';\n\ntype Props = ComponentProps<'div'>;\n\nexport const WorkbenchBarEnd = ({ className, ...props }: Props) => (\n <div\n {...props}\n data-slot=\"workbench-bar-end\"\n className={cn(\n // grid placement\n 'tw:col-start-3',\n 'tw:row-start-1',\n\n // layout\n 'tw:flex',\n 'tw:items-center',\n 'tw:justify-end',\n 'tw:gap-2',\n\n className,\n )}\n />\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../../utils';\n\ntype Props = ComponentProps<'div'>;\n\nexport const WorkbenchBarMiddle = ({ className, ...props }: Props) => (\n <div\n {...props}\n data-slot=\"workbench-bar-middle\"\n className={cn(\n // grid placement\n 'tw:col-start-2',\n 'tw:row-start-1',\n\n // layout\n 'tw:flex',\n 'tw:items-center',\n 'tw:justify-center',\n 'tw:gap-2',\n\n className,\n )}\n />\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../../utils';\n\ntype Props = ComponentProps<'div'>;\n\nexport const WorkbenchBarStart = ({ className, ...props }: Props) => (\n <div\n {...props}\n data-slot=\"workbench-bar-start\"\n className={cn(\n // grid placement\n 'tw:col-start-1',\n 'tw:row-start-1',\n\n // layout\n 'tw:flex',\n 'tw:items-center',\n 'tw:gap-2',\n\n className,\n )}\n />\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../../utils';\n\nimport { WorkbenchBarEnd } from './WorkbenchBarEnd';\nimport { WorkbenchBarMiddle } from './WorkbenchBarMiddle';\nimport { WorkbenchBarStart } from './WorkbenchBarStart';\n\ntype Props = ComponentProps<'div'>;\n\nexport const WorkbenchBar = ({ className, children, ...props }: Props) => (\n <div\n // Marked so a floating surface (kbc-ui's Kai widget) can measure the dock; the root's rect is the bar alone.\n data-workbench-slot=\"bar\"\n className={cn(\n // layout\n 'tw:grid',\n 'tw:grid-cols-[auto_1fr_auto]',\n 'tw:items-center',\n 'tw:gap-x-2',\n\n // sizing\n 'tw:h-(--workbench-bar-height)',\n 'tw:shrink-0',\n 'tw:pointer-events-auto',\n\n // surface\n 'tw:border-t',\n 'tw:border-sidebar-border',\n 'tw:bg-sidebar',\n\n // spacing\n 'tw:px-3',\n\n // typography\n 'tw:text-xs',\n\n className,\n )}\n {...props}\n >\n {children}\n </div>\n);\n\nWorkbenchBar.Start = WorkbenchBarStart;\nWorkbenchBar.Middle = WorkbenchBarMiddle;\nWorkbenchBar.End = WorkbenchBarEnd;\n","import type { ComponentProps, MouseEvent } from 'react';\nimport { Slot } from '@radix-ui/react-slot';\n\nimport { useWorkbench } from './context';\n\ntype Props = ComponentProps<'button'> & {\n asChild?: boolean;\n};\n\nexport const WorkbenchFullScreenTrigger = ({ asChild = false, onClick, ...props }: Props) => {\n const { state, toggleFullScreen } = useWorkbench();\n const isFullScreen = state === 'full-screen';\n const Comp = asChild ? Slot : 'button';\n\n const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n onClick?.(event);\n\n if (!event.defaultPrevented) {\n toggleFullScreen();\n }\n };\n\n return (\n <Comp\n {...(asChild ? {} : { type: 'button' as const })}\n {...props}\n data-slot=\"workbench-full-screen-trigger\"\n data-state={isFullScreen ? 'on' : 'off'}\n onClick={handleClick}\n />\n );\n};\n","import { useEffect, useRef } from 'react';\nimport type { KeyboardEvent, PointerEvent, RefObject } from 'react';\n\nimport { cn } from '../../../utils';\nimport {\n MIN_WORKBENCH_PANEL_HEIGHT_IN_PX,\n WORKBENCH_PANEL_FULL_SCREEN_EXIT_RATIO,\n WORKBENCH_PANEL_RESIZE_STEP_IN_PX,\n} from '../constants';\nimport { useWorkbench } from '../context';\n\ntype Props = {\n panelRef: RefObject<HTMLDivElement | null>;\n};\n\nconst getMaxHeight = (panel: HTMLDivElement) => {\n const hostTop = panel.offsetParent?.getBoundingClientRect().top ?? 0;\n\n return Math.max(panel.getBoundingClientRect().bottom - hostTop, MIN_WORKBENCH_PANEL_HEIGHT_IN_PX);\n};\n\nconst clampHeight = (height: number, panel: HTMLDivElement) =>\n Math.min(Math.max(height, MIN_WORKBENCH_PANEL_HEIGHT_IN_PX), getMaxHeight(panel));\n\nexport const WorkbenchPanelResizeHandle = ({ panelRef }: Props) => {\n const {\n state,\n panelHeight,\n setPanelHeight,\n isResizing,\n setIsResizing,\n enterFullScreen,\n exitFullScreen,\n } = useWorkbench();\n const grabOffsetRef = useRef(0);\n const previousStateRef = useRef(state);\n const isFullScreenRequestedRef = useRef(state === 'full-screen');\n const enteredFullScreenByDragRef = useRef(false);\n const exitedFullScreenByDragRef = useRef(false);\n\n useEffect(() => {\n if (!isResizing) return;\n\n const { body } = document;\n const { cursor, userSelect } = body.style;\n\n body.style.cursor = 'ns-resize';\n body.style.userSelect = 'none';\n\n return () => {\n body.style.cursor = cursor;\n body.style.userSelect = userSelect;\n };\n }, [isResizing]);\n\n useEffect(() => {\n const previous = previousStateRef.current;\n const panel = panelRef.current;\n\n previousStateRef.current = state;\n isFullScreenRequestedRef.current = state === 'full-screen';\n\n if (previous !== 'full-screen' || state !== 'expanded' || !panel) return;\n\n const draggedIntoFullScreen = enteredFullScreenByDragRef.current;\n const draggedOutOfFullScreen = exitedFullScreenByDragRef.current;\n\n enteredFullScreenByDragRef.current = false;\n exitedFullScreenByDragRef.current = false;\n\n if (!draggedIntoFullScreen || draggedOutOfFullScreen) return;\n\n setPanelHeight(\n clampHeight(getMaxHeight(panel) * WORKBENCH_PANEL_FULL_SCREEN_EXIT_RATIO, panel),\n );\n }, [state, panelRef, setPanelHeight]);\n\n const applyHeight = (height: number, panel: HTMLDivElement) => {\n const isFullScreen = isFullScreenRequestedRef.current;\n\n if (height >= getMaxHeight(panel)) {\n if (!isFullScreen) {\n isFullScreenRequestedRef.current = true;\n enteredFullScreenByDragRef.current = true;\n enterFullScreen();\n }\n\n return;\n }\n\n if (isFullScreen) {\n isFullScreenRequestedRef.current = false;\n exitedFullScreenByDragRef.current = true;\n exitFullScreen();\n }\n\n setPanelHeight(Math.max(height, MIN_WORKBENCH_PANEL_HEIGHT_IN_PX));\n };\n\n const handlePointerDown = (event: PointerEvent<HTMLDivElement>) => {\n const panel = panelRef.current;\n\n if (event.button !== 0 || !panel) return;\n\n event.preventDefault();\n event.currentTarget.setPointerCapture(event.pointerId);\n grabOffsetRef.current = panel.getBoundingClientRect().top - event.clientY;\n setIsResizing(true);\n };\n\n const handlePointerMove = (event: PointerEvent<HTMLDivElement>) => {\n const panel = panelRef.current;\n\n if (!panel || !event.currentTarget.hasPointerCapture(event.pointerId)) return;\n\n const top = event.clientY + grabOffsetRef.current;\n\n applyHeight(panel.getBoundingClientRect().bottom - top, panel);\n };\n\n const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n const panel = panelRef.current;\n\n if (!panel) return;\n\n const step = event.shiftKey\n ? WORKBENCH_PANEL_RESIZE_STEP_IN_PX * 4\n : WORKBENCH_PANEL_RESIZE_STEP_IN_PX;\n const delta = event.key === 'ArrowUp' ? step : event.key === 'ArrowDown' ? -step : 0;\n\n if (delta === 0) return;\n\n event.preventDefault();\n applyHeight(\n (isFullScreenRequestedRef.current ? getMaxHeight(panel) : panelHeight) + delta,\n panel,\n );\n };\n\n return (\n <div\n role=\"separator\"\n aria-orientation=\"horizontal\"\n aria-label=\"Resize panel\"\n aria-valuenow={Math.round(panelHeight)}\n aria-valuemin={MIN_WORKBENCH_PANEL_HEIGHT_IN_PX}\n tabIndex={0}\n onPointerDown={handlePointerDown}\n onPointerMove={handlePointerMove}\n onLostPointerCapture={() => setIsResizing(false)}\n onKeyDown={handleKeyDown}\n className={cn(\n // group\n 'tw:group/workbench-resize',\n\n // positioning — the panel is the positioned ancestor\n 'tw:absolute',\n 'tw:inset-x-0',\n 'tw:top-0',\n 'tw:z-10',\n\n // sizing\n 'tw:h-2',\n\n // layout — the whole strip grabs, only the pill shows\n 'tw:flex',\n 'tw:justify-center',\n\n // affordance\n 'tw:cursor-ns-resize',\n 'tw:touch-none',\n\n // focus\n 'tw:outline-none',\n )}\n >\n <span\n className={cn(\n // layout — hangs below the strip so the pill sits clear of the top edge, and\n // grabs there too since the events bubble to the strip\n 'tw:flex',\n 'tw:h-3',\n 'tw:w-16',\n 'tw:items-end',\n 'tw:justify-center',\n )}\n >\n <span\n className={cn(\n // sizing\n 'tw:h-1.5',\n 'tw:w-16',\n\n // surface\n 'tw:rounded-full',\n 'tw:bg-input',\n 'tw:transition-colors',\n 'tw:group-hover/workbench-resize:bg-muted-foreground',\n 'tw:group-focus-visible/workbench-resize:bg-muted-foreground',\n 'tw:group-data-[workbench-resizing=true]/workbench:bg-muted-foreground',\n )}\n />\n </span>\n </div>\n );\n};\n","import { useEffect, useRef } from 'react';\nimport type { ComponentProps, CSSProperties } from 'react';\n\nimport { cn } from '../../../utils';\nimport { Collapsible } from '../../Collapsible';\n\nimport { WorkbenchPanelResizeHandle } from './WorkbenchPanelResizeHandle';\n\ntype Props = ComponentProps<'div'>;\n\nconst clearRadixMeasurementTransitionBlock = (panel: HTMLDivElement | null) => {\n if (panel) panel.style.transitionDuration = '';\n};\n\nexport const WorkbenchPanel = ({ className, children, ...props }: Props) => {\n const panelRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => clearRadixMeasurementTransitionBlock(panelRef.current), []);\n\n return (\n <Collapsible.Content\n ref={panelRef}\n // See `WorkbenchBar` — the other half of the dock's measurable area.\n data-workbench-slot=\"panel\"\n style={{ '--workbench-panel-shadow': '0 -8px 24px -6px rgb(0 0 0 / 0.08)' } as CSSProperties}\n className={cn(\n // positioning — against the host, which must be a positioned element\n 'tw:absolute',\n 'tw:inset-x-0',\n 'tw:bottom-(--workbench-bar-height)',\n 'tw:pointer-events-auto',\n\n // height — the drag-controlled var, capped at the space above the bar so the panel\n // never covers it, whatever height was dragged or restored\n 'tw:h-(--workbench-panel-height)',\n 'tw:max-h-[calc(100%-var(--workbench-bar-height))]',\n 'tw:group-data-[workbench-state=full-screen]/workbench:h-[calc(100%-var(--workbench-bar-height))]',\n\n // height transition\n 'tw:transition-[height]',\n 'tw:duration-200',\n 'tw:ease-out',\n 'tw:group-data-[workbench-resizing=true]/workbench:transition-none',\n\n // surface\n 'tw:border-x',\n 'tw:border-t',\n 'tw:border-border',\n\n // clipping\n 'tw:overflow-hidden',\n\n // raised edge\n 'tw:group-not-data-[workbench-state=full-screen]/workbench:rounded-t-2xl',\n 'tw:group-not-data-[workbench-state=full-screen]/workbench:shadow-(--workbench-panel-shadow)',\n )}\n >\n <WorkbenchPanelResizeHandle panelRef={panelRef} />\n\n <div\n className={cn(\n // layout\n 'tw:flex',\n 'tw:flex-col',\n 'tw:h-full',\n\n // surface\n 'tw:bg-background',\n\n className,\n )}\n {...props}\n >\n {children}\n </div>\n </Collapsible.Content>\n );\n};\n","import type { ComponentProps } from 'react';\nimport { Slot } from '@radix-ui/react-slot';\n\nimport { cn } from '../../../utils';\n\ntype Props = ComponentProps<'div'> & {\n asChild?: boolean;\n};\n\nexport const WorkbenchPanelActions = ({ className, asChild = false, ...props }: Props) => {\n const Comp = asChild ? Slot : 'div';\n\n return (\n <Comp\n {...props}\n data-slot=\"workbench-panel-actions\"\n className={cn(\n // grid placement\n 'tw:col-start-2',\n 'tw:row-start-1',\n\n // layout\n 'tw:flex',\n 'tw:items-center',\n 'tw:gap-2',\n\n className,\n )}\n />\n );\n};\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../../utils';\n\ntype Props = ComponentProps<'div'>;\n\nexport const WorkbenchPanelContent = ({ className, children, ...props }: Props) => (\n <div\n className={cn(\n // layout\n 'tw:min-h-0',\n 'tw:flex-1',\n 'tw:overflow-auto',\n\n className,\n )}\n {...props}\n >\n {children}\n </div>\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../../utils';\n\ntype Props = ComponentProps<'div'>;\n\nexport const WorkbenchPanelHeader = ({ className, children, ...props }: Props) => (\n <div\n className={cn(\n // layout\n 'tw:grid',\n 'tw:grid-cols-[1fr_auto]',\n 'tw:items-center',\n 'tw:gap-x-2',\n\n // sizing\n 'tw:shrink-0',\n\n // surface\n 'tw:bg-sidebar',\n\n // spacing\n 'tw:px-3',\n 'tw:py-2',\n\n // typography\n 'tw:text-xs',\n\n className,\n )}\n {...props}\n >\n {children}\n </div>\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../../utils';\n\ntype Props = ComponentProps<'div'>;\n\nexport const WorkbenchPanelTitle = ({ className, ...props }: Props) => (\n <div\n {...props}\n data-slot=\"workbench-panel-title\"\n className={cn(\n // grid placement\n 'tw:col-start-1',\n\n // layout\n 'tw:flex',\n 'tw:items-center',\n\n // typography\n 'tw:text-sm',\n 'tw:font-semibold',\n 'tw:text-foreground',\n\n className,\n )}\n />\n);\n","import { useMemo, useState } from 'react';\nimport type { CSSProperties, ReactNode } from 'react';\n\nimport { useControllableState } from '../../hooks/useControllableState';\nimport { cn } from '../../utils';\nimport { Collapsible } from '../Collapsible';\n\nimport {\n DEFAULT_WORKBENCH_BAR_HEIGHT_IN_REM,\n DEFAULT_WORKBENCH_PANEL_HEIGHT_IN_PX,\n MIN_WORKBENCH_BAR_HEIGHT_IN_REM,\n MIN_WORKBENCH_PANEL_HEIGHT_IN_PX,\n} from './constants';\nimport type { WorkbenchState } from './context';\nimport { createWorkbenchActions, WorkbenchContext } from './context';\nimport {\n WorkbenchBar,\n WorkbenchBarEnd,\n WorkbenchBarMiddle,\n WorkbenchBarStart,\n} from './WorkbenchBar';\nimport { WorkbenchFullScreenTrigger } from './WorkbenchFullScreenTrigger';\nimport {\n WorkbenchPanel,\n WorkbenchPanelActions,\n WorkbenchPanelContent,\n WorkbenchPanelHeader,\n WorkbenchPanelTitle,\n} from './WorkbenchPanel';\n\ntype Props = {\n className?: string;\n children: ReactNode;\n state?: WorkbenchState;\n defaultState?: WorkbenchState;\n onStateChange?: (state: WorkbenchState) => void;\n barHeight?: number;\n panelHeight?: number;\n defaultPanelHeight?: number;\n onPanelHeightChange?: (panelHeight: number) => void;\n};\n\nexport const Workbench = ({\n className,\n children,\n state: stateProp,\n defaultState = 'collapsed',\n onStateChange,\n barHeight = DEFAULT_WORKBENCH_BAR_HEIGHT_IN_REM,\n panelHeight: panelHeightProp,\n defaultPanelHeight = DEFAULT_WORKBENCH_PANEL_HEIGHT_IN_PX,\n onPanelHeightChange,\n}: Props) => {\n const [state, setState] = useControllableState<WorkbenchState>({\n prop: stateProp,\n defaultProp: defaultState,\n onChange: onStateChange,\n });\n const [panelHeight, setPanelHeight] = useControllableState<number>({\n prop: panelHeightProp,\n defaultProp: defaultPanelHeight,\n onChange: onPanelHeightChange,\n });\n const [isResizing, setIsResizing] = useState(false);\n\n const actions = useMemo(() => createWorkbenchActions(setState), [setState]);\n const value = useMemo(\n () => ({\n state,\n setState,\n panelHeight,\n setPanelHeight,\n isResizing,\n setIsResizing,\n ...actions,\n }),\n [state, setState, panelHeight, setPanelHeight, isResizing, actions],\n );\n\n const clampedBarHeight = Math.max(barHeight, MIN_WORKBENCH_BAR_HEIGHT_IN_REM);\n const clampedPanelHeight = Math.max(panelHeight, MIN_WORKBENCH_PANEL_HEIGHT_IN_PX);\n\n return (\n <WorkbenchContext value={value}>\n <Collapsible\n open={state !== 'collapsed'}\n onOpenChange={(open) => setState(open ? 'expanded' : 'collapsed')}\n data-workbench-state={state}\n data-workbench-resizing={isResizing ? 'true' : undefined}\n style={\n {\n '--workbench-bar-height': `${clampedBarHeight}rem`,\n '--workbench-panel-height': `${clampedPanelHeight}px`,\n } as CSSProperties\n }\n className={cn(\n // reset\n 'tailwindcss-preflight',\n\n // group\n 'tw:group/workbench',\n\n // positioning — above the chrome layer (`z-50`) *and* above a `Sidebar` in\n // `expand-on-hover`, which takes `z-51` to float over content; the dock outranks both.\n // Overlays (Modal / Sheet / Popover / Tooltip) live on `z-overlay` and above, so they still win.\n 'tw:z-[52]',\n\n // layout\n 'tw:shrink-0',\n\n className,\n )}\n >\n {children}\n </Collapsible>\n </WorkbenchContext>\n );\n};\n\nWorkbench.Bar = WorkbenchBar;\nWorkbench.BarStart = WorkbenchBarStart;\nWorkbench.BarMiddle = WorkbenchBarMiddle;\nWorkbench.BarEnd = WorkbenchBarEnd;\n\nWorkbench.Panel = WorkbenchPanel;\nWorkbench.PanelHeader = WorkbenchPanelHeader;\nWorkbench.PanelTitle = WorkbenchPanelTitle;\nWorkbench.PanelActions = WorkbenchPanelActions;\nWorkbench.PanelContent = WorkbenchPanelContent;\n\nWorkbench.Trigger = Collapsible.Trigger;\nWorkbench.FullScreenTrigger = WorkbenchFullScreenTrigger;\n"],"mappings":"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"}
|
|
@@ -223,7 +223,7 @@ const ZoomableSvg = ({ html, copyText, className, allowForeignObject, allowUse,
|
|
|
223
223
|
if (isFullscreen) return createPortal(/* @__PURE__ */ jsx("div", {
|
|
224
224
|
role: "presentation",
|
|
225
225
|
"data-testid": "zoomable-svg-fullscreen",
|
|
226
|
-
className: "tw:fixed tw:inset-0 tw:z-
|
|
226
|
+
className: "tw:fixed tw:inset-0 tw:z-overlay tw:bg-muted tw:p-4 tailwindcss-preflight",
|
|
227
227
|
onClick: stopPropagation,
|
|
228
228
|
children: diagramContent
|
|
229
229
|
}), document.body);
|
|
@@ -235,4 +235,4 @@ const ZoomableSvg = ({ html, copyText, className, allowForeignObject, allowUse,
|
|
|
235
235
|
//#endregion
|
|
236
236
|
export { ZoomableSvg, svgToPngBlob, toSvgFileContent };
|
|
237
237
|
|
|
238
|
-
//# sourceMappingURL=ZoomableSvg-
|
|
238
|
+
//# sourceMappingURL=ZoomableSvg-CxXKanUR.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ZoomableSvg-DnFXo2L4.js","names":[],"sources":["../src/components/ZoomableSvg/exportSvg.ts","../src/components/ZoomableSvg/ZoomableSvg.tsx"],"sourcesContent":["const PNG_SCALE = 2;\n\n// The root `<svg …>` tag, so the namespace check looks only at its attributes.\n// A plain `includes('xmlns=')` would also match a nested element or body text,\n// and would miss `xmlns = \"…\"` — adding a second declaration, which parsers\n// reject outright with \"Attribute xmlns redefined\".\nconst ROOT_SVG_TAG = /^<svg\\b[^>]*>/i;\nconst HAS_DEFAULT_NAMESPACE = /\\bxmlns\\s*=/i;\n\n// A standalone SVG file needs the namespace declaration; inline diagram output may\n// omit it because an inline <svg> inherits it from the host document.\n// Trim before matching: the anchored `^<svg` misses markup that arrives with a\n// leading newline or indentation, which would emit a standalone file with no\n// namespace — unopenable in an image viewer.\nconst withSvgNamespace = (svg: string) => {\n const trimmed = svg.trim();\n const rootTag = trimmed.match(ROOT_SVG_TAG)?.[0];\n\n if (!rootTag || HAS_DEFAULT_NAMESPACE.test(rootTag)) return trimmed;\n\n return trimmed.replace(/^<svg\\b/i, '<svg xmlns=\"http://www.w3.org/2000/svg\"');\n};\n\nexport const toSvgFileContent = (svg: string) =>\n `<?xml version=\"1.0\" encoding=\"UTF-8\"?>\\n${withSvgNamespace(svg).trim()}\\n`;\n\n// A single decimal number: `12`, `12.5`, `.5`. Deliberately stricter than\n// `[\\d.]+`, which also matches `1.2.3` — and `parseFloat` truncates that to\n// `1.2` rather than rejecting it, so a malformed value would pass as a plausible\n// one.\nconst NUMBER = String.raw`\\d+(?:\\.\\d+)?|\\.\\d+`;\n\n// `parseFloat` happily reads a relative length as a number — `\"100%\"` becomes\n// `100`, `\"2em\"` becomes `2` — and `makeResponsive` sets `width=\"100%\"` on every\n// diagram root, so an SVG with no usable viewBox would rasterize 100px wide with\n// no error. Accept only a unitless number or an explicit `px`.\nconst PIXEL_LENGTH = new RegExp(String.raw`^\\s*(?:${NUMBER})(?:px)?\\s*$`, 'i');\n\nconst parsePixelLength = (value: string | null): number | null => {\n if (!PIXEL_LENGTH.test(value ?? '')) return null;\n\n const parsed = Number.parseFloat(value ?? '');\n\n return Number.isFinite(parsed) && parsed > 0 ? parsed : null;\n};\n\nexport const parseSvgSize = (svg: string) => {\n const doc = new DOMParser().parseFromString(withSvgNamespace(svg), 'image/svg+xml');\n const element = doc.documentElement;\n\n const viewBox = element\n .getAttribute('viewBox')\n ?.split(/[\\s,]+/)\n .map(Number);\n // `> 0`, not truthiness: a negative extent is accepted by a truthy check, and\n // negative canvas dimensions silently fall back to the 300x150 default — an\n // export at the wrong size with no error. Falling through to width/height is\n // the better answer, since those are usually still valid.\n if (viewBox?.length === 4 && viewBox.every((value) => Number.isFinite(value))) {\n const [, , width, height] = viewBox;\n if (width !== undefined && height !== undefined && width > 0 && height > 0) {\n return { width, height };\n }\n }\n\n const width = parsePixelLength(element.getAttribute('width'));\n const height = parsePixelLength(element.getAttribute('height'));\n\n return width !== null && height !== null ? { width, height } : null;\n};\n\n// Resolve the themed page background so the exported PNG follows the active\n// brand and color scheme instead of a frozen literal. Falls back to `white`\n// (a CSS keyword, not a brand-locked hex) when the token is unset.\n//\n// The token holds Tailwind's bare channel triplet (\"249 250 251\") so utilities\n// can add an alpha. Canvas `fillStyle` rejects that form *silently* and keeps\n// its previous value (black), so wrap it back into rgb() before use.\nconst CHANNEL_TRIPLET = new RegExp(String.raw`^(?:${NUMBER})\\s+(?:${NUMBER})\\s+(?:${NUMBER})$`);\n\nexport const toCanvasColor = (token: string) => {\n const trimmed = token.trim();\n if (!trimmed) return 'white';\n\n // Only wrap a well-formed triplet. A malformed one (`1.2.3 4 5`) would produce\n // an invalid `rgb()` that `fillStyle` rejects silently, painting the PNG on\n // whatever colour was set before — passing it through unwrapped at least lets\n // a genuine CSS color value work.\n return CHANNEL_TRIPLET.test(trimmed) ? `rgb(${trimmed})` : trimmed;\n};\n\nconst resolveBackground = () =>\n toCanvasColor(getComputedStyle(document.documentElement).getPropertyValue('--color-background'));\n\n/**\n * Rasterize SVG markup to a PNG blob at 2x for legible text.\n *\n * The SVG is loaded as a data URL rather than a blob URL: an <img> loading SVG\n * is treated as a foreign resource, so a blob URL would taint the canvas and\n * make toBlob throw a SecurityError. A background is painted first because a\n * transparent PNG reads as unusable when pasted into a slide deck.\n */\nexport const svgToPngBlob = async (svg: string, background?: string): Promise<Blob> => {\n const size = parseSvgSize(svg);\n if (!size) throw new Error('Cannot determine diagram dimensions.');\n\n const encoded = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(toSvgFileContent(svg))}`;\n\n const image = new Image();\n image.decoding = 'sync';\n await new Promise<void>((resolve, reject) => {\n image.onload = () => resolve();\n image.onerror = () => reject(new Error('Failed to load the diagram for export.'));\n image.src = encoded;\n });\n\n const canvas = document.createElement('canvas');\n canvas.width = Math.round(size.width * PNG_SCALE);\n canvas.height = Math.round(size.height * PNG_SCALE);\n\n const context = canvas.getContext('2d');\n if (!context) throw new Error('Canvas is unavailable in this browser.');\n\n context.fillStyle = background ?? resolveBackground();\n context.fillRect(0, 0, canvas.width, canvas.height);\n context.drawImage(image, 0, 0, canvas.width, canvas.height);\n\n return new Promise<Blob>((resolve, reject) => {\n canvas.toBlob(\n (blob) => (blob ? resolve(blob) : reject(new Error('Failed to encode the PNG.'))),\n 'image/png',\n );\n });\n};\n","import { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport type { ReactNode } from 'react';\nimport { createPortal } from 'react-dom';\nimport DOMPurify from 'dompurify';\n\nimport { ClipboardButton } from '../../blocks/ClipboardButton';\nimport { Maximize2, Minimize2 } from '../../icons';\nimport { cn } from '../../utils';\nimport { Button } from '../Button';\nimport { Tooltip } from '../Tooltip';\n\nconst MIN_SCALE = 0.5;\nconst MAX_SCALE = 3;\nconst ZOOM_STEP = 0.1;\n\ntype Props = {\n /** Raw SVG markup; DOMPurify-sanitized (SVG profile), so user/LLM content is safe. */\n html: string;\n copyText?: string;\n className?: string;\n /** Keep `<foreignObject>` through sanitization; its HTML children are still stripped.\n * Enable only when each one is pre-flattened to bare text. */\n allowForeignObject?: boolean;\n /** Keep `<use>` through sanitization. Enable only when every `href` is already a `#` reference. */\n allowUse?: boolean;\n /** Extra toolbar controls (e.g. `ExportMenu`) between copy and fullscreen; receives the\n * sanitized SVG. Injected so this lazy chunk carries no export dependencies. */\n renderActions?: (safeSvg: string) => ReactNode;\n};\n\nexport const ZoomableSvg = ({\n html,\n copyText,\n className,\n allowForeignObject,\n allowUse,\n renderActions,\n}: Props) => {\n const safeHtml = useMemo(\n () =>\n DOMPurify.sanitize(html, {\n USE_PROFILES: { svg: true, svgFilters: true },\n ADD_TAGS: [...(allowForeignObject ? ['foreignObject'] : []), ...(allowUse ? ['use'] : [])],\n }),\n [html, allowForeignObject, allowUse],\n );\n\n const containerRef = useRef<HTMLDivElement>(null);\n const [scale, setScale] = useState(1);\n const [translate, setTranslate] = useState({ x: 0, y: 0 });\n const [isFullscreen, setIsFullscreen] = useState(false);\n\n useEffect(() => {\n if (!isFullscreen) return;\n const onKeyDown = (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n e.stopPropagation();\n setIsFullscreen(false);\n }\n };\n document.addEventListener('keydown', onKeyDown, { capture: true });\n return () => document.removeEventListener('keydown', onKeyDown, { capture: true });\n }, [isFullscreen]);\n\n const dragRef = useRef<{\n startX: number;\n startY: number;\n startTx: number;\n startTy: number;\n } | null>(null);\n\n useEffect(() => {\n const el = containerRef.current;\n if (!el) return;\n\n const onWheel = (e: WheelEvent) => {\n if (!e.ctrlKey && !e.metaKey) return;\n e.preventDefault();\n const delta = e.deltaY > 0 ? -ZOOM_STEP : ZOOM_STEP;\n setScale((s) => Math.min(MAX_SCALE, Math.max(MIN_SCALE, s + delta)));\n };\n\n el.addEventListener('wheel', onWheel, { passive: false });\n return () => el.removeEventListener('wheel', onWheel);\n // Re-bind when toggling fullscreen: the portal/inline switch remounts the\n // container element, so the listener must attach to the new node.\n }, [isFullscreen]);\n\n const didDragRef = useRef(false);\n\n const handleMouseDown = useCallback(\n (e: React.MouseEvent) => {\n if (e.button !== 0) return;\n e.preventDefault();\n didDragRef.current = false;\n dragRef.current = {\n startX: e.clientX,\n startY: e.clientY,\n startTx: translate.x,\n startTy: translate.y,\n };\n },\n [translate],\n );\n\n const handleMouseMove = useCallback((e: React.MouseEvent) => {\n if (!dragRef.current) return;\n didDragRef.current = true;\n setTranslate({\n x: dragRef.current.startTx + e.clientX - dragRef.current.startX,\n y: dragRef.current.startTy + e.clientY - dragRef.current.startY,\n });\n }, []);\n\n const handleMouseUp = useCallback(() => {\n dragRef.current = null;\n }, []);\n\n const handleReset = useCallback(() => {\n setScale(1);\n setTranslate({ x: 0, y: 0 });\n }, []);\n\n const isZoomed = Math.abs(scale - 1) > 0.001 || translate.x !== 0 || translate.y !== 0;\n\n const handleClick = useCallback((e: React.MouseEvent) => {\n if (didDragRef.current) {\n e.stopPropagation();\n }\n }, []);\n\n const stopPropagation = useCallback((e: React.SyntheticEvent) => {\n e.stopPropagation();\n }, []);\n\n const diagramContent = (\n <div\n role=\"presentation\"\n className={cn('tw:group/zoom tw:relative', isFullscreen && 'tw:h-full')}\n onClick={handleClick}\n >\n <div\n role=\"presentation\"\n ref={containerRef}\n className={cn(\n 'tw:overflow-hidden tw:cursor-grab tw:active:cursor-grabbing tw:p-3',\n isFullscreen && 'tw:h-full',\n )}\n onMouseDown={handleMouseDown}\n onMouseMove={handleMouseMove}\n onMouseUp={handleMouseUp}\n onMouseLeave={handleMouseUp}\n >\n <div\n className={cn(\n 'tw:flex tw:justify-center tw:origin-center',\n isFullscreen && 'tw:h-full tw:[&>svg]:h-full',\n )}\n style={{ transform: `translate(${translate.x}px, ${translate.y}px) scale(${scale})` }}\n dangerouslySetInnerHTML={{ __html: safeHtml }}\n />\n </div>\n <div\n role=\"presentation\"\n // `focus-within` too: the opacity-0 toolbar is still in the tab order.\n className=\"tw:absolute tw:right-1 tw:top-1 tw:flex tw:gap-1 tw:opacity-0 tw:transition-opacity tw:focus-within:opacity-100 tw:group-hover/zoom:opacity-100\"\n onClick={stopPropagation}\n >\n {isZoomed && (\n <Tooltip tooltip=\"Reset zoom\" placement=\"top\" triggerAsChild>\n <Button size=\"small\" variant=\"outline\" onClick={handleReset}>\n Reset\n </Button>\n </Tooltip>\n )}\n {copyText && (\n <ClipboardButton text={copyText} tooltip=\"Copy code\" size=\"icon-sm\" variant=\"outline\" />\n )}\n {renderActions?.(safeHtml)}\n <Tooltip\n tooltip={isFullscreen ? 'Exit fullscreen' : 'Fullscreen'}\n placement=\"top\"\n triggerAsChild\n >\n <Button\n size=\"icon-sm\"\n variant=\"outline\"\n aria-label={isFullscreen ? 'Exit fullscreen' : 'Fullscreen'}\n onClick={() => setIsFullscreen((f) => !f)}\n >\n {isFullscreen ? (\n <Minimize2 className=\"tw:size-4\" />\n ) : (\n <Maximize2 className=\"tw:size-4\" />\n )}\n </Button>\n </Tooltip>\n </div>\n </div>\n );\n\n if (isFullscreen) {\n return createPortal(\n <div\n role=\"presentation\"\n data-testid=\"zoomable-svg-fullscreen\"\n // z-1051 (Modal band): must stay below floating panels (z-1055) or toolbar menus hide.\n // Tooltip (z-1060) and SpotlightBackdrop (z-1056) sit above it by design.\n className=\"tw:fixed tw:inset-0 tw:z-[1051] tw:bg-muted tw:p-4 tailwindcss-preflight\"\n onClick={stopPropagation}\n >\n {diagramContent}\n </div>,\n document.body,\n );\n }\n\n return (\n <div\n className={cn(\n 'tw:overflow-hidden tw:rounded-md tw:border tw:border-border tw:bg-muted',\n className,\n )}\n >\n {diagramContent}\n </div>\n );\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ZoomableSvg-CxXKanUR.js","names":[],"sources":["../src/components/ZoomableSvg/exportSvg.ts","../src/components/ZoomableSvg/ZoomableSvg.tsx"],"sourcesContent":["const PNG_SCALE = 2;\n\n// The root `<svg …>` tag, so the namespace check looks only at its attributes.\n// A plain `includes('xmlns=')` would also match a nested element or body text,\n// and would miss `xmlns = \"…\"` — adding a second declaration, which parsers\n// reject outright with \"Attribute xmlns redefined\".\nconst ROOT_SVG_TAG = /^<svg\\b[^>]*>/i;\nconst HAS_DEFAULT_NAMESPACE = /\\bxmlns\\s*=/i;\n\n// A standalone SVG file needs the namespace declaration; inline diagram output may\n// omit it because an inline <svg> inherits it from the host document.\n// Trim before matching: the anchored `^<svg` misses markup that arrives with a\n// leading newline or indentation, which would emit a standalone file with no\n// namespace — unopenable in an image viewer.\nconst withSvgNamespace = (svg: string) => {\n const trimmed = svg.trim();\n const rootTag = trimmed.match(ROOT_SVG_TAG)?.[0];\n\n if (!rootTag || HAS_DEFAULT_NAMESPACE.test(rootTag)) return trimmed;\n\n return trimmed.replace(/^<svg\\b/i, '<svg xmlns=\"http://www.w3.org/2000/svg\"');\n};\n\nexport const toSvgFileContent = (svg: string) =>\n `<?xml version=\"1.0\" encoding=\"UTF-8\"?>\\n${withSvgNamespace(svg).trim()}\\n`;\n\n// A single decimal number: `12`, `12.5`, `.5`. Deliberately stricter than\n// `[\\d.]+`, which also matches `1.2.3` — and `parseFloat` truncates that to\n// `1.2` rather than rejecting it, so a malformed value would pass as a plausible\n// one.\nconst NUMBER = String.raw`\\d+(?:\\.\\d+)?|\\.\\d+`;\n\n// `parseFloat` happily reads a relative length as a number — `\"100%\"` becomes\n// `100`, `\"2em\"` becomes `2` — and `makeResponsive` sets `width=\"100%\"` on every\n// diagram root, so an SVG with no usable viewBox would rasterize 100px wide with\n// no error. Accept only a unitless number or an explicit `px`.\nconst PIXEL_LENGTH = new RegExp(String.raw`^\\s*(?:${NUMBER})(?:px)?\\s*$`, 'i');\n\nconst parsePixelLength = (value: string | null): number | null => {\n if (!PIXEL_LENGTH.test(value ?? '')) return null;\n\n const parsed = Number.parseFloat(value ?? '');\n\n return Number.isFinite(parsed) && parsed > 0 ? parsed : null;\n};\n\nexport const parseSvgSize = (svg: string) => {\n const doc = new DOMParser().parseFromString(withSvgNamespace(svg), 'image/svg+xml');\n const element = doc.documentElement;\n\n const viewBox = element\n .getAttribute('viewBox')\n ?.split(/[\\s,]+/)\n .map(Number);\n // `> 0`, not truthiness: a negative extent is accepted by a truthy check, and\n // negative canvas dimensions silently fall back to the 300x150 default — an\n // export at the wrong size with no error. Falling through to width/height is\n // the better answer, since those are usually still valid.\n if (viewBox?.length === 4 && viewBox.every((value) => Number.isFinite(value))) {\n const [, , width, height] = viewBox;\n if (width !== undefined && height !== undefined && width > 0 && height > 0) {\n return { width, height };\n }\n }\n\n const width = parsePixelLength(element.getAttribute('width'));\n const height = parsePixelLength(element.getAttribute('height'));\n\n return width !== null && height !== null ? { width, height } : null;\n};\n\n// Resolve the themed page background so the exported PNG follows the active\n// brand and color scheme instead of a frozen literal. Falls back to `white`\n// (a CSS keyword, not a brand-locked hex) when the token is unset.\n//\n// The token holds Tailwind's bare channel triplet (\"249 250 251\") so utilities\n// can add an alpha. Canvas `fillStyle` rejects that form *silently* and keeps\n// its previous value (black), so wrap it back into rgb() before use.\nconst CHANNEL_TRIPLET = new RegExp(String.raw`^(?:${NUMBER})\\s+(?:${NUMBER})\\s+(?:${NUMBER})$`);\n\nexport const toCanvasColor = (token: string) => {\n const trimmed = token.trim();\n if (!trimmed) return 'white';\n\n // Only wrap a well-formed triplet. A malformed one (`1.2.3 4 5`) would produce\n // an invalid `rgb()` that `fillStyle` rejects silently, painting the PNG on\n // whatever colour was set before — passing it through unwrapped at least lets\n // a genuine CSS color value work.\n return CHANNEL_TRIPLET.test(trimmed) ? `rgb(${trimmed})` : trimmed;\n};\n\nconst resolveBackground = () =>\n toCanvasColor(getComputedStyle(document.documentElement).getPropertyValue('--color-background'));\n\n/**\n * Rasterize SVG markup to a PNG blob at 2x for legible text.\n *\n * The SVG is loaded as a data URL rather than a blob URL: an <img> loading SVG\n * is treated as a foreign resource, so a blob URL would taint the canvas and\n * make toBlob throw a SecurityError. A background is painted first because a\n * transparent PNG reads as unusable when pasted into a slide deck.\n */\nexport const svgToPngBlob = async (svg: string, background?: string): Promise<Blob> => {\n const size = parseSvgSize(svg);\n if (!size) throw new Error('Cannot determine diagram dimensions.');\n\n const encoded = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(toSvgFileContent(svg))}`;\n\n const image = new Image();\n image.decoding = 'sync';\n await new Promise<void>((resolve, reject) => {\n image.onload = () => resolve();\n image.onerror = () => reject(new Error('Failed to load the diagram for export.'));\n image.src = encoded;\n });\n\n const canvas = document.createElement('canvas');\n canvas.width = Math.round(size.width * PNG_SCALE);\n canvas.height = Math.round(size.height * PNG_SCALE);\n\n const context = canvas.getContext('2d');\n if (!context) throw new Error('Canvas is unavailable in this browser.');\n\n context.fillStyle = background ?? resolveBackground();\n context.fillRect(0, 0, canvas.width, canvas.height);\n context.drawImage(image, 0, 0, canvas.width, canvas.height);\n\n return new Promise<Blob>((resolve, reject) => {\n canvas.toBlob(\n (blob) => (blob ? resolve(blob) : reject(new Error('Failed to encode the PNG.'))),\n 'image/png',\n );\n });\n};\n","import { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport type { ReactNode } from 'react';\nimport { createPortal } from 'react-dom';\nimport DOMPurify from 'dompurify';\n\nimport { ClipboardButton } from '../../blocks/ClipboardButton';\nimport { Maximize2, Minimize2 } from '../../icons';\nimport { cn } from '../../utils';\nimport { Button } from '../Button';\nimport { Tooltip } from '../Tooltip';\n\nconst MIN_SCALE = 0.5;\nconst MAX_SCALE = 3;\nconst ZOOM_STEP = 0.1;\n\ntype Props = {\n /** Raw SVG markup; DOMPurify-sanitized (SVG profile), so user/LLM content is safe. */\n html: string;\n copyText?: string;\n className?: string;\n /** Keep `<foreignObject>` through sanitization; its HTML children are still stripped.\n * Enable only when each one is pre-flattened to bare text. */\n allowForeignObject?: boolean;\n /** Keep `<use>` through sanitization. Enable only when every `href` is already a `#` reference. */\n allowUse?: boolean;\n /** Extra toolbar controls (e.g. `ExportMenu`) between copy and fullscreen; receives the\n * sanitized SVG. Injected so this lazy chunk carries no export dependencies. */\n renderActions?: (safeSvg: string) => ReactNode;\n};\n\nexport const ZoomableSvg = ({\n html,\n copyText,\n className,\n allowForeignObject,\n allowUse,\n renderActions,\n}: Props) => {\n const safeHtml = useMemo(\n () =>\n DOMPurify.sanitize(html, {\n USE_PROFILES: { svg: true, svgFilters: true },\n ADD_TAGS: [...(allowForeignObject ? ['foreignObject'] : []), ...(allowUse ? ['use'] : [])],\n }),\n [html, allowForeignObject, allowUse],\n );\n\n const containerRef = useRef<HTMLDivElement>(null);\n const [scale, setScale] = useState(1);\n const [translate, setTranslate] = useState({ x: 0, y: 0 });\n const [isFullscreen, setIsFullscreen] = useState(false);\n\n useEffect(() => {\n if (!isFullscreen) return;\n const onKeyDown = (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n e.stopPropagation();\n setIsFullscreen(false);\n }\n };\n document.addEventListener('keydown', onKeyDown, { capture: true });\n return () => document.removeEventListener('keydown', onKeyDown, { capture: true });\n }, [isFullscreen]);\n\n const dragRef = useRef<{\n startX: number;\n startY: number;\n startTx: number;\n startTy: number;\n } | null>(null);\n\n useEffect(() => {\n const el = containerRef.current;\n if (!el) return;\n\n const onWheel = (e: WheelEvent) => {\n if (!e.ctrlKey && !e.metaKey) return;\n e.preventDefault();\n const delta = e.deltaY > 0 ? -ZOOM_STEP : ZOOM_STEP;\n setScale((s) => Math.min(MAX_SCALE, Math.max(MIN_SCALE, s + delta)));\n };\n\n el.addEventListener('wheel', onWheel, { passive: false });\n return () => el.removeEventListener('wheel', onWheel);\n // Re-bind when toggling fullscreen: the portal/inline switch remounts the\n // container element, so the listener must attach to the new node.\n }, [isFullscreen]);\n\n const didDragRef = useRef(false);\n\n const handleMouseDown = useCallback(\n (e: React.MouseEvent) => {\n if (e.button !== 0) return;\n e.preventDefault();\n didDragRef.current = false;\n dragRef.current = {\n startX: e.clientX,\n startY: e.clientY,\n startTx: translate.x,\n startTy: translate.y,\n };\n },\n [translate],\n );\n\n const handleMouseMove = useCallback((e: React.MouseEvent) => {\n if (!dragRef.current) return;\n didDragRef.current = true;\n setTranslate({\n x: dragRef.current.startTx + e.clientX - dragRef.current.startX,\n y: dragRef.current.startTy + e.clientY - dragRef.current.startY,\n });\n }, []);\n\n const handleMouseUp = useCallback(() => {\n dragRef.current = null;\n }, []);\n\n const handleReset = useCallback(() => {\n setScale(1);\n setTranslate({ x: 0, y: 0 });\n }, []);\n\n const isZoomed = Math.abs(scale - 1) > 0.001 || translate.x !== 0 || translate.y !== 0;\n\n const handleClick = useCallback((e: React.MouseEvent) => {\n if (didDragRef.current) {\n e.stopPropagation();\n }\n }, []);\n\n const stopPropagation = useCallback((e: React.SyntheticEvent) => {\n e.stopPropagation();\n }, []);\n\n const diagramContent = (\n <div\n role=\"presentation\"\n className={cn('tw:group/zoom tw:relative', isFullscreen && 'tw:h-full')}\n onClick={handleClick}\n >\n <div\n role=\"presentation\"\n ref={containerRef}\n className={cn(\n 'tw:overflow-hidden tw:cursor-grab tw:active:cursor-grabbing tw:p-3',\n isFullscreen && 'tw:h-full',\n )}\n onMouseDown={handleMouseDown}\n onMouseMove={handleMouseMove}\n onMouseUp={handleMouseUp}\n onMouseLeave={handleMouseUp}\n >\n <div\n className={cn(\n 'tw:flex tw:justify-center tw:origin-center',\n isFullscreen && 'tw:h-full tw:[&>svg]:h-full',\n )}\n style={{ transform: `translate(${translate.x}px, ${translate.y}px) scale(${scale})` }}\n dangerouslySetInnerHTML={{ __html: safeHtml }}\n />\n </div>\n <div\n role=\"presentation\"\n // `focus-within` too: the opacity-0 toolbar is still in the tab order.\n className=\"tw:absolute tw:right-1 tw:top-1 tw:flex tw:gap-1 tw:opacity-0 tw:transition-opacity tw:focus-within:opacity-100 tw:group-hover/zoom:opacity-100\"\n onClick={stopPropagation}\n >\n {isZoomed && (\n <Tooltip tooltip=\"Reset zoom\" placement=\"top\" triggerAsChild>\n <Button size=\"small\" variant=\"outline\" onClick={handleReset}>\n Reset\n </Button>\n </Tooltip>\n )}\n {copyText && (\n <ClipboardButton text={copyText} tooltip=\"Copy code\" size=\"icon-sm\" variant=\"outline\" />\n )}\n {renderActions?.(safeHtml)}\n <Tooltip\n tooltip={isFullscreen ? 'Exit fullscreen' : 'Fullscreen'}\n placement=\"top\"\n triggerAsChild\n >\n <Button\n size=\"icon-sm\"\n variant=\"outline\"\n aria-label={isFullscreen ? 'Exit fullscreen' : 'Fullscreen'}\n onClick={() => setIsFullscreen((f) => !f)}\n >\n {isFullscreen ? (\n <Minimize2 className=\"tw:size-4\" />\n ) : (\n <Maximize2 className=\"tw:size-4\" />\n )}\n </Button>\n </Tooltip>\n </div>\n </div>\n );\n\n if (isFullscreen) {\n return createPortal(\n <div\n role=\"presentation\"\n data-testid=\"zoomable-svg-fullscreen\"\n // `z-overlay`: a toolbar menu opened later paints over it.\n // Tooltip (z-1060) and SpotlightBackdrop (z-1056) sit above it by design.\n className=\"tw:fixed tw:inset-0 tw:z-overlay tw:bg-muted tw:p-4 tailwindcss-preflight\"\n onClick={stopPropagation}\n >\n {diagramContent}\n </div>,\n document.body,\n );\n }\n\n return (\n <div\n className={cn(\n 'tw:overflow-hidden tw:rounded-md tw:border tw:border-border tw:bg-muted',\n className,\n )}\n >\n {diagramContent}\n </div>\n );\n};\n"],"mappings":"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"}
|
package/dist/flint.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { DiagramSkeleton } from "./internal/blocks/DiagramShared/DiagramSkeleton.js";
|
|
2
2
|
import { DiagramSource, makeResponsive } from "./svgTransforms-Hnvev3Vs.js";
|
|
3
|
-
import { ZoomableSvg } from "./ZoomableSvg-
|
|
3
|
+
import { ZoomableSvg } from "./ZoomableSvg-CxXKanUR.js";
|
|
4
4
|
import { useThemeAttributes } from "./themeTokens-DCeb62ap.js";
|
|
5
5
|
import { SERIES_TOKENS, createVegaColorResolver, tierTwoColour } from "./vegaTokens-DCkvpIVE.js";
|
|
6
6
|
import { vegaTheme } from "./vegaTheme-ISwGXvof.js";
|
package/dist/index.d.ts
CHANGED
|
@@ -4724,6 +4724,14 @@ declare const SIZES: {
|
|
|
4724
4724
|
readonly gap: 'little-small';
|
|
4725
4725
|
};
|
|
4726
4726
|
};
|
|
4727
|
+
/** A control a host adds beside copy and thumbs, drawn in their style. */
|
|
4728
|
+
type AnswerExtraAction = {
|
|
4729
|
+
id: string;
|
|
4730
|
+
label: string;
|
|
4731
|
+
icon: ReactNode;
|
|
4732
|
+
onSelect: () => void;
|
|
4733
|
+
disabled?: boolean;
|
|
4734
|
+
};
|
|
4727
4735
|
type Props$141 = {
|
|
4728
4736
|
/** The answer as text, for the clipboard; empty or absent draws no copy button. */
|
|
4729
4737
|
copyText?: string;
|
|
@@ -4732,6 +4740,8 @@ type Props$141 = {
|
|
|
4732
4740
|
onVote: (vote: AnswerVote) => void;
|
|
4733
4741
|
/** Extra controls, e.g. a report button; drawn ahead of copy. */
|
|
4734
4742
|
actions?: ReactNode;
|
|
4743
|
+
/** Extra controls drawn like copy and thumbs, right after Copy in either layout; each is named and tooltipped by `label`. */
|
|
4744
|
+
extraActions?: AnswerExtraAction[];
|
|
4735
4745
|
/** What the thumbs call the thing rated: "response" or "answer". */
|
|
4736
4746
|
labels?: {
|
|
4737
4747
|
up: string;
|
|
@@ -4761,7 +4771,7 @@ type Props$141 = {
|
|
|
4761
4771
|
* - A vote can be changed but not withdrawn; pressing the pressed one re-sends it.
|
|
4762
4772
|
* - The caller owns the recorded vote and the write.
|
|
4763
4773
|
*/
|
|
4764
|
-
declare const AnswerActions: ({ copyText, vote, onVote, onCopy, actions, labels, confirmation, size, layout, onDownComment, commentPlaceholder, onRegenerate, regenerateLabel }: Props$141) => import("react").JSX.Element;
|
|
4774
|
+
declare const AnswerActions: ({ copyText, vote, onVote, onCopy, actions, extraActions, labels, confirmation, size, layout, onDownComment, commentPlaceholder, onRegenerate, regenerateLabel }: Props$141) => import("react").JSX.Element;
|
|
4765
4775
|
//#endregion
|
|
4766
4776
|
//#region src/blocks/AIKit/SourceChip.d.ts
|
|
4767
4777
|
type SourceState = 'verified' | 'unverified' | 'neutral';
|
|
@@ -4839,6 +4849,10 @@ type Props$139 = {
|
|
|
4839
4849
|
name: string;
|
|
4840
4850
|
/** Replaces the file glyph while the upload is not failing. */
|
|
4841
4851
|
thumbnailUrl?: string;
|
|
4852
|
+
/** Replaces the glyph or thumbnail while the upload is not failing, e.g. a table icon. */
|
|
4853
|
+
lead?: ReactNode;
|
|
4854
|
+
/** Replaces the plain name text, e.g. a link; `name` still names the remove control. */
|
|
4855
|
+
label?: ReactNode;
|
|
4842
4856
|
status: AttachmentStatus;
|
|
4843
4857
|
/** Shown as a tooltip on an `error` chip. */
|
|
4844
4858
|
error?: string;
|
|
@@ -4853,7 +4867,7 @@ type Props$139 = {
|
|
|
4853
4867
|
* - Capped width with a truncating name, so a long filename cannot push the text away.
|
|
4854
4868
|
* - `error` explains itself in a tooltip; the remove control stays available in every status.
|
|
4855
4869
|
*/
|
|
4856
|
-
declare const AttachmentChip: ({ name, thumbnailUrl, status, error, onRemove, trailing, className }: Props$139) => import("react").JSX.Element;
|
|
4870
|
+
declare const AttachmentChip: ({ name, thumbnailUrl, lead, label, status, error, onRemove, trailing, className }: Props$139) => import("react").JSX.Element;
|
|
4857
4871
|
//#endregion
|
|
4858
4872
|
//#region src/blocks/AIKit/ChatInlineIcon.d.ts
|
|
4859
4873
|
/**
|
|
@@ -4919,9 +4933,13 @@ type ContextImage = {
|
|
|
4919
4933
|
type Props$135 = {
|
|
4920
4934
|
/** Where the quote came from, e.g. a message or a page title. */
|
|
4921
4935
|
label: string;
|
|
4922
|
-
|
|
4936
|
+
/** Absent or empty draws the label alone. */
|
|
4937
|
+
excerpt?: string;
|
|
4923
4938
|
images?: ContextImage[];
|
|
4924
|
-
|
|
4939
|
+
/** A position drawn as a numbered disc in place of the quote glyph, so a message can cite it. */
|
|
4940
|
+
number?: number;
|
|
4941
|
+
/** Absent draws the chip read-only, e.g. on a sent message. */
|
|
4942
|
+
onRemove?: () => void;
|
|
4925
4943
|
className?: string;
|
|
4926
4944
|
};
|
|
4927
4945
|
/**
|
|
@@ -4930,7 +4948,7 @@ type Props$135 = {
|
|
|
4930
4948
|
* - The excerpt is clamped to two lines; "Show all" appears once it is long enough to be cut.
|
|
4931
4949
|
* - Images sit under the excerpt as small thumbnails.
|
|
4932
4950
|
*/
|
|
4933
|
-
declare const ContextChip: ({ label, excerpt, images, onRemove, className }: Props$135) => import("react").JSX.Element;
|
|
4951
|
+
declare const ContextChip: ({ label, excerpt, images, number, onRemove, className }: Props$135) => import("react").JSX.Element;
|
|
4934
4952
|
//#endregion
|
|
4935
4953
|
//#region src/blocks/AIKit/FileDownloadChip.d.ts
|
|
4936
4954
|
type Props$134 = {
|
|
@@ -5051,6 +5069,8 @@ type Props$132 = {
|
|
|
5051
5069
|
onClick: () => void;
|
|
5052
5070
|
/** Text beside the arrow; absent draws an icon-only button named "Scroll to bottom". */
|
|
5053
5071
|
label?: string;
|
|
5072
|
+
/** Shown beside the button on hover, to its left, where the button sits against the right edge. */
|
|
5073
|
+
tooltip?: string;
|
|
5054
5074
|
className?: string;
|
|
5055
5075
|
};
|
|
5056
5076
|
/**
|
|
@@ -5059,7 +5079,7 @@ type Props$132 = {
|
|
|
5059
5079
|
* - Renders nothing while `visible` is false.
|
|
5060
5080
|
* - Positioning is the host's: pass `className` to pin it over the list.
|
|
5061
5081
|
*/
|
|
5062
|
-
declare const JumpToLatest: ({ visible, working, onClick, label, className }: Props$132) => import("react").JSX.Element | null;
|
|
5082
|
+
declare const JumpToLatest: ({ visible, working, onClick, label, tooltip, className }: Props$132) => import("react").JSX.Element | null;
|
|
5063
5083
|
//#endregion
|
|
5064
5084
|
//#region src/blocks/AIKit/markdownOptions.d.ts
|
|
5065
5085
|
type RenderDiagramActions = (safeSvg: string) => ReactNode;
|
|
@@ -5361,6 +5381,10 @@ type Props$123 = {
|
|
|
5361
5381
|
/** Images and chips already attached, in rows of their own above the text. */
|
|
5362
5382
|
attachments?: ReactNode;
|
|
5363
5383
|
className?: string;
|
|
5384
|
+
/** On the element around the frame, for an outer pattern that themes the shell itself. */
|
|
5385
|
+
shellClassName?: string;
|
|
5386
|
+
/** Fires as focus enters or leaves the composer; the outer element also carries `data-focused`. */
|
|
5387
|
+
onFocusChange?: (focused: boolean) => void;
|
|
5364
5388
|
variant?: 'default' | 'inline';
|
|
5365
5389
|
disableSubmit?: boolean;
|
|
5366
5390
|
/** Holds the composer read-only while the host reconnects: focus stays, Enter and send do nothing. */
|
|
@@ -5398,6 +5422,8 @@ type Props$123 = {
|
|
|
5398
5422
|
mentions?: PromptCommand[];
|
|
5399
5423
|
/** Fires after the `@` token is replaced; the host attaches or opens whatever the item stands for. */
|
|
5400
5424
|
onMentionSelect?: (item: PromptCommand) => void;
|
|
5425
|
+
/** Text a picked mention leaves at the caret, in the same update that removes its `@token`; ignored with `mentionsMultiple`. */
|
|
5426
|
+
mentionInsert?: (item: PromptCommand) => string;
|
|
5401
5427
|
/** What the `@` list says when it has nothing to list — the host owns that wording. */
|
|
5402
5428
|
mentionsEmptyText?: ReactNode;
|
|
5403
5429
|
/** An `@` group's heading — the group key names a bucket, the host says how a bucket looks. */
|
|
@@ -5407,7 +5433,7 @@ type Props$123 = {
|
|
|
5407
5433
|
/** Prompts already sent, oldest first: ↑ at the start of the text recalls them, ↓ steps back. */
|
|
5408
5434
|
history?: string[];
|
|
5409
5435
|
} & VariantProps<typeof promptInputVariants> & Pick<ComponentProps<typeof TextareaAutosize>, 'placeholder' | 'minRows' | 'maxRows' | 'disabled' | 'defaultValue' | 'autoFocus'> & ComponentProps<typeof PromptInputSubmit>;
|
|
5410
|
-
declare function PromptInput({ onSend, onAbort, onContinue, prefix, variant, suffix, attachments, className, disabled, disableSubmit, busy, blurOnEscape, onKeyDown, onPasteFiles, canSubmitEmpty, allowSendWhileBusy, canAbort, value, onValueChange, status, maxRows, minRows, commands, commandsEmptyText, commandsLoading, slashTrigger, commandsGroupAction, panel, mentions, onMentionSelect, mentionsEmptyText, mentionsGroupHeading, mentionsMultiple, history, autoFocus, textareaRef: publishedRef, ...textareaProps }: Props$123): import("react").JSX.Element;
|
|
5436
|
+
declare function PromptInput({ onSend, onAbort, onContinue, prefix, variant, suffix, attachments, className, shellClassName, onFocusChange, disabled, disableSubmit, busy, blurOnEscape, onKeyDown, onPasteFiles, canSubmitEmpty, allowSendWhileBusy, canAbort, value, onValueChange, status, maxRows, minRows, commands, commandsEmptyText, commandsLoading, slashTrigger, commandsGroupAction, panel, mentions, onMentionSelect, mentionInsert, mentionsEmptyText, mentionsGroupHeading, mentionsMultiple, history, autoFocus, textareaRef: publishedRef, ...textareaProps }: Props$123): import("react").JSX.Element;
|
|
5411
5437
|
declare namespace PromptInput {
|
|
5412
5438
|
export { PromptInputAction as Action };
|
|
5413
5439
|
export { PromptInputMenuTrigger as MenuTrigger };
|
|
@@ -7725,6 +7751,14 @@ declare const useScrollbarPosition: () => {
|
|
|
7725
7751
|
*/
|
|
7726
7752
|
declare const useStableCallback: <Args extends unknown[], Result>(callback: (...args: Args) => Result) => ((...args: Args) => Result);
|
|
7727
7753
|
//#endregion
|
|
7754
|
+
//#region src/hooks/useTimeout.d.ts
|
|
7755
|
+
/**
|
|
7756
|
+
* Runs `callback` once, `delayMs` after mount; cleared on unmount.
|
|
7757
|
+
*
|
|
7758
|
+
* - A new `callback` identity does not restart the timer; a new `delayMs` does.
|
|
7759
|
+
*/
|
|
7760
|
+
declare const useTimeout: (callback: () => unknown, delayMs: number) => void;
|
|
7761
|
+
//#endregion
|
|
7728
7762
|
//#region src/utils/classNames.d.ts
|
|
7729
7763
|
declare const cn: (...classes: ClassValue[]) => string;
|
|
7730
7764
|
//#endregion
|
|
@@ -7835,5 +7869,5 @@ declare const contrastRatio: (fg: string, bg: string) => number;
|
|
|
7835
7869
|
/** WCAG level for normal-size text at a given ratio. */
|
|
7836
7870
|
declare const wcagLevel: (ratio: number) => 'AAA' | 'AA' | 'fail';
|
|
7837
7871
|
//#endregion
|
|
7838
|
-
export { ANSWER_SOURCES_VISIBLE, Alert, AlertModal, AnswerActions, AnswerSource, AnswerSources, AnswerSummary, type AnswerItem as AnswerSummaryItem, type Props as AnswerSummaryProps, type Variant as AnswerSummaryVariant, AnswerVote, AppShell, type AppShellHeaderSpan, type AppShellSlot, AttachmentChip, AttachmentStatus, AuthLayout, type RootProps as AuthLayoutProps, AutoSaveTextarea, Avatar, BLANK_VALUES, Badge, type Brand, BrandEditor, type BrandEditorProps, BrandId, BrandLogo, Breadcrumb, Button, ButtonGroup, ButtonInline, CONTEXT_CHIP_EXPANDABLE_LENGTH, Calendar, type CalendarProps, Card, type ChangeClassification, ChartPanel, type RootProps$1 as ChartPanelProps, ChatInlineIcon, ChatNotice, ChatNoticeTone, Checkbox, ChipEditor, type Props$1 as ChipEditorProps, Clipboard, ClipboardButton, ClipboardInline, Collapsible, CollapsiblePanel, CollapsibleStepHeader, ColorInput, ColorModeSwitch, ColorScheme, type ColorSlot, Combobox, ComboboxField, Command, CommandGroup, CommandInput, CommandItem, CommandList, ConflictStatusIndicator, ContextChip, CopyField, DEFAULT_COLOR_SCHEME, DEFAULT_FALLBACK_FONT, DEFAULT_FONT_OPTIONS, DEFAULT_BRAND_ID as DEFAULT_KEBOOLA_BRAND_ID, DEFAULT_WORKBENCH_BAR_HEIGHT_IN_REM, DEFAULT_WORKBENCH_PANEL_HEIGHT_IN_PX, DIAGRAM_LANGUAGES, DashboardHero, type RootProps$2 as DashboardHeroProps, DateInput, DatePicker, type DateRange, DateRangeInput, DateRangePicker, type DateRangePreset, DiagramSkeleton, type DiffChunk, type DiffInformation, type DiffRow, DiffType, DiffView, DotsLoader, DropdownMenu, EmptyConfigurationActionCard, EmptySearchContent, EmptyState, type RootProps$3 as EmptyStateProps, type Variant$1 as EmptyStateVariant, ErrorState, type RootProps$4 as ErrorStateProps, type Variant$2 as ErrorStateVariant, ExportMenu, ExportMenuItem, FacebookButton, FileDownloadChip, FileGallery, type FileGalleryImage, FileUpload, type FileUploadAccept, type FileUploadRejection, type FileUploadRejectionCode, FormGroup, FullScreenModal, FullScreenModalBody, FullScreenModalHeader, GoogleButton, HINT_UNDERLINE_CLASS_NAME, HelpBlock, HoverCard, InlineEdit, InlineStepDetail, type Props$2 as InlineStepDetailProps, InlineStepGroup, type Props$3 as InlineStepGroupProps, InlineStepLabel, type Props$4 as InlineStepLabelProps, type Variant$3 as InlineStepLabelVariant, InputGroup, JumpToLatest, Kbd, Label, type LineInformation, Link, MAX_DIGIT_HOTKEY, MIN_WORKBENCH_PANEL_HEIGHT_IN_PX, Markdown, MarkdownTable, MarkedText, type MergeConflict, MessageBubble, MicrosoftButton, Modal, ModeChip, MultiActionButtonGroup, MultiCombobox, MultiComboboxField, MultiComboboxHighlighted, Navbar, NumberInput, OtpInput, type RootProps$5 as OtpInputProps, type OtpInputRenderSlotProps, PROMPT_INPUT_CONTAINER, PageHeader, PageLayout, PageToolbar, Pagination, PaneHeader, type PanelImperativeHandle, PanelWithDetails, PasswordInput, PlanApproval, type PlanApprovalProps, type PlanApprovalStatus, PlanRewritingIndicator, type PlanRewritingIndicatorProps, Popconfirm, Popover, Progress, type PromptCommand, PromptInput, Props$5 as Props, Question, type QuestionAnswers, QuestionBlock, type Props$6 as QuestionBlockProps, type QuestionOption, type Props$7 as QuestionProps, type QuestionStep, REGEXP_ONLY_CHARS, REGEXP_ONLY_DIGITS, REGEXP_ONLY_DIGITS_AND_CHARS, RadioGroup, type RadiusSize, ResizableHandle, ResizablePanel, ResizablePanelGroup, ResolvedColorScheme, ScrollArea, ScrollBar, Search, SearchForm, SearchInput, SearchInputWithNavigation, SectionNav, type SectionNavGroup, type SectionNavItem, type SectionNavItemRenderProps, Select, SelectItem, SelectItemGroup, SelectProps, Separator, type ServerFieldError, Sheet, type SideInformation, Sidebar, type SidebarMode, SidebarProvider, type SidebarSide, type SidebarSlot, Skeleton, SkeletonList, Slider, Slot, SourceChip, SourceChipProps, SourceState, SplitButton, SpotlightBackdrop, SpotlightTarget, StatCard, StatCardGrid, type Props$8 as StatCardGridProps, type RootProps$6 as StatCardProps, type TrendDirection as StatCardTrendDirection, type TrendProps as StatCardTrendProps, type StepStatus, Stepper, type StepperOrientation, SuggestedPrompt, Switch, Table, type TableSkeletonColumn, type TableSortDirection, Tabs, TabsContent, TargetRect, TextInput, Textarea, Theme, ThemeProvider, ThemeScope, ThinkingIndicator, type ThinkingIndicatorProps, ThumbTooltipFn, TimeInput, TimePicker, Timeline, type ToastOptions, Toaster, Toggle, ToggleGroup, Tokens, ToolCallApproval, type ToolCallApprovalAction, type ToolCallApprovalExtraAction, type ToolCallApprovalNoticeItem, type NoticeTone as ToolCallApprovalNoticeTone, type ToolCallApprovalProps, type ShortcutKey as ToolCallApprovalShortcutKey, type ToolCallApprovalStatus, ToolCallChip, type ToolCallChipProps, type ToolCallState, type ToolCallStatus, ToolCallStatusHeader, type Props$9 as ToolCallStatusHeaderProps, Tooltip, type Props$10 as TooltipProps, TooltipProvider, type Trigger, Truncated, UsageBar, UsageStats, UsageStatsRing, UseAutosizeInputOptions, UseAutosizeInputReturn, type ValidityState, type WithAccessibleName, type WordInformation, Workbench, type WorkbenchState, ZoomableSvg, agnes, appShellSlotSelector, brandSchema, buttonVariants, channelsToHex, clampPercentage, cn, computeDiffRows, computeLineInformation, contrastRatio, copyToClipboard, defaultFilter, digitFromKeyCode, exampleCustomer, filterByWords, findLiteralMatches, findMentionToken, findSlashToken, formatPercentage, forwardAccessibleName, getChatInlineIconName, harbor, hasLiteralMatch, hexToChannels, isMac, kbcUi, kbdVariants, keboola, keys, matchByWords, mergeRefs, namedLabel, setServerFieldErrors, setSubmitError, splitSealedBlocks, svgToPngBlob, tableAriaSort, toSvgFileContent, toast, useAltDigitHotkey, useAppForm, useAutosizeInput, useCommandState, useDefaultLayout, useFileDropTarget, useFileUploadRejections, useMergeDiff, useNotification, useOptionalSidebar, useScrollbarPosition, useSidebar, useStableCallback, useTargetRect, useTheme, useThemeScopeContainer, useWorkbench, wcagLevel, withBlankValues, withForm, withholdOpenTail };
|
|
7872
|
+
export { ANSWER_SOURCES_VISIBLE, Alert, AlertModal, AnswerActions, AnswerExtraAction, AnswerSource, AnswerSources, AnswerSummary, type AnswerItem as AnswerSummaryItem, type Props as AnswerSummaryProps, type Variant as AnswerSummaryVariant, AnswerVote, AppShell, type AppShellHeaderSpan, type AppShellSlot, AttachmentChip, AttachmentStatus, AuthLayout, type RootProps as AuthLayoutProps, AutoSaveTextarea, Avatar, BLANK_VALUES, Badge, type Brand, BrandEditor, type BrandEditorProps, BrandId, BrandLogo, Breadcrumb, Button, ButtonGroup, ButtonInline, CONTEXT_CHIP_EXPANDABLE_LENGTH, Calendar, type CalendarProps, Card, type ChangeClassification, ChartPanel, type RootProps$1 as ChartPanelProps, ChatInlineIcon, ChatNotice, ChatNoticeTone, Checkbox, ChipEditor, type Props$1 as ChipEditorProps, Clipboard, ClipboardButton, ClipboardInline, Collapsible, CollapsiblePanel, CollapsibleStepHeader, ColorInput, ColorModeSwitch, ColorScheme, type ColorSlot, Combobox, ComboboxField, Command, CommandGroup, CommandInput, CommandItem, CommandList, ConflictStatusIndicator, ContextChip, CopyField, DEFAULT_COLOR_SCHEME, DEFAULT_FALLBACK_FONT, DEFAULT_FONT_OPTIONS, DEFAULT_BRAND_ID as DEFAULT_KEBOOLA_BRAND_ID, DEFAULT_WORKBENCH_BAR_HEIGHT_IN_REM, DEFAULT_WORKBENCH_PANEL_HEIGHT_IN_PX, DIAGRAM_LANGUAGES, DashboardHero, type RootProps$2 as DashboardHeroProps, DateInput, DatePicker, type DateRange, DateRangeInput, DateRangePicker, type DateRangePreset, DiagramSkeleton, type DiffChunk, type DiffInformation, type DiffRow, DiffType, DiffView, DotsLoader, DropdownMenu, EmptyConfigurationActionCard, EmptySearchContent, EmptyState, type RootProps$3 as EmptyStateProps, type Variant$1 as EmptyStateVariant, ErrorState, type RootProps$4 as ErrorStateProps, type Variant$2 as ErrorStateVariant, ExportMenu, ExportMenuItem, FacebookButton, FileDownloadChip, FileGallery, type FileGalleryImage, FileUpload, type FileUploadAccept, type FileUploadRejection, type FileUploadRejectionCode, FormGroup, FullScreenModal, FullScreenModalBody, FullScreenModalHeader, GoogleButton, HINT_UNDERLINE_CLASS_NAME, HelpBlock, HoverCard, InlineEdit, InlineStepDetail, type Props$2 as InlineStepDetailProps, InlineStepGroup, type Props$3 as InlineStepGroupProps, InlineStepLabel, type Props$4 as InlineStepLabelProps, type Variant$3 as InlineStepLabelVariant, InputGroup, JumpToLatest, Kbd, Label, type LineInformation, Link, MAX_DIGIT_HOTKEY, MIN_WORKBENCH_PANEL_HEIGHT_IN_PX, Markdown, MarkdownTable, MarkedText, type MergeConflict, MessageBubble, MicrosoftButton, Modal, ModeChip, MultiActionButtonGroup, MultiCombobox, MultiComboboxField, MultiComboboxHighlighted, Navbar, NumberInput, OtpInput, type RootProps$5 as OtpInputProps, type OtpInputRenderSlotProps, PROMPT_INPUT_CONTAINER, PageHeader, PageLayout, PageToolbar, Pagination, PaneHeader, type PanelImperativeHandle, PanelWithDetails, PasswordInput, PlanApproval, type PlanApprovalProps, type PlanApprovalStatus, PlanRewritingIndicator, type PlanRewritingIndicatorProps, Popconfirm, Popover, Progress, type PromptCommand, PromptInput, Props$5 as Props, Question, type QuestionAnswers, QuestionBlock, type Props$6 as QuestionBlockProps, type QuestionOption, type Props$7 as QuestionProps, type QuestionStep, REGEXP_ONLY_CHARS, REGEXP_ONLY_DIGITS, REGEXP_ONLY_DIGITS_AND_CHARS, RadioGroup, type RadiusSize, ResizableHandle, ResizablePanel, ResizablePanelGroup, ResolvedColorScheme, ScrollArea, ScrollBar, Search, SearchForm, SearchInput, SearchInputWithNavigation, SectionNav, type SectionNavGroup, type SectionNavItem, type SectionNavItemRenderProps, Select, SelectItem, SelectItemGroup, SelectProps, Separator, type ServerFieldError, Sheet, type SideInformation, Sidebar, type SidebarMode, SidebarProvider, type SidebarSide, type SidebarSlot, Skeleton, SkeletonList, Slider, Slot, SourceChip, SourceChipProps, SourceState, SplitButton, SpotlightBackdrop, SpotlightTarget, StatCard, StatCardGrid, type Props$8 as StatCardGridProps, type RootProps$6 as StatCardProps, type TrendDirection as StatCardTrendDirection, type TrendProps as StatCardTrendProps, type StepStatus, Stepper, type StepperOrientation, SuggestedPrompt, Switch, Table, type TableSkeletonColumn, type TableSortDirection, Tabs, TabsContent, TargetRect, TextInput, Textarea, Theme, ThemeProvider, ThemeScope, ThinkingIndicator, type ThinkingIndicatorProps, ThumbTooltipFn, TimeInput, TimePicker, Timeline, type ToastOptions, Toaster, Toggle, ToggleGroup, Tokens, ToolCallApproval, type ToolCallApprovalAction, type ToolCallApprovalExtraAction, type ToolCallApprovalNoticeItem, type NoticeTone as ToolCallApprovalNoticeTone, type ToolCallApprovalProps, type ShortcutKey as ToolCallApprovalShortcutKey, type ToolCallApprovalStatus, ToolCallChip, type ToolCallChipProps, type ToolCallState, type ToolCallStatus, ToolCallStatusHeader, type Props$9 as ToolCallStatusHeaderProps, Tooltip, type Props$10 as TooltipProps, TooltipProvider, type Trigger, Truncated, UsageBar, UsageStats, UsageStatsRing, UseAutosizeInputOptions, UseAutosizeInputReturn, type ValidityState, type WithAccessibleName, type WordInformation, Workbench, type WorkbenchState, ZoomableSvg, agnes, appShellSlotSelector, brandSchema, buttonVariants, channelsToHex, clampPercentage, cn, computeDiffRows, computeLineInformation, contrastRatio, copyToClipboard, defaultFilter, digitFromKeyCode, exampleCustomer, filterByWords, findLiteralMatches, findMentionToken, findSlashToken, formatPercentage, forwardAccessibleName, getChatInlineIconName, harbor, hasLiteralMatch, hexToChannels, isMac, kbcUi, kbdVariants, keboola, keys, matchByWords, mergeRefs, namedLabel, setServerFieldErrors, setSubmitError, splitSealedBlocks, svgToPngBlob, tableAriaSort, toSvgFileContent, toast, useAltDigitHotkey, useAppForm, useAutosizeInput, useCommandState, useDefaultLayout, useFileDropTarget, useFileUploadRejections, useMergeDiff, useNotification, useOptionalSidebar, useScrollbarPosition, useSidebar, useStableCallback, useTargetRect, useTheme, useThemeScopeContainer, useTimeout, useWorkbench, wcagLevel, withBlankValues, withForm, withholdOpenTail };
|
|
7839
7873
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.js
CHANGED
|
@@ -4,7 +4,7 @@ import { findLiteralMatches, hasLiteralMatch } from "./findLiteralMatches-DgGLzy
|
|
|
4
4
|
import { mergeRefs } from "./internal/utils/mergeRefs.js";
|
|
5
5
|
import { Button, ButtonInline, buttonVariants } from "./Button-BNkyYU8u.js";
|
|
6
6
|
import { ButtonGroup } from "./internal/components/ButtonGroup.js";
|
|
7
|
-
import { DropdownMenu } from "./DropdownMenu-
|
|
7
|
+
import { DropdownMenu } from "./DropdownMenu-Bum99mVf.js";
|
|
8
8
|
import { ScrollArea, ScrollBar } from "./internal/components/ScrollArea.js";
|
|
9
9
|
import { SplitButton } from "./internal/blocks/SplitButton.js";
|
|
10
10
|
import { MultiActionButtonGroup } from "./MultiActionButtonGroup-Dzig87s1.js";
|
|
@@ -19,33 +19,33 @@ import { MicrosoftButton } from "./internal/blocks/MicrosoftButton.js";
|
|
|
19
19
|
import { FacebookButton } from "./internal/blocks/FacebookButton.js";
|
|
20
20
|
import { GoogleButton } from "./internal/blocks/GoogleButton.js";
|
|
21
21
|
import { Link } from "./internal/components/Link.js";
|
|
22
|
-
import { AlertModal } from "./AlertModal-
|
|
23
|
-
import { Modal } from "./Modal-
|
|
22
|
+
import { AlertModal } from "./AlertModal-DMsn62JJ.js";
|
|
23
|
+
import { Modal } from "./Modal-DwuvuiUx.js";
|
|
24
24
|
import { FullScreenModal, FullScreenModalBody, FullScreenModalHeader } from "./FullScreenModal-DAvvlGOz.js";
|
|
25
25
|
import { Truncated } from "./internal/components/Truncated.js";
|
|
26
|
-
import { Sheet } from "./Sheet-
|
|
26
|
+
import { Sheet } from "./Sheet-DKG20J7W.js";
|
|
27
27
|
import { useStableCallback } from "./internal/hooks/useStableCallback.js";
|
|
28
|
-
import { Popover } from "./Popover-
|
|
29
|
-
import { Popconfirm } from "./Popconfirm-
|
|
30
|
-
import { HoverCard } from "./HoverCard-
|
|
28
|
+
import { Popover } from "./Popover-DnBw5Uay.js";
|
|
29
|
+
import { Popconfirm } from "./Popconfirm-p72DiagN.js";
|
|
30
|
+
import { HoverCard } from "./HoverCard-Cf9iYyaW.js";
|
|
31
31
|
import { Command, CommandGroup, CommandInput, CommandItem, CommandList, defaultFilter, useCommandState } from "./Command-DhXmqFLT.js";
|
|
32
32
|
import { InputGroup } from "./InputGroup-CZv_7QlM.js";
|
|
33
33
|
import { TextInput } from "./TextInput-CR0_USaY.js";
|
|
34
34
|
import { SpotlightBackdrop, useTargetRect } from "./internal/components/SpotlightBackdrop.js";
|
|
35
35
|
import { Calendar } from "./Calendar-BnKi1kPu.js";
|
|
36
|
-
import { DatePicker } from "./DatePicker-
|
|
37
|
-
import { TimePicker } from "./TimePicker-
|
|
38
|
-
import { DateRangePicker } from "./DateRangePicker-
|
|
36
|
+
import { DatePicker } from "./DatePicker-Cg_aG_N4.js";
|
|
37
|
+
import { TimePicker } from "./TimePicker-lk3NGqeK.js";
|
|
38
|
+
import { DateRangePicker } from "./DateRangePicker-m47cSV1r.js";
|
|
39
39
|
import { Switch } from "./Switch-DccpSpzC.js";
|
|
40
40
|
import { RadioGroup } from "./RadioGroup-B0TwHjBb.js";
|
|
41
41
|
import { Separator } from "./internal/components/Separator.js";
|
|
42
42
|
import { Slider } from "./Slider-DrcsM8_G.js";
|
|
43
43
|
import { Search, SearchForm } from "./Search-vyZwGKMU.js";
|
|
44
44
|
import { forwardAccessibleName } from "./internal/utils/accessibleName.js";
|
|
45
|
-
import { Select } from "./Select-
|
|
45
|
+
import { Select } from "./Select-C6zKeip5.js";
|
|
46
46
|
import { Checkbox } from "./Checkbox-CHDDJyAA.js";
|
|
47
|
-
import { BLANK_VALUES, Combobox, filterByWords, matchByWords, namedLabel, withBlankValues } from "./Combobox-
|
|
48
|
-
import { Badge } from "./Badge-
|
|
47
|
+
import { BLANK_VALUES, Combobox, filterByWords, matchByWords, namedLabel, withBlankValues } from "./Combobox-BLqX-Tdh.js";
|
|
48
|
+
import { Badge } from "./Badge-CqlOE5A2.js";
|
|
49
49
|
import { MultiCombobox } from "./internal/blocks/MultiCombobox.js";
|
|
50
50
|
import { FormGroup } from "./FormGroup-V5kIgQRN.js";
|
|
51
51
|
import { ColorInput } from "./ColorInput-B_eZIu39.js";
|
|
@@ -59,22 +59,22 @@ import { AutoSaveTextarea } from "./AutoSaveTextarea-BbMhC5Aq.js";
|
|
|
59
59
|
import { Kbd, kbdVariants, keys } from "./Kbd-CflKthfu.js";
|
|
60
60
|
import { useAutosizeInput } from "./internal/hooks/useAutosizeInput.js";
|
|
61
61
|
import { InlineEdit } from "./InlineEdit-D4P0SvCB.js";
|
|
62
|
-
import { ColorModeSwitch } from "./ColorModeSwitch-
|
|
63
|
-
import { DateInput } from "./DateInput-
|
|
62
|
+
import { ColorModeSwitch } from "./ColorModeSwitch-BlrH8jAi.js";
|
|
63
|
+
import { DateInput } from "./DateInput-duinbI9_.js";
|
|
64
64
|
import { PasswordInput } from "./internal/blocks/PasswordInput.js";
|
|
65
65
|
import { TimeInput } from "./internal/blocks/TimeInput.js";
|
|
66
|
-
import { DateRangeInput } from "./DateRangeInput-
|
|
66
|
+
import { DateRangeInput } from "./DateRangeInput-BYVHf9zo.js";
|
|
67
67
|
import { OtpInput, REGEXP_ONLY_CHARS, REGEXP_ONLY_DIGITS, REGEXP_ONLY_DIGITS_AND_CHARS } from "./OtpInput-CY8yCaJk.js";
|
|
68
68
|
import { SearchInput } from "./SearchInput-DyYXyw3u.js";
|
|
69
69
|
import { SearchInputWithNavigation } from "./internal/blocks/SearchInputWithNavigation.js";
|
|
70
70
|
import { FileUpload, useFileDropTarget, useFileUploadRejections } from "./FileUpload-BYFONpEl.js";
|
|
71
|
-
import { ANSWER_SOURCES_VISIBLE, AnswerActions, AnswerSources, AnswerSummary, AttachmentChip, CONTEXT_CHIP_EXPANDABLE_LENGTH, ChatInlineIcon, ChatNotice, CollapsibleStepHeader, ContextChip, DIAGRAM_LANGUAGES, FileDownloadChip, FileGallery, InlineStepDetail, InlineStepGroup, InlineStepLabel, JumpToLatest, Markdown, MarkdownTable, MessageBubble, ModeChip, PROMPT_INPUT_CONTAINER, PlanApproval, PlanRewritingIndicator, PromptInput, Question, QuestionBlock, SourceChip, SuggestedPrompt, ThinkingIndicator, ToolCallApproval, ToolCallChip, ToolCallStatusHeader, UsageBar, UsageStats, UsageStatsRing, clampPercentage, findMentionToken, findSlashToken, formatPercentage, getChatInlineIconName, splitSealedBlocks, withholdOpenTail } from "./AIKit-
|
|
71
|
+
import { ANSWER_SOURCES_VISIBLE, AnswerActions, AnswerSources, AnswerSummary, AttachmentChip, CONTEXT_CHIP_EXPANDABLE_LENGTH, ChatInlineIcon, ChatNotice, CollapsibleStepHeader, ContextChip, DIAGRAM_LANGUAGES, FileDownloadChip, FileGallery, InlineStepDetail, InlineStepGroup, InlineStepLabel, JumpToLatest, Markdown, MarkdownTable, MessageBubble, ModeChip, PROMPT_INPUT_CONTAINER, PlanApproval, PlanRewritingIndicator, PromptInput, Question, QuestionBlock, SourceChip, SuggestedPrompt, ThinkingIndicator, ToolCallApproval, ToolCallChip, ToolCallStatusHeader, UsageBar, UsageStats, UsageStatsRing, clampPercentage, findMentionToken, findSlashToken, formatPercentage, getChatInlineIconName, splitSealedBlocks, withholdOpenTail } from "./AIKit-BR6jfsdI.js";
|
|
72
72
|
import { Collapsible } from "./Collapsible-DD4xTL75.js";
|
|
73
73
|
import { Alert } from "./Alert-Chz6KZ7e.js";
|
|
74
74
|
import { Table, tableAriaSort } from "./Table-CilEvpMq.js";
|
|
75
75
|
import { Skeleton } from "./internal/components/Skeleton/Skeleton.js";
|
|
76
76
|
import { DiagramSkeleton } from "./internal/blocks/DiagramShared/DiagramSkeleton.js";
|
|
77
|
-
import { ZoomableSvg, svgToPngBlob, toSvgFileContent } from "./ZoomableSvg-
|
|
77
|
+
import { ZoomableSvg, svgToPngBlob, toSvgFileContent } from "./ZoomableSvg-CxXKanUR.js";
|
|
78
78
|
import { Progress } from "./internal/components/Progress.js";
|
|
79
79
|
import { MAX_DIGIT_HOTKEY, digitFromKeyCode, useAltDigitHotkey } from "./internal/hooks/useAltDigitHotkey.js";
|
|
80
80
|
import { toast } from "./toast-Y3cTMBW8.js";
|
|
@@ -95,14 +95,14 @@ import { BrandLogo } from "./BrandLogo-DkESE19K.js";
|
|
|
95
95
|
import { AuthLayout } from "./internal/blocks/AuthLayout.js";
|
|
96
96
|
import { PageLayout } from "./PageLayout-C9aXTpqV.js";
|
|
97
97
|
import { PageHeader } from "./PageHeader-CL1A6jFM.js";
|
|
98
|
-
import { PageToolbar } from "./PageToolbar-
|
|
99
|
-
import { SectionNav } from "./SectionNav-
|
|
98
|
+
import { PageToolbar } from "./PageToolbar-LKP6PiP_.js";
|
|
99
|
+
import { SectionNav } from "./SectionNav-6hcIpZLO.js";
|
|
100
100
|
import { ResizableHandle, ResizablePanel, ResizablePanelGroup, useDefaultLayout } from "./Resizable-D8zs0kcq.js";
|
|
101
|
-
import { Sidebar, SidebarProvider, useOptionalSidebar, useSidebar } from "./Sidebar-
|
|
101
|
+
import { Sidebar, SidebarProvider, useOptionalSidebar, useSidebar } from "./Sidebar-BlYqasnX.js";
|
|
102
102
|
import { useScrollbarPosition } from "./internal/hooks/useScrollbarPosition.js";
|
|
103
103
|
import { Navbar } from "./Navbar-DHUS7XiU.js";
|
|
104
104
|
import { DEFAULT_WORKBENCH_BAR_HEIGHT_IN_REM, DEFAULT_WORKBENCH_PANEL_HEIGHT_IN_PX, MIN_WORKBENCH_PANEL_HEIGHT_IN_PX, Workbench, useWorkbench } from "./Workbench-CxgNCs3I.js";
|
|
105
|
-
import { Breadcrumb } from "./Breadcrumb-
|
|
105
|
+
import { Breadcrumb } from "./Breadcrumb-DbqvDnYl.js";
|
|
106
106
|
import { Tabs, TabsContent } from "./Tabs-Ck4uWf8U.js";
|
|
107
107
|
import { Stepper } from "./Stepper-CQrUPVFL.js";
|
|
108
108
|
import { Timeline } from "./Timeline-DUXgByUE.js";
|
|
@@ -116,7 +116,8 @@ import { useMergeDiff } from "./useMergeDiff-CvowEXJ1.js";
|
|
|
116
116
|
import { DashboardHero } from "./internal/blocks/DashboardHero.js";
|
|
117
117
|
import { StatCard, StatCardGrid } from "./internal/blocks/StatCard.js";
|
|
118
118
|
import { ChartPanel } from "./internal/blocks/ChartPanel.js";
|
|
119
|
-
import { setServerFieldErrors, setSubmitError, useAppForm, withForm } from "./Form-
|
|
120
|
-
import {
|
|
119
|
+
import { setServerFieldErrors, setSubmitError, useAppForm, withForm } from "./Form-Dqbt_tIs.js";
|
|
120
|
+
import { useTimeout } from "./internal/hooks/useTimeout.js";
|
|
121
|
+
import { BrandEditor, DEFAULT_FALLBACK_FONT, DEFAULT_FONT_OPTIONS, channelsToHex, contrastRatio, hexToChannels, wcagLevel } from "./BrandEditor-D61pzWRq.js";
|
|
121
122
|
import { Slot } from "@radix-ui/react-slot";
|
|
122
|
-
export { ANSWER_SOURCES_VISIBLE, Alert, AlertModal, AnswerActions, AnswerSources, AnswerSummary, AppShell, AttachmentChip, AuthLayout, AutoSaveTextarea, Avatar, BLANK_VALUES, Badge, BrandEditor, BrandLogo, Breadcrumb, Button, ButtonGroup, ButtonInline, CONTEXT_CHIP_EXPANDABLE_LENGTH, Calendar, Card, ChartPanel, ChatInlineIcon, ChatNotice, Checkbox, ChipEditor, Clipboard, ClipboardButton, ClipboardInline, Collapsible, CollapsiblePanel, CollapsibleStepHeader, ColorInput, ColorModeSwitch, Combobox, ComboboxField, Command, CommandGroup, CommandInput, CommandItem, CommandList, ConflictStatusIndicator, ContextChip, CopyField, DEFAULT_COLOR_SCHEME, DEFAULT_FALLBACK_FONT, DEFAULT_FONT_OPTIONS, DEFAULT_BRAND_ID as DEFAULT_KEBOOLA_BRAND_ID, DEFAULT_WORKBENCH_BAR_HEIGHT_IN_REM, DEFAULT_WORKBENCH_PANEL_HEIGHT_IN_PX, DIAGRAM_LANGUAGES, DashboardHero, DateInput, DatePicker, DateRangeInput, DateRangePicker, DiagramSkeleton, DiffType, DiffView, DotsLoader, DropdownMenu, EmptyConfigurationActionCard, EmptySearchContent, EmptyState, ErrorState, ExportMenu, FacebookButton, FileDownloadChip, FileGallery, FileUpload, FormGroup, FullScreenModal, FullScreenModalBody, FullScreenModalHeader, GoogleButton, HINT_UNDERLINE_CLASS_NAME, HelpBlock, HoverCard, InlineEdit, InlineStepDetail, InlineStepGroup, InlineStepLabel, InputGroup, JumpToLatest, Kbd, Label, Link, MAX_DIGIT_HOTKEY, MIN_WORKBENCH_PANEL_HEIGHT_IN_PX, Markdown, MarkdownTable, MarkedText, MessageBubble, MicrosoftButton, Modal, ModeChip, MultiActionButtonGroup, MultiCombobox, MultiComboboxField, Navbar, NumberInput, OtpInput, PROMPT_INPUT_CONTAINER, PageHeader, PageLayout, PageToolbar, Pagination, PaneHeader, PanelWithDetails, PasswordInput, PlanApproval, PlanRewritingIndicator, Popconfirm, Popover, Progress, PromptInput, Question, QuestionBlock, REGEXP_ONLY_CHARS, REGEXP_ONLY_DIGITS, REGEXP_ONLY_DIGITS_AND_CHARS, RadioGroup, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, Search, SearchForm, SearchInput, SearchInputWithNavigation, SectionNav, Select, Separator, Sheet, Sidebar, SidebarProvider, Skeleton, SkeletonList, Slider, Slot, SourceChip, SplitButton, SpotlightBackdrop, StatCard, StatCardGrid, Stepper, SuggestedPrompt, Switch, Table, Tabs, TabsContent, TextInput, Textarea, ThemeProvider, ThemeScope, ThinkingIndicator, TimeInput, TimePicker, Timeline, Toaster, Toggle, ToggleGroup, ToolCallApproval, ToolCallChip, ToolCallStatusHeader, Tooltip, TooltipProvider, Truncated, UsageBar, UsageStats, UsageStatsRing, Workbench, ZoomableSvg, agnes, appShellSlotSelector, brandSchema, buttonVariants, channelsToHex, clampPercentage, cn, computeDiffRows, computeLineInformation, contrastRatio, copyToClipboard, defaultFilter, digitFromKeyCode, exampleCustomer, filterByWords, findLiteralMatches, findMentionToken, findSlashToken, formatPercentage, forwardAccessibleName, getChatInlineIconName, harbor, hasLiteralMatch, hexToChannels, isMac, kbcUi, kbdVariants, keboola, keys, matchByWords, mergeRefs, namedLabel, setServerFieldErrors, setSubmitError, splitSealedBlocks, svgToPngBlob, tableAriaSort, toSvgFileContent, toast, useAltDigitHotkey, useAppForm, useAutosizeInput, useCommandState, useDefaultLayout, useFileDropTarget, useFileUploadRejections, useMergeDiff, useNotification, useOptionalSidebar, useScrollbarPosition, useSidebar, useStableCallback, useTargetRect, useTheme, useThemeScopeContainer, useWorkbench, wcagLevel, withBlankValues, withForm, withholdOpenTail };
|
|
123
|
+
export { ANSWER_SOURCES_VISIBLE, Alert, AlertModal, AnswerActions, AnswerSources, AnswerSummary, AppShell, AttachmentChip, AuthLayout, AutoSaveTextarea, Avatar, BLANK_VALUES, Badge, BrandEditor, BrandLogo, Breadcrumb, Button, ButtonGroup, ButtonInline, CONTEXT_CHIP_EXPANDABLE_LENGTH, Calendar, Card, ChartPanel, ChatInlineIcon, ChatNotice, Checkbox, ChipEditor, Clipboard, ClipboardButton, ClipboardInline, Collapsible, CollapsiblePanel, CollapsibleStepHeader, ColorInput, ColorModeSwitch, Combobox, ComboboxField, Command, CommandGroup, CommandInput, CommandItem, CommandList, ConflictStatusIndicator, ContextChip, CopyField, DEFAULT_COLOR_SCHEME, DEFAULT_FALLBACK_FONT, DEFAULT_FONT_OPTIONS, DEFAULT_BRAND_ID as DEFAULT_KEBOOLA_BRAND_ID, DEFAULT_WORKBENCH_BAR_HEIGHT_IN_REM, DEFAULT_WORKBENCH_PANEL_HEIGHT_IN_PX, DIAGRAM_LANGUAGES, DashboardHero, DateInput, DatePicker, DateRangeInput, DateRangePicker, DiagramSkeleton, DiffType, DiffView, DotsLoader, DropdownMenu, EmptyConfigurationActionCard, EmptySearchContent, EmptyState, ErrorState, ExportMenu, FacebookButton, FileDownloadChip, FileGallery, FileUpload, FormGroup, FullScreenModal, FullScreenModalBody, FullScreenModalHeader, GoogleButton, HINT_UNDERLINE_CLASS_NAME, HelpBlock, HoverCard, InlineEdit, InlineStepDetail, InlineStepGroup, InlineStepLabel, InputGroup, JumpToLatest, Kbd, Label, Link, MAX_DIGIT_HOTKEY, MIN_WORKBENCH_PANEL_HEIGHT_IN_PX, Markdown, MarkdownTable, MarkedText, MessageBubble, MicrosoftButton, Modal, ModeChip, MultiActionButtonGroup, MultiCombobox, MultiComboboxField, Navbar, NumberInput, OtpInput, PROMPT_INPUT_CONTAINER, PageHeader, PageLayout, PageToolbar, Pagination, PaneHeader, PanelWithDetails, PasswordInput, PlanApproval, PlanRewritingIndicator, Popconfirm, Popover, Progress, PromptInput, Question, QuestionBlock, REGEXP_ONLY_CHARS, REGEXP_ONLY_DIGITS, REGEXP_ONLY_DIGITS_AND_CHARS, RadioGroup, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, Search, SearchForm, SearchInput, SearchInputWithNavigation, SectionNav, Select, Separator, Sheet, Sidebar, SidebarProvider, Skeleton, SkeletonList, Slider, Slot, SourceChip, SplitButton, SpotlightBackdrop, StatCard, StatCardGrid, Stepper, SuggestedPrompt, Switch, Table, Tabs, TabsContent, TextInput, Textarea, ThemeProvider, ThemeScope, ThinkingIndicator, TimeInput, TimePicker, Timeline, Toaster, Toggle, ToggleGroup, ToolCallApproval, ToolCallChip, ToolCallStatusHeader, Tooltip, TooltipProvider, Truncated, UsageBar, UsageStats, UsageStatsRing, Workbench, ZoomableSvg, agnes, appShellSlotSelector, brandSchema, buttonVariants, channelsToHex, clampPercentage, cn, computeDiffRows, computeLineInformation, contrastRatio, copyToClipboard, defaultFilter, digitFromKeyCode, exampleCustomer, filterByWords, findLiteralMatches, findMentionToken, findSlashToken, formatPercentage, forwardAccessibleName, getChatInlineIconName, harbor, hasLiteralMatch, hexToChannels, isMac, kbcUi, kbdVariants, keboola, keys, matchByWords, mergeRefs, namedLabel, setServerFieldErrors, setSubmitError, splitSealedBlocks, svgToPngBlob, tableAriaSort, toSvgFileContent, toast, useAltDigitHotkey, useAppForm, useAutosizeInput, useCommandState, useDefaultLayout, useFileDropTarget, useFileUploadRejections, useMergeDiff, useNotification, useOptionalSidebar, useScrollbarPosition, useSidebar, useStableCallback, useTargetRect, useTheme, useThemeScopeContainer, useTimeout, useWorkbench, wcagLevel, withBlankValues, withForm, withholdOpenTail };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { ANSWER_SOURCES_VISIBLE, AnswerActions, AnswerSources, AnswerSummary, AttachmentChip, CONTEXT_CHIP_EXPANDABLE_LENGTH, ChatInlineIcon, ChatNotice, CollapsibleStepHeader, ContextChip, DIAGRAM_LANGUAGES, FileDownloadChip, FileGallery, InlineStepDetail, InlineStepGroup, InlineStepLabel, JumpToLatest, Markdown, MarkdownTable, MessageBubble, ModeChip, PROMPT_INPUT_CONTAINER, PlanApproval, PlanRewritingIndicator, PromptInput, Question, QuestionBlock, SourceChip, SuggestedPrompt, ThinkingIndicator, ToolCallApproval, ToolCallChip, ToolCallStatusHeader, UsageBar, UsageStats, UsageStatsRing, clampPercentage, findMentionToken, findSlashToken, formatPercentage, getChatInlineIconName, splitSealedBlocks, withholdOpenTail } from "../../AIKit-
|
|
1
|
+
import { ANSWER_SOURCES_VISIBLE, AnswerActions, AnswerSources, AnswerSummary, AttachmentChip, CONTEXT_CHIP_EXPANDABLE_LENGTH, ChatInlineIcon, ChatNotice, CollapsibleStepHeader, ContextChip, DIAGRAM_LANGUAGES, FileDownloadChip, FileGallery, InlineStepDetail, InlineStepGroup, InlineStepLabel, JumpToLatest, Markdown, MarkdownTable, MessageBubble, ModeChip, PROMPT_INPUT_CONTAINER, PlanApproval, PlanRewritingIndicator, PromptInput, Question, QuestionBlock, SourceChip, SuggestedPrompt, ThinkingIndicator, ToolCallApproval, ToolCallChip, ToolCallStatusHeader, UsageBar, UsageStats, UsageStatsRing, clampPercentage, findMentionToken, findSlashToken, formatPercentage, getChatInlineIconName, splitSealedBlocks, withholdOpenTail } from "../../AIKit-BR6jfsdI.js";
|
|
2
2
|
export { ANSWER_SOURCES_VISIBLE, AnswerActions, AnswerSources, AnswerSummary, AttachmentChip, CONTEXT_CHIP_EXPANDABLE_LENGTH, ChatInlineIcon, ChatNotice, CollapsibleStepHeader, ContextChip, DIAGRAM_LANGUAGES, FileDownloadChip, FileGallery, InlineStepDetail, InlineStepGroup, InlineStepLabel, JumpToLatest, Markdown, MarkdownTable, MessageBubble, ModeChip, PROMPT_INPUT_CONTAINER, PlanApproval, PlanRewritingIndicator, PromptInput, Question, QuestionBlock, SourceChip, SuggestedPrompt, ThinkingIndicator, ToolCallApproval, ToolCallChip, ToolCallStatusHeader, UsageBar, UsageStats, UsageStatsRing, clampPercentage, findMentionToken, findSlashToken, formatPercentage, getChatInlineIconName, splitSealedBlocks, withholdOpenTail };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { BrandEditor, DEFAULT_FALLBACK_FONT, DEFAULT_FONT_OPTIONS, channelsToHex, contrastRatio, hexToChannels, wcagLevel } from "../../BrandEditor-
|
|
1
|
+
import { BrandEditor, DEFAULT_FALLBACK_FONT, DEFAULT_FONT_OPTIONS, channelsToHex, contrastRatio, hexToChannels, wcagLevel } from "../../BrandEditor-D61pzWRq.js";
|
|
2
2
|
export { BrandEditor, DEFAULT_FALLBACK_FONT, DEFAULT_FONT_OPTIONS, channelsToHex, contrastRatio, hexToChannels, wcagLevel };
|
|
@@ -3,7 +3,7 @@ import { mergeRefs } from "../utils/mergeRefs.js";
|
|
|
3
3
|
import { X } from "../../icons-ZIeZXXS7.js";
|
|
4
4
|
import { InputGroup } from "../../InputGroup-CZv_7QlM.js";
|
|
5
5
|
import { useControllableState } from "../../useControllableState-CUYXMsfz.js";
|
|
6
|
-
import { Badge } from "../../Badge-
|
|
6
|
+
import { Badge } from "../../Badge-CqlOE5A2.js";
|
|
7
7
|
import { useRef, useState } from "react";
|
|
8
8
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
9
9
|
//#region src/blocks/ChipEditor/ChipEditor.tsx
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { ColorModeSwitch } from "../../ColorModeSwitch-
|
|
1
|
+
import { ColorModeSwitch } from "../../ColorModeSwitch-BlrH8jAi.js";
|
|
2
2
|
export { ColorModeSwitch };
|