@weasel-js/ui 1.5.2 → 1.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/chunks/ActionBar-CYvfmEz0.js +57 -0
- package/dist/chunks/ActionBar-CYvfmEz0.js.map +1 -0
- package/dist/chunks/{Badge-CW9pBPFl.js → Badge-DZ0lFs14.js} +755 -738
- package/dist/chunks/Badge-DZ0lFs14.js.map +1 -0
- package/dist/chunks/{BandEditor-jY-PFKY6.js → BandEditor-D-nVrVO4.js} +34 -34
- package/dist/chunks/{BandEditor-jY-PFKY6.js.map → BandEditor-D-nVrVO4.js.map} +1 -1
- package/dist/chunks/Button-Dyp31jMt.js +111 -0
- package/dist/chunks/Button-Dyp31jMt.js.map +1 -0
- package/dist/chunks/ButtonBar-smZzFuEo.js +46 -0
- package/dist/chunks/ButtonBar-smZzFuEo.js.map +1 -0
- package/dist/chunks/Callout-xLjnx7Mp.js +119 -0
- package/dist/chunks/Callout-xLjnx7Mp.js.map +1 -0
- package/dist/chunks/{Checkbox-BOsDAY2F.js → Checkbox-ChZz30Ds.js} +1 -1
- package/dist/chunks/{Checkbox-BOsDAY2F.js.map → Checkbox-ChZz30Ds.js.map} +1 -1
- package/dist/chunks/Code-v4tDWuuN.js +24 -0
- package/dist/chunks/Code-v4tDWuuN.js.map +1 -0
- package/dist/chunks/{ColorField-BYzgZM9o.js → ColorField-DJSCuSJv.js} +15 -15
- package/dist/chunks/ColorField-DJSCuSJv.js.map +1 -0
- package/dist/chunks/ColorModeControl-JOEiqtE0.js +47 -0
- package/dist/chunks/ColorModeControl-JOEiqtE0.js.map +1 -0
- package/dist/chunks/{ComboBox-Cz3f0Y_8.js → ComboBox-C1JgIpML.js} +2 -2
- package/dist/chunks/{ComboBox-Cz3f0Y_8.js.map → ComboBox-C1JgIpML.js.map} +1 -1
- package/dist/chunks/{CurveEditor-DXwSP-iA.js → CurveEditor-f1R4kSbD.js} +2 -2
- package/dist/chunks/{CurveEditor-DXwSP-iA.js.map → CurveEditor-f1R4kSbD.js.map} +1 -1
- package/dist/chunks/DataGrid-CZPrB_3a.js +152 -0
- package/dist/chunks/DataGrid-CZPrB_3a.js.map +1 -0
- package/dist/chunks/DetailList-DHaXX4TG.js +43 -0
- package/dist/chunks/DetailList-DHaXX4TG.js.map +1 -0
- package/dist/chunks/{DetentSlider-CAubVX0J.js → DetentSlider-BYyaZha6.js} +2 -2
- package/dist/chunks/{DetentSlider-CAubVX0J.js.map → DetentSlider-BYyaZha6.js.map} +1 -1
- package/dist/chunks/Dialog-GIvjoDQj.js +66 -0
- package/dist/chunks/Dialog-GIvjoDQj.js.map +1 -0
- package/dist/chunks/Disclosure-D79jhmh2.js +58 -0
- package/dist/chunks/Disclosure-D79jhmh2.js.map +1 -0
- package/dist/chunks/DragGhost-DcU7cOwy.js +30 -0
- package/dist/chunks/DragGhost-DcU7cOwy.js.map +1 -0
- package/dist/chunks/{DragHandleGlyph-CppAz4_8.js → DragHandleGlyph-BtBxHjZS.js} +1 -1
- package/dist/chunks/{DragHandleGlyph-CppAz4_8.js.map → DragHandleGlyph-BtBxHjZS.js.map} +1 -1
- package/dist/chunks/{Field-DWnV8WZY.js → Field-xbqRmjsI.js} +1 -1
- package/dist/chunks/{Field-DWnV8WZY.js.map → Field-xbqRmjsI.js.map} +1 -1
- package/dist/chunks/FillStrokeSwatch-BViKXIPx.js +111 -0
- package/dist/chunks/FillStrokeSwatch-BViKXIPx.js.map +1 -0
- package/dist/chunks/{FontFamilySelect-DxfgTC3G.js → FontFamilySelect-r9TV_xIH.js} +2 -2
- package/dist/chunks/{FontFamilySelect-DxfgTC3G.js.map → FontFamilySelect-r9TV_xIH.js.map} +1 -1
- package/dist/chunks/GradientEditor-BRTxHG-W.js +333 -0
- package/dist/chunks/{GradientEditor-rRBmf3G0.js.map → GradientEditor-BRTxHG-W.js.map} +1 -1
- package/dist/chunks/{Icon-DT0x6HaQ.js → Icon-BW0qv_U7.js} +28 -20
- package/dist/chunks/Icon-BW0qv_U7.js.map +1 -0
- package/dist/chunks/InlineRange-BwGFDhpT.js +29 -0
- package/dist/chunks/InlineRange-BwGFDhpT.js.map +1 -0
- package/dist/chunks/{Input-DbMKpkXy.js → Input-Bx2cuUbS.js} +24 -19
- package/dist/chunks/Input-Bx2cuUbS.js.map +1 -0
- package/dist/chunks/ItemList-DzJ2lK0R.js +175 -0
- package/dist/chunks/ItemList-DzJ2lK0R.js.map +1 -0
- package/dist/chunks/ItemList.module-DDUXfuZL.js +14 -0
- package/dist/chunks/ItemList.module-DDUXfuZL.js.map +1 -0
- package/dist/chunks/{Jog-DkkTlL3_.js → Jog-LPoac9s4.js} +6 -6
- package/dist/chunks/{Jog-DkkTlL3_.js.map → Jog-LPoac9s4.js.map} +1 -1
- package/dist/chunks/{Keycaps-DunVpejA.js → Keycaps-CKiKOJnJ.js} +71 -65
- package/dist/chunks/Keycaps-CKiKOJnJ.js.map +1 -0
- package/dist/chunks/LayerList-BeGrkLb9.js +427 -0
- package/dist/chunks/LayerList-BeGrkLb9.js.map +1 -0
- package/dist/chunks/ListEditor-C6zLzCsJ.js +74 -0
- package/dist/chunks/ListEditor-C6zLzCsJ.js.map +1 -0
- package/dist/chunks/MenuButton-BcdhrNGh.js +70 -0
- package/dist/chunks/MenuButton-BcdhrNGh.js.map +1 -0
- package/dist/chunks/MeshEditor-BOOIFWnz.js +87 -0
- package/dist/chunks/MeshEditor-BOOIFWnz.js.map +1 -0
- package/dist/chunks/{NumberField-CCjEDZCg.js → NumberField-C1Y7zP-a.js} +27 -22
- package/dist/chunks/NumberField-C1Y7zP-a.js.map +1 -0
- package/dist/chunks/{OptionsBar-DeQ-vUeZ.js → OptionsBar-DlcagPYK.js} +3 -3
- package/dist/chunks/{OptionsBar-DeQ-vUeZ.js.map → OptionsBar-DlcagPYK.js.map} +1 -1
- package/dist/chunks/{PaintField-jBOJ32rL.js → PaintField-B2mLRZa4.js} +20 -20
- package/dist/chunks/PaintField-B2mLRZa4.js.map +1 -0
- package/dist/chunks/{PaintInput-Qs7Rul5R.js → PaintInput-BFKhd83I.js} +24 -24
- package/dist/chunks/{PaintInput-Qs7Rul5R.js.map → PaintInput-BFKhd83I.js.map} +1 -1
- package/dist/chunks/{PatternPicker-BMpXWboq.js → PatternPicker-DdfpxoQy.js} +2 -2
- package/dist/chunks/{PatternPicker-BMpXWboq.js.map → PatternPicker-DdfpxoQy.js.map} +1 -1
- package/dist/chunks/{Plot2D-CXf_f7QD.js → Plot2D-lyO7waPQ.js} +1 -1
- package/dist/chunks/{Plot2D-CXf_f7QD.js.map → Plot2D-lyO7waPQ.js.map} +1 -1
- package/dist/chunks/{PointPlotter-S_gz7VYt.js → PointPlotter-DGs9i5P-.js} +2 -2
- package/dist/chunks/{PointPlotter-S_gz7VYt.js.map → PointPlotter-DGs9i5P-.js.map} +1 -1
- package/dist/chunks/{Powerline-Ak5AWUlK.js → Powerline-DBEPceLE.js} +4 -2
- package/dist/chunks/Powerline-DBEPceLE.js.map +1 -0
- package/dist/chunks/Prefs-Ctu0H4-b.js +475 -0
- package/dist/chunks/Prefs-Ctu0H4-b.js.map +1 -0
- package/dist/chunks/Properties-Bbneh1ws.js +281 -0
- package/dist/chunks/Properties-Bbneh1ws.js.map +1 -0
- package/dist/chunks/PropertyField-CDb19d3F.js +756 -0
- package/dist/chunks/PropertyField-CDb19d3F.js.map +1 -0
- package/dist/chunks/{RadioGroup-CsVp3SEu.js → RadioGroup-BK2mD6Q0.js} +2 -2
- package/dist/chunks/{RadioGroup-CsVp3SEu.js.map → RadioGroup-BK2mD6Q0.js.map} +1 -1
- package/dist/chunks/{RangeSlider-DNr-pJpZ.js → RangeSlider-BiRAOsTh.js} +1 -1
- package/dist/chunks/{RangeSlider-DNr-pJpZ.js.map → RangeSlider-BiRAOsTh.js.map} +1 -1
- package/dist/chunks/{ResizeHandle-RXFf5fXr.js → ResizeHandle-Cc6EOehs.js} +9 -9
- package/dist/chunks/{ResizeHandle-RXFf5fXr.js.map → ResizeHandle-Cc6EOehs.js.map} +1 -1
- package/dist/chunks/Select-DVValBe1.js +225 -0
- package/dist/chunks/Select-DVValBe1.js.map +1 -0
- package/dist/chunks/{SelectionPanel-CEbLS-0D.js → SelectionPanel-C5LmZA7b.js} +21 -20
- package/dist/chunks/{SelectionPanel-CEbLS-0D.js.map → SelectionPanel-C5LmZA7b.js.map} +1 -1
- package/dist/chunks/{Sidebar-qn_oSCNX.js → Sidebar-DKKd4R-x.js} +1 -1
- package/dist/chunks/{Sidebar-qn_oSCNX.js.map → Sidebar-DKKd4R-x.js.map} +1 -1
- package/dist/chunks/{SidebarPanel-Bs6V21hg.js → SidebarPanel-u5NsuAZY.js} +15 -19
- package/dist/chunks/SidebarPanel-u5NsuAZY.js.map +1 -0
- package/dist/chunks/{Slider-CIIrqiFS.js → Slider-BwRrWHFW.js} +42 -42
- package/dist/chunks/{Slider-CIIrqiFS.js.map → Slider-BwRrWHFW.js.map} +1 -1
- package/dist/chunks/{StatusBar-B4L15DSm.js → StatusBar-CdPdmmda.js} +1 -1
- package/dist/chunks/{StatusBar-B4L15DSm.js.map → StatusBar-CdPdmmda.js.map} +1 -1
- package/dist/chunks/SwatchGrid-C-Zx2Exd.js +73 -0
- package/dist/chunks/SwatchGrid-C-Zx2Exd.js.map +1 -0
- package/dist/chunks/{Switch-DH5POG0T.js → Switch-DxF7TsEu.js} +1 -1
- package/dist/chunks/{Switch-DH5POG0T.js.map → Switch-DxF7TsEu.js.map} +1 -1
- package/dist/chunks/{Tabs-BFHikpml.js → Tabs-GXEfoe3o.js} +1 -1
- package/dist/chunks/{Tabs-BFHikpml.js.map → Tabs-GXEfoe3o.js.map} +1 -1
- package/dist/chunks/{Timeline-DNKY_yiK.js → Timeline-SgmpQtUV.js} +128 -132
- package/dist/chunks/Timeline-SgmpQtUV.js.map +1 -0
- package/dist/chunks/{Toast-CI1UDuK6.js → Toast-BfcljZz6.js} +1 -1
- package/dist/chunks/{Toast-CI1UDuK6.js.map → Toast-BfcljZz6.js.map} +1 -1
- package/dist/chunks/ToggleBar-Btnl5r7F.js +80 -0
- package/dist/chunks/{ToggleBar-CClus5Cd.js.map → ToggleBar-Btnl5r7F.js.map} +1 -1
- package/dist/chunks/{TokenPanel-BPHq24dc.js → TokenPanel-5ajHEHha.js} +40 -40
- package/dist/chunks/{TokenPanel-BPHq24dc.js.map → TokenPanel-5ajHEHha.js.map} +1 -1
- package/dist/chunks/{ToolButton-9QzJCmuM.js → ToolButton-rzqlFlAc.js} +4 -4
- package/dist/chunks/{ToolButton-9QzJCmuM.js.map → ToolButton-rzqlFlAc.js.map} +1 -1
- package/dist/chunks/{ToolGroup-BJiDrH_i.js → ToolGroup-4bUBV5k6.js} +1 -1
- package/dist/chunks/{ToolGroup-BJiDrH_i.js.map → ToolGroup-4bUBV5k6.js.map} +1 -1
- package/dist/chunks/{ToolOptionsBar-CAM6RcUH.js → ToolOptionsBar-BF3TNXA3.js} +2 -2
- package/dist/chunks/{ToolOptionsBar-CAM6RcUH.js.map → ToolOptionsBar-BF3TNXA3.js.map} +1 -1
- package/dist/chunks/ToolPalette-Uw4PvWwa.js +83 -0
- package/dist/chunks/ToolPalette-Uw4PvWwa.js.map +1 -0
- package/dist/chunks/{Tooltip-C4YBczLq.js → Tooltip-9XiJF937.js} +13 -13
- package/dist/chunks/Tooltip-9XiJF937.js.map +1 -0
- package/dist/chunks/Tree-BGt6P8tI.js +203 -0
- package/dist/chunks/Tree-BGt6P8tI.js.map +1 -0
- package/dist/chunks/{createKeyframeLayer-DKtO0Sw_.js → createKeyframeLayer-BzDRCrrh.js} +71 -71
- package/dist/chunks/{createKeyframeLayer-DKtO0Sw_.js.map → createKeyframeLayer-BzDRCrrh.js.map} +1 -1
- package/dist/chunks/formatShortcut-BoGqUoWi.js +15 -0
- package/dist/chunks/formatShortcut-BoGqUoWi.js.map +1 -0
- package/dist/chunks/icons-DbScMMqX.js +179 -0
- package/dist/chunks/icons-DbScMMqX.js.map +1 -0
- package/dist/chunks/interactiveTarget-C7QUBaJN.js +24 -0
- package/dist/chunks/interactiveTarget-C7QUBaJN.js.map +1 -0
- package/dist/chunks/{keyGlyph-Bp0wnLHn.js → keyGlyph-CLvUHU8c.js} +1 -1
- package/dist/chunks/{keyGlyph-Bp0wnLHn.js.map → keyGlyph-CLvUHU8c.js.map} +1 -1
- package/dist/chunks/model-BQMvTLnW.js +360 -0
- package/dist/chunks/model-BQMvTLnW.js.map +1 -0
- package/dist/chunks/{number-BHz66zQO.js → number-6S8IzXVt.js} +3 -3
- package/dist/chunks/number-6S8IzXVt.js.map +1 -0
- package/dist/chunks/paintPreview-DPtZS4yU.js +42 -0
- package/dist/chunks/paintPreview-DPtZS4yU.js.map +1 -0
- package/dist/chunks/paintValue-Bz6AVuh3.js +18 -0
- package/dist/chunks/paintValue-Bz6AVuh3.js.map +1 -0
- package/dist/chunks/prefField-CLkhrvYl.js +197 -0
- package/dist/chunks/prefField-CLkhrvYl.js.map +1 -0
- package/dist/chunks/segmentTooltip-CAkZlW-t.js +29 -0
- package/dist/chunks/segmentTooltip-CAkZlW-t.js.map +1 -0
- package/dist/chunks/segmentedControl.module-D2nw68Yo.js +11 -0
- package/dist/chunks/segmentedControl.module-D2nw68Yo.js.map +1 -0
- package/dist/chunks/{snap-CEjuWOhN.js → snap-DC4Km8xG.js} +1 -1
- package/dist/chunks/{snap-CEjuWOhN.js.map → snap-DC4Km8xG.js.map} +1 -1
- package/dist/chunks/stance-CarrcbbP.js +17 -0
- package/dist/chunks/stance-CarrcbbP.js.map +1 -0
- package/dist/chunks/useReorderDragList-Dcezzgix.js +131 -0
- package/dist/chunks/useReorderDragList-Dcezzgix.js.map +1 -0
- package/dist/chunks/{useRovingTabIndex-Dkpf_KhN.js → useRovingTabIndex-B4uJqiKP.js} +1 -1
- package/dist/chunks/useRovingTabIndex-B4uJqiKP.js.map +1 -0
- package/dist/color/ramp.d.ts +38 -0
- package/dist/color/ramp.d.ts.map +1 -0
- package/dist/components/ActionBar/ActionBar.d.ts +6 -4
- package/dist/components/ActionBar/ActionBar.d.ts.map +1 -1
- package/dist/components/ActionBar/index.js +1 -1
- package/dist/components/Badge/Badge.d.ts +21 -7
- package/dist/components/Badge/Badge.d.ts.map +1 -1
- package/dist/components/Badge/effects/Aqua.d.ts +1 -1
- package/dist/components/Badge/effects/Aqua.d.ts.map +1 -1
- package/dist/components/Badge/index.d.ts +1 -1
- package/dist/components/Badge/index.d.ts.map +1 -1
- package/dist/components/Badge/index.js +1 -1
- package/dist/components/Badge/types.d.ts +6 -5
- package/dist/components/Badge/types.d.ts.map +1 -1
- package/dist/components/BandEditor/index.js +1 -1
- package/dist/components/Button/Button.d.ts +17 -3
- package/dist/components/Button/Button.d.ts.map +1 -1
- package/dist/components/Button/index.d.ts +1 -1
- package/dist/components/Button/index.d.ts.map +1 -1
- package/dist/components/Button/index.js +1 -1
- package/dist/components/ButtonBar/ButtonBar.d.ts +36 -0
- package/dist/components/ButtonBar/ButtonBar.d.ts.map +1 -0
- package/dist/components/ButtonBar/index.d.ts +3 -0
- package/dist/components/ButtonBar/index.d.ts.map +1 -0
- package/dist/components/ButtonBar/index.js +2 -0
- package/dist/components/Callout/Callout.d.ts +2 -5
- package/dist/components/Callout/Callout.d.ts.map +1 -1
- package/dist/components/Callout/index.d.ts +1 -1
- package/dist/components/Callout/index.d.ts.map +1 -1
- package/dist/components/Callout/index.js +1 -1
- package/dist/components/Checkbox/index.js +1 -1
- package/dist/components/Code/Code.d.ts +28 -0
- package/dist/components/Code/Code.d.ts.map +1 -0
- package/dist/components/Code/index.d.ts +3 -0
- package/dist/components/Code/index.d.ts.map +1 -0
- package/dist/components/Code/index.js +2 -0
- package/dist/components/ColorField/index.js +1 -1
- package/dist/components/ColorModeControl/ColorModeControl.d.ts +21 -0
- package/dist/components/ColorModeControl/ColorModeControl.d.ts.map +1 -0
- package/dist/components/ColorModeControl/index.d.ts +3 -0
- package/dist/components/ColorModeControl/index.d.ts.map +1 -0
- package/dist/components/ColorModeControl/index.js +2 -0
- package/dist/components/ComboBox/index.js +1 -1
- package/dist/components/CurveEditor/index.js +3 -3
- package/dist/components/DataGrid/DataGrid.d.ts +22 -0
- package/dist/components/DataGrid/DataGrid.d.ts.map +1 -1
- package/dist/components/DataGrid/index.js +1 -1
- package/dist/components/DetailList/DetailList.d.ts +36 -0
- package/dist/components/DetailList/DetailList.d.ts.map +1 -0
- package/dist/components/DetailList/index.d.ts +3 -0
- package/dist/components/DetailList/index.d.ts.map +1 -0
- package/dist/components/DetailList/index.js +2 -0
- package/dist/components/DetentSlider/index.js +1 -1
- package/dist/components/Dialog/Dialog.d.ts +8 -2
- package/dist/components/Dialog/Dialog.d.ts.map +1 -1
- package/dist/components/Dialog/index.js +1 -1
- package/dist/components/Disclosure/Disclosure.d.ts +25 -17
- package/dist/components/Disclosure/Disclosure.d.ts.map +1 -1
- package/dist/components/Disclosure/index.d.ts +2 -2
- package/dist/components/Disclosure/index.d.ts.map +1 -1
- package/dist/components/Disclosure/index.js +2 -2
- package/dist/components/DragGhost/DragGhost.d.ts +21 -0
- package/dist/components/DragGhost/DragGhost.d.ts.map +1 -0
- package/dist/components/DragGhost/index.d.ts +3 -0
- package/dist/components/DragGhost/index.d.ts.map +1 -0
- package/dist/components/DragGhost/index.js +2 -0
- package/dist/components/DragHandleGlyph/index.js +1 -1
- package/dist/components/Field/index.js +1 -1
- package/dist/components/FillStrokeSwatch/FillStrokeSwatch.d.ts +45 -0
- package/dist/components/FillStrokeSwatch/FillStrokeSwatch.d.ts.map +1 -0
- package/dist/components/FillStrokeSwatch/index.d.ts +3 -0
- package/dist/components/FillStrokeSwatch/index.d.ts.map +1 -0
- package/dist/components/FillStrokeSwatch/index.js +2 -0
- package/dist/components/FontFamilySelect/index.js +1 -1
- package/dist/components/GradientEditor/SceneGradientHandles.d.ts.map +1 -1
- package/dist/components/GradientEditor/index.js +1 -1
- package/dist/components/InlineRange/InlineRange.d.ts +6 -2
- package/dist/components/InlineRange/InlineRange.d.ts.map +1 -1
- package/dist/components/InlineRange/index.js +1 -1
- package/dist/components/Input/Input.d.ts +13 -0
- package/dist/components/Input/Input.d.ts.map +1 -1
- package/dist/components/Input/index.js +1 -1
- package/dist/components/ItemList/ItemList.d.ts +70 -10
- package/dist/components/ItemList/ItemList.d.ts.map +1 -1
- package/dist/components/ItemList/index.js +1 -1
- package/dist/components/Jog/index.js +1 -1
- package/dist/components/Keycaps/index.d.ts +1 -0
- package/dist/components/Keycaps/index.d.ts.map +1 -1
- package/dist/components/Keycaps/index.js +3 -3
- package/dist/components/Keycaps/keySpecsFromMods.d.ts +2 -0
- package/dist/components/Keycaps/keySpecsFromMods.d.ts.map +1 -1
- package/dist/components/Keycaps/keySpecsFromShortcut.d.ts +16 -0
- package/dist/components/Keycaps/keySpecsFromShortcut.d.ts.map +1 -0
- package/dist/components/LayerList/LayerList.d.ts +79 -0
- package/dist/components/LayerList/LayerList.d.ts.map +1 -0
- package/dist/components/LayerList/index.d.ts +3 -0
- package/dist/components/LayerList/index.d.ts.map +1 -0
- package/dist/components/LayerList/index.js +2 -0
- package/dist/components/LayerList/useSceneLayerList.d.ts +20 -0
- package/dist/components/LayerList/useSceneLayerList.d.ts.map +1 -0
- package/dist/components/ListEditor/ListEditor.d.ts +23 -0
- package/dist/components/ListEditor/ListEditor.d.ts.map +1 -0
- package/dist/components/ListEditor/index.d.ts +3 -0
- package/dist/components/ListEditor/index.d.ts.map +1 -0
- package/dist/components/ListEditor/index.js +2 -0
- package/dist/components/MenuButton/MenuButton.d.ts +6 -2
- package/dist/components/MenuButton/MenuButton.d.ts.map +1 -1
- package/dist/components/MenuButton/index.js +1 -1
- package/dist/components/MeshEditor/index.js +1 -1
- package/dist/components/NumberField/NumberField.d.ts +13 -0
- package/dist/components/NumberField/NumberField.d.ts.map +1 -1
- package/dist/components/NumberField/index.js +1 -1
- package/dist/components/OptionsBar/index.js +1 -1
- package/dist/components/PaintField/index.js +1 -1
- package/dist/components/PaintInput/index.js +1 -1
- package/dist/components/PatternPicker/index.js +1 -1
- package/dist/components/Plot2D/index.js +1 -1
- package/dist/components/PointPlotter/index.js +1 -1
- package/dist/components/Powerline/Powerline.d.ts +4 -3
- package/dist/components/Powerline/Powerline.d.ts.map +1 -1
- package/dist/components/Powerline/index.js +2 -2
- package/dist/components/Prefs/PrefsDialog.d.ts +10 -2
- package/dist/components/Prefs/PrefsDialog.d.ts.map +1 -1
- package/dist/components/Prefs/PrefsForm.d.ts +26 -25
- package/dist/components/Prefs/PrefsForm.d.ts.map +1 -1
- package/dist/components/Prefs/PrefsPane.d.ts +24 -0
- package/dist/components/Prefs/PrefsPane.d.ts.map +1 -0
- package/dist/components/Prefs/PrefsRail.d.ts +32 -0
- package/dist/components/Prefs/PrefsRail.d.ts.map +1 -0
- package/dist/components/Prefs/PrefsRow.d.ts +32 -0
- package/dist/components/Prefs/PrefsRow.d.ts.map +1 -0
- package/dist/components/Prefs/index.d.ts +5 -2
- package/dist/components/Prefs/index.d.ts.map +1 -1
- package/dist/components/Prefs/index.js +3 -3
- package/dist/components/Prefs/prefField.d.ts +36 -0
- package/dist/components/Prefs/prefField.d.ts.map +1 -0
- package/dist/components/Prefs/schema.d.ts +30 -0
- package/dist/components/Prefs/schema.d.ts.map +1 -1
- package/dist/components/Properties/DialogRow.d.ts +33 -0
- package/dist/components/Properties/DialogRow.d.ts.map +1 -0
- package/dist/components/Properties/PropertyField.d.ts +238 -0
- package/dist/components/Properties/PropertyField.d.ts.map +1 -0
- package/dist/components/Properties/PropertyGroup.d.ts +12 -3
- package/dist/components/Properties/PropertyGroup.d.ts.map +1 -1
- package/dist/components/Properties/PropertyPanel.d.ts +32 -236
- package/dist/components/Properties/PropertyPanel.d.ts.map +1 -1
- package/dist/components/Properties/Subpanel.d.ts +14 -0
- package/dist/components/Properties/Subpanel.d.ts.map +1 -0
- package/dist/components/Properties/index.d.ts +8 -4
- package/dist/components/Properties/index.d.ts.map +1 -1
- package/dist/components/Properties/index.js +3 -2
- package/dist/components/Properties/storyLayouts.d.ts.map +1 -1
- package/dist/components/RadioGroup/index.js +1 -1
- package/dist/components/RangeSlider/index.js +1 -1
- package/dist/components/ResizeHandle/index.js +1 -1
- package/dist/components/Select/Select.d.ts +38 -5
- package/dist/components/Select/Select.d.ts.map +1 -1
- package/dist/components/Select/index.d.ts +2 -2
- package/dist/components/Select/index.d.ts.map +1 -1
- package/dist/components/Select/index.js +2 -2
- package/dist/components/SelectionPanel/index.js +2 -2
- package/dist/components/SelectionPanel/renderLeaf.d.ts +14 -8
- package/dist/components/SelectionPanel/renderLeaf.d.ts.map +1 -1
- package/dist/components/Sidebar/index.js +1 -1
- package/dist/components/SidebarPanel/SidebarPanel.d.ts +2 -2
- package/dist/components/SidebarPanel/SidebarPanel.d.ts.map +1 -1
- package/dist/components/SidebarPanel/index.js +1 -1
- package/dist/components/Slider/index.js +1 -1
- package/dist/components/StatusBar/index.js +1 -1
- package/dist/components/SwatchGrid/SwatchGrid.d.ts +34 -0
- package/dist/components/SwatchGrid/SwatchGrid.d.ts.map +1 -0
- package/dist/components/SwatchGrid/index.d.ts +3 -0
- package/dist/components/SwatchGrid/index.d.ts.map +1 -0
- package/dist/components/SwatchGrid/index.js +2 -0
- package/dist/components/Switch/index.js +1 -1
- package/dist/components/Tabs/index.js +1 -1
- package/dist/components/Timeline/Lane.d.ts.map +1 -1
- package/dist/components/Timeline/index.js +1 -1
- package/dist/components/Toast/index.js +1 -1
- package/dist/components/ToggleBar/ToggleBar.d.ts +2 -1
- package/dist/components/ToggleBar/ToggleBar.d.ts.map +1 -1
- package/dist/components/ToggleBar/index.js +1 -1
- package/dist/components/TokenPanel/index.js +1 -1
- package/dist/components/ToolButton/index.js +1 -1
- package/dist/components/ToolGroup/index.js +1 -1
- package/dist/components/ToolOptionsBar/index.js +1 -1
- package/dist/components/ToolPalette/index.d.ts +1 -0
- package/dist/components/ToolPalette/index.d.ts.map +1 -1
- package/dist/components/ToolPalette/index.js +3 -2
- package/dist/components/Tooltip/Tooltip.d.ts +6 -2
- package/dist/components/Tooltip/Tooltip.d.ts.map +1 -1
- package/dist/components/Tooltip/index.d.ts +1 -1
- package/dist/components/Tooltip/index.d.ts.map +1 -1
- package/dist/components/Tooltip/index.js +2 -2
- package/dist/components/Tree/Tree.d.ts +84 -0
- package/dist/components/Tree/Tree.d.ts.map +1 -0
- package/dist/components/Tree/index.d.ts +3 -0
- package/dist/components/Tree/index.d.ts.map +1 -0
- package/dist/components/Tree/index.js +2 -0
- package/dist/components/segmentTooltip.d.ts +30 -0
- package/dist/components/segmentTooltip.d.ts.map +1 -0
- package/dist/components/stance.d.ts +30 -0
- package/dist/components/stance.d.ts.map +1 -0
- package/dist/components/stanceCss.d.ts +31 -0
- package/dist/components/stanceCss.d.ts.map +1 -0
- package/dist/components/stanceSurfaces.d.ts +4 -0
- package/dist/components/stanceSurfaces.d.ts.map +1 -0
- package/dist/format/number.d.ts +3 -2
- package/dist/format/number.d.ts.map +1 -1
- package/dist/icons/Icon.d.ts.map +1 -1
- package/dist/icons/ShapeKindIcon.d.ts +10 -0
- package/dist/icons/ShapeKindIcon.d.ts.map +1 -0
- package/dist/icons/index.d.ts +5 -3
- package/dist/icons/index.d.ts.map +1 -1
- package/dist/icons/paths.d.ts +2 -0
- package/dist/icons/paths.d.ts.map +1 -1
- package/dist/index.d.ts +16 -3
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +110 -78
- package/dist/index.js.map +1 -1
- package/dist/interactiveTarget.d.ts +9 -0
- package/dist/interactiveTarget.d.ts.map +1 -0
- package/dist/style.css +1 -1
- package/dist/useReorderDragList.d.ts +36 -7
- package/dist/useReorderDragList.d.ts.map +1 -1
- package/dist/useRovingTabIndex.d.ts +1 -1
- package/dist/useScrollSpy.d.ts +48 -0
- package/dist/useScrollSpy.d.ts.map +1 -0
- package/package.json +8 -8
- package/dist/chunks/ActionBar-CLwiY3Jg.js +0 -62
- package/dist/chunks/ActionBar-CLwiY3Jg.js.map +0 -1
- package/dist/chunks/ActionsBar-D84a4eGy.js +0 -41
- package/dist/chunks/ActionsBar-D84a4eGy.js.map +0 -1
- package/dist/chunks/Badge-CW9pBPFl.js.map +0 -1
- package/dist/chunks/Button-DRSApvnK.js +0 -90
- package/dist/chunks/Button-DRSApvnK.js.map +0 -1
- package/dist/chunks/Callout-DrNu-9Qr.js +0 -122
- package/dist/chunks/Callout-DrNu-9Qr.js.map +0 -1
- package/dist/chunks/ColorField-BYzgZM9o.js.map +0 -1
- package/dist/chunks/DataGrid-C8KrYtw7.js +0 -104
- package/dist/chunks/DataGrid-C8KrYtw7.js.map +0 -1
- package/dist/chunks/Dialog-fGqqQ6o_.js +0 -61
- package/dist/chunks/Dialog-fGqqQ6o_.js.map +0 -1
- package/dist/chunks/Disclosure-CILDfWsU.js +0 -47
- package/dist/chunks/Disclosure-CILDfWsU.js.map +0 -1
- package/dist/chunks/GradientEditor-rRBmf3G0.js +0 -333
- package/dist/chunks/Icon-DT0x6HaQ.js.map +0 -1
- package/dist/chunks/InlineRange-DdIlfGqG.js +0 -29
- package/dist/chunks/InlineRange-DdIlfGqG.js.map +0 -1
- package/dist/chunks/Input-DbMKpkXy.js.map +0 -1
- package/dist/chunks/ItemList-B9zYb0GE.js +0 -42
- package/dist/chunks/ItemList-B9zYb0GE.js.map +0 -1
- package/dist/chunks/Keycaps-DunVpejA.js.map +0 -1
- package/dist/chunks/LayerStack-CfQ6GsRz.js +0 -142
- package/dist/chunks/LayerStack-CfQ6GsRz.js.map +0 -1
- package/dist/chunks/MenuButton-C_4nox39.js +0 -60
- package/dist/chunks/MenuButton-C_4nox39.js.map +0 -1
- package/dist/chunks/MeshEditor-Bipz-Ocl.js +0 -123
- package/dist/chunks/MeshEditor-Bipz-Ocl.js.map +0 -1
- package/dist/chunks/NumberField-CCjEDZCg.js.map +0 -1
- package/dist/chunks/PaintField-jBOJ32rL.js.map +0 -1
- package/dist/chunks/Powerline-Ak5AWUlK.js.map +0 -1
- package/dist/chunks/Prefs-CNC8tzyN.js +0 -308
- package/dist/chunks/Prefs-CNC8tzyN.js.map +0 -1
- package/dist/chunks/Properties-Rnb6TAbN.js +0 -891
- package/dist/chunks/Properties-Rnb6TAbN.js.map +0 -1
- package/dist/chunks/Select-BEope086.js +0 -190
- package/dist/chunks/Select-BEope086.js.map +0 -1
- package/dist/chunks/SidebarPanel-Bs6V21hg.js.map +0 -1
- package/dist/chunks/Timeline-DNKY_yiK.js.map +0 -1
- package/dist/chunks/ToggleBar-CClus5Cd.js +0 -75
- package/dist/chunks/ToolPalette-DGkKwE7D.js +0 -97
- package/dist/chunks/ToolPalette-DGkKwE7D.js.map +0 -1
- package/dist/chunks/Tooltip-C4YBczLq.js.map +0 -1
- package/dist/chunks/icons-DFLytcui.js +0 -165
- package/dist/chunks/icons-DFLytcui.js.map +0 -1
- package/dist/chunks/model-13kZ_-mE.js +0 -483
- package/dist/chunks/model-13kZ_-mE.js.map +0 -1
- package/dist/chunks/number-BHz66zQO.js.map +0 -1
- package/dist/chunks/range.module-DSsOIq1R.js +0 -8
- package/dist/chunks/range.module-DSsOIq1R.js.map +0 -1
- package/dist/chunks/schema-Dft4Cu2p.js +0 -47
- package/dist/chunks/schema-Dft4Cu2p.js.map +0 -1
- package/dist/chunks/segmentedControl.module-DS72X1ns.js +0 -11
- package/dist/chunks/segmentedControl.module-DS72X1ns.js.map +0 -1
- package/dist/chunks/useReorderDragList-CSQGd7zQ.js +0 -102
- package/dist/chunks/useReorderDragList-CSQGd7zQ.js.map +0 -1
- package/dist/chunks/useRovingTabIndex-Dkpf_KhN.js.map +0 -1
- package/dist/components/ActionsBar/ActionsBar.d.ts +0 -35
- package/dist/components/ActionsBar/ActionsBar.d.ts.map +0 -1
- package/dist/components/ActionsBar/index.d.ts +0 -3
- package/dist/components/ActionsBar/index.d.ts.map +0 -1
- package/dist/components/ActionsBar/index.js +0 -2
- package/dist/components/LayerStack/LayerStack.d.ts +0 -62
- package/dist/components/LayerStack/LayerStack.d.ts.map +0 -1
- package/dist/components/LayerStack/index.d.ts +0 -2
- package/dist/components/LayerStack/index.d.ts.map +0 -1
- package/dist/components/LayerStack/index.js +0 -2
- package/dist/components/Properties/EffectCard.d.ts +0 -69
- package/dist/components/Properties/EffectCard.d.ts.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CurveEditor-DXwSP-iA.js","names":[],"sources":["../../src/components/CurveEditor/catmullRom.ts","../../src/components/CurveEditor/monotone.ts","../../src/components/CurveEditor/interpolation.ts","../../src/components/CurveEditor/createFunctionLayer.tsx","../../src/components/CurveEditor/CurveEditor.tsx","../../src/components/CurveEditor/setCurveOp.ts"],"sourcesContent":["/**\n * Catmull-Rom spline sampling, parameterized by α.\n *\n * α = 0 → uniform parameterization (original Catmull-Rom). Fast, can\n * produce cusps and self-intersections at sharp 2D angles.\n * α = 0.5 → centripetal (Yuksel/Schneider 2011). No cusps, no\n * self-intersection. The \"safe default\" for 2D.\n * α = 1 → chordal. Smoother than uniform, different artifacts.\n *\n * `sampleCurve(...)` is the convenience alias for centripetal (α=0.5).\n */\n\nexport interface Point {\n x: number;\n y: number;\n}\n\nfunction knot(a: Point, b: Point, alpha: number): number {\n const dx = b.x - a.x;\n const dy = b.y - a.y;\n return Math.pow(Math.sqrt(dx * dx + dy * dy), alpha);\n}\n\n/**\n * Sample the Catmull-Rom segment between p1 and p2 at parameter\n * t ∈ [0, 1]. p0 and p3 are the surrounding control points (use phantom\n * reflection at endpoints — see sampleCatmullRom below).\n *\n * Returns p1 at t=0 and p2 at t=1. `alpha` controls parameterization.\n */\nexport function segmentSampleAt(\n p0: Point, p1: Point, p2: Point, p3: Point, t: number,\n alpha: number = 0.5,\n): Point {\n const t0 = 0;\n const t1 = t0 + knot(p0, p1, alpha);\n const t2 = t1 + knot(p1, p2, alpha);\n const t3 = t2 + knot(p2, p3, alpha);\n\n // Degenerate: coincident p1/p2 → linear interpolation fallback.\n if (t2 - t1 === 0) {\n return { x: p1.x + (p2.x - p1.x) * t, y: p1.y + (p2.y - p1.y) * t };\n }\n\n const u = t1 + t * (t2 - t1);\n\n const a1x = ((t1 - u) * p0.x + (u - t0) * p1.x) / (t1 - t0);\n const a1y = ((t1 - u) * p0.y + (u - t0) * p1.y) / (t1 - t0);\n const a2x = ((t2 - u) * p1.x + (u - t1) * p2.x) / (t2 - t1);\n const a2y = ((t2 - u) * p1.y + (u - t1) * p2.y) / (t2 - t1);\n const a3x = ((t3 - u) * p2.x + (u - t2) * p3.x) / (t3 - t2);\n const a3y = ((t3 - u) * p2.y + (u - t2) * p3.y) / (t3 - t2);\n\n const b1x = ((t2 - u) * a1x + (u - t0) * a2x) / (t2 - t0);\n const b1y = ((t2 - u) * a1y + (u - t0) * a2y) / (t2 - t0);\n const b2x = ((t3 - u) * a2x + (u - t1) * a3x) / (t3 - t1);\n const b2y = ((t3 - u) * a2y + (u - t1) * a3y) / (t3 - t1);\n\n const cx = ((t2 - u) * b1x + (u - t1) * b2x) / (t2 - t1);\n const cy = ((t2 - u) * b1y + (u - t1) * b2y) / (t2 - t1);\n return { x: cx, y: cy };\n}\n\n/**\n * Sample the whole curve through `anchors` using Catmull-Rom with the\n * given α. Returns `(n-1) * samplesPerSegment + 1` points. Phantom\n * endpoints by reflection so the first/last segments are tangent to\n * the chord into/out of the endpoints. Returns `[]` for fewer than 2\n * anchors.\n */\nexport function sampleCatmullRom(\n anchors: readonly Point[],\n samplesPerSegment: number,\n alpha: number = 0.5,\n): Point[] {\n if (anchors.length < 2) return [];\n if (samplesPerSegment < 1) samplesPerSegment = 1;\n\n const n = anchors.length;\n const out: Point[] = [];\n\n const reflectStart: Point = {\n x: 2 * anchors[0].x - anchors[1].x,\n y: 2 * anchors[0].y - anchors[1].y,\n };\n const reflectEnd: Point = {\n x: 2 * anchors[n - 1].x - anchors[n - 2].x,\n y: 2 * anchors[n - 1].y - anchors[n - 2].y,\n };\n\n for (let i = 0; i < n - 1; i++) {\n const p0 = i === 0 ? reflectStart : anchors[i - 1];\n const p1 = anchors[i];\n const p2 = anchors[i + 1];\n const p3 = i + 2 < n ? anchors[i + 2] : reflectEnd;\n const tStart = i === 0 ? 0 : 1;\n for (let s = tStart; s <= samplesPerSegment; s++) {\n if (s === 0) {\n out.push(p1);\n continue;\n }\n if (s === samplesPerSegment) {\n out.push(p2);\n continue;\n }\n const t = s / samplesPerSegment;\n out.push(segmentSampleAt(p0, p1, p2, p3, t, alpha));\n }\n }\n return out;\n}\n\n/** Convenience alias for centripetal Catmull-Rom (α=0.5). The most\n * common choice; safe default for 2D paths. */\nexport function sampleCurve(\n anchors: readonly Point[],\n samplesPerSegment: number,\n): Point[] {\n return sampleCatmullRom(anchors, samplesPerSegment, 0.5);\n}\n","/**\n * Monotone cubic interpolation (Fritsch-Carlson / Steffen variant).\n *\n * Passes through every anchor and guarantees the curve never\n * overshoots `min(neighbors)` / `max(neighbors)` along either axis.\n * The right choice for animation timing curves (no anticipation) or\n * audio envelopes (no out-of-range values).\n *\n * Parameterized by index — works for both 1D (function-shaped) and\n * 2D (parametric) anchor sequences. The x and y coordinates are\n * interpolated independently as functions of the anchor index.\n *\n * Reference: Fritsch & Carlson 1980, \"Monotone piecewise cubic\n * interpolation.\" Steffen's 1990 refinement is conceptually the same;\n * we use a min-clamp variant that's monotonicity-preserving by\n * construction.\n */\n\nimport type { Point } from './catmullRom';\n\n/** Per-axis tangent computation for a 1D series of y-values sampled at\n * unit intervals (index-parameterized). Returns one tangent per\n * anchor. */\nfunction tangents(ys: readonly number[]): number[] {\n const n = ys.length;\n if (n === 0) return [];\n if (n === 1) return [0];\n\n // Secant slopes (dx = 1 in index parameterization).\n const m: number[] = new Array(n - 1);\n for (let i = 0; i < n - 1; i++) m[i] = ys[i + 1] - ys[i];\n\n const t: number[] = new Array(n);\n t[0] = m[0];\n t[n - 1] = m[n - 2];\n\n for (let i = 1; i < n - 1; i++) {\n if (m[i - 1] * m[i] <= 0) {\n // Sign change or flat → local extremum; tangent is zero (forces\n // the curve to settle without overshoot).\n t[i] = 0;\n } else {\n // Weighted average of adjacent secants (with dx_i = dx_{i-1} = 1,\n // this is just the arithmetic mean). Clamped by Steffen's rule\n // so the cubic stays monotone within each segment.\n const avg = (m[i - 1] + m[i]) / 2;\n const mag = Math.min(Math.abs(m[i - 1]), Math.abs(m[i]), Math.abs(avg));\n t[i] = Math.sign(avg) * mag;\n }\n }\n return t;\n}\n\n/** Cubic Hermite basis at parameter t ∈ [0, 1] given endpoint values\n * p0, p1 and endpoint tangents m0, m1. */\nfunction hermite(\n p0: number, p1: number, m0: number, m1: number, t: number,\n): number {\n const t2 = t * t;\n const t3 = t2 * t;\n return (\n (2 * t3 - 3 * t2 + 1) * p0 +\n (t3 - 2 * t2 + t) * m0 +\n (-2 * t3 + 3 * t2) * p1 +\n (t3 - t2) * m1\n );\n}\n\n/**\n * Sample the monotone-cubic curve through `anchors`. Returns\n * `(n-1) * samplesPerSegment + 1` points (same shape as\n * `sampleCatmullRom`). `[]` for fewer than 2 anchors.\n */\nexport function sampleMonotone(\n anchors: readonly Point[],\n samplesPerSegment: number,\n): Point[] {\n if (anchors.length < 2) return [];\n if (samplesPerSegment < 1) samplesPerSegment = 1;\n\n const n = anchors.length;\n const xs = anchors.map((a) => a.x);\n const ys = anchors.map((a) => a.y);\n const tx = tangents(xs);\n const ty = tangents(ys);\n\n const out: Point[] = [];\n for (let i = 0; i < n - 1; i++) {\n const startStep = i === 0 ? 0 : 1; // skip duplicate boundary\n for (let s = startStep; s <= samplesPerSegment; s++) {\n if (s === 0) { out.push(anchors[i]); continue; }\n if (s === samplesPerSegment) { out.push(anchors[i + 1]); continue; }\n const t = s / samplesPerSegment;\n out.push({\n x: hermite(xs[i], xs[i + 1], tx[i], tx[i + 1], t),\n y: hermite(ys[i], ys[i + 1], ty[i], ty[i + 1], t),\n });\n }\n }\n return out;\n}\n","/**\n * Interpolation mode dispatcher for CurveEditor. The vocabulary of\n * supported algorithms and the unified `sample(...)` entry point that\n * picks the right one. All algorithms produce\n * `(n-1) * samplesPerSegment + 1` points and pass through every\n * anchor — CurveEditor is strictly interpolating, never approximating.\n */\n\nimport { sampleCatmullRom, type Point } from './catmullRom';\nimport { sampleMonotone } from './monotone';\n\n/** Supported interpolation modes. All are interpolating (pass through\n * every anchor); the differences are in tangent computation and\n * parameterization. */\nexport type InterpolationMode =\n | 'linear'\n | 'catmull-rom' // centripetal (α=0.5) — safe default\n | 'catmull-rom-uniform' // α=0; can cusp on sharp 2D angles\n | 'catmull-rom-chordal' // α=1; smoother than uniform\n | 'monotone'; // Fritsch-Carlson / Steffen; no overshoot\n\n/** Sample anchors as a polyline. Produces the same sample count shape\n * as the Catmull-Rom variants so downstream segment-slicing logic\n * (hit testing, fill path construction) works uniformly. */\nfunction sampleLinear(\n anchors: readonly Point[],\n samplesPerSegment: number,\n): Point[] {\n if (anchors.length < 2) return [];\n if (samplesPerSegment < 1) samplesPerSegment = 1;\n\n const out: Point[] = [];\n for (let i = 0; i < anchors.length - 1; i++) {\n const a = anchors[i];\n const b = anchors[i + 1];\n const startStep = i === 0 ? 0 : 1;\n for (let s = startStep; s <= samplesPerSegment; s++) {\n if (s === 0) { out.push(a); continue; }\n if (s === samplesPerSegment) { out.push(b); continue; }\n const t = s / samplesPerSegment;\n out.push({ x: a.x + (b.x - a.x) * t, y: a.y + (b.y - a.y) * t });\n }\n }\n return out;\n}\n\n/** Sample `anchors` using the chosen interpolation mode. */\nexport function sampleByInterpolation(\n anchors: readonly Point[],\n samplesPerSegment: number,\n mode: InterpolationMode,\n): Point[] {\n switch (mode) {\n case 'linear':\n return sampleLinear(anchors, samplesPerSegment);\n case 'catmull-rom-uniform':\n return sampleCatmullRom(anchors, samplesPerSegment, 0);\n case 'catmull-rom-chordal':\n return sampleCatmullRom(anchors, samplesPerSegment, 1);\n case 'monotone':\n return sampleMonotone(anchors, samplesPerSegment);\n case 'catmull-rom':\n default:\n return sampleCatmullRom(anchors, samplesPerSegment, 0.5);\n }\n}\n","/**\n * Built-in function/curve layer for LayeredCurveEditor. Bundles the\n * curve-render + anchor-render + drag/insert/delete gestures that were\n * the entirety of the original `CurveEditor`. Multiple instances coexist\n * by id; consumers can compose several to plot e.g. a primary function\n * and a derived (read-only) curve on the same chart.\n */\nimport type { ReactNode } from 'react';\nimport { sampleByInterpolation, type InterpolationMode } from './interpolation';\nimport { hitTestAnchor, hitTestCurve } from './hitTest';\nimport { handleHalf } from '../../handles';\nimport { dlog } from '../../dlog';\nimport s from './CurveEditor.module.css';\nimport type {\n CurveLayer, LayerCtx, LayerGesture, LayerRenderCtx, ModelPoint, PlotPoint,\n EmptyDownArgs, KeyDownArgs,\n} from './layerTypes';\n\n// ── Public types ─────────────────────────────────────────────────────\n\n/** One anchor of a curve, in model space. */\nexport interface ControlPoint {\n x: number;\n y: number;\n /** When true, this control point can't be moved or deleted by the\n * user. Render as a smaller diamond with locked styling. */\n locked?: boolean;\n}\n\n/**\n * Whether a curve's points keep their x order. In `'1d'` an anchor cannot be\n * dragged past its neighbors and a new point is inserted at its x position;\n * in `'2d'` points are free to move anywhere and keep their list order.\n */\nexport type CurveDomain = '1d' | '2d';\n/**\n * How much of a curve's first and last anchor the user may move: everything,\n * only their y, or nothing.\n */\nexport type EndpointMode = 'free' | 'pinned-x' | 'pinned-both';\n/**\n * Where a click adds a new anchor — on the curve itself, anywhere in the\n * plot, or nowhere.\n */\nexport type AddPointMode = 'click-curve' | 'click-empty' | 'never';\n\n/**\n * What a `renderAnchor` function is given for one anchor: the point, its\n * index, its position in plot space (`cx`/`cy`), and the states that change\n * how it should look.\n */\nexport interface AnchorRenderProps {\n point: ControlPoint;\n index: number;\n cx: number;\n cy: number;\n isActive: boolean;\n isLocked: boolean;\n isPinnedEndpoint: boolean;\n isEndpoint: boolean;\n}\n\n/**\n * Per-instance curve-rendering overrides. Currently empty — passing `{}`\n * means \"draw the curve\", and `false`/`null` means don't.\n */\nexport type CurveSettings = object;\n\n/** Shades the region between the curve and one edge of the plot. */\nexport interface FillSettings {\n side: 'below' | 'above';\n color?: string;\n}\n\n/** Configuration for {@link createFunctionLayer}. */\nexport interface FunctionLayerConfig {\n /** Layer id; default `'function'`. Two instances on the same editor\n * must have distinct ids. */\n id?: string;\n domain?: CurveDomain;\n endpoints?: EndpointMode;\n interpolation?: InterpolationMode;\n constrain?: 'none' | 'function';\n addPointMode?: AddPointMode;\n minPoints?: number;\n maxPoints?: number;\n curve?: CurveSettings | false | null;\n fill?: FillSettings | false | null;\n hideNonInteractive?: boolean;\n renderAnchor?: (info: AnchorRenderProps) => ReactNode;\n /** When false, the layer renders the curve+fill but doesn't render\n * anchors and doesn't accept pointer input. For derived read-only\n * curves (e.g. plotting f'(x) alongside f(x)). Default true. */\n interactive?: boolean;\n /** Override x clamp range for drags and pinned endpoints. Defaults\n * to the editor's modelRange x. Use this to constrain a layer to a\n * sub-range of the plot (e.g. a bevel curve occupying x ∈ [0, b]\n * while the editor's xRange is [0, halfWidth]). */\n xClamp?: readonly [number, number];\n /** Names the curve in each anchor's accessible name. Default `'Point'`. */\n label?: string;\n}\n\n/**\n * The state a function layer owns. Treat it as opaque and round-trip it\n * through `LayeredCurveEditor`'s `onLayerChange`; `points` is the part worth\n * reading.\n */\nexport interface FunctionLayerState {\n points: readonly ControlPoint[];\n /** Layer-internal: the index of the anchor currently being dragged.\n * Cleared between gestures. Consumers treat the whole state as\n * opaque and round-trip it via onLayerChange. */\n activeIndex: number | null;\n}\n\nconst SAMPLES_PER_SEGMENT = 16;\nconst ENDPOINT_HALF = handleHalf('--wzl-handle-size-lg');\nconst LOCKED_HALF = handleHalf('--wzl-handle-size-sm');\nconst ANCHOR_SNAP_PX = 12;\nconst CURVE_HIT_PX = 8;\n/** An arrow-key nudge, as a fraction of the range; shift takes ten. */\nconst KEY_STEP_FRACTION = 0.01;\nconst SHIFT_MULTIPLIER = 10;\n\nconst formatCoord = (n: number): string => String(Number(n.toFixed(3)));\n\n// ── Helpers ───────────────────────────────────────────────────────────\n\nfunction clampToModelRange(p: ModelPoint, ctx: LayerCtx): ModelPoint {\n const m = ctx.modelRange;\n const xLo = Math.min(m.xMin, m.xMax);\n const xHi = Math.max(m.xMin, m.xMax);\n const yLo = Math.min(m.yMin, m.yMax);\n const yHi = Math.max(m.yMin, m.yMax);\n return {\n x: Math.max(xLo, Math.min(xHi, p.x)),\n y: Math.max(yLo, Math.min(yHi, p.y)),\n };\n}\n\nfunction isPinnedEndpointAt(index: number, count: number, endpoints: EndpointMode): boolean {\n if (endpoints === 'free') return false;\n return index === 0 || index === count - 1;\n}\n\nfunction projectAnchors(points: readonly ControlPoint[], ctx: LayerCtx): PlotPoint[] {\n return points.map((p) => ctx.toPlot(p));\n}\n\nfunction segmentSamples(\n points: readonly ControlPoint[],\n interpolation: InterpolationMode,\n ctx: LayerCtx,\n): PlotPoint[][] {\n if (points.length < 2) return [];\n const all = sampleByInterpolation(points, SAMPLES_PER_SEGMENT, interpolation);\n const out: PlotPoint[][] = [];\n for (let i = 0; i < points.length - 1; i++) {\n const start = i * SAMPLES_PER_SEGMENT;\n const end = start + SAMPLES_PER_SEGMENT;\n const slice = all.slice(start, end + 1);\n out.push(slice.map((p) => ctx.toPlot(p)));\n }\n return out;\n}\n\nfunction resolveInterpolation(cfg: FunctionLayerConfig): InterpolationMode {\n return (cfg.constrain ?? 'none') === 'function'\n ? 'monotone'\n : (cfg.interpolation ?? 'catmull-rom');\n}\n\n// ── Factory ───────────────────────────────────────────────────────────\n\n/**\n * Builds the built-in curve layer for `LayeredCurveEditor`: it draws the\n * interpolated curve and its anchors, and handles dragging, inserting and\n * deleting them.\n *\n * Several can coexist on one editor as long as their ids differ — plotting a\n * derived read-only curve beside an editable one is the case it is shaped\n * for, via `interactive: false`.\n */\nexport function createFunctionLayer(cfg: FunctionLayerConfig = {}): CurveLayer<FunctionLayerState> {\n const id = cfg.id ?? 'function';\n const domain = cfg.domain ?? '2d';\n const endpoints = cfg.endpoints ?? 'free';\n const constrain = cfg.constrain ?? 'none';\n const addPointMode = cfg.addPointMode ?? 'click-curve';\n const interpolation = resolveInterpolation(cfg);\n const interactive = cfg.interactive !== false;\n const curveVisible = cfg.curve !== false && cfg.curve !== null;\n\n // ── render ──────────────────────────────────────────────────────────\n function render(state: FunctionLayerState, ctx: LayerRenderCtx): ReactNode {\n const { points, activeIndex } = state;\n const plotAnchors = projectAnchors(points, ctx);\n\n let pathD = '';\n let fillD: string | null = null;\n if (points.length >= 2) {\n const samples = sampleByInterpolation(points, SAMPLES_PER_SEGMENT, interpolation)\n .map((p) => ctx.toPlot(p));\n const parts: string[] = [`M${samples[0].x.toFixed(2)},${samples[0].y.toFixed(2)}`];\n for (let i = 1; i < samples.length; i++) {\n parts.push(`L${samples[i].x.toFixed(2)},${samples[i].y.toFixed(2)}`);\n }\n pathD = parts.join('');\n\n if (cfg.fill) {\n const closingY = cfg.fill.side === 'below' ? ctx.plotSize.height : 0;\n const first = samples[0];\n const last = samples[samples.length - 1];\n const fillParts = [...parts];\n fillParts.push(`L${last.x.toFixed(2)},${closingY.toFixed(2)}`);\n fillParts.push(`L${first.x.toFixed(2)},${closingY.toFixed(2)}`);\n fillParts.push('Z');\n fillD = fillParts.join('');\n }\n }\n\n return (\n <>\n {fillD && (\n <path\n data-curve-element=\"fill\"\n className={s.fill}\n d={fillD}\n fill={cfg.fill ? cfg.fill.color : undefined}\n />\n )}\n {pathD && curveVisible && (\n <path\n className={s.curve}\n d={pathD}\n fill=\"none\"\n />\n )}\n {interactive && plotAnchors.map((a, i) => {\n const pinned = isPinnedEndpointAt(i, points.length, endpoints);\n const locked = points[i]?.locked === true;\n if ((locked || pinned) && cfg.hideNonInteractive) return null;\n const active = activeIndex === i;\n const isEndpoint = curveVisible && (i === 0 || i === points.length - 1);\n const focus = !locked && !(endpoints === 'pinned-both' && pinned)\n ? { tabIndex: 0 }\n : {};\n const a11y = {\n ...focus,\n role: 'button',\n 'aria-label': `${cfg.label ?? 'Point'} ${i + 1} at ${formatCoord(points[i].x)}, ${formatCoord(points[i].y)}`,\n };\n if (cfg.renderAnchor) {\n const node = cfg.renderAnchor({\n point: points[i], index: i,\n cx: a.x, cy: a.y,\n isActive: active, isLocked: locked,\n isPinnedEndpoint: pinned, isEndpoint,\n });\n if (node !== null && node !== undefined) {\n return <g key={i} data-anchor-index={i} {...a11y}>{node}</g>;\n }\n }\n const anchorCls = [\n s.anchor,\n isEndpoint && s.endpoint,\n (pinned || locked) && s.pinned,\n locked && s.locked,\n active && s.active,\n ].filter(Boolean).join(' ');\n const renderAsDiamond = isEndpoint || locked;\n if (renderAsDiamond) {\n const half = locked ? LOCKED_HALF : ENDPOINT_HALF;\n return (\n <rect\n key={i}\n className={anchorCls}\n x={a.x - half}\n y={a.y - half}\n width={half * 2}\n height={half * 2}\n transform={`rotate(45 ${a.x} ${a.y})`}\n data-anchor-index={i}\n {...a11y}\n />\n );\n }\n return (\n <circle\n key={i}\n className={anchorCls}\n cx={a.x}\n cy={a.y}\n r={4}\n data-anchor-index={i}\n {...a11y}\n />\n );\n })}\n </>\n );\n }\n\n // ── hit test ────────────────────────────────────────────────────────\n function hitTest(state: FunctionLayerState, plot: PlotPoint, ctx: LayerCtx) {\n if (!interactive) return null;\n const plotAnchors = projectAnchors(state.points, ctx);\n const a = hitTestAnchor(plotAnchors, plot, ANCHOR_SNAP_PX);\n if (a) return { kind: 'anchor' as const, payload: { index: a.index } };\n if (addPointMode === 'click-curve' && curveVisible) {\n const segs = segmentSamples(state.points, interpolation, ctx);\n const c = hitTestCurve(segs, plot, CURVE_HIT_PX);\n if (c) return { kind: 'curve' as const, payload: { segIdx: c.segIdx, t: c.t } };\n }\n return null;\n }\n\n // ── move constraint, shared by drag and keyboard ────────────────────\n function moveAnchor(state: FunctionLayerState, index: number, model: ModelPoint, ctx: LayerCtx): FunctionLayerState {\n const points = state.points;\n if (index < 0 || index >= points.length) return state;\n const mr = ctx.modelRange;\n const xMin = cfg.xClamp ? cfg.xClamp[0] : mr.xMin;\n const xMax = cfg.xClamp ? cfg.xClamp[1] : mr.xMax;\n let nx = model.x;\n let ny = model.y;\n const isEndpoint = index === 0 || index === points.length - 1;\n\n if (endpoints === 'pinned-both' && isEndpoint) {\n nx = points[index].x;\n ny = points[index].y;\n } else if (endpoints === 'pinned-x' && isEndpoint) {\n nx = index === 0 ? xMin : xMax;\n } else if (constrain === 'function' || domain === '1d') {\n const epsilon = constrain === 'function'\n ? (xMax - xMin) / 1000\n : 0;\n const left = index > 0 ? points[index - 1].x + epsilon : xMin;\n const right = index < points.length - 1 ? points[index + 1].x - epsilon : xMax;\n nx = Math.max(left, Math.min(right, nx));\n }\n\n // Always clamp x to the layer's own range (so free-mode\n // interior anchors of a sub-range layer can't escape it).\n // Normalize bounds for inverted ranges.\n {\n const lo = Math.min(xMin, xMax);\n const hi = Math.max(xMin, xMax);\n nx = Math.max(lo, Math.min(hi, nx));\n }\n const clamped = clampToModelRange({ x: nx, y: ny }, ctx);\n const next = points.slice();\n next[index] = { ...points[index], x: clamped.x, y: clamped.y };\n return { ...state, points: next, activeIndex: index };\n }\n\n // ── drag gesture ────────────────────────────────────────────────────\n function makeDragGesture(index: number): LayerGesture<FunctionLayerState> {\n return {\n onMove(state, model, _e, ctx) { return moveAnchor(state, index, model, ctx); },\n onCommit(state) { return { ...state, activeIndex: null }; },\n onCancel(state) { return { ...state, activeIndex: null }; },\n };\n }\n\n // ── pointerdown on a positive hit ───────────────────────────────────\n function onPointerDown(\n state: FunctionLayerState,\n hit: { kind: string; payload?: unknown },\n e: PointerEvent,\n ctx: LayerCtx,\n extra: EmptyDownArgs<FunctionLayerState>,\n ): LayerGesture<FunctionLayerState> | void {\n if (hit.kind === 'anchor') {\n const { index } = hit.payload as { index: number };\n dlog('function-layer', 'anchor-down', { id, index, shift: ctx.modifiers.shift, button: e.button });\n if (state.points[index]?.locked) return;\n if (ctx.modifiers.shift) {\n if (isPinnedEndpointAt(index, state.points.length, endpoints)) return;\n if (cfg.minPoints !== undefined && state.points.length <= cfg.minPoints) return;\n extra.commit({\n ...state,\n points: state.points.filter((_, i) => i !== index),\n activeIndex: null,\n });\n return;\n }\n if (e.button === 2) return;\n extra.commit({ ...state, activeIndex: index });\n return makeDragGesture(index);\n }\n if (hit.kind === 'curve') {\n const { segIdx } = hit.payload as { segIdx: number; t: number };\n if (cfg.maxPoints !== undefined && state.points.length >= cfg.maxPoints) return;\n const insertIndex = segIdx + 1;\n const modelPt = clampToModelRange(extra.model, ctx);\n\n // function/1d: refuse insert that would be immediately clamped\n // against a neighbor (mouse jitter would otherwise drop a phantom\n // point directly above an existing anchor). Snap to dragging the\n // neighbor instead.\n if (constrain === 'function' || domain === '1d') {\n const epsilon = constrain === 'function'\n ? (ctx.modelRange.xMax - ctx.modelRange.xMin) / 1000\n : 0;\n const left = insertIndex > 0 ? state.points[insertIndex - 1] : null;\n const right = insertIndex < state.points.length ? state.points[insertIndex] : null;\n if (left && Math.abs(modelPt.x - left.x) < epsilon * 2) {\n extra.commit({ ...state, activeIndex: insertIndex - 1 });\n return makeDragGesture(insertIndex - 1);\n }\n if (right && Math.abs(modelPt.x - right.x) < epsilon * 2) {\n extra.commit({ ...state, activeIndex: insertIndex });\n return makeDragGesture(insertIndex);\n }\n }\n\n const nextPoints = [...state.points.slice(0, insertIndex), modelPt, ...state.points.slice(insertIndex)];\n extra.commit({ ...state, points: nextPoints, activeIndex: insertIndex });\n return makeDragGesture(insertIndex);\n }\n }\n\n // ── empty-space click ───────────────────────────────────────────────\n function onEmptyPointerDown(\n state: FunctionLayerState,\n model: ModelPoint,\n _e: PointerEvent,\n ctx: LayerCtx,\n extra: EmptyDownArgs<FunctionLayerState>,\n ): LayerGesture<FunctionLayerState> | void {\n if (!interactive) return;\n if (addPointMode !== 'click-empty') return;\n if (cfg.maxPoints !== undefined && state.points.length >= cfg.maxPoints) return;\n\n const clamped = clampToModelRange(model, ctx);\n let insertIndex = state.points.length;\n if (domain === '1d') {\n for (let i = 0; i < state.points.length; i++) {\n if (state.points[i].x > clamped.x) { insertIndex = i; break; }\n }\n }\n const nextPoints = [...state.points.slice(0, insertIndex), clamped, ...state.points.slice(insertIndex)];\n extra.commit({ ...state, points: nextPoints, activeIndex: null });\n return;\n }\n\n // ── keyboard ────────────────────────────────────────────────────────\n function onKeyDown(\n state: FunctionLayerState,\n e: KeyboardEvent,\n ctx: LayerCtx,\n extra: KeyDownArgs<FunctionLayerState>,\n ): void {\n if (!interactive) return;\n const target = e.target as Element | null;\n if (target?.closest?.('[data-layer-id]')?.getAttribute('data-layer-id') !== id) return;\n const el = target.closest('[data-anchor-index]');\n if (!el) return;\n const dx = e.key === 'ArrowRight' ? 1 : e.key === 'ArrowLeft' ? -1 : 0;\n const dy = e.key === 'ArrowUp' ? 1 : e.key === 'ArrowDown' ? -1 : 0;\n if (dx === 0 && dy === 0) return;\n e.preventDefault();\n const index = Number(el.getAttribute('data-anchor-index'));\n const p = state.points[index];\n if (!p || p.locked) return;\n const m = ctx.modelRange;\n const mult = e.shiftKey ? SHIFT_MULTIPLIER : 1;\n const xSpan = cfg.xClamp ? cfg.xClamp[1] - cfg.xClamp[0] : m.xMax - m.xMin;\n const next = moveAnchor(state, index, {\n x: p.x + dx * Math.abs(xSpan) * KEY_STEP_FRACTION * mult,\n y: p.y + dy * Math.abs(m.yMax - m.yMin) * KEY_STEP_FRACTION * mult,\n }, ctx);\n const moved = next.points[index];\n if (moved.x === p.x && moved.y === p.y) return;\n extra.commit({ ...next, activeIndex: null });\n }\n\n return {\n id,\n render,\n hitTest,\n onPointerDown,\n onEmptyPointerDown,\n onKeyDown,\n };\n}\n\n/** Convenience: build a function-layer state from a points array. */\nexport function functionLayerState(points: readonly ControlPoint[]): FunctionLayerState {\n return { points, activeIndex: null };\n}\n","/**\n * Back-compat wrapper around `LayeredCurveEditor` that preserves the\n * original single-curve API. New consumers wanting multi-layer\n * composition should reach for `LayeredCurveEditor` + `createFunctionLayer`\n * directly.\n */\nimport {\n useCallback, useEffect, useMemo, useRef, useState,\n type CSSProperties,\n type MouseEvent as ReactMouseEvent,\n type ReactNode,\n} from 'react';\nimport {\n type GridSettings,\n type AxesSettings,\n type TickSettings,\n} from '../Plot2D';\nimport type { InterpolationMode } from './interpolation';\nimport {\n createFunctionLayer,\n type ControlPoint,\n type CurveDomain,\n type EndpointMode,\n type AddPointMode,\n type CurveSettings,\n type FillSettings,\n type AnchorRenderProps,\n type FunctionLayerState,\n} from './createFunctionLayer';\nimport { LayeredCurveEditor } from './LayeredCurveEditor';\n\nexport type { GridSettings, AxesSettings, TickSettings };\nexport type {\n ControlPoint, CurveDomain, EndpointMode, AddPointMode,\n CurveSettings, FillSettings, AnchorRenderProps,\n};\n\n/**\n * Props for {@link CurveEditor}. `onInput` fires throughout a gesture and\n * `onChange` once at its end, with the pre-gesture points as `prev`.\n */\nexport interface CurveEditorProps {\n value: readonly ControlPoint[];\n onInput: (next: ControlPoint[]) => void;\n onChange?: (next: ControlPoint[], prev: readonly ControlPoint[]) => void;\n domain?: CurveDomain;\n interpolation?: InterpolationMode;\n endpoints?: EndpointMode;\n xRange?: readonly [number, number];\n yRange?: readonly [number, number];\n width: number;\n height: number;\n grid?: GridSettings | false | null;\n axes?: AxesSettings | false | null;\n xTicks?: TickSettings | false | null;\n yTicks?: TickSettings | false | null;\n curve?: CurveSettings | false | null;\n fill?: FillSettings | false | null;\n hideNonInteractive?: boolean;\n constrain?: 'none' | 'function';\n history?: boolean;\n minPoints?: number;\n maxPoints?: number;\n addPointMode?: AddPointMode;\n renderAnchor?: (info: AnchorRenderProps) => ReactNode;\n /** Extra SVG content rendered behind the curve and anchors. */\n decorations?: ReactNode;\n className?: string;\n style?: CSSProperties;\n}\n\n/**\n * Editable curve through a list of control points: drag anchors, click to\n * insert, right-click to delete, with optional built-in undo.\n *\n * This is the single-curve API, implemented as one `createFunctionLayer` on\n * a `LayeredCurveEditor`. Reach for those directly to stack several curves\n * on one plot.\n */\nexport function CurveEditor(props: CurveEditorProps) {\n const {\n value, onInput, onChange,\n domain, endpoints, interpolation, constrain, addPointMode,\n minPoints, maxPoints, curve, fill, hideNonInteractive, renderAnchor,\n width, height, xRange, yRange, grid, axes, xTicks, yTicks, history,\n className, style, decorations,\n } = props;\n\n // Layer is config-only; rebuild only when *config* changes.\n const layer = useMemo(() => createFunctionLayer({\n id: 'function',\n domain, endpoints, interpolation, constrain, addPointMode,\n minPoints, maxPoints, curve, fill, hideNonInteractive, renderAnchor,\n }), [\n domain, endpoints, interpolation, constrain, addPointMode,\n minPoints, maxPoints, curve, fill, hideNonInteractive, renderAnchor,\n ]);\n\n // Hybrid controlled-state: the wrapper holds the full FunctionLayerState\n // locally so that consumers using the original CurveEditor API don't\n // have to wire their `value` prop back through on every drag tick to\n // keep the in-flight gesture advancing. We adopt the consumer's\n // `value` prop when it changes externally (and no gesture is active).\n const [layerState, setLayerState] = useState<FunctionLayerState>(\n () => ({ points: value, activeIndex: null }),\n );\n // Ref mirror so the layerChange callback can compare against the\n // freshest state without re-binding on every render.\n const layerStateRef = useRef(layerState);\n layerStateRef.current = layerState;\n\n // Sync from controlled `value` when the consumer updates it externally\n // and we're idle. Skip the update during a gesture so drag-in-flight\n // points aren't clobbered by a stale `value`.\n useEffect(() => {\n if (layerStateRef.current.activeIndex !== null) return;\n if (layerStateRef.current.points === value) return;\n setLayerState({ points: value, activeIndex: null });\n }, [value]);\n\n const handleLayerChange = useCallback((_id: string, nextUnknown: unknown) => {\n const next = nextUnknown as FunctionLayerState;\n const prevPoints = layerStateRef.current.points;\n setLayerState(next);\n if (next.points !== prevPoints) {\n onInput(next.points as ControlPoint[]);\n }\n }, [onInput]);\n\n const handleLayerCommit = useCallback((_id: string, nextUnknown: unknown, prevUnknown: unknown) => {\n if (!onChange) return;\n const next = nextUnknown as FunctionLayerState;\n const prev = prevUnknown as FunctionLayerState;\n if (next.points !== prev.points) {\n onChange?.(next.points as ControlPoint[], prev.points);\n }\n }, [onChange]);\n\n // Right-click on an anchor → delete (preserves original CurveEditor\n // behavior). LayeredCurveEditor doesn't model contextmenu as a\n // gesture; we intercept at the wrapper level by walking the DOM\n // target for `data-anchor-index`.\n const onContextMenu = useCallback((e: ReactMouseEvent<HTMLDivElement>) => {\n const target = e.target as Element | null;\n const node = target?.closest?.('[data-anchor-index]') as Element | null;\n if (!node) return;\n e.preventDefault();\n e.stopPropagation();\n const idxAttr = node.getAttribute('data-anchor-index');\n if (idxAttr === null) return;\n const idx = Number(idxAttr);\n const points = layerStateRef.current.points;\n if (!Number.isInteger(idx) || idx < 0 || idx >= points.length) return;\n if (points[idx]?.locked) return;\n if (endpoints !== undefined && endpoints !== 'free' && (idx === 0 || idx === points.length - 1)) return;\n if (minPoints !== undefined && points.length <= minPoints) return;\n const next = points.filter((_, i) => i !== idx);\n setLayerState({ points: next, activeIndex: null });\n onInput(next as ControlPoint[]);\n onChange?.(next as ControlPoint[], points);\n }, [endpoints, minPoints, onInput, onChange]);\n\n const layers = useMemo(() => [{ layer, state: layerState }], [layer, layerState]);\n\n return (\n <div\n onContextMenu={onContextMenu}\n style={{ display: 'contents' }}\n >\n <LayeredCurveEditor\n layers={layers}\n onLayerChange={handleLayerChange}\n onLayerCommit={handleLayerCommit}\n width={width}\n height={height}\n xRange={xRange}\n yRange={yRange}\n grid={grid}\n axes={axes}\n xTicks={xTicks}\n yTicks={yTicks}\n history={history}\n className={className}\n style={style}\n >\n {decorations}\n </LayeredCurveEditor>\n </div>\n );\n}\n","import type { Op } from '@weasel-js/core';\nimport type { ControlPoint } from './CurveEditor';\n\n/**\n * The adapter contract for {@link createSetCurveOp}. Consumers wire\n * this to whatever state container holds the curve's value — typically\n * a small callback that calls a React state setter or dispatches a\n * Redux/Zustand action.\n */\nexport interface SetCurveAdapter {\n setValue(id: string, next: readonly ControlPoint[]): void;\n}\n\n/**\n * Arguments for {@link createSetCurveOp}. `coalesceKey` merges consecutive\n * edits sharing it into one history entry.\n */\nexport interface CreateSetCurveOpArgs {\n /** Stable id the consumer uses for this curve. Used so a single\n * adapter can handle multiple curves; the op's apply routes by id. */\n id: string;\n from: readonly ControlPoint[];\n to: readonly ControlPoint[];\n label?: string;\n coalesceKey?: string;\n}\n\n/**\n * Op factory for editing a CurveEditor's value through weasel-history.\n *\n * history.applyOps(\n * [createSetCurveOp({ id: 'easing', from, to, label: 'Edit easing' })],\n * 'Edit easing',\n * );\n *\n * The op's `apply(adapter)` calls `adapter.setValue(id, to)`. `invert()`\n * returns a mirror op with `from`/`to` swapped. When `from` and `to`\n * are structurally equal, `apply` returns `false` so history can skip\n * the entry — same convention as `createSetPathOp`.\n */\nexport function createSetCurveOp(args: CreateSetCurveOpArgs): Op {\n const { id, from, to, label, coalesceKey } = args;\n return {\n name: 'setCurve',\n args: { id, from, to, label, coalesceKey },\n label,\n coalesceKey,\n apply(adapter) {\n if (controlPointsEqual(from, to)) return false;\n (adapter as SetCurveAdapter).setValue(id, to);\n return undefined;\n },\n invert() {\n return createSetCurveOp({ id, from: to, to: from, label, coalesceKey });\n },\n };\n}\n\nfunction controlPointsEqual(\n a: readonly ControlPoint[],\n b: readonly ControlPoint[],\n): boolean {\n if (a === b) return true;\n if (a.length !== b.length) return false;\n for (let i = 0; i < a.length; i++) {\n if (a[i].x !== b[i].x || a[i].y !== b[i].y) return false;\n }\n return true;\n}\n"],"mappings":";;;;;AAiBA,SAAS,EAAK,GAAU,GAAU,GAAuB;CACvD,IAAM,IAAK,EAAE,IAAI,EAAE,GACb,IAAK,EAAE,IAAI,EAAE;AACnB,QAAgB,KAAK,KAAK,IAAK,IAAK,IAAK,EAAG,KAAE;;AAUhD,SAAgB,EACd,GAAW,GAAW,GAAW,GAAW,GAC5C,IAAgB,IACT;CACP,IACM,IAAK,IAAK,EAAK,GAAI,GAAI,EAAM,EAC7B,IAAK,IAAK,EAAK,GAAI,GAAI,EAAM,EAC7B,IAAK,IAAK,EAAK,GAAI,GAAI,EAAM;AAGnC,KAAI,IAAK,MAAO,EACd,QAAO;EAAE,GAAG,EAAG,KAAK,EAAG,IAAI,EAAG,KAAK;EAAG,GAAG,EAAG,KAAK,EAAG,IAAI,EAAG,KAAK;EAAG;CAGrE,IAAM,IAAI,IAAK,KAAK,IAAK,IAEnB,MAAQ,IAAK,KAAK,EAAG,KAAK,IAAI,KAAM,EAAG,MAAM,IAAK,IAClD,MAAQ,IAAK,KAAK,EAAG,KAAK,IAAI,KAAM,EAAG,MAAM,IAAK,IAClD,MAAQ,IAAK,KAAK,EAAG,KAAK,IAAI,KAAM,EAAG,MAAM,IAAK,IAClD,MAAQ,IAAK,KAAK,EAAG,KAAK,IAAI,KAAM,EAAG,MAAM,IAAK,IAClD,MAAQ,IAAK,KAAK,EAAG,KAAK,IAAI,KAAM,EAAG,MAAM,IAAK,IAClD,MAAQ,IAAK,KAAK,EAAG,KAAK,IAAI,KAAM,EAAG,MAAM,IAAK,IAElD,MAAQ,IAAK,KAAK,KAAO,IAAI,KAAM,MAAQ,IAAK,IAChD,MAAQ,IAAK,KAAK,KAAO,IAAI,KAAM,MAAQ,IAAK,IAChD,MAAQ,IAAK,KAAK,KAAO,IAAI,KAAM,MAAQ,IAAK,IAChD,MAAQ,IAAK,KAAK,KAAO,IAAI,KAAM,MAAQ,IAAK;AAItD,QAAO;EAAE,KAFI,IAAK,KAAK,KAAO,IAAI,KAAM,MAAQ,IAAK;EAErC,KADH,IAAK,KAAK,KAAO,IAAI,KAAM,MAAQ,IAAK;EAC9B;;AAUzB,SAAgB,EACd,GACA,GACA,IAAgB,IACP;AACT,KAAI,EAAQ,SAAS,EAAG,QAAO,EAAE;AACjC,CAAI,IAAoB,MAAG,IAAoB;CAE/C,IAAM,IAAI,EAAQ,QACZ,IAAe,EAAE,EAEjB,IAAsB;EAC1B,GAAG,IAAI,EAAQ,GAAG,IAAI,EAAQ,GAAG;EACjC,GAAG,IAAI,EAAQ,GAAG,IAAI,EAAQ,GAAG;EAClC,EACK,IAAoB;EACxB,GAAG,IAAI,EAAQ,IAAI,GAAG,IAAI,EAAQ,IAAI,GAAG;EACzC,GAAG,IAAI,EAAQ,IAAI,GAAG,IAAI,EAAQ,IAAI,GAAG;EAC1C;AAED,MAAK,IAAI,IAAI,GAAG,IAAI,IAAI,GAAG,KAAK;EAC9B,IAAM,IAAK,MAAM,IAAI,IAAe,EAAQ,IAAI,IAC1C,IAAK,EAAQ,IACb,IAAK,EAAQ,IAAI,IACjB,IAAK,IAAI,IAAI,IAAI,EAAQ,IAAI,KAAK,GAClC,IAAS,MAAM,IAAI,IAAI;AAC7B,OAAK,IAAI,IAAI,GAAQ,KAAK,GAAmB,KAAK;AAChD,OAAI,MAAM,GAAG;AACX,MAAI,KAAK,EAAG;AACZ;;AAEF,OAAI,MAAM,GAAmB;AAC3B,MAAI,KAAK,EAAG;AACZ;;GAEF,IAAM,IAAI,IAAI;AACd,KAAI,KAAK,EAAgB,GAAI,GAAI,GAAI,GAAI,GAAG,EAAM,CAAC;;;AAGvD,QAAO;;;;ACtFT,SAAS,EAAS,GAAiC;CACjD,IAAM,IAAI,EAAG;AACb,KAAI,MAAM,EAAG,QAAO,EAAE;AACtB,KAAI,MAAM,EAAG,QAAO,CAAC,EAAE;CAGvB,IAAM,IAAkB,MAAM,IAAI,EAAE;AACpC,MAAK,IAAI,IAAI,GAAG,IAAI,IAAI,GAAG,IAAK,GAAE,KAAK,EAAG,IAAI,KAAK,EAAG;CAEtD,IAAM,IAAkB,MAAM,EAAE;AAEhC,CADA,EAAE,KAAK,EAAE,IACT,EAAE,IAAI,KAAK,EAAE,IAAI;AAEjB,MAAK,IAAI,IAAI,GAAG,IAAI,IAAI,GAAG,IACzB,KAAI,EAAE,IAAI,KAAK,EAAE,MAAM,EAGrB,GAAE,KAAK;MACF;EAIL,IAAM,KAAO,EAAE,IAAI,KAAK,EAAE,MAAM,GAC1B,IAAM,KAAK,IAAI,KAAK,IAAI,EAAE,IAAI,GAAG,EAAE,KAAK,IAAI,EAAE,GAAG,EAAE,KAAK,IAAI,EAAI,CAAC;AACvE,IAAE,KAAK,KAAK,KAAK,EAAI,GAAG;;AAG5B,QAAO;;AAKT,SAAS,EACP,GAAY,GAAY,GAAY,GAAY,GACxC;CACR,IAAM,IAAK,IAAI,GACT,IAAK,IAAK;AAChB,SACG,IAAI,IAAK,IAAI,IAAK,KAAK,KACvB,IAAK,IAAI,IAAK,KAAK,KACnB,KAAK,IAAK,IAAI,KAAM,KACpB,IAAK,KAAM;;AAShB,SAAgB,EACd,GACA,GACS;AACT,KAAI,EAAQ,SAAS,EAAG,QAAO,EAAE;AACjC,CAAI,IAAoB,MAAG,IAAoB;CAE/C,IAAM,IAAI,EAAQ,QACZ,IAAK,EAAQ,KAAK,MAAM,EAAE,EAAE,EAC5B,IAAK,EAAQ,KAAK,MAAM,EAAE,EAAE,EAC5B,IAAK,EAAS,EAAG,EACjB,IAAK,EAAS,EAAG,EAEjB,IAAe,EAAE;AACvB,MAAK,IAAI,IAAI,GAAG,IAAI,IAAI,GAAG,KAAK;EAC9B,IAAM,IAAY,MAAM,IAAI,IAAI;AAChC,OAAK,IAAI,IAAI,GAAW,KAAK,GAAmB,KAAK;AACnD,OAAI,MAAM,GAAG;AAAE,MAAI,KAAK,EAAQ,GAAG;AAAE;;AACrC,OAAI,MAAM,GAAmB;AAAE,MAAI,KAAK,EAAQ,IAAI,GAAG;AAAE;;GACzD,IAAM,IAAI,IAAI;AACd,KAAI,KAAK;IACP,GAAG,EAAQ,EAAG,IAAI,EAAG,IAAI,IAAI,EAAG,IAAI,EAAG,IAAI,IAAI,EAAE;IACjD,GAAG,EAAQ,EAAG,IAAI,EAAG,IAAI,IAAI,EAAG,IAAI,EAAG,IAAI,IAAI,EAAE;IAClD,CAAC;;;AAGN,QAAO;;;;AC3ET,SAAS,EACP,GACA,GACS;AACT,KAAI,EAAQ,SAAS,EAAG,QAAO,EAAE;AACjC,CAAI,IAAoB,MAAG,IAAoB;CAE/C,IAAM,IAAe,EAAE;AACvB,MAAK,IAAI,IAAI,GAAG,IAAI,EAAQ,SAAS,GAAG,KAAK;EAC3C,IAAM,IAAI,EAAQ,IACZ,IAAI,EAAQ,IAAI,IAChB,IAAY,MAAM,IAAI,IAAI;AAChC,OAAK,IAAI,IAAI,GAAW,KAAK,GAAmB,KAAK;AACnD,OAAI,MAAM,GAAG;AAAE,MAAI,KAAK,EAAE;AAAE;;AAC5B,OAAI,MAAM,GAAmB;AAAE,MAAI,KAAK,EAAE;AAAE;;GAC5C,IAAM,IAAI,IAAI;AACd,KAAI,KAAK;IAAE,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK;IAAG,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK;IAAG,CAAC;;;AAGpE,QAAO;;AAIT,SAAgB,EACd,GACA,GACA,GACS;AACT,SAAQ,GAAR;EACE,KAAK,SACH,QAAO,EAAa,GAAS,EAAkB;EACjD,KAAK,sBACH,QAAO,EAAiB,GAAS,GAAmB,EAAE;EACxD,KAAK,sBACH,QAAO,EAAiB,GAAS,GAAmB,EAAE;EACxD,KAAK,WACH,QAAO,EAAe,GAAS,EAAkB;EAEnD,QACE,QAAO,EAAiB,GAAS,GAAmB,GAAI;;;;;ACqD9D,IAAM,IAAsB,IACtB,IAAgB,EAAW,uBAAuB,EAClD,IAAc,EAAW,uBAAuB,EAChD,IAAiB,IACjB,IAAe,GAEf,IAAoB,KACpB,IAAmB,IAEnB,KAAe,MAAsB,OAAO,OAAO,EAAE,QAAQ,EAAE,CAAC,CAAC;AAIvE,SAAS,EAAkB,GAAe,GAA2B;CACnE,IAAM,IAAI,EAAI,YACR,IAAM,KAAK,IAAI,EAAE,MAAM,EAAE,KAAK,EAC9B,IAAM,KAAK,IAAI,EAAE,MAAM,EAAE,KAAK,EAC9B,IAAM,KAAK,IAAI,EAAE,MAAM,EAAE,KAAK,EAC9B,IAAM,KAAK,IAAI,EAAE,MAAM,EAAE,KAAK;AACpC,QAAO;EACL,GAAG,KAAK,IAAI,GAAK,KAAK,IAAI,GAAK,EAAE,EAAE,CAAC;EACpC,GAAG,KAAK,IAAI,GAAK,KAAK,IAAI,GAAK,EAAE,EAAE,CAAC;EACrC;;AAGH,SAAS,EAAmB,GAAe,GAAe,GAAkC;AAE1F,QADI,MAAc,SAAe,KAC1B,MAAU,KAAK,MAAU,IAAQ;;AAG1C,SAAS,EAAe,GAAiC,GAA4B;AACnF,QAAO,EAAO,KAAK,MAAM,EAAI,OAAO,EAAE,CAAC;;AAGzC,SAAS,EACP,GACA,GACA,GACe;AACf,KAAI,EAAO,SAAS,EAAG,QAAO,EAAE;CAChC,IAAM,IAAM,EAAsB,GAAQ,GAAqB,EAAc,EACvE,IAAqB,EAAE;AAC7B,MAAK,IAAI,IAAI,GAAG,IAAI,EAAO,SAAS,GAAG,KAAK;EAC1C,IAAM,IAAQ,IAAI,GACZ,IAAM,IAAQ,GACd,IAAQ,EAAI,MAAM,GAAO,IAAM,EAAE;AACvC,IAAI,KAAK,EAAM,KAAK,MAAM,EAAI,OAAO,EAAE,CAAC,CAAC;;AAE3C,QAAO;;AAGT,SAAS,EAAqB,GAA6C;AACzE,SAAQ,EAAI,aAAa,YAAY,aACjC,aACC,EAAI,iBAAiB;;AAc5B,SAAgB,EAAoB,IAA2B,EAAE,EAAkC;CACjG,IAAM,IAAK,EAAI,MAAM,YACf,IAAS,EAAI,UAAU,MACvB,IAAY,EAAI,aAAa,QAC7B,IAAY,EAAI,aAAa,QAC7B,IAAe,EAAI,gBAAgB,eACnC,IAAgB,EAAqB,EAAI,EACzC,IAAc,EAAI,gBAAgB,IAClC,IAAe,EAAI,UAAU,MAAS,EAAI,UAAU;CAG1D,SAAS,EAAO,GAA2B,GAAgC;EACzE,IAAM,EAAE,WAAQ,mBAAgB,GAC1B,IAAc,EAAe,GAAQ,EAAI,EAE3C,IAAQ,IACR,IAAuB;AAC3B,MAAI,EAAO,UAAU,GAAG;GACtB,IAAM,IAAU,EAAsB,GAAQ,GAAqB,EAAc,CAC9E,KAAK,MAAM,EAAI,OAAO,EAAE,CAAC,EACtB,IAAkB,CAAC,IAAI,EAAQ,GAAG,EAAE,QAAQ,EAAE,CAAC,GAAG,EAAQ,GAAG,EAAE,QAAQ,EAAE,GAAG;AAClF,QAAK,IAAI,IAAI,GAAG,IAAI,EAAQ,QAAQ,IAClC,GAAM,KAAK,IAAI,EAAQ,GAAG,EAAE,QAAQ,EAAE,CAAC,GAAG,EAAQ,GAAG,EAAE,QAAQ,EAAE,GAAG;AAItE,OAFA,IAAQ,EAAM,KAAK,GAAG,EAElB,EAAI,MAAM;IACZ,IAAM,IAAW,EAAI,KAAK,SAAS,UAAU,EAAI,SAAS,SAAS,GAC7D,IAAQ,EAAQ,IAChB,IAAO,EAAQ,EAAQ,SAAS,IAChC,IAAY,CAAC,GAAG,EAAM;AAI5B,IAHA,EAAU,KAAK,IAAI,EAAK,EAAE,QAAQ,EAAE,CAAC,GAAG,EAAS,QAAQ,EAAE,GAAG,EAC9D,EAAU,KAAK,IAAI,EAAM,EAAE,QAAQ,EAAE,CAAC,GAAG,EAAS,QAAQ,EAAE,GAAG,EAC/D,EAAU,KAAK,IAAI,EACnB,IAAQ,EAAU,KAAK,GAAG;;;AAI9B,SACE,kBAAA,GAAA,EAAA,UAAA;GACG,KACC,kBAAC,QAAD;IACE,sBAAmB;IACnB,WAAW,EAAE;IACb,GAAG;IACH,MAAM,EAAI,OAAO,EAAI,KAAK,QAAQ,KAAA;IAClC,CAAA;GAEH,KAAS,KACR,kBAAC,QAAD;IACE,WAAW,EAAE;IACV;IACH,MAAK;IACL,CAAA;GAEH,KAAe,EAAY,KAAK,GAAG,MAAM;IACxC,IAAM,IAAS,EAAmB,GAAG,EAAO,QAAQ,EAAU,EACxD,IAAS,EAAO,IAAI,WAAW;AACrC,SAAK,KAAU,MAAW,EAAI,mBAAoB,QAAO;IACzD,IAAM,IAAS,MAAgB,GACzB,IAAa,MAAiB,MAAM,KAAK,MAAM,EAAO,SAAS,IAI/D,IAAO;KACX,GAJY,CAAC,KAAU,EAAE,MAAc,iBAAiB,KACtD,EAAE,UAAU,GAAG,GACf,EAAE;KAGJ,MAAM;KACN,cAAc,GAAG,EAAI,SAAS,QAAQ,GAAG,IAAI,EAAE,MAAM,EAAY,EAAO,GAAG,EAAE,CAAC,IAAI,EAAY,EAAO,GAAG,EAAE;KAC3G;AACD,QAAI,EAAI,cAAc;KACpB,IAAM,IAAO,EAAI,aAAa;MAC5B,OAAO,EAAO;MAAI,OAAO;MACzB,IAAI,EAAE;MAAG,IAAI,EAAE;MACf,UAAU;MAAQ,UAAU;MAC5B,kBAAkB;MAAQ;MAC3B,CAAC;AACF,SAAI,KAAS,KACX,QAAO,kBAAC,KAAD;MAAW,qBAAmB;MAAG,GAAI;gBAAO;MAAS,EAA7C,EAA6C;;IAGhE,IAAM,IAAY;KAChB,EAAE;KACF,KAAc,EAAE;MACf,KAAU,MAAW,EAAE;KACxB,KAAU,EAAE;KACZ,KAAU,EAAE;KACb,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;AAE3B,QADwB,KAAc,GACjB;KACnB,IAAM,IAAO,IAAS,IAAc;AACpC,YACE,kBAAC,QAAD;MAEE,WAAW;MACX,GAAG,EAAE,IAAI;MACT,GAAG,EAAE,IAAI;MACT,OAAO,IAAO;MACd,QAAQ,IAAO;MACf,WAAW,aAAa,EAAE,EAAE,GAAG,EAAE,EAAE;MACnC,qBAAmB;MACnB,GAAI;MACJ,EATK,EASL;;AAGN,WACE,kBAAC,UAAD;KAEE,WAAW;KACX,IAAI,EAAE;KACN,IAAI,EAAE;KACN,GAAG;KACH,qBAAmB;KACnB,GAAI;KACJ,EAPK,EAOL;KAEJ;GACD,EAAA,CAAA;;CAKP,SAAS,EAAQ,GAA2B,GAAiB,GAAe;AAC1E,MAAI,CAAC,EAAa,QAAO;EAEzB,IAAM,IAAI,EADU,EAAe,EAAM,QAAQ,EACzB,EAAa,GAAM,EAAe;AAC1D,MAAI,EAAG,QAAO;GAAE,MAAM;GAAmB,SAAS,EAAE,OAAO,EAAE,OAAO;GAAE;AACtE,MAAI,MAAiB,iBAAiB,GAAc;GAElD,IAAM,IAAI,EADG,EAAe,EAAM,QAAQ,GAAe,EAClC,EAAM,GAAM,EAAa;AAChD,OAAI,EAAG,QAAO;IAAE,MAAM;IAAkB,SAAS;KAAE,QAAQ,EAAE;KAAQ,GAAG,EAAE;KAAG;IAAE;;AAEjF,SAAO;;CAIT,SAAS,EAAW,GAA2B,GAAe,GAAmB,GAAmC;EAClH,IAAM,IAAS,EAAM;AACrB,MAAI,IAAQ,KAAK,KAAS,EAAO,OAAQ,QAAO;EAChD,IAAM,IAAK,EAAI,YACT,IAAO,EAAI,SAAS,EAAI,OAAO,KAAK,EAAG,MACvC,IAAO,EAAI,SAAS,EAAI,OAAO,KAAK,EAAG,MACzC,IAAK,EAAM,GACX,IAAK,EAAM,GACT,IAAa,MAAU,KAAK,MAAU,EAAO,SAAS;AAE5D,MAAI,MAAc,iBAAiB,EAEjC,CADA,IAAK,EAAO,GAAO,GACnB,IAAK,EAAO,GAAO;WACV,MAAc,cAAc,EACrC,KAAK,MAAU,IAAI,IAAO;WACjB,MAAc,cAAc,MAAW,MAAM;GACtD,IAAM,IAAU,MAAc,cACzB,IAAO,KAAQ,MAChB,GACE,IAAO,IAAQ,IAAI,EAAO,IAAQ,GAAG,IAAI,IAAU,GACnD,IAAQ,IAAQ,EAAO,SAAS,IAAI,EAAO,IAAQ,GAAG,IAAI,IAAU;AAC1E,OAAK,KAAK,IAAI,GAAM,KAAK,IAAI,GAAO,EAAG,CAAC;;AASxC,MAAK,KAAK,IAFC,KAAK,IAAI,GAAM,EAEZ,EAAI,KAAK,IADZ,KAAK,IAAI,GAAM,EACC,EAAI,EAAG,CAAC;EAErC,IAAM,IAAU,EAAkB;GAAE,GAAG;GAAI,GAAG;GAAI,EAAE,EAAI,EAClD,IAAO,EAAO,OAAO;AAE3B,SADA,EAAK,KAAS;GAAE,GAAG,EAAO;GAAQ,GAAG,EAAQ;GAAG,GAAG,EAAQ;GAAG,EACvD;GAAE,GAAG;GAAO,QAAQ;GAAM,aAAa;GAAO;;CAIvD,SAAS,EAAgB,GAAiD;AACxE,SAAO;GACL,OAAO,GAAO,GAAO,GAAI,GAAK;AAAE,WAAO,EAAW,GAAO,GAAO,GAAO,EAAI;;GAC3E,SAAS,GAAO;AAAE,WAAO;KAAE,GAAG;KAAO,aAAa;KAAM;;GACxD,SAAS,GAAO;AAAE,WAAO;KAAE,GAAG;KAAO,aAAa;KAAM;;GACzD;;CAIH,SAAS,EACP,GACA,GACA,GACA,GACA,GACyC;AACzC,MAAI,EAAI,SAAS,UAAU;GACzB,IAAM,EAAE,aAAU,EAAI;AAEtB,OADA,EAAK,kBAAkB,eAAe;IAAE;IAAI;IAAO,OAAO,EAAI,UAAU;IAAO,QAAQ,EAAE;IAAQ,CAAC,EAC9F,EAAM,OAAO,IAAQ,OAAQ;AACjC,OAAI,EAAI,UAAU,OAAO;AAEvB,QADI,EAAmB,GAAO,EAAM,OAAO,QAAQ,EAAU,IACzD,EAAI,cAAc,KAAA,KAAa,EAAM,OAAO,UAAU,EAAI,UAAW;AACzE,MAAM,OAAO;KACX,GAAG;KACH,QAAQ,EAAM,OAAO,QAAQ,GAAG,MAAM,MAAM,EAAM;KAClD,aAAa;KACd,CAAC;AACF;;AAIF,UAFI,EAAE,WAAW,IAAG,UACpB,EAAM,OAAO;IAAE,GAAG;IAAO,aAAa;IAAO,CAAC,EACvC,EAAgB,EAAM;;AAE/B,MAAI,EAAI,SAAS,SAAS;GACxB,IAAM,EAAE,cAAW,EAAI;AACvB,OAAI,EAAI,cAAc,KAAA,KAAa,EAAM,OAAO,UAAU,EAAI,UAAW;GACzE,IAAM,IAAc,IAAS,GACvB,IAAU,EAAkB,EAAM,OAAO,EAAI;AAMnD,OAAI,MAAc,cAAc,MAAW,MAAM;IAC/C,IAAM,IAAU,MAAc,cACzB,EAAI,WAAW,OAAO,EAAI,WAAW,QAAQ,MAC9C,GACE,IAAO,IAAc,IAAI,EAAM,OAAO,IAAc,KAAK,MACzD,IAAQ,IAAc,EAAM,OAAO,SAAS,EAAM,OAAO,KAAe;AAC9E,QAAI,KAAQ,KAAK,IAAI,EAAQ,IAAI,EAAK,EAAE,GAAG,IAAU,EAEnD,QADA,EAAM,OAAO;KAAE,GAAG;KAAO,aAAa,IAAc;KAAG,CAAC,EACjD,EAAgB,IAAc,EAAE;AAEzC,QAAI,KAAS,KAAK,IAAI,EAAQ,IAAI,EAAM,EAAE,GAAG,IAAU,EAErD,QADA,EAAM,OAAO;KAAE,GAAG;KAAO,aAAa;KAAa,CAAC,EAC7C,EAAgB,EAAY;;GAIvC,IAAM,IAAa;IAAC,GAAG,EAAM,OAAO,MAAM,GAAG,EAAY;IAAE;IAAS,GAAG,EAAM,OAAO,MAAM,EAAY;IAAC;AAEvG,UADA,EAAM,OAAO;IAAE,GAAG;IAAO,QAAQ;IAAY,aAAa;IAAa,CAAC,EACjE,EAAgB,EAAY;;;CAKvC,SAAS,EACP,GACA,GACA,GACA,GACA,GACyC;AAGzC,MAFI,CAAC,KACD,MAAiB,iBACjB,EAAI,cAAc,KAAA,KAAa,EAAM,OAAO,UAAU,EAAI,UAAW;EAEzE,IAAM,IAAU,EAAkB,GAAO,EAAI,EACzC,IAAc,EAAM,OAAO;AAC/B,MAAI,MAAW;QACR,IAAI,IAAI,GAAG,IAAI,EAAM,OAAO,QAAQ,IACvC,KAAI,EAAM,OAAO,GAAG,IAAI,EAAQ,GAAG;AAAE,QAAc;AAAG;;;EAG1D,IAAM,IAAa;GAAC,GAAG,EAAM,OAAO,MAAM,GAAG,EAAY;GAAE;GAAS,GAAG,EAAM,OAAO,MAAM,EAAY;GAAC;AACvG,IAAM,OAAO;GAAE,GAAG;GAAO,QAAQ;GAAY,aAAa;GAAM,CAAC;;CAKnE,SAAS,EACP,GACA,GACA,GACA,GACM;AACN,MAAI,CAAC,EAAa;EAClB,IAAM,IAAS,EAAE;AACjB,MAAI,GAAQ,UAAU,kBAAkB,EAAE,aAAa,gBAAgB,KAAK,EAAI;EAChF,IAAM,IAAK,EAAO,QAAQ,sBAAsB;AAChD,MAAI,CAAC,EAAI;EACT,IAAM,IAAK,EAAE,QAAQ,eAAe,IAAI,EAAE,QAAQ,cAAc,KAAK,GAC/D,IAAK,EAAE,QAAQ,YAAY,IAAI,EAAE,QAAQ,cAAc,KAAK;AAClE,MAAI,MAAO,KAAK,MAAO,EAAG;AAC1B,IAAE,gBAAgB;EAClB,IAAM,IAAQ,OAAO,EAAG,aAAa,oBAAoB,CAAC,EACpD,IAAI,EAAM,OAAO;AACvB,MAAI,CAAC,KAAK,EAAE,OAAQ;EACpB,IAAM,IAAI,EAAI,YACR,IAAO,EAAE,WAAW,IAAmB,GACvC,IAAQ,EAAI,SAAS,EAAI,OAAO,KAAK,EAAI,OAAO,KAAK,EAAE,OAAO,EAAE,MAChE,IAAO,EAAW,GAAO,GAAO;GACpC,GAAG,EAAE,IAAI,IAAK,KAAK,IAAI,EAAM,GAAG,IAAoB;GACpD,GAAG,EAAE,IAAI,IAAK,KAAK,IAAI,EAAE,OAAO,EAAE,KAAK,GAAG,IAAoB;GAC/D,EAAE,EAAI,EACD,IAAQ,EAAK,OAAO;AACtB,IAAM,MAAM,EAAE,KAAK,EAAM,MAAM,EAAE,KACrC,EAAM,OAAO;GAAE,GAAG;GAAM,aAAa;GAAM,CAAC;;AAG9C,QAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACD;;AAIH,SAAgB,EAAmB,GAAqD;AACtF,QAAO;EAAE;EAAQ,aAAa;EAAM;;;;AC5ZtC,SAAgB,EAAY,GAAyB;CACnD,IAAM,EACJ,UAAO,YAAS,aAChB,WAAQ,cAAW,kBAAe,cAAW,iBAC7C,cAAW,cAAW,UAAO,SAAM,uBAAoB,iBACvD,UAAO,WAAQ,WAAQ,WAAQ,SAAM,SAAM,WAAQ,WAAQ,YAC3D,cAAW,UAAO,mBAChB,GAGE,IAAQ,QAAc,EAAoB;EAC9C,IAAI;EACJ;EAAQ;EAAW;EAAe;EAAW;EAC7C;EAAW;EAAW;EAAO;EAAM;EAAoB;EACxD,CAAC,EAAE;EACF;EAAQ;EAAW;EAAe;EAAW;EAC7C;EAAW;EAAW;EAAO;EAAM;EAAoB;EACxD,CAAC,EAOI,CAAC,GAAY,KAAiB,SAC3B;EAAE,QAAQ;EAAO,aAAa;EAAM,EAC5C,EAGK,IAAgB,EAAO,EAAW;AAMxC,CALA,EAAc,UAAU,GAKxB,QAAgB;AACV,IAAc,QAAQ,gBAAgB,QACtC,EAAc,QAAQ,WAAW,KACrC,EAAc;GAAE,QAAQ;GAAO,aAAa;GAAM,CAAC;IAClD,CAAC,EAAM,CAAC;CAEX,IAAM,IAAoB,GAAa,GAAa,MAAyB;EAC3E,IAAM,IAAO,GACP,IAAa,EAAc,QAAQ;AAEzC,EADA,EAAc,EAAK,EACf,EAAK,WAAW,KAClB,EAAQ,EAAK,OAAyB;IAEvC,CAAC,EAAQ,CAAC,EAEP,IAAoB,GAAa,GAAa,GAAsB,MAAyB;AACjG,MAAI,CAAC,EAAU;EACf,IAAM,IAAO,GACP,IAAO;AACb,EAAI,EAAK,WAAW,EAAK,UACvB,IAAW,EAAK,QAA0B,EAAK,OAAO;IAEvD,CAAC,EAAS,CAAC;AA4Bd,QACE,kBAAC,OAAD;EACiB,eAxBG,GAAa,MAAuC;GAExE,IAAM,IADS,EAAE,QACI,UAAU,sBAAsB;AACrD,OAAI,CAAC,EAAM;AAEX,GADA,EAAE,gBAAgB,EAClB,EAAE,iBAAiB;GACnB,IAAM,IAAU,EAAK,aAAa,oBAAoB;AACtD,OAAI,MAAY,KAAM;GACtB,IAAM,IAAM,OAAO,EAAQ,EACrB,IAAS,EAAc,QAAQ;AAIrC,OAHI,CAAC,OAAO,UAAU,EAAI,IAAI,IAAM,KAAK,KAAO,EAAO,UACnD,EAAO,IAAM,UACb,MAAc,KAAA,KAAa,MAAc,WAAW,MAAQ,KAAK,MAAQ,EAAO,SAAS,MACzF,MAAc,KAAA,KAAa,EAAO,UAAU,EAAW;GAC3D,IAAM,IAAO,EAAO,QAAQ,GAAG,MAAM,MAAM,EAAI;AAG/C,GAFA,EAAc;IAAE,QAAQ;IAAM,aAAa;IAAM,CAAC,EAClD,EAAQ,EAAuB,EAC/B,IAAW,GAAwB,EAAO;KACzC;GAAC;GAAW;GAAW;GAAS;GAAS,CAMzB;EACf,OAAO,EAAE,SAAS,YAAY;YAE9B,kBAAC,GAAD;GACU,QARC,QAAc,CAAC;IAAE;IAAO,OAAO;IAAY,CAAC,EAAE,CAAC,GAAO,EAAW,CAQlE;GACR,eAAe;GACf,eAAe;GACR;GACC;GACA;GACA;GACF;GACA;GACE;GACA;GACC;GACE;GACJ;aAEN;GACkB,CAAA;EACjB,CAAA;;;;ACnJV,SAAgB,EAAiB,GAAgC;CAC/D,IAAM,EAAE,OAAI,SAAM,OAAI,UAAO,mBAAgB;AAC7C,QAAO;EACL,MAAM;EACN,MAAM;GAAE;GAAI;GAAM;GAAI;GAAO;GAAa;EAC1C;EACA;EACA,MAAM,GAAS;AACb,OAAI,EAAmB,GAAM,EAAG,CAAE,QAAO;AACxC,KAA4B,SAAS,GAAI,EAAG;;EAG/C,SAAS;AACP,UAAO,EAAiB;IAAE;IAAI,MAAM;IAAI,IAAI;IAAM;IAAO;IAAa,CAAC;;EAE1E;;AAGH,SAAS,EACP,GACA,GACS;AACT,KAAI,MAAM,EAAG,QAAO;AACpB,KAAI,EAAE,WAAW,EAAE,OAAQ,QAAO;AAClC,MAAK,IAAI,IAAI,GAAG,IAAI,EAAE,QAAQ,IAC5B,KAAI,EAAE,GAAG,MAAM,EAAE,GAAG,KAAK,EAAE,GAAG,MAAM,EAAE,GAAG,EAAG,QAAO;AAErD,QAAO"}
|
|
1
|
+
{"version":3,"file":"CurveEditor-f1R4kSbD.js","names":[],"sources":["../../src/components/CurveEditor/catmullRom.ts","../../src/components/CurveEditor/monotone.ts","../../src/components/CurveEditor/interpolation.ts","../../src/components/CurveEditor/createFunctionLayer.tsx","../../src/components/CurveEditor/CurveEditor.tsx","../../src/components/CurveEditor/setCurveOp.ts"],"sourcesContent":["/**\n * Catmull-Rom spline sampling, parameterized by α.\n *\n * α = 0 → uniform parameterization (original Catmull-Rom). Fast, can\n * produce cusps and self-intersections at sharp 2D angles.\n * α = 0.5 → centripetal (Yuksel/Schneider 2011). No cusps, no\n * self-intersection. The \"safe default\" for 2D.\n * α = 1 → chordal. Smoother than uniform, different artifacts.\n *\n * `sampleCurve(...)` is the convenience alias for centripetal (α=0.5).\n */\n\nexport interface Point {\n x: number;\n y: number;\n}\n\nfunction knot(a: Point, b: Point, alpha: number): number {\n const dx = b.x - a.x;\n const dy = b.y - a.y;\n return Math.pow(Math.sqrt(dx * dx + dy * dy), alpha);\n}\n\n/**\n * Sample the Catmull-Rom segment between p1 and p2 at parameter\n * t ∈ [0, 1]. p0 and p3 are the surrounding control points (use phantom\n * reflection at endpoints — see sampleCatmullRom below).\n *\n * Returns p1 at t=0 and p2 at t=1. `alpha` controls parameterization.\n */\nexport function segmentSampleAt(\n p0: Point, p1: Point, p2: Point, p3: Point, t: number,\n alpha: number = 0.5,\n): Point {\n const t0 = 0;\n const t1 = t0 + knot(p0, p1, alpha);\n const t2 = t1 + knot(p1, p2, alpha);\n const t3 = t2 + knot(p2, p3, alpha);\n\n // Degenerate: coincident p1/p2 → linear interpolation fallback.\n if (t2 - t1 === 0) {\n return { x: p1.x + (p2.x - p1.x) * t, y: p1.y + (p2.y - p1.y) * t };\n }\n\n const u = t1 + t * (t2 - t1);\n\n const a1x = ((t1 - u) * p0.x + (u - t0) * p1.x) / (t1 - t0);\n const a1y = ((t1 - u) * p0.y + (u - t0) * p1.y) / (t1 - t0);\n const a2x = ((t2 - u) * p1.x + (u - t1) * p2.x) / (t2 - t1);\n const a2y = ((t2 - u) * p1.y + (u - t1) * p2.y) / (t2 - t1);\n const a3x = ((t3 - u) * p2.x + (u - t2) * p3.x) / (t3 - t2);\n const a3y = ((t3 - u) * p2.y + (u - t2) * p3.y) / (t3 - t2);\n\n const b1x = ((t2 - u) * a1x + (u - t0) * a2x) / (t2 - t0);\n const b1y = ((t2 - u) * a1y + (u - t0) * a2y) / (t2 - t0);\n const b2x = ((t3 - u) * a2x + (u - t1) * a3x) / (t3 - t1);\n const b2y = ((t3 - u) * a2y + (u - t1) * a3y) / (t3 - t1);\n\n const cx = ((t2 - u) * b1x + (u - t1) * b2x) / (t2 - t1);\n const cy = ((t2 - u) * b1y + (u - t1) * b2y) / (t2 - t1);\n return { x: cx, y: cy };\n}\n\n/**\n * Sample the whole curve through `anchors` using Catmull-Rom with the\n * given α. Returns `(n-1) * samplesPerSegment + 1` points. Phantom\n * endpoints by reflection so the first/last segments are tangent to\n * the chord into/out of the endpoints. Returns `[]` for fewer than 2\n * anchors.\n */\nexport function sampleCatmullRom(\n anchors: readonly Point[],\n samplesPerSegment: number,\n alpha: number = 0.5,\n): Point[] {\n if (anchors.length < 2) return [];\n if (samplesPerSegment < 1) samplesPerSegment = 1;\n\n const n = anchors.length;\n const out: Point[] = [];\n\n const reflectStart: Point = {\n x: 2 * anchors[0].x - anchors[1].x,\n y: 2 * anchors[0].y - anchors[1].y,\n };\n const reflectEnd: Point = {\n x: 2 * anchors[n - 1].x - anchors[n - 2].x,\n y: 2 * anchors[n - 1].y - anchors[n - 2].y,\n };\n\n for (let i = 0; i < n - 1; i++) {\n const p0 = i === 0 ? reflectStart : anchors[i - 1];\n const p1 = anchors[i];\n const p2 = anchors[i + 1];\n const p3 = i + 2 < n ? anchors[i + 2] : reflectEnd;\n const tStart = i === 0 ? 0 : 1;\n for (let s = tStart; s <= samplesPerSegment; s++) {\n if (s === 0) {\n out.push(p1);\n continue;\n }\n if (s === samplesPerSegment) {\n out.push(p2);\n continue;\n }\n const t = s / samplesPerSegment;\n out.push(segmentSampleAt(p0, p1, p2, p3, t, alpha));\n }\n }\n return out;\n}\n\n/** Convenience alias for centripetal Catmull-Rom (α=0.5). The most\n * common choice; safe default for 2D paths. */\nexport function sampleCurve(\n anchors: readonly Point[],\n samplesPerSegment: number,\n): Point[] {\n return sampleCatmullRom(anchors, samplesPerSegment, 0.5);\n}\n","/**\n * Monotone cubic interpolation (Fritsch-Carlson / Steffen variant).\n *\n * Passes through every anchor and guarantees the curve never\n * overshoots `min(neighbors)` / `max(neighbors)` along either axis.\n * The right choice for animation timing curves (no anticipation) or\n * audio envelopes (no out-of-range values).\n *\n * Parameterized by index — works for both 1D (function-shaped) and\n * 2D (parametric) anchor sequences. The x and y coordinates are\n * interpolated independently as functions of the anchor index.\n *\n * Reference: Fritsch & Carlson 1980, \"Monotone piecewise cubic\n * interpolation.\" Steffen's 1990 refinement is conceptually the same;\n * we use a min-clamp variant that's monotonicity-preserving by\n * construction.\n */\n\nimport type { Point } from './catmullRom';\n\n/** Per-axis tangent computation for a 1D series of y-values sampled at\n * unit intervals (index-parameterized). Returns one tangent per\n * anchor. */\nfunction tangents(ys: readonly number[]): number[] {\n const n = ys.length;\n if (n === 0) return [];\n if (n === 1) return [0];\n\n // Secant slopes (dx = 1 in index parameterization).\n const m: number[] = new Array(n - 1);\n for (let i = 0; i < n - 1; i++) m[i] = ys[i + 1] - ys[i];\n\n const t: number[] = new Array(n);\n t[0] = m[0];\n t[n - 1] = m[n - 2];\n\n for (let i = 1; i < n - 1; i++) {\n if (m[i - 1] * m[i] <= 0) {\n // Sign change or flat → local extremum; tangent is zero (forces\n // the curve to settle without overshoot).\n t[i] = 0;\n } else {\n // Weighted average of adjacent secants (with dx_i = dx_{i-1} = 1,\n // this is just the arithmetic mean). Clamped by Steffen's rule\n // so the cubic stays monotone within each segment.\n const avg = (m[i - 1] + m[i]) / 2;\n const mag = Math.min(Math.abs(m[i - 1]), Math.abs(m[i]), Math.abs(avg));\n t[i] = Math.sign(avg) * mag;\n }\n }\n return t;\n}\n\n/** Cubic Hermite basis at parameter t ∈ [0, 1] given endpoint values\n * p0, p1 and endpoint tangents m0, m1. */\nfunction hermite(\n p0: number, p1: number, m0: number, m1: number, t: number,\n): number {\n const t2 = t * t;\n const t3 = t2 * t;\n return (\n (2 * t3 - 3 * t2 + 1) * p0 +\n (t3 - 2 * t2 + t) * m0 +\n (-2 * t3 + 3 * t2) * p1 +\n (t3 - t2) * m1\n );\n}\n\n/**\n * Sample the monotone-cubic curve through `anchors`. Returns\n * `(n-1) * samplesPerSegment + 1` points (same shape as\n * `sampleCatmullRom`). `[]` for fewer than 2 anchors.\n */\nexport function sampleMonotone(\n anchors: readonly Point[],\n samplesPerSegment: number,\n): Point[] {\n if (anchors.length < 2) return [];\n if (samplesPerSegment < 1) samplesPerSegment = 1;\n\n const n = anchors.length;\n const xs = anchors.map((a) => a.x);\n const ys = anchors.map((a) => a.y);\n const tx = tangents(xs);\n const ty = tangents(ys);\n\n const out: Point[] = [];\n for (let i = 0; i < n - 1; i++) {\n const startStep = i === 0 ? 0 : 1; // skip duplicate boundary\n for (let s = startStep; s <= samplesPerSegment; s++) {\n if (s === 0) { out.push(anchors[i]); continue; }\n if (s === samplesPerSegment) { out.push(anchors[i + 1]); continue; }\n const t = s / samplesPerSegment;\n out.push({\n x: hermite(xs[i], xs[i + 1], tx[i], tx[i + 1], t),\n y: hermite(ys[i], ys[i + 1], ty[i], ty[i + 1], t),\n });\n }\n }\n return out;\n}\n","/**\n * Interpolation mode dispatcher for CurveEditor. The vocabulary of\n * supported algorithms and the unified `sample(...)` entry point that\n * picks the right one. All algorithms produce\n * `(n-1) * samplesPerSegment + 1` points and pass through every\n * anchor — CurveEditor is strictly interpolating, never approximating.\n */\n\nimport { sampleCatmullRom, type Point } from './catmullRom';\nimport { sampleMonotone } from './monotone';\n\n/** Supported interpolation modes. All are interpolating (pass through\n * every anchor); the differences are in tangent computation and\n * parameterization. */\nexport type InterpolationMode =\n | 'linear'\n | 'catmull-rom' // centripetal (α=0.5) — safe default\n | 'catmull-rom-uniform' // α=0; can cusp on sharp 2D angles\n | 'catmull-rom-chordal' // α=1; smoother than uniform\n | 'monotone'; // Fritsch-Carlson / Steffen; no overshoot\n\n/** Sample anchors as a polyline. Produces the same sample count shape\n * as the Catmull-Rom variants so downstream segment-slicing logic\n * (hit testing, fill path construction) works uniformly. */\nfunction sampleLinear(\n anchors: readonly Point[],\n samplesPerSegment: number,\n): Point[] {\n if (anchors.length < 2) return [];\n if (samplesPerSegment < 1) samplesPerSegment = 1;\n\n const out: Point[] = [];\n for (let i = 0; i < anchors.length - 1; i++) {\n const a = anchors[i];\n const b = anchors[i + 1];\n const startStep = i === 0 ? 0 : 1;\n for (let s = startStep; s <= samplesPerSegment; s++) {\n if (s === 0) { out.push(a); continue; }\n if (s === samplesPerSegment) { out.push(b); continue; }\n const t = s / samplesPerSegment;\n out.push({ x: a.x + (b.x - a.x) * t, y: a.y + (b.y - a.y) * t });\n }\n }\n return out;\n}\n\n/** Sample `anchors` using the chosen interpolation mode. */\nexport function sampleByInterpolation(\n anchors: readonly Point[],\n samplesPerSegment: number,\n mode: InterpolationMode,\n): Point[] {\n switch (mode) {\n case 'linear':\n return sampleLinear(anchors, samplesPerSegment);\n case 'catmull-rom-uniform':\n return sampleCatmullRom(anchors, samplesPerSegment, 0);\n case 'catmull-rom-chordal':\n return sampleCatmullRom(anchors, samplesPerSegment, 1);\n case 'monotone':\n return sampleMonotone(anchors, samplesPerSegment);\n case 'catmull-rom':\n default:\n return sampleCatmullRom(anchors, samplesPerSegment, 0.5);\n }\n}\n","/**\n * Built-in function/curve layer for LayeredCurveEditor. Bundles the\n * curve-render + anchor-render + drag/insert/delete gestures that were\n * the entirety of the original `CurveEditor`. Multiple instances coexist\n * by id; consumers can compose several to plot e.g. a primary function\n * and a derived (read-only) curve on the same chart.\n */\nimport type { ReactNode } from 'react';\nimport { sampleByInterpolation, type InterpolationMode } from './interpolation';\nimport { hitTestAnchor, hitTestCurve } from './hitTest';\nimport { handleHalf } from '../../handles';\nimport { dlog } from '../../dlog';\nimport s from './CurveEditor.module.css';\nimport type {\n CurveLayer, LayerCtx, LayerGesture, LayerRenderCtx, ModelPoint, PlotPoint,\n EmptyDownArgs, KeyDownArgs,\n} from './layerTypes';\n\n// ── Public types ─────────────────────────────────────────────────────\n\n/** One anchor of a curve, in model space. */\nexport interface ControlPoint {\n x: number;\n y: number;\n /** When true, this control point can't be moved or deleted by the\n * user. Render as a smaller diamond with locked styling. */\n locked?: boolean;\n}\n\n/**\n * Whether a curve's points keep their x order. In `'1d'` an anchor cannot be\n * dragged past its neighbors and a new point is inserted at its x position;\n * in `'2d'` points are free to move anywhere and keep their list order.\n */\nexport type CurveDomain = '1d' | '2d';\n/**\n * How much of a curve's first and last anchor the user may move: everything,\n * only their y, or nothing.\n */\nexport type EndpointMode = 'free' | 'pinned-x' | 'pinned-both';\n/**\n * Where a click adds a new anchor — on the curve itself, anywhere in the\n * plot, or nowhere.\n */\nexport type AddPointMode = 'click-curve' | 'click-empty' | 'never';\n\n/**\n * What a `renderAnchor` function is given for one anchor: the point, its\n * index, its position in plot space (`cx`/`cy`), and the states that change\n * how it should look.\n */\nexport interface AnchorRenderProps {\n point: ControlPoint;\n index: number;\n cx: number;\n cy: number;\n isActive: boolean;\n isLocked: boolean;\n isPinnedEndpoint: boolean;\n isEndpoint: boolean;\n}\n\n/**\n * Per-instance curve-rendering overrides. Currently empty — passing `{}`\n * means \"draw the curve\", and `false`/`null` means don't.\n */\nexport type CurveSettings = object;\n\n/** Shades the region between the curve and one edge of the plot. */\nexport interface FillSettings {\n side: 'below' | 'above';\n color?: string;\n}\n\n/** Configuration for {@link createFunctionLayer}. */\nexport interface FunctionLayerConfig {\n /** Layer id; default `'function'`. Two instances on the same editor\n * must have distinct ids. */\n id?: string;\n domain?: CurveDomain;\n endpoints?: EndpointMode;\n interpolation?: InterpolationMode;\n constrain?: 'none' | 'function';\n addPointMode?: AddPointMode;\n minPoints?: number;\n maxPoints?: number;\n curve?: CurveSettings | false | null;\n fill?: FillSettings | false | null;\n hideNonInteractive?: boolean;\n renderAnchor?: (info: AnchorRenderProps) => ReactNode;\n /** When false, the layer renders the curve+fill but doesn't render\n * anchors and doesn't accept pointer input. For derived read-only\n * curves (e.g. plotting f'(x) alongside f(x)). Default true. */\n interactive?: boolean;\n /** Override x clamp range for drags and pinned endpoints. Defaults\n * to the editor's modelRange x. Use this to constrain a layer to a\n * sub-range of the plot (e.g. a bevel curve occupying x ∈ [0, b]\n * while the editor's xRange is [0, halfWidth]). */\n xClamp?: readonly [number, number];\n /** Names the curve in each anchor's accessible name. Default `'Point'`. */\n label?: string;\n}\n\n/**\n * The state a function layer owns. Treat it as opaque and round-trip it\n * through `LayeredCurveEditor`'s `onLayerChange`; `points` is the part worth\n * reading.\n */\nexport interface FunctionLayerState {\n points: readonly ControlPoint[];\n /** Layer-internal: the index of the anchor currently being dragged.\n * Cleared between gestures. Consumers treat the whole state as\n * opaque and round-trip it via onLayerChange. */\n activeIndex: number | null;\n}\n\nconst SAMPLES_PER_SEGMENT = 16;\nconst ENDPOINT_HALF = handleHalf('--wzl-handle-size-lg');\nconst LOCKED_HALF = handleHalf('--wzl-handle-size-sm');\nconst ANCHOR_SNAP_PX = 12;\nconst CURVE_HIT_PX = 8;\n/** An arrow-key nudge, as a fraction of the range; shift takes ten. */\nconst KEY_STEP_FRACTION = 0.01;\nconst SHIFT_MULTIPLIER = 10;\n\nconst formatCoord = (n: number): string => String(Number(n.toFixed(3)));\n\n// ── Helpers ───────────────────────────────────────────────────────────\n\nfunction clampToModelRange(p: ModelPoint, ctx: LayerCtx): ModelPoint {\n const m = ctx.modelRange;\n const xLo = Math.min(m.xMin, m.xMax);\n const xHi = Math.max(m.xMin, m.xMax);\n const yLo = Math.min(m.yMin, m.yMax);\n const yHi = Math.max(m.yMin, m.yMax);\n return {\n x: Math.max(xLo, Math.min(xHi, p.x)),\n y: Math.max(yLo, Math.min(yHi, p.y)),\n };\n}\n\nfunction isPinnedEndpointAt(index: number, count: number, endpoints: EndpointMode): boolean {\n if (endpoints === 'free') return false;\n return index === 0 || index === count - 1;\n}\n\nfunction projectAnchors(points: readonly ControlPoint[], ctx: LayerCtx): PlotPoint[] {\n return points.map((p) => ctx.toPlot(p));\n}\n\nfunction segmentSamples(\n points: readonly ControlPoint[],\n interpolation: InterpolationMode,\n ctx: LayerCtx,\n): PlotPoint[][] {\n if (points.length < 2) return [];\n const all = sampleByInterpolation(points, SAMPLES_PER_SEGMENT, interpolation);\n const out: PlotPoint[][] = [];\n for (let i = 0; i < points.length - 1; i++) {\n const start = i * SAMPLES_PER_SEGMENT;\n const end = start + SAMPLES_PER_SEGMENT;\n const slice = all.slice(start, end + 1);\n out.push(slice.map((p) => ctx.toPlot(p)));\n }\n return out;\n}\n\nfunction resolveInterpolation(cfg: FunctionLayerConfig): InterpolationMode {\n return (cfg.constrain ?? 'none') === 'function'\n ? 'monotone'\n : (cfg.interpolation ?? 'catmull-rom');\n}\n\n// ── Factory ───────────────────────────────────────────────────────────\n\n/**\n * Builds the built-in curve layer for `LayeredCurveEditor`: it draws the\n * interpolated curve and its anchors, and handles dragging, inserting and\n * deleting them.\n *\n * Several can coexist on one editor as long as their ids differ — plotting a\n * derived read-only curve beside an editable one is the case it is shaped\n * for, via `interactive: false`.\n */\nexport function createFunctionLayer(cfg: FunctionLayerConfig = {}): CurveLayer<FunctionLayerState> {\n const id = cfg.id ?? 'function';\n const domain = cfg.domain ?? '2d';\n const endpoints = cfg.endpoints ?? 'free';\n const constrain = cfg.constrain ?? 'none';\n const addPointMode = cfg.addPointMode ?? 'click-curve';\n const interpolation = resolveInterpolation(cfg);\n const interactive = cfg.interactive !== false;\n const curveVisible = cfg.curve !== false && cfg.curve !== null;\n\n // ── render ──────────────────────────────────────────────────────────\n function render(state: FunctionLayerState, ctx: LayerRenderCtx): ReactNode {\n const { points, activeIndex } = state;\n const plotAnchors = projectAnchors(points, ctx);\n\n let pathD = '';\n let fillD: string | null = null;\n if (points.length >= 2) {\n const samples = sampleByInterpolation(points, SAMPLES_PER_SEGMENT, interpolation)\n .map((p) => ctx.toPlot(p));\n const parts: string[] = [`M${samples[0].x.toFixed(2)},${samples[0].y.toFixed(2)}`];\n for (let i = 1; i < samples.length; i++) {\n parts.push(`L${samples[i].x.toFixed(2)},${samples[i].y.toFixed(2)}`);\n }\n pathD = parts.join('');\n\n if (cfg.fill) {\n const closingY = cfg.fill.side === 'below' ? ctx.plotSize.height : 0;\n const first = samples[0];\n const last = samples[samples.length - 1];\n const fillParts = [...parts];\n fillParts.push(`L${last.x.toFixed(2)},${closingY.toFixed(2)}`);\n fillParts.push(`L${first.x.toFixed(2)},${closingY.toFixed(2)}`);\n fillParts.push('Z');\n fillD = fillParts.join('');\n }\n }\n\n return (\n <>\n {fillD && (\n <path\n data-curve-element=\"fill\"\n className={s.fill}\n d={fillD}\n fill={cfg.fill ? cfg.fill.color : undefined}\n />\n )}\n {pathD && curveVisible && (\n <path\n className={s.curve}\n d={pathD}\n fill=\"none\"\n />\n )}\n {interactive && plotAnchors.map((a, i) => {\n const pinned = isPinnedEndpointAt(i, points.length, endpoints);\n const locked = points[i]?.locked === true;\n if ((locked || pinned) && cfg.hideNonInteractive) return null;\n const active = activeIndex === i;\n const isEndpoint = curveVisible && (i === 0 || i === points.length - 1);\n const focus = !locked && !(endpoints === 'pinned-both' && pinned)\n ? { tabIndex: 0 }\n : {};\n const a11y = {\n ...focus,\n role: 'button',\n 'aria-label': `${cfg.label ?? 'Point'} ${i + 1} at ${formatCoord(points[i].x)}, ${formatCoord(points[i].y)}`,\n };\n if (cfg.renderAnchor) {\n const node = cfg.renderAnchor({\n point: points[i], index: i,\n cx: a.x, cy: a.y,\n isActive: active, isLocked: locked,\n isPinnedEndpoint: pinned, isEndpoint,\n });\n if (node !== null && node !== undefined) {\n return <g key={i} data-anchor-index={i} {...a11y}>{node}</g>;\n }\n }\n const anchorCls = [\n s.anchor,\n isEndpoint && s.endpoint,\n (pinned || locked) && s.pinned,\n locked && s.locked,\n active && s.active,\n ].filter(Boolean).join(' ');\n const renderAsDiamond = isEndpoint || locked;\n if (renderAsDiamond) {\n const half = locked ? LOCKED_HALF : ENDPOINT_HALF;\n return (\n <rect\n key={i}\n className={anchorCls}\n x={a.x - half}\n y={a.y - half}\n width={half * 2}\n height={half * 2}\n transform={`rotate(45 ${a.x} ${a.y})`}\n data-anchor-index={i}\n {...a11y}\n />\n );\n }\n return (\n <circle\n key={i}\n className={anchorCls}\n cx={a.x}\n cy={a.y}\n r={4}\n data-anchor-index={i}\n {...a11y}\n />\n );\n })}\n </>\n );\n }\n\n // ── hit test ────────────────────────────────────────────────────────\n function hitTest(state: FunctionLayerState, plot: PlotPoint, ctx: LayerCtx) {\n if (!interactive) return null;\n const plotAnchors = projectAnchors(state.points, ctx);\n const a = hitTestAnchor(plotAnchors, plot, ANCHOR_SNAP_PX);\n if (a) return { kind: 'anchor' as const, payload: { index: a.index } };\n if (addPointMode === 'click-curve' && curveVisible) {\n const segs = segmentSamples(state.points, interpolation, ctx);\n const c = hitTestCurve(segs, plot, CURVE_HIT_PX);\n if (c) return { kind: 'curve' as const, payload: { segIdx: c.segIdx, t: c.t } };\n }\n return null;\n }\n\n // ── move constraint, shared by drag and keyboard ────────────────────\n function moveAnchor(state: FunctionLayerState, index: number, model: ModelPoint, ctx: LayerCtx): FunctionLayerState {\n const points = state.points;\n if (index < 0 || index >= points.length) return state;\n const mr = ctx.modelRange;\n const xMin = cfg.xClamp ? cfg.xClamp[0] : mr.xMin;\n const xMax = cfg.xClamp ? cfg.xClamp[1] : mr.xMax;\n let nx = model.x;\n let ny = model.y;\n const isEndpoint = index === 0 || index === points.length - 1;\n\n if (endpoints === 'pinned-both' && isEndpoint) {\n nx = points[index].x;\n ny = points[index].y;\n } else if (endpoints === 'pinned-x' && isEndpoint) {\n nx = index === 0 ? xMin : xMax;\n } else if (constrain === 'function' || domain === '1d') {\n const epsilon = constrain === 'function'\n ? (xMax - xMin) / 1000\n : 0;\n const left = index > 0 ? points[index - 1].x + epsilon : xMin;\n const right = index < points.length - 1 ? points[index + 1].x - epsilon : xMax;\n nx = Math.max(left, Math.min(right, nx));\n }\n\n // Always clamp x to the layer's own range (so free-mode\n // interior anchors of a sub-range layer can't escape it).\n // Normalize bounds for inverted ranges.\n {\n const lo = Math.min(xMin, xMax);\n const hi = Math.max(xMin, xMax);\n nx = Math.max(lo, Math.min(hi, nx));\n }\n const clamped = clampToModelRange({ x: nx, y: ny }, ctx);\n const next = points.slice();\n next[index] = { ...points[index], x: clamped.x, y: clamped.y };\n return { ...state, points: next, activeIndex: index };\n }\n\n // ── drag gesture ────────────────────────────────────────────────────\n function makeDragGesture(index: number): LayerGesture<FunctionLayerState> {\n return {\n onMove(state, model, _e, ctx) { return moveAnchor(state, index, model, ctx); },\n onCommit(state) { return { ...state, activeIndex: null }; },\n onCancel(state) { return { ...state, activeIndex: null }; },\n };\n }\n\n // ── pointerdown on a positive hit ───────────────────────────────────\n function onPointerDown(\n state: FunctionLayerState,\n hit: { kind: string; payload?: unknown },\n e: PointerEvent,\n ctx: LayerCtx,\n extra: EmptyDownArgs<FunctionLayerState>,\n ): LayerGesture<FunctionLayerState> | void {\n if (hit.kind === 'anchor') {\n const { index } = hit.payload as { index: number };\n dlog('function-layer', 'anchor-down', { id, index, shift: ctx.modifiers.shift, button: e.button });\n if (state.points[index]?.locked) return;\n if (ctx.modifiers.shift) {\n if (isPinnedEndpointAt(index, state.points.length, endpoints)) return;\n if (cfg.minPoints !== undefined && state.points.length <= cfg.minPoints) return;\n extra.commit({\n ...state,\n points: state.points.filter((_, i) => i !== index),\n activeIndex: null,\n });\n return;\n }\n if (e.button === 2) return;\n extra.commit({ ...state, activeIndex: index });\n return makeDragGesture(index);\n }\n if (hit.kind === 'curve') {\n const { segIdx } = hit.payload as { segIdx: number; t: number };\n if (cfg.maxPoints !== undefined && state.points.length >= cfg.maxPoints) return;\n const insertIndex = segIdx + 1;\n const modelPt = clampToModelRange(extra.model, ctx);\n\n // function/1d: refuse insert that would be immediately clamped\n // against a neighbor (mouse jitter would otherwise drop a phantom\n // point directly above an existing anchor). Snap to dragging the\n // neighbor instead.\n if (constrain === 'function' || domain === '1d') {\n const epsilon = constrain === 'function'\n ? (ctx.modelRange.xMax - ctx.modelRange.xMin) / 1000\n : 0;\n const left = insertIndex > 0 ? state.points[insertIndex - 1] : null;\n const right = insertIndex < state.points.length ? state.points[insertIndex] : null;\n if (left && Math.abs(modelPt.x - left.x) < epsilon * 2) {\n extra.commit({ ...state, activeIndex: insertIndex - 1 });\n return makeDragGesture(insertIndex - 1);\n }\n if (right && Math.abs(modelPt.x - right.x) < epsilon * 2) {\n extra.commit({ ...state, activeIndex: insertIndex });\n return makeDragGesture(insertIndex);\n }\n }\n\n const nextPoints = [...state.points.slice(0, insertIndex), modelPt, ...state.points.slice(insertIndex)];\n extra.commit({ ...state, points: nextPoints, activeIndex: insertIndex });\n return makeDragGesture(insertIndex);\n }\n }\n\n // ── empty-space click ───────────────────────────────────────────────\n function onEmptyPointerDown(\n state: FunctionLayerState,\n model: ModelPoint,\n _e: PointerEvent,\n ctx: LayerCtx,\n extra: EmptyDownArgs<FunctionLayerState>,\n ): LayerGesture<FunctionLayerState> | void {\n if (!interactive) return;\n if (addPointMode !== 'click-empty') return;\n if (cfg.maxPoints !== undefined && state.points.length >= cfg.maxPoints) return;\n\n const clamped = clampToModelRange(model, ctx);\n let insertIndex = state.points.length;\n if (domain === '1d') {\n for (let i = 0; i < state.points.length; i++) {\n if (state.points[i].x > clamped.x) { insertIndex = i; break; }\n }\n }\n const nextPoints = [...state.points.slice(0, insertIndex), clamped, ...state.points.slice(insertIndex)];\n extra.commit({ ...state, points: nextPoints, activeIndex: null });\n return;\n }\n\n // ── keyboard ────────────────────────────────────────────────────────\n function onKeyDown(\n state: FunctionLayerState,\n e: KeyboardEvent,\n ctx: LayerCtx,\n extra: KeyDownArgs<FunctionLayerState>,\n ): void {\n if (!interactive) return;\n const target = e.target as Element | null;\n if (target?.closest?.('[data-layer-id]')?.getAttribute('data-layer-id') !== id) return;\n const el = target.closest('[data-anchor-index]');\n if (!el) return;\n const dx = e.key === 'ArrowRight' ? 1 : e.key === 'ArrowLeft' ? -1 : 0;\n const dy = e.key === 'ArrowUp' ? 1 : e.key === 'ArrowDown' ? -1 : 0;\n if (dx === 0 && dy === 0) return;\n e.preventDefault();\n const index = Number(el.getAttribute('data-anchor-index'));\n const p = state.points[index];\n if (!p || p.locked) return;\n const m = ctx.modelRange;\n const mult = e.shiftKey ? SHIFT_MULTIPLIER : 1;\n const xSpan = cfg.xClamp ? cfg.xClamp[1] - cfg.xClamp[0] : m.xMax - m.xMin;\n const next = moveAnchor(state, index, {\n x: p.x + dx * Math.abs(xSpan) * KEY_STEP_FRACTION * mult,\n y: p.y + dy * Math.abs(m.yMax - m.yMin) * KEY_STEP_FRACTION * mult,\n }, ctx);\n const moved = next.points[index];\n if (moved.x === p.x && moved.y === p.y) return;\n extra.commit({ ...next, activeIndex: null });\n }\n\n return {\n id,\n render,\n hitTest,\n onPointerDown,\n onEmptyPointerDown,\n onKeyDown,\n };\n}\n\n/** Convenience: build a function-layer state from a points array. */\nexport function functionLayerState(points: readonly ControlPoint[]): FunctionLayerState {\n return { points, activeIndex: null };\n}\n","/**\n * Back-compat wrapper around `LayeredCurveEditor` that preserves the\n * original single-curve API. New consumers wanting multi-layer\n * composition should reach for `LayeredCurveEditor` + `createFunctionLayer`\n * directly.\n */\nimport {\n useCallback, useEffect, useMemo, useRef, useState,\n type CSSProperties,\n type MouseEvent as ReactMouseEvent,\n type ReactNode,\n} from 'react';\nimport {\n type GridSettings,\n type AxesSettings,\n type TickSettings,\n} from '../Plot2D';\nimport type { InterpolationMode } from './interpolation';\nimport {\n createFunctionLayer,\n type ControlPoint,\n type CurveDomain,\n type EndpointMode,\n type AddPointMode,\n type CurveSettings,\n type FillSettings,\n type AnchorRenderProps,\n type FunctionLayerState,\n} from './createFunctionLayer';\nimport { LayeredCurveEditor } from './LayeredCurveEditor';\n\nexport type { GridSettings, AxesSettings, TickSettings };\nexport type {\n ControlPoint, CurveDomain, EndpointMode, AddPointMode,\n CurveSettings, FillSettings, AnchorRenderProps,\n};\n\n/**\n * Props for {@link CurveEditor}. `onInput` fires throughout a gesture and\n * `onChange` once at its end, with the pre-gesture points as `prev`.\n */\nexport interface CurveEditorProps {\n value: readonly ControlPoint[];\n onInput: (next: ControlPoint[]) => void;\n onChange?: (next: ControlPoint[], prev: readonly ControlPoint[]) => void;\n domain?: CurveDomain;\n interpolation?: InterpolationMode;\n endpoints?: EndpointMode;\n xRange?: readonly [number, number];\n yRange?: readonly [number, number];\n width: number;\n height: number;\n grid?: GridSettings | false | null;\n axes?: AxesSettings | false | null;\n xTicks?: TickSettings | false | null;\n yTicks?: TickSettings | false | null;\n curve?: CurveSettings | false | null;\n fill?: FillSettings | false | null;\n hideNonInteractive?: boolean;\n constrain?: 'none' | 'function';\n history?: boolean;\n minPoints?: number;\n maxPoints?: number;\n addPointMode?: AddPointMode;\n renderAnchor?: (info: AnchorRenderProps) => ReactNode;\n /** Extra SVG content rendered behind the curve and anchors. */\n decorations?: ReactNode;\n className?: string;\n style?: CSSProperties;\n}\n\n/**\n * Editable curve through a list of control points: drag anchors, click to\n * insert, right-click to delete, with optional built-in undo.\n *\n * This is the single-curve API, implemented as one `createFunctionLayer` on\n * a `LayeredCurveEditor`. Reach for those directly to stack several curves\n * on one plot.\n */\nexport function CurveEditor(props: CurveEditorProps) {\n const {\n value, onInput, onChange,\n domain, endpoints, interpolation, constrain, addPointMode,\n minPoints, maxPoints, curve, fill, hideNonInteractive, renderAnchor,\n width, height, xRange, yRange, grid, axes, xTicks, yTicks, history,\n className, style, decorations,\n } = props;\n\n // Layer is config-only; rebuild only when *config* changes.\n const layer = useMemo(() => createFunctionLayer({\n id: 'function',\n domain, endpoints, interpolation, constrain, addPointMode,\n minPoints, maxPoints, curve, fill, hideNonInteractive, renderAnchor,\n }), [\n domain, endpoints, interpolation, constrain, addPointMode,\n minPoints, maxPoints, curve, fill, hideNonInteractive, renderAnchor,\n ]);\n\n // Hybrid controlled-state: the wrapper holds the full FunctionLayerState\n // locally so that consumers using the original CurveEditor API don't\n // have to wire their `value` prop back through on every drag tick to\n // keep the in-flight gesture advancing. We adopt the consumer's\n // `value` prop when it changes externally (and no gesture is active).\n const [layerState, setLayerState] = useState<FunctionLayerState>(\n () => ({ points: value, activeIndex: null }),\n );\n // Ref mirror so the layerChange callback can compare against the\n // freshest state without re-binding on every render.\n const layerStateRef = useRef(layerState);\n layerStateRef.current = layerState;\n\n // Sync from controlled `value` when the consumer updates it externally\n // and we're idle. Skip the update during a gesture so drag-in-flight\n // points aren't clobbered by a stale `value`.\n useEffect(() => {\n if (layerStateRef.current.activeIndex !== null) return;\n if (layerStateRef.current.points === value) return;\n setLayerState({ points: value, activeIndex: null });\n }, [value]);\n\n const handleLayerChange = useCallback((_id: string, nextUnknown: unknown) => {\n const next = nextUnknown as FunctionLayerState;\n const prevPoints = layerStateRef.current.points;\n setLayerState(next);\n if (next.points !== prevPoints) {\n onInput(next.points as ControlPoint[]);\n }\n }, [onInput]);\n\n const handleLayerCommit = useCallback((_id: string, nextUnknown: unknown, prevUnknown: unknown) => {\n if (!onChange) return;\n const next = nextUnknown as FunctionLayerState;\n const prev = prevUnknown as FunctionLayerState;\n if (next.points !== prev.points) {\n onChange?.(next.points as ControlPoint[], prev.points);\n }\n }, [onChange]);\n\n // Right-click on an anchor → delete (preserves original CurveEditor\n // behavior). LayeredCurveEditor doesn't model contextmenu as a\n // gesture; we intercept at the wrapper level by walking the DOM\n // target for `data-anchor-index`.\n const onContextMenu = useCallback((e: ReactMouseEvent<HTMLDivElement>) => {\n const target = e.target as Element | null;\n const node = target?.closest?.('[data-anchor-index]') as Element | null;\n if (!node) return;\n e.preventDefault();\n e.stopPropagation();\n const idxAttr = node.getAttribute('data-anchor-index');\n if (idxAttr === null) return;\n const idx = Number(idxAttr);\n const points = layerStateRef.current.points;\n if (!Number.isInteger(idx) || idx < 0 || idx >= points.length) return;\n if (points[idx]?.locked) return;\n if (endpoints !== undefined && endpoints !== 'free' && (idx === 0 || idx === points.length - 1)) return;\n if (minPoints !== undefined && points.length <= minPoints) return;\n const next = points.filter((_, i) => i !== idx);\n setLayerState({ points: next, activeIndex: null });\n onInput(next as ControlPoint[]);\n onChange?.(next as ControlPoint[], points);\n }, [endpoints, minPoints, onInput, onChange]);\n\n const layers = useMemo(() => [{ layer, state: layerState }], [layer, layerState]);\n\n return (\n <div\n onContextMenu={onContextMenu}\n style={{ display: 'contents' }}\n >\n <LayeredCurveEditor\n layers={layers}\n onLayerChange={handleLayerChange}\n onLayerCommit={handleLayerCommit}\n width={width}\n height={height}\n xRange={xRange}\n yRange={yRange}\n grid={grid}\n axes={axes}\n xTicks={xTicks}\n yTicks={yTicks}\n history={history}\n className={className}\n style={style}\n >\n {decorations}\n </LayeredCurveEditor>\n </div>\n );\n}\n","import type { Op } from '@weasel-js/core';\nimport type { ControlPoint } from './CurveEditor';\n\n/**\n * The adapter contract for {@link createSetCurveOp}. Consumers wire\n * this to whatever state container holds the curve's value — typically\n * a small callback that calls a React state setter or dispatches a\n * Redux/Zustand action.\n */\nexport interface SetCurveAdapter {\n setValue(id: string, next: readonly ControlPoint[]): void;\n}\n\n/**\n * Arguments for {@link createSetCurveOp}. `coalesceKey` merges consecutive\n * edits sharing it into one history entry.\n */\nexport interface CreateSetCurveOpArgs {\n /** Stable id the consumer uses for this curve. Used so a single\n * adapter can handle multiple curves; the op's apply routes by id. */\n id: string;\n from: readonly ControlPoint[];\n to: readonly ControlPoint[];\n label?: string;\n coalesceKey?: string;\n}\n\n/**\n * Op factory for editing a CurveEditor's value through weasel-history.\n *\n * history.applyOps(\n * [createSetCurveOp({ id: 'easing', from, to, label: 'Edit easing' })],\n * 'Edit easing',\n * );\n *\n * The op's `apply(adapter)` calls `adapter.setValue(id, to)`. `invert()`\n * returns a mirror op with `from`/`to` swapped. When `from` and `to`\n * are structurally equal, `apply` returns `false` so history can skip\n * the entry — same convention as `createSetPathOp`.\n */\nexport function createSetCurveOp(args: CreateSetCurveOpArgs): Op {\n const { id, from, to, label, coalesceKey } = args;\n return {\n name: 'setCurve',\n args: { id, from, to, label, coalesceKey },\n label,\n coalesceKey,\n apply(adapter) {\n if (controlPointsEqual(from, to)) return false;\n (adapter as SetCurveAdapter).setValue(id, to);\n return undefined;\n },\n invert() {\n return createSetCurveOp({ id, from: to, to: from, label, coalesceKey });\n },\n };\n}\n\nfunction controlPointsEqual(\n a: readonly ControlPoint[],\n b: readonly ControlPoint[],\n): boolean {\n if (a === b) return true;\n if (a.length !== b.length) return false;\n for (let i = 0; i < a.length; i++) {\n if (a[i].x !== b[i].x || a[i].y !== b[i].y) return false;\n }\n return true;\n}\n"],"mappings":";;;;;AAiBA,SAAS,EAAK,GAAU,GAAU,GAAuB;CACvD,IAAM,IAAK,EAAE,IAAI,EAAE,GACb,IAAK,EAAE,IAAI,EAAE;AACnB,QAAgB,KAAK,KAAK,IAAK,IAAK,IAAK,EAAG,KAAE;;AAUhD,SAAgB,EACd,GAAW,GAAW,GAAW,GAAW,GAC5C,IAAgB,IACT;CACP,IACM,IAAK,IAAK,EAAK,GAAI,GAAI,EAAM,EAC7B,IAAK,IAAK,EAAK,GAAI,GAAI,EAAM,EAC7B,IAAK,IAAK,EAAK,GAAI,GAAI,EAAM;AAGnC,KAAI,IAAK,MAAO,EACd,QAAO;EAAE,GAAG,EAAG,KAAK,EAAG,IAAI,EAAG,KAAK;EAAG,GAAG,EAAG,KAAK,EAAG,IAAI,EAAG,KAAK;EAAG;CAGrE,IAAM,IAAI,IAAK,KAAK,IAAK,IAEnB,MAAQ,IAAK,KAAK,EAAG,KAAK,IAAI,KAAM,EAAG,MAAM,IAAK,IAClD,MAAQ,IAAK,KAAK,EAAG,KAAK,IAAI,KAAM,EAAG,MAAM,IAAK,IAClD,MAAQ,IAAK,KAAK,EAAG,KAAK,IAAI,KAAM,EAAG,MAAM,IAAK,IAClD,MAAQ,IAAK,KAAK,EAAG,KAAK,IAAI,KAAM,EAAG,MAAM,IAAK,IAClD,MAAQ,IAAK,KAAK,EAAG,KAAK,IAAI,KAAM,EAAG,MAAM,IAAK,IAClD,MAAQ,IAAK,KAAK,EAAG,KAAK,IAAI,KAAM,EAAG,MAAM,IAAK,IAElD,MAAQ,IAAK,KAAK,KAAO,IAAI,KAAM,MAAQ,IAAK,IAChD,MAAQ,IAAK,KAAK,KAAO,IAAI,KAAM,MAAQ,IAAK,IAChD,MAAQ,IAAK,KAAK,KAAO,IAAI,KAAM,MAAQ,IAAK,IAChD,MAAQ,IAAK,KAAK,KAAO,IAAI,KAAM,MAAQ,IAAK;AAItD,QAAO;EAAE,KAFI,IAAK,KAAK,KAAO,IAAI,KAAM,MAAQ,IAAK;EAErC,KADH,IAAK,KAAK,KAAO,IAAI,KAAM,MAAQ,IAAK;EAC9B;;AAUzB,SAAgB,EACd,GACA,GACA,IAAgB,IACP;AACT,KAAI,EAAQ,SAAS,EAAG,QAAO,EAAE;AACjC,CAAI,IAAoB,MAAG,IAAoB;CAE/C,IAAM,IAAI,EAAQ,QACZ,IAAe,EAAE,EAEjB,IAAsB;EAC1B,GAAG,IAAI,EAAQ,GAAG,IAAI,EAAQ,GAAG;EACjC,GAAG,IAAI,EAAQ,GAAG,IAAI,EAAQ,GAAG;EAClC,EACK,IAAoB;EACxB,GAAG,IAAI,EAAQ,IAAI,GAAG,IAAI,EAAQ,IAAI,GAAG;EACzC,GAAG,IAAI,EAAQ,IAAI,GAAG,IAAI,EAAQ,IAAI,GAAG;EAC1C;AAED,MAAK,IAAI,IAAI,GAAG,IAAI,IAAI,GAAG,KAAK;EAC9B,IAAM,IAAK,MAAM,IAAI,IAAe,EAAQ,IAAI,IAC1C,IAAK,EAAQ,IACb,IAAK,EAAQ,IAAI,IACjB,IAAK,IAAI,IAAI,IAAI,EAAQ,IAAI,KAAK,GAClC,IAAS,MAAM,IAAI,IAAI;AAC7B,OAAK,IAAI,IAAI,GAAQ,KAAK,GAAmB,KAAK;AAChD,OAAI,MAAM,GAAG;AACX,MAAI,KAAK,EAAG;AACZ;;AAEF,OAAI,MAAM,GAAmB;AAC3B,MAAI,KAAK,EAAG;AACZ;;GAEF,IAAM,IAAI,IAAI;AACd,KAAI,KAAK,EAAgB,GAAI,GAAI,GAAI,GAAI,GAAG,EAAM,CAAC;;;AAGvD,QAAO;;;;ACtFT,SAAS,EAAS,GAAiC;CACjD,IAAM,IAAI,EAAG;AACb,KAAI,MAAM,EAAG,QAAO,EAAE;AACtB,KAAI,MAAM,EAAG,QAAO,CAAC,EAAE;CAGvB,IAAM,IAAkB,MAAM,IAAI,EAAE;AACpC,MAAK,IAAI,IAAI,GAAG,IAAI,IAAI,GAAG,IAAK,GAAE,KAAK,EAAG,IAAI,KAAK,EAAG;CAEtD,IAAM,IAAkB,MAAM,EAAE;AAEhC,CADA,EAAE,KAAK,EAAE,IACT,EAAE,IAAI,KAAK,EAAE,IAAI;AAEjB,MAAK,IAAI,IAAI,GAAG,IAAI,IAAI,GAAG,IACzB,KAAI,EAAE,IAAI,KAAK,EAAE,MAAM,EAGrB,GAAE,KAAK;MACF;EAIL,IAAM,KAAO,EAAE,IAAI,KAAK,EAAE,MAAM,GAC1B,IAAM,KAAK,IAAI,KAAK,IAAI,EAAE,IAAI,GAAG,EAAE,KAAK,IAAI,EAAE,GAAG,EAAE,KAAK,IAAI,EAAI,CAAC;AACvE,IAAE,KAAK,KAAK,KAAK,EAAI,GAAG;;AAG5B,QAAO;;AAKT,SAAS,EACP,GAAY,GAAY,GAAY,GAAY,GACxC;CACR,IAAM,IAAK,IAAI,GACT,IAAK,IAAK;AAChB,SACG,IAAI,IAAK,IAAI,IAAK,KAAK,KACvB,IAAK,IAAI,IAAK,KAAK,KACnB,KAAK,IAAK,IAAI,KAAM,KACpB,IAAK,KAAM;;AAShB,SAAgB,EACd,GACA,GACS;AACT,KAAI,EAAQ,SAAS,EAAG,QAAO,EAAE;AACjC,CAAI,IAAoB,MAAG,IAAoB;CAE/C,IAAM,IAAI,EAAQ,QACZ,IAAK,EAAQ,KAAK,MAAM,EAAE,EAAE,EAC5B,IAAK,EAAQ,KAAK,MAAM,EAAE,EAAE,EAC5B,IAAK,EAAS,EAAG,EACjB,IAAK,EAAS,EAAG,EAEjB,IAAe,EAAE;AACvB,MAAK,IAAI,IAAI,GAAG,IAAI,IAAI,GAAG,KAAK;EAC9B,IAAM,IAAY,MAAM,IAAI,IAAI;AAChC,OAAK,IAAI,IAAI,GAAW,KAAK,GAAmB,KAAK;AACnD,OAAI,MAAM,GAAG;AAAE,MAAI,KAAK,EAAQ,GAAG;AAAE;;AACrC,OAAI,MAAM,GAAmB;AAAE,MAAI,KAAK,EAAQ,IAAI,GAAG;AAAE;;GACzD,IAAM,IAAI,IAAI;AACd,KAAI,KAAK;IACP,GAAG,EAAQ,EAAG,IAAI,EAAG,IAAI,IAAI,EAAG,IAAI,EAAG,IAAI,IAAI,EAAE;IACjD,GAAG,EAAQ,EAAG,IAAI,EAAG,IAAI,IAAI,EAAG,IAAI,EAAG,IAAI,IAAI,EAAE;IAClD,CAAC;;;AAGN,QAAO;;;;AC3ET,SAAS,EACP,GACA,GACS;AACT,KAAI,EAAQ,SAAS,EAAG,QAAO,EAAE;AACjC,CAAI,IAAoB,MAAG,IAAoB;CAE/C,IAAM,IAAe,EAAE;AACvB,MAAK,IAAI,IAAI,GAAG,IAAI,EAAQ,SAAS,GAAG,KAAK;EAC3C,IAAM,IAAI,EAAQ,IACZ,IAAI,EAAQ,IAAI,IAChB,IAAY,MAAM,IAAI,IAAI;AAChC,OAAK,IAAI,IAAI,GAAW,KAAK,GAAmB,KAAK;AACnD,OAAI,MAAM,GAAG;AAAE,MAAI,KAAK,EAAE;AAAE;;AAC5B,OAAI,MAAM,GAAmB;AAAE,MAAI,KAAK,EAAE;AAAE;;GAC5C,IAAM,IAAI,IAAI;AACd,KAAI,KAAK;IAAE,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK;IAAG,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK;IAAG,CAAC;;;AAGpE,QAAO;;AAIT,SAAgB,EACd,GACA,GACA,GACS;AACT,SAAQ,GAAR;EACE,KAAK,SACH,QAAO,EAAa,GAAS,EAAkB;EACjD,KAAK,sBACH,QAAO,EAAiB,GAAS,GAAmB,EAAE;EACxD,KAAK,sBACH,QAAO,EAAiB,GAAS,GAAmB,EAAE;EACxD,KAAK,WACH,QAAO,EAAe,GAAS,EAAkB;EAEnD,QACE,QAAO,EAAiB,GAAS,GAAmB,GAAI;;;;;ACqD9D,IAAM,IAAsB,IACtB,IAAgB,EAAW,uBAAuB,EAClD,IAAc,EAAW,uBAAuB,EAChD,IAAiB,IACjB,IAAe,GAEf,IAAoB,KACpB,IAAmB,IAEnB,KAAe,MAAsB,OAAO,OAAO,EAAE,QAAQ,EAAE,CAAC,CAAC;AAIvE,SAAS,EAAkB,GAAe,GAA2B;CACnE,IAAM,IAAI,EAAI,YACR,IAAM,KAAK,IAAI,EAAE,MAAM,EAAE,KAAK,EAC9B,IAAM,KAAK,IAAI,EAAE,MAAM,EAAE,KAAK,EAC9B,IAAM,KAAK,IAAI,EAAE,MAAM,EAAE,KAAK,EAC9B,IAAM,KAAK,IAAI,EAAE,MAAM,EAAE,KAAK;AACpC,QAAO;EACL,GAAG,KAAK,IAAI,GAAK,KAAK,IAAI,GAAK,EAAE,EAAE,CAAC;EACpC,GAAG,KAAK,IAAI,GAAK,KAAK,IAAI,GAAK,EAAE,EAAE,CAAC;EACrC;;AAGH,SAAS,EAAmB,GAAe,GAAe,GAAkC;AAE1F,QADI,MAAc,SAAe,KAC1B,MAAU,KAAK,MAAU,IAAQ;;AAG1C,SAAS,EAAe,GAAiC,GAA4B;AACnF,QAAO,EAAO,KAAK,MAAM,EAAI,OAAO,EAAE,CAAC;;AAGzC,SAAS,EACP,GACA,GACA,GACe;AACf,KAAI,EAAO,SAAS,EAAG,QAAO,EAAE;CAChC,IAAM,IAAM,EAAsB,GAAQ,GAAqB,EAAc,EACvE,IAAqB,EAAE;AAC7B,MAAK,IAAI,IAAI,GAAG,IAAI,EAAO,SAAS,GAAG,KAAK;EAC1C,IAAM,IAAQ,IAAI,GACZ,IAAM,IAAQ,GACd,IAAQ,EAAI,MAAM,GAAO,IAAM,EAAE;AACvC,IAAI,KAAK,EAAM,KAAK,MAAM,EAAI,OAAO,EAAE,CAAC,CAAC;;AAE3C,QAAO;;AAGT,SAAS,EAAqB,GAA6C;AACzE,SAAQ,EAAI,aAAa,YAAY,aACjC,aACC,EAAI,iBAAiB;;AAc5B,SAAgB,EAAoB,IAA2B,EAAE,EAAkC;CACjG,IAAM,IAAK,EAAI,MAAM,YACf,IAAS,EAAI,UAAU,MACvB,IAAY,EAAI,aAAa,QAC7B,IAAY,EAAI,aAAa,QAC7B,IAAe,EAAI,gBAAgB,eACnC,IAAgB,EAAqB,EAAI,EACzC,IAAc,EAAI,gBAAgB,IAClC,IAAe,EAAI,UAAU,MAAS,EAAI,UAAU;CAG1D,SAAS,EAAO,GAA2B,GAAgC;EACzE,IAAM,EAAE,WAAQ,mBAAgB,GAC1B,IAAc,EAAe,GAAQ,EAAI,EAE3C,IAAQ,IACR,IAAuB;AAC3B,MAAI,EAAO,UAAU,GAAG;GACtB,IAAM,IAAU,EAAsB,GAAQ,GAAqB,EAAc,CAC9E,KAAK,MAAM,EAAI,OAAO,EAAE,CAAC,EACtB,IAAkB,CAAC,IAAI,EAAQ,GAAG,EAAE,QAAQ,EAAE,CAAC,GAAG,EAAQ,GAAG,EAAE,QAAQ,EAAE,GAAG;AAClF,QAAK,IAAI,IAAI,GAAG,IAAI,EAAQ,QAAQ,IAClC,GAAM,KAAK,IAAI,EAAQ,GAAG,EAAE,QAAQ,EAAE,CAAC,GAAG,EAAQ,GAAG,EAAE,QAAQ,EAAE,GAAG;AAItE,OAFA,IAAQ,EAAM,KAAK,GAAG,EAElB,EAAI,MAAM;IACZ,IAAM,IAAW,EAAI,KAAK,SAAS,UAAU,EAAI,SAAS,SAAS,GAC7D,IAAQ,EAAQ,IAChB,IAAO,EAAQ,EAAQ,SAAS,IAChC,IAAY,CAAC,GAAG,EAAM;AAI5B,IAHA,EAAU,KAAK,IAAI,EAAK,EAAE,QAAQ,EAAE,CAAC,GAAG,EAAS,QAAQ,EAAE,GAAG,EAC9D,EAAU,KAAK,IAAI,EAAM,EAAE,QAAQ,EAAE,CAAC,GAAG,EAAS,QAAQ,EAAE,GAAG,EAC/D,EAAU,KAAK,IAAI,EACnB,IAAQ,EAAU,KAAK,GAAG;;;AAI9B,SACE,kBAAA,GAAA,EAAA,UAAA;GACG,KACC,kBAAC,QAAD;IACE,sBAAmB;IACnB,WAAW,EAAE;IACb,GAAG;IACH,MAAM,EAAI,OAAO,EAAI,KAAK,QAAQ,KAAA;IAClC,CAAA;GAEH,KAAS,KACR,kBAAC,QAAD;IACE,WAAW,EAAE;IACV;IACH,MAAK;IACL,CAAA;GAEH,KAAe,EAAY,KAAK,GAAG,MAAM;IACxC,IAAM,IAAS,EAAmB,GAAG,EAAO,QAAQ,EAAU,EACxD,IAAS,EAAO,IAAI,WAAW;AACrC,SAAK,KAAU,MAAW,EAAI,mBAAoB,QAAO;IACzD,IAAM,IAAS,MAAgB,GACzB,IAAa,MAAiB,MAAM,KAAK,MAAM,EAAO,SAAS,IAI/D,IAAO;KACX,GAJY,CAAC,KAAU,EAAE,MAAc,iBAAiB,KACtD,EAAE,UAAU,GAAG,GACf,EAAE;KAGJ,MAAM;KACN,cAAc,GAAG,EAAI,SAAS,QAAQ,GAAG,IAAI,EAAE,MAAM,EAAY,EAAO,GAAG,EAAE,CAAC,IAAI,EAAY,EAAO,GAAG,EAAE;KAC3G;AACD,QAAI,EAAI,cAAc;KACpB,IAAM,IAAO,EAAI,aAAa;MAC5B,OAAO,EAAO;MAAI,OAAO;MACzB,IAAI,EAAE;MAAG,IAAI,EAAE;MACf,UAAU;MAAQ,UAAU;MAC5B,kBAAkB;MAAQ;MAC3B,CAAC;AACF,SAAI,KAAS,KACX,QAAO,kBAAC,KAAD;MAAW,qBAAmB;MAAG,GAAI;gBAAO;MAAS,EAA7C,EAA6C;;IAGhE,IAAM,IAAY;KAChB,EAAE;KACF,KAAc,EAAE;MACf,KAAU,MAAW,EAAE;KACxB,KAAU,EAAE;KACZ,KAAU,EAAE;KACb,CAAC,OAAO,QAAQ,CAAC,KAAK,IAAI;AAE3B,QADwB,KAAc,GACjB;KACnB,IAAM,IAAO,IAAS,IAAc;AACpC,YACE,kBAAC,QAAD;MAEE,WAAW;MACX,GAAG,EAAE,IAAI;MACT,GAAG,EAAE,IAAI;MACT,OAAO,IAAO;MACd,QAAQ,IAAO;MACf,WAAW,aAAa,EAAE,EAAE,GAAG,EAAE,EAAE;MACnC,qBAAmB;MACnB,GAAI;MACJ,EATK,EASL;;AAGN,WACE,kBAAC,UAAD;KAEE,WAAW;KACX,IAAI,EAAE;KACN,IAAI,EAAE;KACN,GAAG;KACH,qBAAmB;KACnB,GAAI;KACJ,EAPK,EAOL;KAEJ;GACD,EAAA,CAAA;;CAKP,SAAS,EAAQ,GAA2B,GAAiB,GAAe;AAC1E,MAAI,CAAC,EAAa,QAAO;EAEzB,IAAM,IAAI,EADU,EAAe,EAAM,QAAQ,EACzB,EAAa,GAAM,EAAe;AAC1D,MAAI,EAAG,QAAO;GAAE,MAAM;GAAmB,SAAS,EAAE,OAAO,EAAE,OAAO;GAAE;AACtE,MAAI,MAAiB,iBAAiB,GAAc;GAElD,IAAM,IAAI,EADG,EAAe,EAAM,QAAQ,GAAe,EAClC,EAAM,GAAM,EAAa;AAChD,OAAI,EAAG,QAAO;IAAE,MAAM;IAAkB,SAAS;KAAE,QAAQ,EAAE;KAAQ,GAAG,EAAE;KAAG;IAAE;;AAEjF,SAAO;;CAIT,SAAS,EAAW,GAA2B,GAAe,GAAmB,GAAmC;EAClH,IAAM,IAAS,EAAM;AACrB,MAAI,IAAQ,KAAK,KAAS,EAAO,OAAQ,QAAO;EAChD,IAAM,IAAK,EAAI,YACT,IAAO,EAAI,SAAS,EAAI,OAAO,KAAK,EAAG,MACvC,IAAO,EAAI,SAAS,EAAI,OAAO,KAAK,EAAG,MACzC,IAAK,EAAM,GACX,IAAK,EAAM,GACT,IAAa,MAAU,KAAK,MAAU,EAAO,SAAS;AAE5D,MAAI,MAAc,iBAAiB,EAEjC,CADA,IAAK,EAAO,GAAO,GACnB,IAAK,EAAO,GAAO;WACV,MAAc,cAAc,EACrC,KAAK,MAAU,IAAI,IAAO;WACjB,MAAc,cAAc,MAAW,MAAM;GACtD,IAAM,IAAU,MAAc,cACzB,IAAO,KAAQ,MAChB,GACE,IAAO,IAAQ,IAAI,EAAO,IAAQ,GAAG,IAAI,IAAU,GACnD,IAAQ,IAAQ,EAAO,SAAS,IAAI,EAAO,IAAQ,GAAG,IAAI,IAAU;AAC1E,OAAK,KAAK,IAAI,GAAM,KAAK,IAAI,GAAO,EAAG,CAAC;;AASxC,MAAK,KAAK,IAFC,KAAK,IAAI,GAAM,EAEZ,EAAI,KAAK,IADZ,KAAK,IAAI,GAAM,EACC,EAAI,EAAG,CAAC;EAErC,IAAM,IAAU,EAAkB;GAAE,GAAG;GAAI,GAAG;GAAI,EAAE,EAAI,EAClD,IAAO,EAAO,OAAO;AAE3B,SADA,EAAK,KAAS;GAAE,GAAG,EAAO;GAAQ,GAAG,EAAQ;GAAG,GAAG,EAAQ;GAAG,EACvD;GAAE,GAAG;GAAO,QAAQ;GAAM,aAAa;GAAO;;CAIvD,SAAS,EAAgB,GAAiD;AACxE,SAAO;GACL,OAAO,GAAO,GAAO,GAAI,GAAK;AAAE,WAAO,EAAW,GAAO,GAAO,GAAO,EAAI;;GAC3E,SAAS,GAAO;AAAE,WAAO;KAAE,GAAG;KAAO,aAAa;KAAM;;GACxD,SAAS,GAAO;AAAE,WAAO;KAAE,GAAG;KAAO,aAAa;KAAM;;GACzD;;CAIH,SAAS,EACP,GACA,GACA,GACA,GACA,GACyC;AACzC,MAAI,EAAI,SAAS,UAAU;GACzB,IAAM,EAAE,aAAU,EAAI;AAEtB,OADA,EAAK,kBAAkB,eAAe;IAAE;IAAI;IAAO,OAAO,EAAI,UAAU;IAAO,QAAQ,EAAE;IAAQ,CAAC,EAC9F,EAAM,OAAO,IAAQ,OAAQ;AACjC,OAAI,EAAI,UAAU,OAAO;AAEvB,QADI,EAAmB,GAAO,EAAM,OAAO,QAAQ,EAAU,IACzD,EAAI,cAAc,KAAA,KAAa,EAAM,OAAO,UAAU,EAAI,UAAW;AACzE,MAAM,OAAO;KACX,GAAG;KACH,QAAQ,EAAM,OAAO,QAAQ,GAAG,MAAM,MAAM,EAAM;KAClD,aAAa;KACd,CAAC;AACF;;AAIF,UAFI,EAAE,WAAW,IAAG,UACpB,EAAM,OAAO;IAAE,GAAG;IAAO,aAAa;IAAO,CAAC,EACvC,EAAgB,EAAM;;AAE/B,MAAI,EAAI,SAAS,SAAS;GACxB,IAAM,EAAE,cAAW,EAAI;AACvB,OAAI,EAAI,cAAc,KAAA,KAAa,EAAM,OAAO,UAAU,EAAI,UAAW;GACzE,IAAM,IAAc,IAAS,GACvB,IAAU,EAAkB,EAAM,OAAO,EAAI;AAMnD,OAAI,MAAc,cAAc,MAAW,MAAM;IAC/C,IAAM,IAAU,MAAc,cACzB,EAAI,WAAW,OAAO,EAAI,WAAW,QAAQ,MAC9C,GACE,IAAO,IAAc,IAAI,EAAM,OAAO,IAAc,KAAK,MACzD,IAAQ,IAAc,EAAM,OAAO,SAAS,EAAM,OAAO,KAAe;AAC9E,QAAI,KAAQ,KAAK,IAAI,EAAQ,IAAI,EAAK,EAAE,GAAG,IAAU,EAEnD,QADA,EAAM,OAAO;KAAE,GAAG;KAAO,aAAa,IAAc;KAAG,CAAC,EACjD,EAAgB,IAAc,EAAE;AAEzC,QAAI,KAAS,KAAK,IAAI,EAAQ,IAAI,EAAM,EAAE,GAAG,IAAU,EAErD,QADA,EAAM,OAAO;KAAE,GAAG;KAAO,aAAa;KAAa,CAAC,EAC7C,EAAgB,EAAY;;GAIvC,IAAM,IAAa;IAAC,GAAG,EAAM,OAAO,MAAM,GAAG,EAAY;IAAE;IAAS,GAAG,EAAM,OAAO,MAAM,EAAY;IAAC;AAEvG,UADA,EAAM,OAAO;IAAE,GAAG;IAAO,QAAQ;IAAY,aAAa;IAAa,CAAC,EACjE,EAAgB,EAAY;;;CAKvC,SAAS,EACP,GACA,GACA,GACA,GACA,GACyC;AAGzC,MAFI,CAAC,KACD,MAAiB,iBACjB,EAAI,cAAc,KAAA,KAAa,EAAM,OAAO,UAAU,EAAI,UAAW;EAEzE,IAAM,IAAU,EAAkB,GAAO,EAAI,EACzC,IAAc,EAAM,OAAO;AAC/B,MAAI,MAAW;QACR,IAAI,IAAI,GAAG,IAAI,EAAM,OAAO,QAAQ,IACvC,KAAI,EAAM,OAAO,GAAG,IAAI,EAAQ,GAAG;AAAE,QAAc;AAAG;;;EAG1D,IAAM,IAAa;GAAC,GAAG,EAAM,OAAO,MAAM,GAAG,EAAY;GAAE;GAAS,GAAG,EAAM,OAAO,MAAM,EAAY;GAAC;AACvG,IAAM,OAAO;GAAE,GAAG;GAAO,QAAQ;GAAY,aAAa;GAAM,CAAC;;CAKnE,SAAS,EACP,GACA,GACA,GACA,GACM;AACN,MAAI,CAAC,EAAa;EAClB,IAAM,IAAS,EAAE;AACjB,MAAI,GAAQ,UAAU,kBAAkB,EAAE,aAAa,gBAAgB,KAAK,EAAI;EAChF,IAAM,IAAK,EAAO,QAAQ,sBAAsB;AAChD,MAAI,CAAC,EAAI;EACT,IAAM,IAAK,EAAE,QAAQ,eAAe,IAAI,EAAE,QAAQ,cAAc,KAAK,GAC/D,IAAK,EAAE,QAAQ,YAAY,IAAI,EAAE,QAAQ,cAAc,KAAK;AAClE,MAAI,MAAO,KAAK,MAAO,EAAG;AAC1B,IAAE,gBAAgB;EAClB,IAAM,IAAQ,OAAO,EAAG,aAAa,oBAAoB,CAAC,EACpD,IAAI,EAAM,OAAO;AACvB,MAAI,CAAC,KAAK,EAAE,OAAQ;EACpB,IAAM,IAAI,EAAI,YACR,IAAO,EAAE,WAAW,IAAmB,GACvC,IAAQ,EAAI,SAAS,EAAI,OAAO,KAAK,EAAI,OAAO,KAAK,EAAE,OAAO,EAAE,MAChE,IAAO,EAAW,GAAO,GAAO;GACpC,GAAG,EAAE,IAAI,IAAK,KAAK,IAAI,EAAM,GAAG,IAAoB;GACpD,GAAG,EAAE,IAAI,IAAK,KAAK,IAAI,EAAE,OAAO,EAAE,KAAK,GAAG,IAAoB;GAC/D,EAAE,EAAI,EACD,IAAQ,EAAK,OAAO;AACtB,IAAM,MAAM,EAAE,KAAK,EAAM,MAAM,EAAE,KACrC,EAAM,OAAO;GAAE,GAAG;GAAM,aAAa;GAAM,CAAC;;AAG9C,QAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACD;;AAIH,SAAgB,EAAmB,GAAqD;AACtF,QAAO;EAAE;EAAQ,aAAa;EAAM;;;;AC5ZtC,SAAgB,EAAY,GAAyB;CACnD,IAAM,EACJ,UAAO,YAAS,aAChB,WAAQ,cAAW,kBAAe,cAAW,iBAC7C,cAAW,cAAW,UAAO,SAAM,uBAAoB,iBACvD,UAAO,WAAQ,WAAQ,WAAQ,SAAM,SAAM,WAAQ,WAAQ,YAC3D,cAAW,UAAO,mBAChB,GAGE,IAAQ,QAAc,EAAoB;EAC9C,IAAI;EACJ;EAAQ;EAAW;EAAe;EAAW;EAC7C;EAAW;EAAW;EAAO;EAAM;EAAoB;EACxD,CAAC,EAAE;EACF;EAAQ;EAAW;EAAe;EAAW;EAC7C;EAAW;EAAW;EAAO;EAAM;EAAoB;EACxD,CAAC,EAOI,CAAC,GAAY,KAAiB,SAC3B;EAAE,QAAQ;EAAO,aAAa;EAAM,EAC5C,EAGK,IAAgB,EAAO,EAAW;AAMxC,CALA,EAAc,UAAU,GAKxB,QAAgB;AACV,IAAc,QAAQ,gBAAgB,QACtC,EAAc,QAAQ,WAAW,KACrC,EAAc;GAAE,QAAQ;GAAO,aAAa;GAAM,CAAC;IAClD,CAAC,EAAM,CAAC;CAEX,IAAM,IAAoB,GAAa,GAAa,MAAyB;EAC3E,IAAM,IAAO,GACP,IAAa,EAAc,QAAQ;AAEzC,EADA,EAAc,EAAK,EACf,EAAK,WAAW,KAClB,EAAQ,EAAK,OAAyB;IAEvC,CAAC,EAAQ,CAAC,EAEP,IAAoB,GAAa,GAAa,GAAsB,MAAyB;AACjG,MAAI,CAAC,EAAU;EACf,IAAM,IAAO,GACP,IAAO;AACb,EAAI,EAAK,WAAW,EAAK,UACvB,IAAW,EAAK,QAA0B,EAAK,OAAO;IAEvD,CAAC,EAAS,CAAC;AA4Bd,QACE,kBAAC,OAAD;EACiB,eAxBG,GAAa,MAAuC;GAExE,IAAM,IADS,EAAE,QACI,UAAU,sBAAsB;AACrD,OAAI,CAAC,EAAM;AAEX,GADA,EAAE,gBAAgB,EAClB,EAAE,iBAAiB;GACnB,IAAM,IAAU,EAAK,aAAa,oBAAoB;AACtD,OAAI,MAAY,KAAM;GACtB,IAAM,IAAM,OAAO,EAAQ,EACrB,IAAS,EAAc,QAAQ;AAIrC,OAHI,CAAC,OAAO,UAAU,EAAI,IAAI,IAAM,KAAK,KAAO,EAAO,UACnD,EAAO,IAAM,UACb,MAAc,KAAA,KAAa,MAAc,WAAW,MAAQ,KAAK,MAAQ,EAAO,SAAS,MACzF,MAAc,KAAA,KAAa,EAAO,UAAU,EAAW;GAC3D,IAAM,IAAO,EAAO,QAAQ,GAAG,MAAM,MAAM,EAAI;AAG/C,GAFA,EAAc;IAAE,QAAQ;IAAM,aAAa;IAAM,CAAC,EAClD,EAAQ,EAAuB,EAC/B,IAAW,GAAwB,EAAO;KACzC;GAAC;GAAW;GAAW;GAAS;GAAS,CAMzB;EACf,OAAO,EAAE,SAAS,YAAY;YAE9B,kBAAC,GAAD;GACU,QARC,QAAc,CAAC;IAAE;IAAO,OAAO;IAAY,CAAC,EAAE,CAAC,GAAO,EAAW,CAQlE;GACR,eAAe;GACf,eAAe;GACR;GACC;GACA;GACA;GACF;GACA;GACE;GACA;GACC;GACE;GACJ;aAEN;GACkB,CAAA;EACjB,CAAA;;;;ACnJV,SAAgB,EAAiB,GAAgC;CAC/D,IAAM,EAAE,OAAI,SAAM,OAAI,UAAO,mBAAgB;AAC7C,QAAO;EACL,MAAM;EACN,MAAM;GAAE;GAAI;GAAM;GAAI;GAAO;GAAa;EAC1C;EACA;EACA,MAAM,GAAS;AACb,OAAI,EAAmB,GAAM,EAAG,CAAE,QAAO;AACxC,KAA4B,SAAS,GAAI,EAAG;;EAG/C,SAAS;AACP,UAAO,EAAiB;IAAE;IAAI,MAAM;IAAI,IAAI;IAAM;IAAO;IAAa,CAAC;;EAE1E;;AAGH,SAAS,EACP,GACA,GACS;AACT,KAAI,MAAM,EAAG,QAAO;AACpB,KAAI,EAAE,WAAW,EAAE,OAAQ,QAAO;AAClC,MAAK,IAAI,IAAI,GAAG,IAAI,EAAE,QAAQ,IAC5B,KAAI,EAAE,GAAG,MAAM,EAAE,GAAG,KAAK,EAAE,GAAG,MAAM,EAAE,GAAG,EAAG,QAAO;AAErD,QAAO"}
|
|
@@ -0,0 +1,152 @@
|
|
|
1
|
+
import { t as e } from "./useReorderDragList-Dcezzgix.js";
|
|
2
|
+
import { t } from "./Disclosure-D79jhmh2.js";
|
|
3
|
+
import { Fragment as n, jsx as r, jsxs as i } from "react/jsx-runtime";
|
|
4
|
+
import { Fragment as a, useId as o, useMemo as s, useState as c } from "react";
|
|
5
|
+
var l = {
|
|
6
|
+
grid: "_grid_12i61_1",
|
|
7
|
+
table: "_table_12i61_6",
|
|
8
|
+
sortButton: "_sortButton_12i61_32",
|
|
9
|
+
sortActive: "_sortActive_12i61_44",
|
|
10
|
+
empty: "_empty_12i61_46",
|
|
11
|
+
handleCol: "_handleCol_12i61_54",
|
|
12
|
+
handleCell: "_handleCell_12i61_55",
|
|
13
|
+
dragging: "_dragging_12i61_64",
|
|
14
|
+
dropBefore: "_dropBefore_12i61_66",
|
|
15
|
+
dropAfter: "_dropAfter_12i61_67",
|
|
16
|
+
clickable: "_clickable_12i61_70",
|
|
17
|
+
detailCol: "_detailCol_12i61_78",
|
|
18
|
+
detailCell: "_detailCell_12i61_79",
|
|
19
|
+
detailRow: "_detailRow_12i61_85"
|
|
20
|
+
}, u = "a[href], button, input, select, textarea, label, summary, [role=\"button\"], [contenteditable=\"true\"]";
|
|
21
|
+
function d(e) {
|
|
22
|
+
let t = e.target?.closest?.(u);
|
|
23
|
+
return !!t && e.currentTarget.contains(t);
|
|
24
|
+
}
|
|
25
|
+
function f(u) {
|
|
26
|
+
let { rows: f, columns: p, defaultSort: m, onReorder: h, empty: g = "—", className: _, rowClassName: v, onRowClick: y, renderDetail: b, rowExpandable: x, expandedIds: S, defaultExpandedIds: C, onExpandedChange: w } = u, [T, E] = c(m ?? null), [D, O] = c(() => new Set(C)), k = S ?? D, A = o(), j = (e) => {
|
|
27
|
+
let t = new Set(k);
|
|
28
|
+
t.has(e) ? t.delete(e) : t.add(e), S || O(t), w?.(t);
|
|
29
|
+
}, M = s(() => {
|
|
30
|
+
if (!T) return [...f];
|
|
31
|
+
let e = p.find((e) => e.id === T.columnId);
|
|
32
|
+
if (!e) return [...f];
|
|
33
|
+
let t = e.accessor ?? ((t) => t[e.id]), n = T.direction === "asc" ? 1 : -1;
|
|
34
|
+
return [...f].sort((e, r) => {
|
|
35
|
+
let i = t(e), a = t(r);
|
|
36
|
+
return i == null && a == null ? 0 : i == null ? 1 : a == null ? -1 : i < a ? -1 * n : i > a ? 1 * n : 0;
|
|
37
|
+
});
|
|
38
|
+
}, [
|
|
39
|
+
f,
|
|
40
|
+
p,
|
|
41
|
+
T
|
|
42
|
+
]), N = (e) => {
|
|
43
|
+
E((t) => !t || t.columnId !== e ? {
|
|
44
|
+
columnId: e,
|
|
45
|
+
direction: "asc"
|
|
46
|
+
} : t.direction === "asc" ? {
|
|
47
|
+
columnId: e,
|
|
48
|
+
direction: "desc"
|
|
49
|
+
} : null);
|
|
50
|
+
}, P = e({
|
|
51
|
+
items: M.map((e) => ({
|
|
52
|
+
id: e.id,
|
|
53
|
+
label: ""
|
|
54
|
+
})),
|
|
55
|
+
selectedIds: [],
|
|
56
|
+
onReorder: h ?? (() => {}),
|
|
57
|
+
rowSelector: ":not([data-detail-of])"
|
|
58
|
+
}), F = !!h, I = !!b, L = p.length + +!!F + +!!I;
|
|
59
|
+
return /* @__PURE__ */ r("div", {
|
|
60
|
+
className: [l.grid, _].filter(Boolean).join(" "),
|
|
61
|
+
children: /* @__PURE__ */ i("table", {
|
|
62
|
+
className: l.table,
|
|
63
|
+
children: [/* @__PURE__ */ r("thead", { children: /* @__PURE__ */ i("tr", { children: [
|
|
64
|
+
F && /* @__PURE__ */ r("th", {
|
|
65
|
+
className: l.handleCol,
|
|
66
|
+
"aria-label": "drag"
|
|
67
|
+
}),
|
|
68
|
+
I && /* @__PURE__ */ r("th", {
|
|
69
|
+
className: l.detailCol,
|
|
70
|
+
"aria-label": "details"
|
|
71
|
+
}),
|
|
72
|
+
p.map((e) => {
|
|
73
|
+
let t = e.sortable !== !1, a = T?.columnId === e.id, o = a ? T.direction === "asc" ? " ↑" : " ↓" : "";
|
|
74
|
+
return /* @__PURE__ */ r("th", {
|
|
75
|
+
className: [e.className, a ? l.sortActive : ""].filter(Boolean).join(" "),
|
|
76
|
+
"aria-sort": t ? a ? T.direction === "asc" ? "ascending" : "descending" : "none" : void 0,
|
|
77
|
+
children: t ? /* @__PURE__ */ i("button", {
|
|
78
|
+
type: "button",
|
|
79
|
+
className: l.sortButton,
|
|
80
|
+
onClick: () => N(e.id),
|
|
81
|
+
children: [e.header, o]
|
|
82
|
+
}) : /* @__PURE__ */ i(n, { children: [e.header, o] })
|
|
83
|
+
}, e.id);
|
|
84
|
+
})
|
|
85
|
+
] }) }), /* @__PURE__ */ i("tbody", {
|
|
86
|
+
ref: F ? P.containerProps.ref : void 0,
|
|
87
|
+
children: [M.length === 0 && /* @__PURE__ */ r("tr", { children: /* @__PURE__ */ r("td", {
|
|
88
|
+
colSpan: L,
|
|
89
|
+
className: l.empty,
|
|
90
|
+
children: g
|
|
91
|
+
}) }), M.map((e, n) => {
|
|
92
|
+
let o = P.state.draggedIds?.includes(e.id) ?? !1, s = P.state.targetIndex, c = I && (x?.(e) ?? !0), u = c && k.has(e.id), f = u ? b(e) : null, m = `${A}-detail-${e.id}`;
|
|
93
|
+
return /* @__PURE__ */ i(a, { children: [/* @__PURE__ */ i("tr", {
|
|
94
|
+
className: [
|
|
95
|
+
y && l.clickable,
|
|
96
|
+
o && l.dragging,
|
|
97
|
+
s === n && l.dropBefore,
|
|
98
|
+
s === M.length && n === M.length - 1 && l.dropAfter,
|
|
99
|
+
v?.(e)
|
|
100
|
+
].filter(Boolean).join(" ") || void 0,
|
|
101
|
+
"data-expanded": u || void 0,
|
|
102
|
+
tabIndex: y ? 0 : void 0,
|
|
103
|
+
onClick: y ? (t) => {
|
|
104
|
+
d(t) || y(e);
|
|
105
|
+
} : void 0,
|
|
106
|
+
onKeyDown: y ? (t) => {
|
|
107
|
+
t.target !== t.currentTarget || t.key !== "Enter" && t.key !== " " || (t.preventDefault(), y(e));
|
|
108
|
+
} : void 0,
|
|
109
|
+
children: [
|
|
110
|
+
F && /* @__PURE__ */ r("td", {
|
|
111
|
+
className: l.handleCell,
|
|
112
|
+
onPointerDown: (t) => P.rowProps(e.id, n).onPointerDown(t),
|
|
113
|
+
children: /* @__PURE__ */ r("span", {
|
|
114
|
+
"aria-hidden": "true",
|
|
115
|
+
children: "⋮⋮"
|
|
116
|
+
})
|
|
117
|
+
}),
|
|
118
|
+
I && /* @__PURE__ */ r("td", {
|
|
119
|
+
className: l.detailCell,
|
|
120
|
+
children: c && /* @__PURE__ */ r(t, {
|
|
121
|
+
open: u,
|
|
122
|
+
onToggle: () => j(e.id),
|
|
123
|
+
label: u ? "Hide details" : "Show details",
|
|
124
|
+
controls: f == null ? void 0 : m
|
|
125
|
+
})
|
|
126
|
+
}),
|
|
127
|
+
p.map((t) => {
|
|
128
|
+
let n = t.accessor ?? ((e) => e[t.id]), i = t.render ? t.render(e) : String(n(e) ?? "");
|
|
129
|
+
return /* @__PURE__ */ r("td", {
|
|
130
|
+
className: t.className,
|
|
131
|
+
children: i
|
|
132
|
+
}, t.id);
|
|
133
|
+
})
|
|
134
|
+
]
|
|
135
|
+
}), f != null && /* @__PURE__ */ r("tr", {
|
|
136
|
+
id: m,
|
|
137
|
+
className: l.detailRow,
|
|
138
|
+
"data-detail-of": e.id,
|
|
139
|
+
children: /* @__PURE__ */ r("td", {
|
|
140
|
+
colSpan: L,
|
|
141
|
+
children: f
|
|
142
|
+
})
|
|
143
|
+
})] }, e.id);
|
|
144
|
+
})]
|
|
145
|
+
})]
|
|
146
|
+
})
|
|
147
|
+
});
|
|
148
|
+
}
|
|
149
|
+
//#endregion
|
|
150
|
+
export { f as t };
|
|
151
|
+
|
|
152
|
+
//# sourceMappingURL=DataGrid-CZPrB_3a.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DataGrid-CZPrB_3a.js","names":[],"sources":["../../src/components/DataGrid/DataGrid.module.css","../../src/components/DataGrid/DataGrid.tsx"],"sourcesContent":[".grid {\n position: relative;\n width: 100%;\n}\n\n.table {\n width: 100%;\n border-collapse: collapse;\n font-size: var(--wzl-font-size-sm);\n}\n\n.table th,\n.table td {\n text-align: left;\n padding: 3px var(--wzl-space-3);\n vertical-align: middle;\n}\n.table tbody tr {\n border-bottom: 1px solid var(--wzl-line-subtle);\n}\n\n.table th {\n font-weight: var(--wzl-font-weight-bold);\n color: var(--wzl-fg-muted);\n position: sticky;\n top: 0;\n background: var(--wzl-surface, #2a2018);\n z-index: 1;\n border-bottom: 1px solid var(--wzl-border);\n}\n\n.sortButton {\n all: unset;\n cursor: pointer;\n user-select: none;\n display: block;\n width: 100%;\n}\n.sortButton:hover { color: var(--wzl-fg, #e6e7e9); }\n.sortButton:focus-visible {\n outline: 2px solid var(--wzl-focus-ring, var(--wzl-accent, #7fb069));\n outline-offset: -2px;\n}\n.sortActive { color: var(--wzl-fg, #e6e7e9); }\n\n.empty {\n color: var(--wzl-fg-muted);\n font-style: italic;\n padding: var(--wzl-space-4) 0;\n text-align: center;\n}\n\n/* Drag-handle column. */\n.handleCol { width: 14px; }\n.handleCell {\n width: 14px;\n cursor: grab;\n color: var(--wzl-fg-muted);\n user-select: none;\n text-align: center;\n}\n.handleCell:active { cursor: grabbing; }\n\n.dragging { opacity: 0.4; }\n\n.dropBefore > td { box-shadow: inset 0 2px 0 0 var(--wzl-accent, #7fb069); }\n.dropAfter > td { box-shadow: inset 0 -2px 0 0 var(--wzl-accent, #7fb069); }\n\n/* Row activation (`onRowClick`). */\n.clickable { cursor: pointer; }\n.clickable:hover > td { background: var(--wzl-surface-hover); }\n.clickable:focus-visible {\n outline: 2px solid var(--wzl-focus-ring);\n outline-offset: -2px;\n}\n\n/* Disclosure column and the detail row it opens. */\n.detailCol,\n.detailCell {\n width: var(--wzl-control-h-sm);\n padding-inline: 0;\n text-align: center;\n}\n.table .detailCell { padding-block: 0; }\n.detailRow > td {\n padding: var(--wzl-space-2) var(--wzl-space-3) var(--wzl-space-3);\n background: var(--wzl-surface-sunken);\n}\n","/**\n * Lightweight sortable data grid. Use for inspector tables — action\n * registries, route maps, telemetry rows. Intentionally narrow:\n *\n * - Sortable columns (click header to cycle asc → desc → none)\n * - Custom cell render via per-column `render`\n * - Optional drag handles for row reordering (when `onReorder` is set)\n * - Per-row class, row activation, and expandable full-width detail rows\n *\n * Not: virtual scrolling, column resizing, multi-column sort, filtering,\n * inline editing. Reach for a real grid library when you need those.\n */\nimport { Fragment, useId, useMemo, useState } from 'react';\nimport type { KeyboardEvent, MouseEvent, ReactNode } from 'react';\nimport { useReorderDragList } from '../../useReorderDragList';\nimport { Disclosure } from '../Disclosure';\nimport s from './DataGrid.module.css';\n\n/**\n * One column of a {@link DataGrid}. `id` doubles as the default property name\n * read off each row when no `accessor` is given.\n */\nexport interface DataGridColumn<Row> {\n id: string;\n header: ReactNode;\n /** Pull a sortable value from the row. Defaults to `(row as any)[column.id]`. */\n accessor?: (row: Row) => string | number | null | undefined;\n /** Render the cell. Defaults to `String(accessor(row) ?? '')`. */\n render?: (row: Row) => ReactNode;\n /** Default true. Set false to suppress the sort affordance on this column. */\n sortable?: boolean;\n /** Optional CSS class on every <td> in this column. */\n className?: string;\n}\n\n/** Props for {@link DataGrid}. */\nexport interface DataGridProps<Row extends { id: string }> {\n rows: readonly Row[];\n columns: readonly DataGridColumn<Row>[];\n /** Initial sort. Omit for unsorted (rows render in input order). */\n defaultSort?: { columnId: string; direction: 'asc' | 'desc' };\n /** Enable drag handles in a leading column. Receives the reorder spec\n * (the existing `useReorderDragList` semantics — see weasel-ui). */\n onReorder?: (ids: string[], targetIndex: number) => void;\n /** Empty-state row text. Default `'—'`. */\n empty?: ReactNode;\n className?: string;\n /** Extra class on a row's `<tr>`, for row-level state such as a verdict. */\n rowClassName?: (row: Row) => string | undefined;\n /**\n * Activate a row. Makes each row focusable: a click anywhere in it, or\n * Enter/Space while it has focus, calls this. Clicks and keys landing on a\n * control inside a cell (button, link, input, …) are left to that control.\n */\n onRowClick?: (row: Row) => void;\n /**\n * Content for a full-width detail row under `row`, shown while the row is\n * expanded. Setting it adds a leading disclosure column. Return `null` for\n * no detail row.\n */\n renderDetail?: (row: Row) => ReactNode;\n /** Which rows offer the disclosure. Default: every row. */\n rowExpandable?: (row: Row) => boolean;\n /** Expanded row ids, controlled. Pair with `onExpandedChange`. */\n expandedIds?: ReadonlySet<string>;\n /** Initially expanded row ids when uncontrolled. */\n defaultExpandedIds?: Iterable<string>;\n /** Called with the next expanded set when a disclosure toggles. */\n onExpandedChange?: (ids: ReadonlySet<string>) => void;\n}\n\ntype SortState = { columnId: string; direction: 'asc' | 'desc' } | null;\n\nconst INTERACTIVE = 'a[href], button, input, select, textarea, label, summary, [role=\"button\"], [contenteditable=\"true\"]';\n\n/** Did this event start on a control inside the row rather than on the row itself? */\nfunction fromControl(e: MouseEvent | KeyboardEvent): boolean {\n const target = e.target as Element | null;\n const hit = target?.closest?.(INTERACTIVE);\n return !!hit && e.currentTarget.contains(hit);\n}\n\n/**\n * Sortable table for inspector-style data. Rows are keyed by `id`. Clicking a\n * sortable header cycles ascending, descending, unsorted; nullish values sort\n * last regardless of direction. Passing `onReorder` adds a leading drag-handle\n * column — note that the drag indices it reports are into the *sorted* row\n * order, not the input order.\n */\nexport function DataGrid<Row extends { id: string }>(props: DataGridProps<Row>) {\n const {\n rows, columns, defaultSort, onReorder, empty = '—', className,\n rowClassName, onRowClick, renderDetail, rowExpandable, expandedIds, defaultExpandedIds, onExpandedChange,\n } = props;\n const [sort, setSort] = useState<SortState>(defaultSort ?? null);\n const [ownExpanded, setOwnExpanded] = useState<ReadonlySet<string>>(() => new Set(defaultExpandedIds));\n const expanded = expandedIds ?? ownExpanded;\n const detailIdBase = useId();\n\n const toggleExpanded = (id: string) => {\n const next = new Set(expanded);\n if (next.has(id)) next.delete(id);\n else next.add(id);\n if (!expandedIds) setOwnExpanded(next);\n onExpandedChange?.(next);\n };\n\n const sortedRows = useMemo(() => {\n if (!sort) return [...rows];\n const col = columns.find((c) => c.id === sort.columnId);\n if (!col) return [...rows];\n const get = col.accessor ?? ((row: Row) => (row as unknown as Record<string, unknown>)[col.id] as string | number | null | undefined);\n const dir = sort.direction === 'asc' ? 1 : -1;\n return [...rows].sort((a, b) => {\n const av = get(a);\n const bv = get(b);\n if (av == null && bv == null) return 0;\n if (av == null) return 1;\n if (bv == null) return -1;\n if (av < bv) return -1 * dir;\n if (av > bv) return 1 * dir;\n return 0;\n });\n }, [rows, columns, sort]);\n\n const cycleSort = (columnId: string) => {\n setSort((cur) => {\n if (!cur || cur.columnId !== columnId) return { columnId, direction: 'asc' };\n if (cur.direction === 'asc') return { columnId, direction: 'desc' };\n return null;\n });\n };\n\n // Drag handles via useReorderDragList. Adapter: the hook expects\n // `{ id, label }`-shaped items; we map our rows to that shape (label\n // unused — the hook only uses id and locked).\n const drag = useReorderDragList({\n items: sortedRows.map((r) => ({ id: r.id, label: '' })),\n selectedIds: [],\n onReorder: onReorder ?? (() => {}),\n rowSelector: ':not([data-detail-of])',\n });\n const dragEnabled = !!onReorder;\n const detailEnabled = !!renderDetail;\n const colCount = columns.length + (dragEnabled ? 1 : 0) + (detailEnabled ? 1 : 0);\n\n const cls = [s.grid, className].filter(Boolean).join(' ');\n\n return (\n <div\n className={cls}\n >\n <table className={s.table}>\n <thead>\n <tr>\n {dragEnabled && <th className={s.handleCol} aria-label=\"drag\" />}\n {detailEnabled && <th className={s.detailCol} aria-label=\"details\" />}\n {columns.map((col) => {\n const sortable = col.sortable !== false;\n const active = sort?.columnId === col.id;\n const indicator = active ? (sort.direction === 'asc' ? ' ↑' : ' ↓') : '';\n return (\n <th\n key={col.id}\n className={[col.className, active ? s.sortActive : ''].filter(Boolean).join(' ')}\n aria-sort={sortable ? (active ? (sort.direction === 'asc' ? 'ascending' : 'descending') : 'none') : undefined}\n >\n {sortable ? (\n <button type=\"button\" className={s.sortButton} onClick={() => cycleSort(col.id)}>\n {col.header}{indicator}\n </button>\n ) : (\n <>{col.header}{indicator}</>\n )}\n </th>\n );\n })}\n </tr>\n </thead>\n <tbody ref={dragEnabled ? (drag.containerProps.ref as React.RefCallback<HTMLTableSectionElement>) : undefined}>\n {sortedRows.length === 0 && (\n <tr>\n <td colSpan={colCount} className={s.empty}>\n {empty}\n </td>\n </tr>\n )}\n {sortedRows.map((row, i) => {\n const isDragging = drag.state.draggedIds?.includes(row.id) ?? false;\n const target = drag.state.targetIndex;\n const expandable = detailEnabled && (rowExpandable?.(row) ?? true);\n const isExpanded = expandable && expanded.has(row.id);\n const detail = isExpanded ? renderDetail!(row) : null;\n const detailId = `${detailIdBase}-detail-${row.id}`;\n const rowCls = [\n onRowClick && s.clickable,\n isDragging && s.dragging,\n target === i && s.dropBefore,\n target === sortedRows.length && i === sortedRows.length - 1 && s.dropAfter,\n rowClassName?.(row),\n ].filter(Boolean).join(' ');\n return (\n <Fragment key={row.id}>\n <tr\n className={rowCls || undefined}\n data-expanded={isExpanded || undefined}\n tabIndex={onRowClick ? 0 : undefined}\n onClick={onRowClick ? (e) => { if (!fromControl(e)) onRowClick(row); } : undefined}\n onKeyDown={onRowClick ? (e) => {\n if (e.target !== e.currentTarget || (e.key !== 'Enter' && e.key !== ' ')) return;\n e.preventDefault();\n onRowClick(row);\n } : undefined}\n >\n {dragEnabled && (\n <td\n className={s.handleCell}\n onPointerDown={(e) => drag.rowProps(row.id, i).onPointerDown(e)}\n >\n <span aria-hidden=\"true\">⋮⋮</span>\n </td>\n )}\n {detailEnabled && (\n <td className={s.detailCell}>\n {expandable && (\n <Disclosure\n open={isExpanded}\n onToggle={() => toggleExpanded(row.id)}\n label={isExpanded ? 'Hide details' : 'Show details'}\n controls={detail != null ? detailId : undefined}\n />\n )}\n </td>\n )}\n {columns.map((col) => {\n const get = col.accessor ?? ((r: Row) => (r as unknown as Record<string, unknown>)[col.id] as string | number | null | undefined);\n const content = col.render ? col.render(row) : String(get(row) ?? '');\n return (\n <td key={col.id} className={col.className}>\n {content}\n </td>\n );\n })}\n </tr>\n {detail != null && (\n <tr id={detailId} className={s.detailRow} data-detail-of={row.id}>\n <td colSpan={colCount}>{detail}</td>\n </tr>\n )}\n </Fragment>\n );\n })}\n </tbody>\n </table>\n </div>\n );\n}\n"],"mappings":"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"}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import { jsx as e, jsxs as t } from "react/jsx-runtime";
|
|
2
|
+
import { useId as n } from "react";
|
|
3
|
+
var r = {
|
|
4
|
+
list: "_list_1jpmp_1",
|
|
5
|
+
row: "_row_1jpmp_14",
|
|
6
|
+
label: "_label_1jpmp_22",
|
|
7
|
+
value: "_value_1jpmp_36",
|
|
8
|
+
title: "_title_1jpmp_49"
|
|
9
|
+
};
|
|
10
|
+
//#endregion
|
|
11
|
+
//#region src/components/DetailList/DetailList.tsx
|
|
12
|
+
function i({ children: i, title: a, layout: o = "inline", className: s }) {
|
|
13
|
+
let c = n(), l = /* @__PURE__ */ e("dl", {
|
|
14
|
+
className: s && a == null ? `${r.list} ${s}` : r.list,
|
|
15
|
+
"data-layout": o,
|
|
16
|
+
"aria-labelledby": a == null ? void 0 : c,
|
|
17
|
+
children: i
|
|
18
|
+
});
|
|
19
|
+
return a == null ? l : /* @__PURE__ */ t("section", {
|
|
20
|
+
className: s,
|
|
21
|
+
children: [/* @__PURE__ */ e("h3", {
|
|
22
|
+
id: c,
|
|
23
|
+
className: r.title,
|
|
24
|
+
children: a
|
|
25
|
+
}), l]
|
|
26
|
+
});
|
|
27
|
+
}
|
|
28
|
+
function a({ label: n, children: i, className: a }) {
|
|
29
|
+
return /* @__PURE__ */ t("div", {
|
|
30
|
+
className: a ? `${r.row} ${a}` : r.row,
|
|
31
|
+
children: [/* @__PURE__ */ e("dt", {
|
|
32
|
+
className: r.label,
|
|
33
|
+
children: n
|
|
34
|
+
}), /* @__PURE__ */ e("dd", {
|
|
35
|
+
className: r.value,
|
|
36
|
+
children: i
|
|
37
|
+
})]
|
|
38
|
+
});
|
|
39
|
+
}
|
|
40
|
+
//#endregion
|
|
41
|
+
export { a as n, i as t };
|
|
42
|
+
|
|
43
|
+
//# sourceMappingURL=DetailList-DHaXX4TG.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DetailList-DHaXX4TG.js","names":[],"sources":["../../src/components/DetailList/DetailList.module.css","../../src/components/DetailList/DetailList.tsx"],"sourcesContent":[".list {\n display: grid;\n grid-template-columns: var(--wzl-params-label-width, auto) minmax(0, 1fr);\n column-gap: var(--wzl-space-6);\n row-gap: var(--wzl-space-1);\n margin: 0;\n font-size: var(--wzl-font-size-md);\n}\n\n.list[data-layout='block'] {\n grid-template-columns: minmax(0, 1fr);\n}\n\n.row {\n display: grid;\n grid-column: 1 / -1;\n grid-template-columns: subgrid;\n /* A label meets the first line of its value, however many lines that runs to. */\n align-items: baseline;\n}\n\n.label {\n display: flex;\n align-items: baseline;\n justify-content: var(--wzl-params-label-align, start);\n gap: var(--wzl-space-2);\n font-family: var(--wzl-font-display);\n font-weight: var(--wzl-font-weight-light);\n font-size: var(--wzl-font-size-sm);\n line-height: var(--wzl-leading-snug);\n color: var(--wzl-fg-muted);\n text-transform: var(--wzl-params-label-case, uppercase);\n letter-spacing: var(--wzl-params-label-tracking, var(--wzl-tracking-wide));\n}\n\n.value {\n margin: 0;\n min-width: 0;\n /* The floor a property row stands on, so the two share a rhythm side by side. */\n min-height: var(--wzl-prop-row-h, var(--wzl-field-h, var(--wzl-control-h)));\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: var(--wzl-space-2);\n overflow-wrap: anywhere;\n color: var(--wzl-fg);\n}\n\n.title {\n margin: 0 0 var(--wzl-space-3);\n font-family: var(--wzl-font-display);\n font-weight: var(--wzl-font-weight-light);\n font-size: var(--wzl-font-size-sm);\n color: var(--wzl-fg-muted);\n text-transform: var(--wzl-params-label-case, uppercase);\n letter-spacing: var(--wzl-params-label-tracking, var(--wzl-tracking-wide));\n}\n","import { type ReactNode, useId } from 'react';\nimport s from './DetailList.module.css';\n\n/** Whether a row's label sits beside its value or above it. */\nexport type DetailListLayout = 'inline' | 'block';\n\n/** Props for {@link DetailList}. */\nexport interface DetailListProps {\n /** {@link DetailRow}s. */\n children: ReactNode;\n /** Heading drawn above the list, which also names it. */\n title?: ReactNode;\n /**\n * `inline` puts every label in one rail beside the values; `block` stacks\n * each label over its value, for a column too narrow to hold both.\n */\n layout?: DetailListLayout;\n /** Class on the outermost element: the `<dl>`, or the `<section>` holding\n * the heading and the list when there is a `title`. */\n className?: string;\n}\n\n/** Props for {@link DetailRow}. */\nexport interface DetailRowProps {\n label: ReactNode;\n /** The value: text, or any run of elements — code chips, badges, keycaps,\n * links. Several children wrap as a line of items. */\n children: ReactNode;\n className?: string;\n}\n\n/**\n * A read-only list of labelled values — the `<dl>` a property panel would be\n * if its rows held facts instead of controls. Labels take the params label\n * recipe and rail: `--wzl-params-label-width` sets the rail, so a detail list\n * and a property panel beside it line their labels up from one declaration.\n */\nexport function DetailList({ children, title, layout = 'inline', className }: DetailListProps) {\n const titleId = useId();\n const list = (\n <dl\n className={className && title == null ? `${s.list} ${className}` : s.list}\n data-layout={layout}\n aria-labelledby={title != null ? titleId : undefined}\n >\n {children}\n </dl>\n );\n if (title == null) return list;\n return (\n <section className={className}>\n <h3 id={titleId} className={s.title}>{title}</h3>\n {list}\n </section>\n );\n}\n\n/** One label and its value in a {@link DetailList}. */\nexport function DetailRow({ label, children, className }: DetailRowProps) {\n return (\n <div className={className ? `${s.row} ${className}` : s.row}>\n <dt className={s.label}>{label}</dt>\n <dd className={s.value}>{children}</dd>\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;;ACqCA,SAAgB,EAAW,EAAE,aAAU,UAAO,YAAS,UAAU,gBAA8B;CAC7F,IAAM,IAAU,GAAO,EACjB,IACJ,kBAAC,MAAD;EACE,WAAW,KAAa,KAAS,OAAO,GAAG,EAAE,KAAK,GAAG,MAAc,EAAE;EACrE,eAAa;EACb,mBAAiB,KAAS,OAAiB,KAAA,IAAV;EAEhC;EACE,CAAA;AAGP,QADI,KAAS,OAAa,IAExB,kBAAC,WAAD;EAAoB;YAApB,CACE,kBAAC,MAAD;GAAI,IAAI;GAAS,WAAW,EAAE;aAAQ;GAAW,CAAA,EAChD,EACO;;;AAKd,SAAgB,EAAU,EAAE,UAAO,aAAU,gBAA6B;AACxE,QACE,kBAAC,OAAD;EAAK,WAAW,IAAY,GAAG,EAAE,IAAI,GAAG,MAAc,EAAE;YAAxD,CACE,kBAAC,MAAD;GAAI,WAAW,EAAE;aAAQ;GAAW,CAAA,EACpC,kBAAC,MAAD;GAAI,WAAW,EAAE;GAAQ;GAAc,CAAA,CACnC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { t as e } from "./Slider-
|
|
1
|
+
import { t as e } from "./Slider-BwRrWHFW.js";
|
|
2
2
|
import { jsx as t } from "react/jsx-runtime";
|
|
3
3
|
import { useEffect as n, useRef as r } from "react";
|
|
4
4
|
var i = {
|
|
@@ -69,4 +69,4 @@ function c(c) {
|
|
|
69
69
|
//#endregion
|
|
70
70
|
export { c as t };
|
|
71
71
|
|
|
72
|
-
//# sourceMappingURL=DetentSlider-
|
|
72
|
+
//# sourceMappingURL=DetentSlider-BYyaZha6.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DetentSlider-
|
|
1
|
+
{"version":3,"file":"DetentSlider-BYyaZha6.js","names":[],"sources":["../../src/components/DetentSlider/DetentSlider.module.css","../../src/components/DetentSlider/DetentSlider.tsx"],"sourcesContent":[".root {\n position: relative;\n /* Read by Slider's track and stop marks. Detents run the full height of the\n * track so they read as notches rather than as tally marks beside it. */\n --rp-tick-inset: 0;\n --rp-tick-width: 1px;\n --rp-tick-color: var(--wzl-border-strong);\n --rp-track-cursor: pointer;\n font-family: var(--wzl-font-ui);\n}\n\n.slider {\n width: 100%;\n}\n\n","import { useEffect, useRef, type ReactElement, type ReactNode } from 'react';\nimport { Slider, type SliderStop, type Thumb } from '../Slider/Slider';\nimport s from './DetentSlider.module.css';\n\n/** What a detent can carry. Narrowed so identity comparison and React keys\n * both work without a keying callback. */\nexport type DetentValue = string | number;\n\n/** One detent on a {@link DetentSlider}. */\nexport type DetentItem<V extends DetentValue = number> = {\n value: V;\n /** Drawn under the detent. Defaults to `formatLabel(value)`, then `value`. */\n label?: ReactNode;\n /** Spoken form, when the drawn label is not the right thing to say. */\n ariaLabel?: string;\n};\n\n/**\n * Props for {@link DetentSlider}.\n *\n * `items` takes bare values or `DetentItem`s interchangeably — a bare value is\n * a detent with no label of its own.\n *\n * `onChange` fires on every detent the control passes through, including\n * mid-drag: each one is a complete, legal choice, so there is no in-flight\n * value to withhold. `onCommit` fires once the gesture that changed things\n * ends, and is the one to write to history.\n */\nexport type DetentSliderProps<V extends DetentValue = number> = {\n items: readonly (V | DetentItem<V>)[];\n value: V;\n onChange: (value: V, index: number) => void;\n onCommit?: (value: V, index: number) => void;\n formatLabel?: (value: V, index: number) => ReactNode;\n labels?: 'all' | 'ends' | 'none';\n trackHeight?: number;\n ariaLabel?: string;\n className?: string;\n};\n\nfunction normalize<V extends DetentValue>(items: readonly (V | DetentItem<V>)[]): DetentItem<V>[] {\n return items.map(it => (typeof it === 'object' && it !== null ? it : ({ value: it } as DetentItem<V>)));\n}\n\n/**\n * The detent `value` selects. An exact match wins; a number that matches none\n * lands on the nearest one, so a value arriving from a numeric field or an\n * older save renders where it belongs rather than silently reading as the\n * first detent.\n */\nfunction resolveIndex<V extends DetentValue>(items: readonly DetentItem<V>[], value: V): number {\n const exact = items.findIndex(it => it.value === value);\n if (exact !== -1) return exact;\n if (typeof value !== 'number') return 0;\n let best = 0;\n let bestGap = Infinity;\n for (let i = 0; i < items.length; i++) {\n const v = items[i].value;\n if (typeof v !== 'number') continue;\n const gap = Math.abs(v - value);\n if (gap < bestGap) {\n bestGap = gap;\n best = i;\n }\n }\n return best;\n}\n\nfunction plainText(label: ReactNode, fallback: DetentValue): string {\n return typeof label === 'string' || typeof label === 'number' ? String(label) : String(fallback);\n}\n\n/**\n * Slider over a fixed list of values: one detent per value, evenly spaced, the\n * thumb resting on one of them.\n *\n * This is the shape to reach for when an option has a small set of allowed\n * values along a line — playback rate, zoom step, quality — in place of a\n * dropdown, which hides the ordering and the extent of the range behind a\n * click. The values need only be ordered, not numeric.\n *\n * It is a strict {@link Slider} over the *index* of `items`, which keeps the\n * detents evenly spaced however the values are distributed. Since the index is\n * meaningless to a screen reader, the value is published as `aria-valuetext`.\n * For numbers that may also rest between the detents, use `Slider` directly\n * with `spacing=\"even\"` and magnetic stops.\n */\nexport function DetentSlider<V extends DetentValue = number>(props: DetentSliderProps<V>): ReactElement {\n const { value, onChange, onCommit, formatLabel, ariaLabel, className } = props;\n const items = normalize(props.items);\n const index = resolveIndex(items, value);\n const lastIndex = Math.max(0, items.length - 1);\n\n const labelOf = (item: DetentItem<V>, i: number): ReactNode =>\n item.label ?? formatLabel?.(item.value, i) ?? String(item.value);\n\n // Deduped separately: `live` suppresses the repeat reports a drag produces\n // while the pointer crosses one detent, `changed` keeps a press that chose\n // nothing from landing a no-op entry in the consumer's history.\n const liveRef = useRef(index);\n const changedRef = useRef(false);\n useEffect(() => {\n liveRef.current = index;\n }, [index]);\n\n const handleInput = (next: Thumb[]) => {\n const i = next[0].value;\n if (i === liveRef.current) return;\n liveRef.current = i;\n changedRef.current = true;\n onChange(items[i].value, i);\n };\n\n const handleCommit = (next: Thumb[]) => {\n if (!changedRef.current) return;\n changedRef.current = false;\n const i = next[0].value;\n onCommit?.(items[i].value, i);\n };\n\n const current = items[index];\n if (!current) return <div className={className ? `${s.root} ${className}` : s.root} />;\n\n const thumbs: Thumb[] = [\n { value: index, valueText: current.ariaLabel ?? plainText(labelOf(current, index), current.value) },\n ];\n\n const stops: SliderStop[] = items.map((item, i) => ({ value: i, label: labelOf(item, i) }));\n\n return (\n <div className={className ? `${s.root} ${className}` : s.root}>\n <Slider\n className={s.slider}\n min={0}\n max={lastIndex}\n stops={stops}\n snap=\"strict\"\n stopLabels={props.labels ?? 'all'}\n trackClick=\"move-nearest\"\n trackHeight={props.trackHeight ?? 8}\n ariaLabel={ariaLabel}\n thumbs={thumbs}\n onInput={handleInput}\n onChange={handleCommit}\n />\n </div>\n );\n}\n"],"mappings":";;;;;;;;;ACwCA,SAAS,EAAiC,GAAwD;AAChG,QAAO,EAAM,KAAI,MAAO,OAAO,KAAO,YAAY,IAAc,IAAM,EAAE,OAAO,GAAI,CAAoB;;AASzG,SAAS,EAAoC,GAAiC,GAAkB;CAC9F,IAAM,IAAQ,EAAM,WAAU,MAAM,EAAG,UAAU,EAAM;AACvD,KAAI,MAAU,GAAI,QAAO;AACzB,KAAI,OAAO,KAAU,SAAU,QAAO;CACtC,IAAI,IAAO,GACP,IAAU;AACd,MAAK,IAAI,IAAI,GAAG,IAAI,EAAM,QAAQ,KAAK;EACrC,IAAM,IAAI,EAAM,GAAG;AACnB,MAAI,OAAO,KAAM,SAAU;EAC3B,IAAM,IAAM,KAAK,IAAI,IAAI,EAAM;AAC/B,EAAI,IAAM,MACR,IAAU,GACV,IAAO;;AAGX,QAAO;;AAGT,SAAS,EAAU,GAAkB,GAA+B;AAClE,QAAgE,OAAzD,OAAO,KAAU,YAAY,OAAO,KAAU,WAAkB,IAAgB,EAAS;;AAkBlG,SAAgB,EAA6C,GAA2C;CACtG,IAAM,EAAE,UAAO,aAAU,aAAU,gBAAa,cAAW,iBAAc,GACnE,IAAQ,EAAU,EAAM,MAAM,EAC9B,IAAQ,EAAa,GAAO,EAAM,EAClC,IAAY,KAAK,IAAI,GAAG,EAAM,SAAS,EAAE,EAEzC,KAAW,GAAqB,MACpC,EAAK,SAAS,IAAc,EAAK,OAAO,EAAE,IAAI,OAAO,EAAK,MAAM,EAK5D,IAAU,EAAO,EAAM,EACvB,IAAa,EAAO,GAAM;AAChC,SAAgB;AACd,IAAQ,UAAU;IACjB,CAAC,EAAM,CAAC;CAEX,IAAM,KAAe,MAAkB;EACrC,IAAM,IAAI,EAAK,GAAG;AACd,QAAM,EAAQ,YAClB,EAAQ,UAAU,GAClB,EAAW,UAAU,IACrB,EAAS,EAAM,GAAG,OAAO,EAAE;IAGvB,KAAgB,MAAkB;AACtC,MAAI,CAAC,EAAW,QAAS;AACzB,IAAW,UAAU;EACrB,IAAM,IAAI,EAAK,GAAG;AAClB,MAAW,EAAM,GAAG,OAAO,EAAE;IAGzB,IAAU,EAAM;AACtB,KAAI,CAAC,EAAS,QAAO,kBAAC,OAAD,EAAK,WAAW,IAAY,GAAG,EAAE,KAAK,GAAG,MAAc,EAAE,MAAQ,CAAA;CAEtF,IAAM,IAAkB,CACtB;EAAE,OAAO;EAAO,WAAW,EAAQ,aAAa,EAAU,EAAQ,GAAS,EAAM,EAAE,EAAQ,MAAM;EAAE,CACpG,EAEK,IAAsB,EAAM,KAAK,GAAM,OAAO;EAAE,OAAO;EAAG,OAAO,EAAQ,GAAM,EAAE;EAAE,EAAE;AAE3F,QACE,kBAAC,OAAD;EAAK,WAAW,IAAY,GAAG,EAAE,KAAK,GAAG,MAAc,EAAE;YACvD,kBAAC,GAAD;GACE,WAAW,EAAE;GACb,KAAK;GACL,KAAK;GACE;GACP,MAAK;GACL,YAAY,EAAM,UAAU;GAC5B,YAAW;GACX,aAAa,EAAM,eAAe;GACvB;GACH;GACR,SAAS;GACT,UAAU;GACV,CAAA;EACE,CAAA"}
|