@window-splitter/solid 0.8.0

package/dist/esm/SolidWindowSplitter.stories.jsx

@@ -0,0 +1,470 @@
+import { spring } from "framer-motion";
+import { PanelGroup, PanelResizer, Panel, } from "./SolidWIndowSplitter.jsx";
+import { createSignal, Show, splitProps } from "solid-js";
+const meta = {
+    title: "Components/Solid",
+    component: PanelGroup,
+};
+export default meta;
+function StyledPanelGroup(props) {
+    return (<PanelGroup {...props} style={{
+            border: "1px solid rgba(0, 0, 0, 0.3)",
+            background: "rgba(0, 0, 0, 0.1)",
+            "border-radius": "12px",
+            "box-sizing": "border-box",
+            ...props.style,
+        }}/>);
+}
+function StyledPanel(props) {
+    const [, attrs] = splitProps(props, ["children"]);
+    return (<Panel style={{
+            overflow: "hidden",
+        }} {...attrs}>
+      <div style={{
+            height: "100%",
+            width: "100%",
+            padding: "20px",
+            display: "flex",
+            "align-items": "center",
+            "justify-content": "center",
+            overflow: "hidden",
+            "box-sizing": "border-box",
+        }}>
+        {props.children}
+      </div>
+    </Panel>);
+}
+function StyledResizer(props) {
+    return <PanelResizer size="10px" style={{ background: "red" }} {...props}/>;
+}
+export function Simple(props) {
+    return (<StyledPanelGroup handle={props.handle} style={{ height: "200px" }}>
+      <StyledPanel>Panel 1</StyledPanel>
+      <StyledResizer />
+      <StyledPanel min="100px">Panel 2</StyledPanel>
+    </StyledPanelGroup>);
+}
+export function Autosave(props) {
+    return (<StyledPanelGroup autosaveId="autosave-example-solid" handle={props.handle} snapshot={props.snapshot}>
+      <StyledPanel id="1">Panel 1</StyledPanel>
+      <StyledResizer id="resizer"/>
+      <StyledPanel id="2">Panel 2</StyledPanel>
+    </StyledPanelGroup>);
+}
+export function AutosaveCookie(props) {
+    return (<StyledPanelGroup autosaveId="autosave-cookie-solid" autosaveStrategy="cookie" style={{ height: "200px" }} handle={props.handle} snapshot={props.snapshot}>
+      <StyledPanel id="1">Panel 1</StyledPanel>
+      <StyledResizer id="resizer1" size="10px" style={{ background: "red" }}/>
+      <StyledPanel id="2">Panel 2</StyledPanel>
+    </StyledPanelGroup>);
+}
+export function AutosaveCollapsible(props) {
+    return (<StyledPanelGroup autosaveId="autosave-example-2" handle={props.handle}>
+      <StyledPanel id="1" collapsible collapsedSize="100px" min="140px" onCollapseChange={props.onCollapseChange}>
+        Collapsible
+      </StyledPanel>
+      <StyledResizer id="resizer"/>
+      <StyledPanel id="2">Panel 2</StyledPanel>
+    </StyledPanelGroup>);
+}
+// TODO: fix this
+export function DynamicConstraints(props) {
+    const [customOn, setCustomOn] = createSignal(false);
+    return (<>
+      <StyledPanelGroup handle={props.handle}>
+        <StyledPanel default="100px" min={customOn() ? "200px" : "100px"}>
+          <div>Panel 1</div>
+        </StyledPanel>
+        <StyledResizer />
+        <StyledPanel min="100px">
+          <div>Panel 2</div>
+        </StyledPanel>
+        <StyledResizer />
+        <StyledPanel min={customOn() ? "100px" : "400px"} max={customOn() ? "300px" : "700px"}>
+          <div>Panel 3</div>
+        </StyledPanel>
+      </StyledPanelGroup>
+      <button type="button" onClick={() => setCustomOn(!customOn())}>
+        Toggle Custom
+      </button>
+    </>);
+}
+export function SimpleMin() {
+    return (<StyledPanelGroup>
+      <StyledPanel min="100px">
+        <div>Panel 1</div>
+      </StyledPanel>
+      <StyledResizer />
+      <StyledPanel min="100px">
+        <div>Panel 2</div>
+      </StyledPanel>
+      <StyledResizer />
+      <StyledPanel min="100px">
+        <div>Panel 3</div>
+      </StyledPanel>
+    </StyledPanelGroup>);
+}
+export function SimpleMinMax() {
+    return (<StyledPanelGroup>
+      <StyledPanel min="100px" max="200px">
+        <div>Panel 1</div>
+      </StyledPanel>
+      <StyledResizer />
+      <StyledPanel min="100px">
+        <div>Panel 2</div>
+      </StyledPanel>
+      <StyledResizer size="20px"/>
+      <StyledPanel min="100px">
+        <div>Panel 3</div>
+      </StyledPanel>
+    </StyledPanelGroup>);
+}
+export function SimpleConstraints() {
+    return (<StyledPanelGroup>
+      <StyledPanel min="100px" max="50%">
+        <div>Panel 1</div>
+      </StyledPanel>
+      <StyledResizer />
+      <StyledPanel>
+        <div>Panel 2</div>
+      </StyledPanel>
+    </StyledPanelGroup>);
+}
+export function HorizontalLayout() {
+    return (<StyledPanelGroup orientation="horizontal">
+      <StyledPanel default="30%" min="20%">
+        left
+      </StyledPanel>
+      <StyledResizer />
+      <StyledPanel min="20%">middle</StyledPanel>
+      <StyledResizer />
+      <StyledPanel default="30%" min="20%">
+        right
+      </StyledPanel>
+    </StyledPanelGroup>);
+}
+export function VerticalLayout(props) {
+    return (<StyledPanelGroup orientation="vertical" style={{ height: "322px" }} handle={props.handle}>
+      <StyledPanel default="30%" min="20%">
+        top
+      </StyledPanel>
+      <StyledResizer />
+      <StyledPanel min="20%">middle</StyledPanel>
+      <StyledResizer />
+      <StyledPanel default="30%" min="20%">
+        bottom
+      </StyledPanel>
+    </StyledPanelGroup>);
+}
+export function VerticalLayout2() {
+    return (<StyledPanelGroup orientation="vertical" style={{ height: "calc(100vh - 100px)" }}>
+      <StyledPanel default="200px" min="200px">
+        top
+      </StyledPanel>
+      <StyledResizer />
+      <StyledPanel min="200px" collapsedSize="60px" defaultCollapsed collapsible>
+        middle
+      </StyledPanel>
+    </StyledPanelGroup>);
+}
+export function NestedGroups() {
+    return (<PanelGroup orientation="horizontal" style={{
+            border: "1px solid rgba(0, 0, 0, 0.3)",
+            "border-radius": "12px",
+            height: "400px",
+        }}>
+      <Panel min="10%">1</Panel>
+      <StyledResizer />
+      <Panel min="10%">
+        <PanelGroup orientation="vertical">
+          <Panel min="10%">2-1</Panel>
+          <StyledResizer />
+          <Panel min="10%">
+            <PanelGroup orientation="horizontal">
+              <Panel min="20%">2-2-1</Panel>
+              <StyledResizer />
+              <Panel min="20%">2-2-2</Panel>
+            </PanelGroup>
+          </Panel>
+        </PanelGroup>
+      </Panel>
+      <StyledResizer />
+      <Panel min="10%">3</Panel>
+    </PanelGroup>);
+}
+export function WithOverflow() {
+    return (<StyledPanelGroup style={{ height: "400px" }}>
+      <Panel min="200px">
+        <div style={{
+            overflow: "auto",
+            padding: "40px",
+            height: "100%",
+            "box-sizing": "border-box",
+        }}>
+          <p>
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec
+            euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi, eu
+            tincidunt nisl nisl eu nisl. Sed euismod, nisl eget ultricies
+            ultrices, nunc nisi aliquam nisi, eu tincidunt nisl nisl eu nisl.
+            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,
+            eu tincidunt nisl nisl eu nisl.
+          </p>
+          <p>
+            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,
+            eu tincidunt nisl nisl eu nisl. Sed euismod, nisl eget ultricies
+            ultrices, nunc nisi aliquam nisi, eu tincidunt nisl nisl eu nisl.
+            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,
+            eu tincidunt nisl nisl eu nisl.
+          </p>
+          <p>
+            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,
+            eu tincidunt nisl nisl eu nisl. Sed euismod, nisl eget ultricies
+            ultrices, nunc nisi aliquam nisi, eu tincidunt nisl nisl eu nisl.
+            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,
+            eu tincidunt nisl nisl eu nisl.
+          </p>
+          <p>
+            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,
+            eu tincidunt nisl nisl eu nisl. Sed euismod, nisl eget ultricies
+            ultrices, nunc nisi aliquam nisi, eu tincidunt nisl nisl eu nisl.
+            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,
+            eu tincidunt nisl nisl eu nisl.
+          </p>
+          <p>
+            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,
+            eu tincidunt nisl nisl eu nisl. Sed euismod, nisl eget ultricies
+            ultrices, nunc nisi aliquam nisi, eu tincidunt nisl nisl eu nisl.
+            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,
+            eu tincidunt nisl nisl eu nisl.
+          </p>
+        </div>
+      </Panel>
+      <StyledResizer />
+      <Panel min="200px">
+        <div style={{
+            overflow: "auto",
+            padding: "40px",
+            height: "100%",
+            "box-sizing": "border-box",
+        }}>
+          <p>
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec
+            euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi, eu
+            tincidunt nisl nisl eu nisl. Sed euismod, nisl eget ultricies
+            ultrices, nunc nisi aliquam nisi, eu tincidunt nisl nisl eu nisl.
+            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,
+            eu tincidunt nisl nisl eu nisl.
+          </p>
+          <p>
+            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,
+            eu tincidunt nisl nisl eu nisl. Sed euismod, nisl eget ultricies
+            ultrices, nunc nisi aliquam nisi, eu tincidunt nisl nisl eu nisl.
+            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,
+            eu tincidunt nisl nisl eu nisl.
+          </p>
+          <p>
+            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,
+            eu tincidunt nisl nisl eu nisl. Sed euismod, nisl eget ultricies
+            ultrices, nunc nisi aliquam nisi, eu tincidunt nisl nisl eu nisl.
+            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,
+            eu tincidunt nisl nisl eu nisl.
+          </p>
+          <p>
+            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,
+            eu tincidunt nisl nisl eu nisl. Sed euismod, nisl eget ultricies
+            ultrices, nunc nisi aliquam nisi, eu tincidunt nisl nisl eu nisl.
+            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,
+            eu tincidunt nisl nisl eu nisl.
+          </p>
+          <p>
+            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,
+            eu tincidunt nisl nisl eu nisl. Sed euismod, nisl eget ultricies
+            ultrices, nunc nisi aliquam nisi, eu tincidunt nisl nisl eu nisl.
+            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,
+            eu tincidunt nisl nisl eu nisl.
+          </p>
+        </div>
+      </Panel>
+    </StyledPanelGroup>);
+}
+export function Collapsible(props) {
+    const [collapsed, setCollapsed] = createSignal(true);
+    return (<StyledPanelGroup handle={props.handle}>
+      <StyledPanel handle={props.leftPanelHandle} min="100px" collapsible collapsedSize="60px" style={{ border: "10px solid green", "box-sizing": "border-box" }} onCollapseChange={(isCollapsed) => {
+            console.log("COLLAPSE PASSIVE", isCollapsed);
+        }}>
+        <div>1</div>
+      </StyledPanel>
+      <StyledResizer />
+      <StyledPanel min="100px">
+        <div>2</div>
+      </StyledPanel>
+      <StyledResizer id="resizer-2"/>
+      <StyledPanel handle={props.rightPanelHandle} min="100px" collapsible collapsedSize="60px" collapseAnimation={{ easing: "bounce", duration: 1000 }} style={{ border: "10px solid blue", "box-sizing": "border-box" }} collapsed={collapsed} onCollapseChange={setCollapsed}>
+        <div>3</div>
+      </StyledPanel>
+    </StyledPanelGroup>);
+}
+export function CustomCollapseAnimation() {
+    const springFn = spring({
+        keyframes: [0, 1],
+        velocity: 1,
+        stiffness: 100,
+        damping: 10,
+        mass: 1.0,
+    });
+    return (<StyledPanelGroup>
+      <StyledPanel min="100px" collapsible collapsedSize="60px" style={{ border: "10px solid green", "box-sizing": "border-box" }}>
+        1
+      </StyledPanel>
+      <StyledResizer />
+      <StyledPanel min="100px">2</StyledPanel>
+      <StyledResizer />
+      <StyledPanel style={{ border: "10px solid blue", "box-sizing": "border-box" }} min="100px" collapsible collapsedSize="60px" defaultCollapsed collapseAnimation={{
+            easing: (t) => springFn.next(t * 1000).value,
+            duration: 1000,
+        }}>
+        3
+      </StyledPanel>
+    </StyledPanelGroup>);
+}
+export function ImperativePanel() {
+    let groupRef;
+    let panelRef;
+    return (<>
+      <StyledPanelGroup handle={(v) => (groupRef = v)}>
+        <StyledPanel handle={(v) => (panelRef = v)} min="100px" collapsible collapsedSize="60px">
+          1
+        </StyledPanel>
+        <StyledResizer />
+        <StyledPanel min="100px">2</StyledPanel>
+        <StyledResizer />
+        <StyledPanel min="100px" collapsible collapsedSize="60px" defaultCollapsed>
+          3
+        </StyledPanel>
+      </StyledPanelGroup>
+
+      <div>
+        <button type="button" onClick={() => alert(`Sizes: ${groupRef?.getPixelSizes()}`)}>
+          Get pixel sizes
+        </button>
+        <button type="button" onClick={() => alert(`Sizes: ${groupRef?.getPercentageSizes()}`)}>
+          Get percent sizes
+        </button>
+        <button type="button" onClick={() => groupRef?.setSizes(["200px", "10px", "50%", "10px", "150px"])}>
+          Override sizes
+        </button>
+      </div>
+
+      <div>
+        <button type="button" onClick={() => panelRef?.collapse()}>
+          Collapse
+        </button>
+        <button type="button" onClick={() => alert(`Collapsed: ${panelRef?.isCollapsed()}`)}>
+          Is Collapsed?
+        </button>
+        <button type="button" onClick={() => panelRef?.expand()}>
+          Expand
+        </button>
+        <button type="button" onClick={() => alert(`Expanded: ${panelRef?.isExpanded()}`)}>
+          Is Expanded?
+        </button>
+        <button type="button" onClick={() => alert(`Id: ${panelRef?.getId()}`)}>
+          Get Id
+        </button>
+        <button type="button" onClick={() => alert(`Size: ${panelRef?.getPixelSize()}`)}>
+          Get Pixel Size
+        </button>
+        <button type="button" onClick={() => alert(`Percentage: ${panelRef?.getPercentageSize()}`)}>
+          Get Percentage Size
+        </button>
+        <button type="button" onClick={() => panelRef?.setSize("30px")}>
+          Set size to 100px
+        </button>
+        <button type="button" onClick={() => panelRef?.setSize("50%")}>
+          Set size to 50%
+        </button>
+      </div>
+    </>);
+}
+export function ConditionalPanel(props) {
+    const [isExpanded, setIsExpanded] = createSignal(false);
+    return (<>
+      <StyledPanelGroup handle={props.handle}>
+        <StyledPanel id="panel-1" min="100px" collapsible collapsedSize="60px">
+          <div>1</div>
+        </StyledPanel>
+        <StyledResizer id="handle-1"/>
+        <StyledPanel id="panel-2" min="100px">
+          <div>2</div>
+        </StyledPanel>
+
+        {isExpanded() && (<>
+            <StyledResizer id="handle-2"/>
+            <StyledPanel id="panel-3" min="100px">
+              3
+              <button type="button" onClick={() => setIsExpanded(false)}>
+                Close
+              </button>
+            </StyledPanel>
+          </>)}
+      </StyledPanelGroup>
+
+      <button type="button" onClick={() => setIsExpanded(true)}>
+        Expand
+      </button>
+    </>);
+}
+export function ConditionalPanelComplex() {
+    const [isExpanded, setIsExpanded] = createSignal(false);
+    return (<>
+      <StyledPanelGroup>
+        <StyledPanel id="panel-1" min="100px" collapsible collapsedSize="60px">
+          <div>1</div>
+        </StyledPanel>
+        <StyledResizer id="handle-1"/>
+        <StyledPanel id="panel-2" min="100px">
+          <div>2</div>
+        </StyledPanel>
+        <StyledResizer id="handle-2"/>
+        <StyledPanel id="panel-3" min="100px">
+          <div>3</div>
+        </StyledPanel>
+        <Show when={isExpanded()}>
+          <StyledResizer id="handle-3"/>
+          <StyledPanel id="panel-4" min="100px">
+            expanded
+            <button type="button" onClick={() => setIsExpanded(false)}>
+              Close
+            </button>
+          </StyledPanel>
+        </Show>
+        <StyledResizer id="handle-4"/>
+        <StyledPanel min="200px" collapsible collapsedSize="60px" defaultCollapsed id="panel-5">
+          <div>4</div>
+        </StyledPanel>
+      </StyledPanelGroup>
+      <button type="button" onClick={() => setIsExpanded(true)}>
+        Expand
+      </button>
+    </>);
+}
+export function WithDefaultWidth() {
+    return (<PanelGroup style={{ height: "400px" }}>
+      <Panel style={{ "background-color": "#333366" }}/>
+      <PanelResizer size="3px"/>
+      <Panel default="100px" min="100px" max="400px" style={{ "background-color": "#ff3366" }}/>
+    </PanelGroup>);
+}
+export function StaticAtRest() {
+    return (<StyledPanelGroup style={{ height: "200px" }}>
+      <StyledPanel min="100px" max="300px" isStaticAtRest>
+        Panel 1
+      </StyledPanel>
+      <StyledResizer />
+      <StyledPanel min="100px">Panel 2</StyledPanel>
+      <StyledResizer />
+      <StyledPanel min="100px">Panel 3</StyledPanel>
+    </StyledPanelGroup>);
+}
+//# sourceMappingURL=SolidWindowSplitter.stories.jsx.map

package/dist/esm/SolidWindowSplitter.stories.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidWindowSplitter.stories.jsx","sourceRoot":"","sources":["../../src/SolidWindowSplitter.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Meta } from \"storybook-solidjs\";\nimport { spring } from \"framer-motion\";\n\nimport {\n  PanelGroup,\n  PanelResizer,\n  Panel,\n  PanelGroupProps,\n  PanelProps,\n  PanelResizerProps,\n} from \"./SolidWIndowSplitter.jsx\";\nimport { createSignal, Ref, Show, splitProps } from \"solid-js\";\nimport { PanelHandle } from \"@window-splitter/interface\";\nimport { PanelGroupHandle } from \"@window-splitter/interface\";\nimport { GroupMachineContextValue } from \"@window-splitter/state\";\n\nconst meta = {\n  title: \"Components/Solid\",\n  component: PanelGroup,\n} satisfies Meta<typeof PanelGroup>;\n\nexport default meta;\n\nfunction StyledPanelGroup(props: PanelGroupProps) {\n  return (\n    <PanelGroup\n      {...props}\n      style={{\n        border: \"1px solid rgba(0, 0, 0, 0.3)\",\n        background: \"rgba(0, 0, 0, 0.1)\",\n        \"border-radius\": \"12px\",\n        \"box-sizing\": \"border-box\",\n        ...props.style,\n      }}\n    />\n  );\n}\n\nfunction StyledPanel(props: PanelProps) {\n  const [, attrs] = splitProps(props, [\"children\"]);\n  return (\n    <Panel\n      style={{\n        overflow: \"hidden\",\n      }}\n      {...attrs}\n    >\n      <div\n        style={{\n          height: \"100%\",\n          width: \"100%\",\n          padding: \"20px\",\n          display: \"flex\",\n          \"align-items\": \"center\",\n          \"justify-content\": \"center\",\n          overflow: \"hidden\",\n          \"box-sizing\": \"border-box\",\n        }}\n      >\n        {props.children}\n      </div>\n    </Panel>\n  );\n}\n\nfunction StyledResizer(props: PanelResizerProps) {\n  return <PanelResizer size=\"10px\" style={{ background: \"red\" }} {...props} />;\n}\n\nexport function Simple(props: { handle?: Ref<PanelGroupHandle> }) {\n  return (\n    <StyledPanelGroup handle={props.handle} style={{ height: \"200px\" }}>\n      <StyledPanel>Panel 1</StyledPanel>\n      <StyledResizer />\n      <StyledPanel min=\"100px\">Panel 2</StyledPanel>\n    </StyledPanelGroup>\n  );\n}\n\nexport function Autosave(props: {\n  handle?: Ref<PanelGroupHandle>;\n  snapshot?: GroupMachineContextValue;\n}) {\n  return (\n    <StyledPanelGroup\n      autosaveId=\"autosave-example-solid\"\n      handle={props.handle}\n      snapshot={props.snapshot}\n    >\n      <StyledPanel id=\"1\">Panel 1</StyledPanel>\n      <StyledResizer id=\"resizer\" />\n      <StyledPanel id=\"2\">Panel 2</StyledPanel>\n    </StyledPanelGroup>\n  );\n}\n\nexport function AutosaveCookie(props: {\n  handle?: Ref<PanelGroupHandle>;\n  snapshot?: GroupMachineContextValue;\n}) {\n  return (\n    <StyledPanelGroup\n      autosaveId=\"autosave-cookie-solid\"\n      autosaveStrategy=\"cookie\"\n      style={{ height: \"200px\" }}\n      handle={props.handle}\n      snapshot={props.snapshot}\n    >\n      <StyledPanel id=\"1\">Panel 1</StyledPanel>\n      <StyledResizer id=\"resizer1\" size=\"10px\" style={{ background: \"red\" }} />\n      <StyledPanel id=\"2\">Panel 2</StyledPanel>\n    </StyledPanelGroup>\n  );\n}\n\nexport function AutosaveCollapsible(props: {\n  handle?: Ref<PanelGroupHandle>;\n  onCollapseChange?: (isCollapsed: boolean) => void;\n}) {\n  return (\n    <StyledPanelGroup autosaveId=\"autosave-example-2\" handle={props.handle}>\n      <StyledPanel\n        id=\"1\"\n        collapsible\n        collapsedSize=\"100px\"\n        min=\"140px\"\n        onCollapseChange={props.onCollapseChange}\n      >\n        Collapsible\n      </StyledPanel>\n      <StyledResizer id=\"resizer\" />\n      <StyledPanel id=\"2\">Panel 2</StyledPanel>\n    </StyledPanelGroup>\n  );\n}\n\n// TODO: fix this\nexport function DynamicConstraints(props: { handle?: Ref<PanelGroupHandle> }) {\n  const [customOn, setCustomOn] = createSignal(false);\n\n  return (\n    <>\n      <StyledPanelGroup handle={props.handle}>\n        <StyledPanel default=\"100px\" min={customOn() ? \"200px\" : \"100px\"}>\n          <div>Panel 1</div>\n        </StyledPanel>\n        <StyledResizer />\n        <StyledPanel min=\"100px\">\n          <div>Panel 2</div>\n        </StyledPanel>\n        <StyledResizer />\n        <StyledPanel\n          min={customOn() ? \"100px\" : \"400px\"}\n          max={customOn() ? \"300px\" : \"700px\"}\n        >\n          <div>Panel 3</div>\n        </StyledPanel>\n      </StyledPanelGroup>\n      <button type=\"button\" onClick={() => setCustomOn(!customOn())}>\n        Toggle Custom\n      </button>\n    </>\n  );\n}\n\nexport function SimpleMin() {\n  return (\n    <StyledPanelGroup>\n      <StyledPanel min=\"100px\">\n        <div>Panel 1</div>\n      </StyledPanel>\n      <StyledResizer />\n      <StyledPanel min=\"100px\">\n        <div>Panel 2</div>\n      </StyledPanel>\n      <StyledResizer />\n      <StyledPanel min=\"100px\">\n        <div>Panel 3</div>\n      </StyledPanel>\n    </StyledPanelGroup>\n  );\n}\n\nexport function SimpleMinMax() {\n  return (\n    <StyledPanelGroup>\n      <StyledPanel min=\"100px\" max=\"200px\">\n        <div>Panel 1</div>\n      </StyledPanel>\n      <StyledResizer />\n      <StyledPanel min=\"100px\">\n        <div>Panel 2</div>\n      </StyledPanel>\n      <StyledResizer size=\"20px\" />\n      <StyledPanel min=\"100px\">\n        <div>Panel 3</div>\n      </StyledPanel>\n    </StyledPanelGroup>\n  );\n}\n\nexport function SimpleConstraints() {\n  return (\n    <StyledPanelGroup>\n      <StyledPanel min=\"100px\" max=\"50%\">\n        <div>Panel 1</div>\n      </StyledPanel>\n      <StyledResizer />\n      <StyledPanel>\n        <div>Panel 2</div>\n      </StyledPanel>\n    </StyledPanelGroup>\n  );\n}\n\nexport function HorizontalLayout() {\n  return (\n    <StyledPanelGroup orientation=\"horizontal\">\n      <StyledPanel default=\"30%\" min=\"20%\">\n        left\n      </StyledPanel>\n      <StyledResizer />\n      <StyledPanel min=\"20%\">middle</StyledPanel>\n      <StyledResizer />\n      <StyledPanel default=\"30%\" min=\"20%\">\n        right\n      </StyledPanel>\n    </StyledPanelGroup>\n  );\n}\n\nexport function VerticalLayout(props: { handle?: Ref<PanelGroupHandle> }) {\n  return (\n    <StyledPanelGroup\n      orientation=\"vertical\"\n      style={{ height: \"322px\" }}\n      handle={props.handle}\n    >\n      <StyledPanel default=\"30%\" min=\"20%\">\n        top\n      </StyledPanel>\n      <StyledResizer />\n      <StyledPanel min=\"20%\">middle</StyledPanel>\n      <StyledResizer />\n      <StyledPanel default=\"30%\" min=\"20%\">\n        bottom\n      </StyledPanel>\n    </StyledPanelGroup>\n  );\n}\n\nexport function VerticalLayout2() {\n  return (\n    <StyledPanelGroup\n      orientation=\"vertical\"\n      style={{ height: \"calc(100vh - 100px)\" }}\n    >\n      <StyledPanel default=\"200px\" min=\"200px\">\n        top\n      </StyledPanel>\n      <StyledResizer />\n      <StyledPanel\n        min=\"200px\"\n        collapsedSize=\"60px\"\n        defaultCollapsed\n        collapsible\n      >\n        middle\n      </StyledPanel>\n    </StyledPanelGroup>\n  );\n}\n\nexport function NestedGroups() {\n  return (\n    <PanelGroup\n      orientation=\"horizontal\"\n      style={{\n        border: \"1px solid rgba(0, 0, 0, 0.3)\",\n        \"border-radius\": \"12px\",\n        height: \"400px\",\n      }}\n    >\n      <Panel min=\"10%\">1</Panel>\n      <StyledResizer />\n      <Panel min=\"10%\">\n        <PanelGroup orientation=\"vertical\">\n          <Panel min=\"10%\">2-1</Panel>\n          <StyledResizer />\n          <Panel min=\"10%\">\n            <PanelGroup orientation=\"horizontal\">\n              <Panel min=\"20%\">2-2-1</Panel>\n              <StyledResizer />\n              <Panel min=\"20%\">2-2-2</Panel>\n            </PanelGroup>\n          </Panel>\n        </PanelGroup>\n      </Panel>\n      <StyledResizer />\n      <Panel min=\"10%\">3</Panel>\n    </PanelGroup>\n  );\n}\n\nexport function WithOverflow() {\n  return (\n    <StyledPanelGroup style={{ height: \"400px\" }}>\n      <Panel min=\"200px\">\n        <div\n          style={{\n            overflow: \"auto\",\n            padding: \"40px\",\n            height: \"100%\",\n            \"box-sizing\": \"border-box\",\n          }}\n        >\n          <p>\n            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec\n            euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi, eu\n            tincidunt nisl nisl eu nisl. Sed euismod, nisl eget ultricies\n            ultrices, nunc nisi aliquam nisi, eu tincidunt nisl nisl eu nisl.\n            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,\n            eu tincidunt nisl nisl eu nisl.\n          </p>\n          <p>\n            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,\n            eu tincidunt nisl nisl eu nisl. Sed euismod, nisl eget ultricies\n            ultrices, nunc nisi aliquam nisi, eu tincidunt nisl nisl eu nisl.\n            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,\n            eu tincidunt nisl nisl eu nisl.\n          </p>\n          <p>\n            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,\n            eu tincidunt nisl nisl eu nisl. Sed euismod, nisl eget ultricies\n            ultrices, nunc nisi aliquam nisi, eu tincidunt nisl nisl eu nisl.\n            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,\n            eu tincidunt nisl nisl eu nisl.\n          </p>\n          <p>\n            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,\n            eu tincidunt nisl nisl eu nisl. Sed euismod, nisl eget ultricies\n            ultrices, nunc nisi aliquam nisi, eu tincidunt nisl nisl eu nisl.\n            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,\n            eu tincidunt nisl nisl eu nisl.\n          </p>\n          <p>\n            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,\n            eu tincidunt nisl nisl eu nisl. Sed euismod, nisl eget ultricies\n            ultrices, nunc nisi aliquam nisi, eu tincidunt nisl nisl eu nisl.\n            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,\n            eu tincidunt nisl nisl eu nisl.\n          </p>\n        </div>\n      </Panel>\n      <StyledResizer />\n      <Panel min=\"200px\">\n        <div\n          style={{\n            overflow: \"auto\",\n            padding: \"40px\",\n            height: \"100%\",\n            \"box-sizing\": \"border-box\",\n          }}\n        >\n          <p>\n            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec\n            euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi, eu\n            tincidunt nisl nisl eu nisl. Sed euismod, nisl eget ultricies\n            ultrices, nunc nisi aliquam nisi, eu tincidunt nisl nisl eu nisl.\n            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,\n            eu tincidunt nisl nisl eu nisl.\n          </p>\n          <p>\n            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,\n            eu tincidunt nisl nisl eu nisl. Sed euismod, nisl eget ultricies\n            ultrices, nunc nisi aliquam nisi, eu tincidunt nisl nisl eu nisl.\n            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,\n            eu tincidunt nisl nisl eu nisl.\n          </p>\n          <p>\n            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,\n            eu tincidunt nisl nisl eu nisl. Sed euismod, nisl eget ultricies\n            ultrices, nunc nisi aliquam nisi, eu tincidunt nisl nisl eu nisl.\n            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,\n            eu tincidunt nisl nisl eu nisl.\n          </p>\n          <p>\n            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,\n            eu tincidunt nisl nisl eu nisl. Sed euismod, nisl eget ultricies\n            ultrices, nunc nisi aliquam nisi, eu tincidunt nisl nisl eu nisl.\n            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,\n            eu tincidunt nisl nisl eu nisl.\n          </p>\n          <p>\n            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,\n            eu tincidunt nisl nisl eu nisl. Sed euismod, nisl eget ultricies\n            ultrices, nunc nisi aliquam nisi, eu tincidunt nisl nisl eu nisl.\n            Sed euismod, nisl eget ultricies ultrices, nunc nisi aliquam nisi,\n            eu tincidunt nisl nisl eu nisl.\n          </p>\n        </div>\n      </Panel>\n    </StyledPanelGroup>\n  );\n}\n\nexport function Collapsible(props: {\n  handle?: Ref<PanelGroupHandle>;\n  rightPanelHandle?: Ref<PanelHandle>;\n  leftPanelHandle?: Ref<PanelHandle>;\n}) {\n  const [collapsed, setCollapsed] = createSignal(true);\n\n  return (\n    <StyledPanelGroup handle={props.handle}>\n      <StyledPanel\n        handle={props.leftPanelHandle}\n        min=\"100px\"\n        collapsible\n        collapsedSize=\"60px\"\n        style={{ border: \"10px solid green\", \"box-sizing\": \"border-box\" }}\n        onCollapseChange={(isCollapsed) => {\n          console.log(\"COLLAPSE PASSIVE\", isCollapsed);\n        }}\n      >\n        <div>1</div>\n      </StyledPanel>\n      <StyledResizer />\n      <StyledPanel min=\"100px\">\n        <div>2</div>\n      </StyledPanel>\n      <StyledResizer id=\"resizer-2\" />\n      <StyledPanel\n        handle={props.rightPanelHandle}\n        min=\"100px\"\n        collapsible\n        collapsedSize=\"60px\"\n        collapseAnimation={{ easing: \"bounce\", duration: 1000 }}\n        style={{ border: \"10px solid blue\", \"box-sizing\": \"border-box\" }}\n        collapsed={collapsed}\n        onCollapseChange={setCollapsed}\n      >\n        <div>3</div>\n      </StyledPanel>\n    </StyledPanelGroup>\n  );\n}\n\nexport function CustomCollapseAnimation() {\n  const springFn = spring({\n    keyframes: [0, 1],\n    velocity: 1,\n    stiffness: 100,\n    damping: 10,\n    mass: 1.0,\n  });\n\n  return (\n    <StyledPanelGroup>\n      <StyledPanel\n        min=\"100px\"\n        collapsible\n        collapsedSize=\"60px\"\n        style={{ border: \"10px solid green\", \"box-sizing\": \"border-box\" }}\n      >\n        1\n      </StyledPanel>\n      <StyledResizer />\n      <StyledPanel min=\"100px\">2</StyledPanel>\n      <StyledResizer />\n      <StyledPanel\n        style={{ border: \"10px solid blue\", \"box-sizing\": \"border-box\" }}\n        min=\"100px\"\n        collapsible\n        collapsedSize=\"60px\"\n        defaultCollapsed\n        collapseAnimation={{\n          easing: (t) => springFn.next(t * 1000).value,\n          duration: 1000,\n        }}\n      >\n        3\n      </StyledPanel>\n    </StyledPanelGroup>\n  );\n}\n\nexport function ImperativePanel() {\n  let groupRef: PanelGroupHandle | undefined;\n  let panelRef: PanelHandle | undefined;\n\n  return (\n    <>\n      <StyledPanelGroup handle={(v) => (groupRef = v)}>\n        <StyledPanel\n          handle={(v) => (panelRef = v)}\n          min=\"100px\"\n          collapsible\n          collapsedSize=\"60px\"\n        >\n          1\n        </StyledPanel>\n        <StyledResizer />\n        <StyledPanel min=\"100px\">2</StyledPanel>\n        <StyledResizer />\n        <StyledPanel\n          min=\"100px\"\n          collapsible\n          collapsedSize=\"60px\"\n          defaultCollapsed\n        >\n          3\n        </StyledPanel>\n      </StyledPanelGroup>\n\n      <div>\n        <button\n          type=\"button\"\n          onClick={() => alert(`Sizes: ${groupRef?.getPixelSizes()}`)}\n        >\n          Get pixel sizes\n        </button>\n        <button\n          type=\"button\"\n          onClick={() => alert(`Sizes: ${groupRef?.getPercentageSizes()}`)}\n        >\n          Get percent sizes\n        </button>\n        <button\n          type=\"button\"\n          onClick={() =>\n            groupRef?.setSizes([\"200px\", \"10px\", \"50%\", \"10px\", \"150px\"])\n          }\n        >\n          Override sizes\n        </button>\n      </div>\n\n      <div>\n        <button type=\"button\" onClick={() => panelRef?.collapse()}>\n          Collapse\n        </button>\n        <button\n          type=\"button\"\n          onClick={() => alert(`Collapsed: ${panelRef?.isCollapsed()}`)}\n        >\n          Is Collapsed?\n        </button>\n        <button type=\"button\" onClick={() => panelRef?.expand()}>\n          Expand\n        </button>\n        <button\n          type=\"button\"\n          onClick={() => alert(`Expanded: ${panelRef?.isExpanded()}`)}\n        >\n          Is Expanded?\n        </button>\n        <button type=\"button\" onClick={() => alert(`Id: ${panelRef?.getId()}`)}>\n          Get Id\n        </button>\n        <button\n          type=\"button\"\n          onClick={() => alert(`Size: ${panelRef?.getPixelSize()}`)}\n        >\n          Get Pixel Size\n        </button>\n        <button\n          type=\"button\"\n          onClick={() => alert(`Percentage: ${panelRef?.getPercentageSize()}`)}\n        >\n          Get Percentage Size\n        </button>\n        <button type=\"button\" onClick={() => panelRef?.setSize(\"30px\")}>\n          Set size to 100px\n        </button>\n        <button type=\"button\" onClick={() => panelRef?.setSize(\"50%\")}>\n          Set size to 50%\n        </button>\n      </div>\n    </>\n  );\n}\n\nexport function ConditionalPanel(props: { handle?: Ref<PanelGroupHandle> }) {\n  const [isExpanded, setIsExpanded] = createSignal(false);\n\n  return (\n    <>\n      <StyledPanelGroup handle={props.handle}>\n        <StyledPanel id=\"panel-1\" min=\"100px\" collapsible collapsedSize=\"60px\">\n          <div>1</div>\n        </StyledPanel>\n        <StyledResizer id=\"handle-1\" />\n        <StyledPanel id=\"panel-2\" min=\"100px\">\n          <div>2</div>\n        </StyledPanel>\n\n        {isExpanded() && (\n          <>\n            <StyledResizer id=\"handle-2\" />\n            <StyledPanel id=\"panel-3\" min=\"100px\">\n              3\n              <button type=\"button\" onClick={() => setIsExpanded(false)}>\n                Close\n              </button>\n            </StyledPanel>\n          </>\n        )}\n      </StyledPanelGroup>\n\n      <button type=\"button\" onClick={() => setIsExpanded(true)}>\n        Expand\n      </button>\n    </>\n  );\n}\n\nexport function ConditionalPanelComplex() {\n  const [isExpanded, setIsExpanded] = createSignal(false);\n\n  return (\n    <>\n      <StyledPanelGroup>\n        <StyledPanel id=\"panel-1\" min=\"100px\" collapsible collapsedSize=\"60px\">\n          <div>1</div>\n        </StyledPanel>\n        <StyledResizer id=\"handle-1\" />\n        <StyledPanel id=\"panel-2\" min=\"100px\">\n          <div>2</div>\n        </StyledPanel>\n        <StyledResizer id=\"handle-2\" />\n        <StyledPanel id=\"panel-3\" min=\"100px\">\n          <div>3</div>\n        </StyledPanel>\n        <Show when={isExpanded()}>\n          <StyledResizer id=\"handle-3\" />\n          <StyledPanel id=\"panel-4\" min=\"100px\">\n            expanded\n            <button type=\"button\" onClick={() => setIsExpanded(false)}>\n              Close\n            </button>\n          </StyledPanel>\n        </Show>\n        <StyledResizer id=\"handle-4\" />\n        <StyledPanel\n          min=\"200px\"\n          collapsible\n          collapsedSize=\"60px\"\n          defaultCollapsed\n          id=\"panel-5\"\n        >\n          <div>4</div>\n        </StyledPanel>\n      </StyledPanelGroup>\n      <button type=\"button\" onClick={() => setIsExpanded(true)}>\n        Expand\n      </button>\n    </>\n  );\n}\n\nexport function WithDefaultWidth() {\n  return (\n    <PanelGroup style={{ height: \"400px\" }}>\n      <Panel style={{ \"background-color\": \"#333366\" }} />\n      <PanelResizer size=\"3px\" />\n      <Panel\n        default=\"100px\"\n        min=\"100px\"\n        max=\"400px\"\n        style={{ \"background-color\": \"#ff3366\" }}\n      />\n    </PanelGroup>\n  );\n}\n\nexport function StaticAtRest() {\n  return (\n    <StyledPanelGroup style={{ height: \"200px\" }}>\n      <StyledPanel min=\"100px\" max=\"300px\" isStaticAtRest>\n        Panel 1\n      </StyledPanel>\n      <StyledResizer />\n      <StyledPanel min=\"100px\">Panel 2</StyledPanel>\n      <StyledResizer />\n      <StyledPanel min=\"100px\">Panel 3</StyledPanel>\n    </StyledPanelGroup>\n  );\n}\n"]}

package/dist/esm/SolidWindowSplitter.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=SolidWindowSplitter.test.d.ts.map

package/dist/esm/SolidWindowSplitter.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SolidWindowSplitter.test.d.ts","sourceRoot":"","sources":["../../src/SolidWindowSplitter.test.tsx"],"names":[],"mappings":""}