@cratis/scene.primereact 1.1.0 → 3.0.0

package/dist/esm/panel/PrimeAccordion.js

@@ -1,26 +1,56 @@
-import { jsx } from 'react/jsx-runtime';
-import { Accordion, AccordionTab } from 'primereact/accordion';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { Accordion } from 'primereact/accordion';
 import { stringArrayProperty, numberProperty } from '../properties.js';
 
 /**
  * The `PrimeReact:accordion` component - stacked sections of which one is open at a time.
  *
- * Accordion identifies its sections by React element type (`AccordionTab`), so a Scene adapter wrapping
- * one would not be recognized. Sections are therefore paired here: the `headers` property gives the
- * titles and the `content` slot gives the bodies, matched by position. A screen puts as many children in
- * the slot as it lists headers.
+ * Sections are paired by position: the `headers` property gives the titles and the `content` slot gives
+ * the bodies. That pairing is a consequence of the Scene model rather than of PrimeReact - a slot arrives
+ * as a flat list of already-rendered children with nowhere to hang a per-child title - so a screen puts as
+ * many children in the slot as it lists headers.
+ *
+ * PrimeReact 11 replaced `AccordionTab` with a `Accordion.Panel` / `Header` / `Trigger` / `Content`
+ * composition keyed by an explicit `value`, which retires the v10 constraint that sections had to *be*
+ * `AccordionTab` elements for the accordion to recognize them. The index doubles as that value, so the
+ * `activeIndex` property still means what it always did. It is passed as `defaultValue` rather than
+ * `value` because a screen states which section starts open - binding it as the controlled value would
+ * pin the accordion to that section and silently swallow every click.
  */ function PrimeAccordion({ element, slots }) {
     const headers = stringArrayProperty(element, 'headers');
     const bodies = slots.content ?? [];
     const count = Math.max(headers.length, bodies.length);
-    return /*#__PURE__*/ jsx(Accordion, {
+    return /*#__PURE__*/ jsx(Accordion.Root, {
         "data-scene-id": element.id,
-        activeIndex: numberProperty(element, 'activeIndex', 0),
+        defaultValue: String(numberProperty(element, 'activeIndex', 0)),
         children: Array.from({
             length: count
-        }, (_, index)=>/*#__PURE__*/ jsx(AccordionTab, {
-                header: headers[index] ?? `Section ${index + 1}`,
-                children: bodies[index]
+        }, (_, index)=>/*#__PURE__*/ jsxs(Accordion.Panel, {
+                value: String(index),
+                children: [
+                    /*#__PURE__*/ jsx(Accordion.Header, {
+                        children: /*#__PURE__*/ jsxs(Accordion.Trigger, {
+                            children: [
+                                headers[index] ?? `Section ${index + 1}`,
+                                /*#__PURE__*/ jsx(Accordion.Indicator, {
+                                    match: "open",
+                                    children: /*#__PURE__*/ jsx("i", {
+                                        className: "pi pi-chevron-up"
+                                    })
+                                }),
+                                /*#__PURE__*/ jsx(Accordion.Indicator, {
+                                    match: "closed",
+                                    children: /*#__PURE__*/ jsx("i", {
+                                        className: "pi pi-chevron-down"
+                                    })
+                                })
+                            ]
+                        })
+                    }),
+                    /*#__PURE__*/ jsx(Accordion.Content, {
+                        children: bodies[index]
+                    })
+                ]
             }, index))
     });
 }

package/dist/esm/panel/PrimeAccordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"PrimeAccordion.js","sources":["../../../panel/PrimeAccordion.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { Accordion, AccordionTab } from 'primereact/accordion';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { numberProperty, stringArrayProperty } from '../properties';\n\n/**\n * The `PrimeReact:accordion` component - stacked sections of which one is open at a time.\n *\n * Accordion identifies its sections by React element type (`AccordionTab`), so a Scene adapter wrapping\n * one would not be recognized. Sections are therefore paired here: the `headers` property gives the\n * titles and the `content` slot gives the bodies, matched by position. A screen puts as many children in\n * the slot as it lists headers.\n */\nexport function PrimeAccordion({ element, slots }: RegisteredComponentProps) {\n    const headers = stringArrayProperty(element, 'headers');\n    const bodies = slots.content ?? [];\n    const count = Math.max(headers.length, bodies.length);\n    return (\n        <Accordion data-scene-id={element.id} activeIndex={numberProperty(element, 'activeIndex', 0)}>\n            {Array.from({ length: count }, (_, index) => (\n                <AccordionTab key={index} header={headers[index] ?? `Section ${index + 1}`}>\n                    {bodies[index]}\n                </AccordionTab>\n            ))}\n        </Accordion>\n    );\n}\n"],"names":["PrimeAccordion","element","slots","headers","stringArrayProperty","bodies","content","count","Math","max","length","_jsx","Accordion","data-scene-id","id","activeIndex","numberProperty","Array","from","_","index","AccordionTab","header"],"mappings":";;;;AAOA;;;;;;;AAOC,IACM,SAASA,cAAAA,CAAe,EAAEC,OAAO,EAAEC,KAAK,EAA4B,EAAA;IACvE,MAAMC,OAAAA,GAAUC,oBAAoBH,OAAAA,EAAS,SAAA,CAAA;AAC7C,IAAA,MAAMI,MAAAA,GAASH,KAAAA,CAAMI,OAAO,IAAI,EAAE;IAClC,MAAMC,KAAAA,GAAQC,KAAKC,GAAG,CAACN,QAAQO,MAAM,EAAEL,OAAOK,MAAM,CAAA;AACpD,IAAA,qBACIC,GAAA,CAACC,SAAAA,EAAAA;AAAUC,QAAAA,eAAAA,EAAeZ,QAAQa,EAAE;QAAEC,WAAAA,EAAaC,cAAAA,CAAef,SAAS,aAAA,EAAe,CAAA,CAAA;AACrFgB,QAAAA,QAAAA,EAAAA,KAAAA,CAAMC,IAAI,CAAC;YAAER,MAAAA,EAAQH;SAAM,EAAG,CAACY,CAAAA,EAAGC,KAAAA,iBAC/BT,GAAA,CAACU,YAAAA,EAAAA;gBAAyBC,MAAAA,EAAQnB,OAAO,CAACiB,KAAAA,CAAM,IAAI,CAAC,QAAQ,EAAEA,QAAQ,CAAA,CAAA,CAAG;AACrEf,gBAAAA,QAAAA,EAAAA,MAAM,CAACe,KAAAA;AADOA,aAAAA,EAAAA,KAAAA,CAAAA;;AAMnC;;;;"}
+{"version":3,"file":"PrimeAccordion.js","sources":["../../../panel/PrimeAccordion.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { Accordion } from 'primereact/accordion';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { numberProperty, stringArrayProperty } from '../properties';\n\n/**\n * The `PrimeReact:accordion` component - stacked sections of which one is open at a time.\n *\n * Sections are paired by position: the `headers` property gives the titles and the `content` slot gives\n * the bodies. That pairing is a consequence of the Scene model rather than of PrimeReact - a slot arrives\n * as a flat list of already-rendered children with nowhere to hang a per-child title - so a screen puts as\n * many children in the slot as it lists headers.\n *\n * PrimeReact 11 replaced `AccordionTab` with a `Accordion.Panel` / `Header` / `Trigger` / `Content`\n * composition keyed by an explicit `value`, which retires the v10 constraint that sections had to *be*\n * `AccordionTab` elements for the accordion to recognize them. The index doubles as that value, so the\n * `activeIndex` property still means what it always did. It is passed as `defaultValue` rather than\n * `value` because a screen states which section starts open - binding it as the controlled value would\n * pin the accordion to that section and silently swallow every click.\n */\nexport function PrimeAccordion({ element, slots }: RegisteredComponentProps) {\n    const headers = stringArrayProperty(element, 'headers');\n    const bodies = slots.content ?? [];\n    const count = Math.max(headers.length, bodies.length);\n    return (\n        <Accordion.Root data-scene-id={element.id} defaultValue={String(numberProperty(element, 'activeIndex', 0))}>\n            {Array.from({ length: count }, (_, index) => (\n                <Accordion.Panel key={index} value={String(index)}>\n                    <Accordion.Header>\n                        <Accordion.Trigger>\n                            {headers[index] ?? `Section ${index + 1}`}\n                            <Accordion.Indicator match='open'>\n                                <i className='pi pi-chevron-up' />\n                            </Accordion.Indicator>\n                            <Accordion.Indicator match='closed'>\n                                <i className='pi pi-chevron-down' />\n                            </Accordion.Indicator>\n                        </Accordion.Trigger>\n                    </Accordion.Header>\n                    <Accordion.Content>{bodies[index]}</Accordion.Content>\n                </Accordion.Panel>\n            ))}\n        </Accordion.Root>\n    );\n}\n"],"names":["PrimeAccordion","element","slots","headers","stringArrayProperty","bodies","content","count","Math","max","length","_jsx","Accordion","Root","data-scene-id","id","defaultValue","String","numberProperty","Array","from","_","index","_jsxs","Panel","value","Header","Trigger","Indicator","match","i","className","Content"],"mappings":";;;;AAOA;;;;;;;;;;;;;;AAcC,IACM,SAASA,cAAAA,CAAe,EAAEC,OAAO,EAAEC,KAAK,EAA4B,EAAA;IACvE,MAAMC,OAAAA,GAAUC,oBAAoBH,OAAAA,EAAS,SAAA,CAAA;AAC7C,IAAA,MAAMI,MAAAA,GAASH,KAAAA,CAAMI,OAAO,IAAI,EAAE;IAClC,MAAMC,KAAAA,GAAQC,KAAKC,GAAG,CAACN,QAAQO,MAAM,EAAEL,OAAOK,MAAM,CAAA;IACpD,qBACIC,GAAA,CAACC,UAAUC,IAAI,EAAA;AAACC,QAAAA,eAAAA,EAAeb,QAAQc,EAAE;QAAEC,YAAAA,EAAcC,MAAAA,CAAOC,cAAAA,CAAejB,OAAAA,EAAS,aAAA,EAAe,CAAA,CAAA,CAAA;AAClGkB,QAAAA,QAAAA,EAAAA,KAAAA,CAAMC,IAAI,CAAC;YAAEV,MAAAA,EAAQH;AAAM,SAAA,EAAG,CAACc,CAAAA,EAAGC,KAAAA,iBAC/BC,IAAA,CAACX,UAAUY,KAAK,EAAA;AAAaC,gBAAAA,KAAAA,EAAOR,MAAAA,CAAOK,KAAAA,CAAAA;;AACvC,kCAAAX,GAAA,CAACC,UAAUc,MAAM,EAAA;gDACbH,IAAA,CAACX,UAAUe,OAAO,EAAA;;AACbxB,gCAAAA,OAAO,CAACmB,KAAAA,CAAM,IAAI,CAAC,QAAQ,EAAEA,QAAQ,CAAA,CAAA,CAAG;AACzC,8CAAAX,GAAA,CAACC,UAAUgB,SAAS,EAAA;oCAACC,KAAAA,EAAM,MAAA;AACvB,oCAAA,QAAA,gBAAAlB,GAAA,CAACmB,GAAAA,EAAAA;wCAAEC,SAAAA,EAAU;;;AAEjB,8CAAApB,GAAA,CAACC,UAAUgB,SAAS,EAAA;oCAACC,KAAAA,EAAM,QAAA;AACvB,oCAAA,QAAA,gBAAAlB,GAAA,CAACmB,GAAAA,EAAAA;wCAAEC,SAAAA,EAAU;;;;;;AAIzB,kCAAApB,GAAA,CAACC,UAAUoB,OAAO,EAAA;AAAE3B,wBAAAA,QAAAA,EAAAA,MAAM,CAACiB,KAAAA;;;AAZTA,aAAAA,EAAAA,KAAAA,CAAAA;;AAiBtC;;;;"}

package/dist/esm/panel/PrimeCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PrimeCard.d.ts","sourceRoot":"","sources":["../../../panel/PrimeCard.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAU/D,wBAAgB,SAAS,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,wBAAwB,+BAMrE"}
+{"version":3,"file":"PrimeCard.d.ts","sourceRoot":"","sources":["../../../panel/PrimeCard.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAe/D,wBAAgB,SAAS,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,wBAAwB,+BAgBrE"}

package/dist/esm/panel/PrimeCard.js

@@ -1,4 +1,4 @@
-import { jsx } from 'react/jsx-runtime';
+import { jsx, jsxs } from 'react/jsx-runtime';
 import { Card } from 'primereact/card';
 import { stringProperty } from '../properties.js';
 
@@ -8,12 +8,33 @@ import { stringProperty } from '../properties.js';
  * One of the three names this package deliberately shares with `core` (alongside `text` and `button`), so
  * a profile that lists `core` and then `PrimeReact` upgrades every card on every screen to a themed one
  * without a single screen being edited.
+ *
+ * PrimeReact 11 turned `Card` into a namespace of parts, so the v10 `title` / `subTitle` props no longer
+ * exist - the caption is something the adapter assembles. The caption block is omitted entirely when a
+ * screen supplies neither, because an empty `Card.Caption` still reserves its spacing and would leave an
+ * unexplained gap above the body of an untitled card.
  */ function PrimeCard({ element, slots }) {
-    return /*#__PURE__*/ jsx(Card, {
+    const title = stringProperty(element, 'title');
+    const subtitle = stringProperty(element, 'subtitle');
+    return /*#__PURE__*/ jsx(Card.Root, {
         "data-scene-id": element.id,
-        title: stringProperty(element, 'title'),
-        subTitle: stringProperty(element, 'subtitle'),
-        children: slots.content
+        children: /*#__PURE__*/ jsxs(Card.Body, {
+            children: [
+                (title !== undefined || subtitle !== undefined) && /*#__PURE__*/ jsxs(Card.Caption, {
+                    children: [
+                        title !== undefined && /*#__PURE__*/ jsx(Card.Title, {
+                            children: title
+                        }),
+                        subtitle !== undefined && /*#__PURE__*/ jsx(Card.Subtitle, {
+                            children: subtitle
+                        })
+                    ]
+                }),
+                /*#__PURE__*/ jsx(Card.Content, {
+                    children: slots.content
+                })
+            ]
+        })
     });
 }
 

package/dist/esm/panel/PrimeCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"PrimeCard.js","sources":["../../../panel/PrimeCard.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { Card } from 'primereact/card';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { stringProperty } from '../properties';\n\n/**\n * The `PrimeReact:card` component.\n *\n * One of the three names this package deliberately shares with `core` (alongside `text` and `button`), so\n * a profile that lists `core` and then `PrimeReact` upgrades every card on every screen to a themed one\n * without a single screen being edited.\n */\nexport function PrimeCard({ element, slots }: RegisteredComponentProps) {\n    return (\n        <Card data-scene-id={element.id} title={stringProperty(element, 'title')} subTitle={stringProperty(element, 'subtitle')}>\n            {slots.content}\n        </Card>\n    );\n}\n"],"names":["PrimeCard","element","slots","_jsx","Card","data-scene-id","id","title","stringProperty","subTitle","content"],"mappings":";;;;AAOA;;;;;;AAMC,IACM,SAASA,SAAAA,CAAU,EAAEC,OAAO,EAAEC,KAAK,EAA4B,EAAA;AAClE,IAAA,qBACIC,GAAA,CAACC,IAAAA,EAAAA;AAAKC,QAAAA,eAAAA,EAAeJ,QAAQK,EAAE;AAAEC,QAAAA,KAAAA,EAAOC,eAAeP,OAAAA,EAAS,OAAA,CAAA;AAAUQ,QAAAA,QAAAA,EAAUD,eAAeP,OAAAA,EAAS,UAAA,CAAA;AACvGC,QAAAA,QAAAA,EAAAA,KAAAA,CAAMQ;;AAGnB;;;;"}
+{"version":3,"file":"PrimeCard.js","sources":["../../../panel/PrimeCard.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { Card } from 'primereact/card';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { stringProperty } from '../properties';\n\n/**\n * The `PrimeReact:card` component.\n *\n * One of the three names this package deliberately shares with `core` (alongside `text` and `button`), so\n * a profile that lists `core` and then `PrimeReact` upgrades every card on every screen to a themed one\n * without a single screen being edited.\n *\n * PrimeReact 11 turned `Card` into a namespace of parts, so the v10 `title` / `subTitle` props no longer\n * exist - the caption is something the adapter assembles. The caption block is omitted entirely when a\n * screen supplies neither, because an empty `Card.Caption` still reserves its spacing and would leave an\n * unexplained gap above the body of an untitled card.\n */\nexport function PrimeCard({ element, slots }: RegisteredComponentProps) {\n    const title = stringProperty(element, 'title');\n    const subtitle = stringProperty(element, 'subtitle');\n    return (\n        <Card.Root data-scene-id={element.id}>\n            <Card.Body>\n                {(title !== undefined || subtitle !== undefined) && (\n                    <Card.Caption>\n                        {title !== undefined && <Card.Title>{title}</Card.Title>}\n                        {subtitle !== undefined && <Card.Subtitle>{subtitle}</Card.Subtitle>}\n                    </Card.Caption>\n                )}\n                <Card.Content>{slots.content}</Card.Content>\n            </Card.Body>\n        </Card.Root>\n    );\n}\n"],"names":["PrimeCard","element","slots","title","stringProperty","subtitle","_jsx","Card","Root","data-scene-id","id","_jsxs","Body","undefined","Caption","Title","Subtitle","Content","content"],"mappings":";;;;AAOA;;;;;;;;;;;AAWC,IACM,SAASA,SAAAA,CAAU,EAAEC,OAAO,EAAEC,KAAK,EAA4B,EAAA;IAClE,MAAMC,KAAAA,GAAQC,eAAeH,OAAAA,EAAS,OAAA,CAAA;IACtC,MAAMI,QAAAA,GAAWD,eAAeH,OAAAA,EAAS,UAAA,CAAA;IACzC,qBACIK,GAAA,CAACC,KAAKC,IAAI,EAAA;AAACC,QAAAA,eAAAA,EAAeR,QAAQS,EAAE;gCAChCC,IAAA,CAACJ,KAAKK,IAAI,EAAA;;AACJT,gBAAAA,CAAAA,UAAUU,SAAAA,IAAaR,QAAAA,KAAaQ,SAAQ,mBAC1CF,IAAA,CAACJ,KAAKO,OAAO,EAAA;;wBACRX,KAAAA,KAAUU,SAAAA,kBAAaP,GAAA,CAACC,IAAAA,CAAKQ,KAAK,EAAA;AAAEZ,4BAAAA,QAAAA,EAAAA;;wBACpCE,QAAAA,KAAaQ,SAAAA,kBAAaP,GAAA,CAACC,IAAAA,CAAKS,QAAQ,EAAA;AAAEX,4BAAAA,QAAAA,EAAAA;;;;AAGnD,8BAAAC,GAAA,CAACC,KAAKU,OAAO,EAAA;AAAEf,oBAAAA,QAAAA,EAAAA,KAAAA,CAAMgB;;;;;AAIrC;;;;"}

package/dist/esm/panel/PrimeDivider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PrimeDivider.d.ts","sourceRoot":"","sources":["../../../panel/PrimeDivider.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAM/D,wBAAgB,YAAY,CAAC,EAAE,OAAO,EAAE,EAAE,wBAAwB,+BAWjE"}
+{"version":3,"file":"PrimeDivider.d.ts","sourceRoot":"","sources":["../../../panel/PrimeDivider.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAW/D,wBAAgB,YAAY,CAAC,EAAE,OAAO,EAAE,EAAE,wBAAwB,+BAWjE"}

package/dist/esm/panel/PrimeDivider.js

@@ -4,11 +4,16 @@ import { stringProperty } from '../properties.js';
 
 /**
  * The `PrimeReact:divider` component - a rule separating content, optionally with a caption in it.
+ *
+ * The last component in this family PrimeReact 11 left monolithic, so the port is only a prop rename:
+ * v10's `layout` is v11's `orientation`. The Scene property keeps the name `layout`, because a screen's
+ * property vocabulary is this package's contract with authored content and renaming it would break every
+ * screen that set it to buy nothing.
  */ function PrimeDivider({ element }) {
     const label = stringProperty(element, 'label');
     return /*#__PURE__*/ jsx(Divider, {
         "data-scene-id": element.id,
-        layout: stringProperty(element, 'layout', 'horizontal'),
+        orientation: stringProperty(element, 'layout', 'horizontal'),
         align: stringProperty(element, 'align'),
         type: stringProperty(element, 'type', 'solid'),
         children: label

package/dist/esm/panel/PrimeDivider.js.map

@@ -1 +1 @@
-{"version":3,"file":"PrimeDivider.js","sources":["../../../panel/PrimeDivider.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { Divider } from 'primereact/divider';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { stringProperty } from '../properties';\n\n/**\n * The `PrimeReact:divider` component - a rule separating content, optionally with a caption in it.\n */\nexport function PrimeDivider({ element }: RegisteredComponentProps) {\n    const label = stringProperty(element, 'label');\n    return (\n        <Divider\n            data-scene-id={element.id}\n            layout={stringProperty(element, 'layout', 'horizontal') as 'horizontal' | 'vertical'}\n            align={stringProperty(element, 'align') as 'center' | 'left' | 'right' | 'top' | 'bottom' | undefined}\n            type={stringProperty(element, 'type', 'solid') as 'solid' | 'dashed' | 'dotted'}>\n            {label}\n        </Divider>\n    );\n}\n"],"names":["PrimeDivider","element","label","stringProperty","_jsx","Divider","data-scene-id","id","layout","align","type"],"mappings":";;;;AAOA;;AAEC,IACM,SAASA,YAAAA,CAAa,EAAEC,OAAO,EAA4B,EAAA;IAC9D,MAAMC,KAAAA,GAAQC,eAAeF,OAAAA,EAAS,OAAA,CAAA;AACtC,IAAA,qBACIG,GAAA,CAACC,OAAAA,EAAAA;AACGC,QAAAA,eAAAA,EAAeL,QAAQM,EAAE;QACzBC,MAAAA,EAAQL,cAAAA,CAAeF,SAAS,QAAA,EAAU,YAAA,CAAA;AAC1CQ,QAAAA,KAAAA,EAAON,eAAeF,OAAAA,EAAS,OAAA,CAAA;QAC/BS,IAAAA,EAAMP,cAAAA,CAAeF,SAAS,MAAA,EAAQ,OAAA,CAAA;AACrCC,QAAAA,QAAAA,EAAAA;;AAGb;;;;"}
+{"version":3,"file":"PrimeDivider.js","sources":["../../../panel/PrimeDivider.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { Divider } from 'primereact/divider';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { stringProperty } from '../properties';\n\n/**\n * The `PrimeReact:divider` component - a rule separating content, optionally with a caption in it.\n *\n * The last component in this family PrimeReact 11 left monolithic, so the port is only a prop rename:\n * v10's `layout` is v11's `orientation`. The Scene property keeps the name `layout`, because a screen's\n * property vocabulary is this package's contract with authored content and renaming it would break every\n * screen that set it to buy nothing.\n */\nexport function PrimeDivider({ element }: RegisteredComponentProps) {\n    const label = stringProperty(element, 'label');\n    return (\n        <Divider\n            data-scene-id={element.id}\n            orientation={stringProperty(element, 'layout', 'horizontal') as 'horizontal' | 'vertical'}\n            align={stringProperty(element, 'align') as 'center' | 'left' | 'right' | 'top' | 'bottom' | undefined}\n            type={stringProperty(element, 'type', 'solid') as 'solid' | 'dashed' | 'dotted'}>\n            {label}\n        </Divider>\n    );\n}\n"],"names":["PrimeDivider","element","label","stringProperty","_jsx","Divider","data-scene-id","id","orientation","align","type"],"mappings":";;;;AAOA;;;;;;;AAOC,IACM,SAASA,YAAAA,CAAa,EAAEC,OAAO,EAA4B,EAAA;IAC9D,MAAMC,KAAAA,GAAQC,eAAeF,OAAAA,EAAS,OAAA,CAAA;AACtC,IAAA,qBACIG,GAAA,CAACC,OAAAA,EAAAA;AACGC,QAAAA,eAAAA,EAAeL,QAAQM,EAAE;QACzBC,WAAAA,EAAaL,cAAAA,CAAeF,SAAS,QAAA,EAAU,YAAA,CAAA;AAC/CQ,QAAAA,KAAAA,EAAON,eAAeF,OAAAA,EAAS,OAAA,CAAA;QAC/BS,IAAAA,EAAMP,cAAAA,CAAeF,SAAS,MAAA,EAAQ,OAAA,CAAA;AACrCC,QAAAA,QAAAA,EAAAA;;AAGb;;;;"}

package/dist/esm/panel/PrimeFieldset.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PrimeFieldset.d.ts","sourceRoot":"","sources":["../../../panel/PrimeFieldset.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAM/D,wBAAgB,aAAa,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,wBAAwB,+BAMzE"}
+{"version":3,"file":"PrimeFieldset.d.ts","sourceRoot":"","sources":["../../../panel/PrimeFieldset.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAY/D,wBAAgB,aAAa,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,wBAAwB,+BAsBzE"}

package/dist/esm/panel/PrimeFieldset.js

@@ -1,15 +1,48 @@
-import { jsx } from 'react/jsx-runtime';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import { Fieldset } from 'primereact/fieldset';
-import { booleanProperty, stringProperty } from '../properties.js';
+import { stringProperty, booleanProperty } from '../properties.js';
 
 /**
  * The `PrimeReact:fieldset` component - a container whose legend sits on its border.
+ *
+ * PrimeReact 11 dropped the `toggleable` prop entirely: a compositional `Fieldset` is collapsible exactly
+ * when its legend contains a `Fieldset.Trigger`, and inert when it does not. The Scene `toggleable`
+ * property therefore selects between two legend shapes rather than setting a flag. Both are rendered as a
+ * real `<legend>` either way, so the non-toggleable case does not pay for a button it never uses - which
+ * also keeps a static fieldset out of the tab order.
  */ function PrimeFieldset({ element, slots }) {
-    return /*#__PURE__*/ jsx(Fieldset, {
+    const legend = stringProperty(element, 'legend');
+    return /*#__PURE__*/ jsxs(Fieldset.Root, {
         "data-scene-id": element.id,
-        legend: stringProperty(element, 'legend'),
-        toggleable: booleanProperty(element, 'toggleable', false),
-        children: slots.content
+        defaultOpen: true,
+        children: [
+            /*#__PURE__*/ jsx(Fieldset.Legend, {
+                children: booleanProperty(element, 'toggleable', false) ? /*#__PURE__*/ jsxs(Fieldset.Trigger, {
+                    children: [
+                        /*#__PURE__*/ jsx(Fieldset.Title, {
+                            children: legend
+                        }),
+                        /*#__PURE__*/ jsx(Fieldset.Indicator, {
+                            match: "open",
+                            children: /*#__PURE__*/ jsx("i", {
+                                className: "pi pi-chevron-up"
+                            })
+                        }),
+                        /*#__PURE__*/ jsx(Fieldset.Indicator, {
+                            match: "closed",
+                            children: /*#__PURE__*/ jsx("i", {
+                                className: "pi pi-chevron-down"
+                            })
+                        })
+                    ]
+                }) : /*#__PURE__*/ jsx(Fieldset.Title, {
+                    children: legend
+                })
+            }),
+            /*#__PURE__*/ jsx(Fieldset.Content, {
+                children: slots.content
+            })
+        ]
     });
 }
 

package/dist/esm/panel/PrimeFieldset.js.map

@@ -1 +1 @@
-{"version":3,"file":"PrimeFieldset.js","sources":["../../../panel/PrimeFieldset.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { Fieldset } from 'primereact/fieldset';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { booleanProperty, stringProperty } from '../properties';\n\n/**\n * The `PrimeReact:fieldset` component - a container whose legend sits on its border.\n */\nexport function PrimeFieldset({ element, slots }: RegisteredComponentProps) {\n    return (\n        <Fieldset data-scene-id={element.id} legend={stringProperty(element, 'legend')} toggleable={booleanProperty(element, 'toggleable', false)}>\n            {slots.content}\n        </Fieldset>\n    );\n}\n"],"names":["PrimeFieldset","element","slots","_jsx","Fieldset","data-scene-id","id","legend","stringProperty","toggleable","booleanProperty","content"],"mappings":";;;;AAOA;;AAEC,IACM,SAASA,aAAAA,CAAc,EAAEC,OAAO,EAAEC,KAAK,EAA4B,EAAA;AACtE,IAAA,qBACIC,GAAA,CAACC,QAAAA,EAAAA;AAASC,QAAAA,eAAAA,EAAeJ,QAAQK,EAAE;AAAEC,QAAAA,MAAAA,EAAQC,eAAeP,OAAAA,EAAS,QAAA,CAAA;QAAWQ,UAAAA,EAAYC,eAAAA,CAAgBT,SAAS,YAAA,EAAc,KAAA,CAAA;AAC9HC,QAAAA,QAAAA,EAAAA,KAAAA,CAAMS;;AAGnB;;;;"}
+{"version":3,"file":"PrimeFieldset.js","sources":["../../../panel/PrimeFieldset.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { Fieldset } from 'primereact/fieldset';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { booleanProperty, stringProperty } from '../properties';\n\n/**\n * The `PrimeReact:fieldset` component - a container whose legend sits on its border.\n *\n * PrimeReact 11 dropped the `toggleable` prop entirely: a compositional `Fieldset` is collapsible exactly\n * when its legend contains a `Fieldset.Trigger`, and inert when it does not. The Scene `toggleable`\n * property therefore selects between two legend shapes rather than setting a flag. Both are rendered as a\n * real `<legend>` either way, so the non-toggleable case does not pay for a button it never uses - which\n * also keeps a static fieldset out of the tab order.\n */\nexport function PrimeFieldset({ element, slots }: RegisteredComponentProps) {\n    const legend = stringProperty(element, 'legend');\n    return (\n        <Fieldset.Root data-scene-id={element.id} defaultOpen>\n            <Fieldset.Legend>\n                {booleanProperty(element, 'toggleable', false) ? (\n                    <Fieldset.Trigger>\n                        <Fieldset.Title>{legend}</Fieldset.Title>\n                        <Fieldset.Indicator match='open'>\n                            <i className='pi pi-chevron-up' />\n                        </Fieldset.Indicator>\n                        <Fieldset.Indicator match='closed'>\n                            <i className='pi pi-chevron-down' />\n                        </Fieldset.Indicator>\n                    </Fieldset.Trigger>\n                ) : (\n                    <Fieldset.Title>{legend}</Fieldset.Title>\n                )}\n            </Fieldset.Legend>\n            <Fieldset.Content>{slots.content}</Fieldset.Content>\n        </Fieldset.Root>\n    );\n}\n"],"names":["PrimeFieldset","element","slots","legend","stringProperty","_jsxs","Fieldset","Root","data-scene-id","id","defaultOpen","_jsx","Legend","booleanProperty","Trigger","Title","Indicator","match","i","className","Content","content"],"mappings":";;;;AAOA;;;;;;;;AAQC,IACM,SAASA,aAAAA,CAAc,EAAEC,OAAO,EAAEC,KAAK,EAA4B,EAAA;IACtE,MAAMC,MAAAA,GAASC,eAAeH,OAAAA,EAAS,QAAA,CAAA;IACvC,qBACII,IAAA,CAACC,SAASC,IAAI,EAAA;AAACC,QAAAA,eAAAA,EAAeP,QAAQQ,EAAE;QAAEC,WAAW,EAAA,IAAA;;AACjD,0BAAAC,GAAA,CAACL,SAASM,MAAM,EAAA;AACXC,gBAAAA,QAAAA,EAAAA,eAAAA,CAAgBZ,OAAAA,EAAS,YAAA,EAAc,KAAA,CAAA,iBACpCI,IAAA,CAACC,SAASQ,OAAO,EAAA;;AACb,sCAAAH,GAAA,CAACL,SAASS,KAAK,EAAA;AAAEZ,4BAAAA,QAAAA,EAAAA;;AACjB,sCAAAQ,GAAA,CAACL,SAASU,SAAS,EAAA;4BAACC,KAAAA,EAAM,MAAA;AACtB,4BAAA,QAAA,gBAAAN,GAAA,CAACO,GAAAA,EAAAA;gCAAEC,SAAAA,EAAU;;;AAEjB,sCAAAR,GAAA,CAACL,SAASU,SAAS,EAAA;4BAACC,KAAAA,EAAM,QAAA;AACtB,4BAAA,QAAA,gBAAAN,GAAA,CAACO,GAAAA,EAAAA;gCAAEC,SAAAA,EAAU;;;;AAIrB,iBAAA,CAAA,iBAAAR,GAAA,CAACL,SAASS,KAAK,EAAA;AAAEZ,oBAAAA,QAAAA,EAAAA;;;AAGzB,0BAAAQ,GAAA,CAACL,SAASc,OAAO,EAAA;AAAElB,gBAAAA,QAAAA,EAAAA,KAAAA,CAAMmB;;;;AAGrC;;;;"}

package/dist/esm/panel/PrimePanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PrimePanel.d.ts","sourceRoot":"","sources":["../../../panel/PrimePanel.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAM/D,wBAAgB,UAAU,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,wBAAwB,+BAUtE"}
+{"version":3,"file":"PrimePanel.d.ts","sourceRoot":"","sources":["../../../panel/PrimePanel.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAe/D,wBAAgB,UAAU,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,wBAAwB,+BAoBtE"}

package/dist/esm/panel/PrimePanel.js

@@ -1,16 +1,52 @@
-import { jsx } from 'react/jsx-runtime';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import { Panel } from 'primereact/panel';
 import { booleanProperty, stringProperty } from '../properties.js';
 
 /**
  * The `PrimeReact:panel` component - a titled container that can optionally collapse.
+ *
+ * PrimeReact 11 made `Panel` compositional, which moves one decision into the adapter that v10 made
+ * internally: the collapse affordance exists only if something renders a `Panel.Trigger`. Rendering one
+ * unconditionally would put a chevron on every panel, including the ones a screen declared as fixed, so
+ * the trigger is tied to the same `toggleable` property that enables the behavior.
+ *
+ * The `collapsed` property is expressed as `defaultOpen` rather than a controlled `open`, because a
+ * screen states the *initial* state; holding the panel open or shut against the user's clicks is not what
+ * `collapsed: true` means.
  */ function PrimePanel({ element, slots }) {
-    return /*#__PURE__*/ jsx(Panel, {
+    const toggleable = booleanProperty(element, 'toggleable', false);
+    return /*#__PURE__*/ jsxs(Panel.Root, {
         "data-scene-id": element.id,
-        header: stringProperty(element, 'header'),
-        toggleable: booleanProperty(element, 'toggleable', false),
-        collapsed: booleanProperty(element, 'collapsed', false),
-        children: slots.content
+        toggleable: toggleable,
+        defaultOpen: !booleanProperty(element, 'collapsed', false),
+        children: [
+            /*#__PURE__*/ jsxs(Panel.Header, {
+                children: [
+                    /*#__PURE__*/ jsx(Panel.Title, {
+                        children: stringProperty(element, 'header')
+                    }),
+                    toggleable && /*#__PURE__*/ jsxs(Panel.Trigger, {
+                        children: [
+                            /*#__PURE__*/ jsx(Panel.Indicator, {
+                                match: "open",
+                                children: /*#__PURE__*/ jsx("i", {
+                                    className: "pi pi-chevron-up"
+                                })
+                            }),
+                            /*#__PURE__*/ jsx(Panel.Indicator, {
+                                match: "closed",
+                                children: /*#__PURE__*/ jsx("i", {
+                                    className: "pi pi-chevron-down"
+                                })
+                            })
+                        ]
+                    })
+                ]
+            }),
+            /*#__PURE__*/ jsx(Panel.Content, {
+                children: slots.content
+            })
+        ]
     });
 }
 

package/dist/esm/panel/PrimePanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"PrimePanel.js","sources":["../../../panel/PrimePanel.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { Panel } from 'primereact/panel';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { booleanProperty, stringProperty } from '../properties';\n\n/**\n * The `PrimeReact:panel` component - a titled container that can optionally collapse.\n */\nexport function PrimePanel({ element, slots }: RegisteredComponentProps) {\n    return (\n        <Panel\n            data-scene-id={element.id}\n            header={stringProperty(element, 'header')}\n            toggleable={booleanProperty(element, 'toggleable', false)}\n            collapsed={booleanProperty(element, 'collapsed', false)}>\n            {slots.content}\n        </Panel>\n    );\n}\n"],"names":["PrimePanel","element","slots","_jsx","Panel","data-scene-id","id","header","stringProperty","toggleable","booleanProperty","collapsed","content"],"mappings":";;;;AAOA;;AAEC,IACM,SAASA,UAAAA,CAAW,EAAEC,OAAO,EAAEC,KAAK,EAA4B,EAAA;AACnE,IAAA,qBACIC,GAAA,CAACC,KAAAA,EAAAA;AACGC,QAAAA,eAAAA,EAAeJ,QAAQK,EAAE;AACzBC,QAAAA,MAAAA,EAAQC,eAAeP,OAAAA,EAAS,QAAA,CAAA;QAChCQ,UAAAA,EAAYC,eAAAA,CAAgBT,SAAS,YAAA,EAAc,KAAA,CAAA;QACnDU,SAAAA,EAAWD,eAAAA,CAAgBT,SAAS,WAAA,EAAa,KAAA,CAAA;AAChDC,QAAAA,QAAAA,EAAAA,KAAAA,CAAMU;;AAGnB;;;;"}
+{"version":3,"file":"PrimePanel.js","sources":["../../../panel/PrimePanel.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { Panel } from 'primereact/panel';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { booleanProperty, stringProperty } from '../properties';\n\n/**\n * The `PrimeReact:panel` component - a titled container that can optionally collapse.\n *\n * PrimeReact 11 made `Panel` compositional, which moves one decision into the adapter that v10 made\n * internally: the collapse affordance exists only if something renders a `Panel.Trigger`. Rendering one\n * unconditionally would put a chevron on every panel, including the ones a screen declared as fixed, so\n * the trigger is tied to the same `toggleable` property that enables the behavior.\n *\n * The `collapsed` property is expressed as `defaultOpen` rather than a controlled `open`, because a\n * screen states the *initial* state; holding the panel open or shut against the user's clicks is not what\n * `collapsed: true` means.\n */\nexport function PrimePanel({ element, slots }: RegisteredComponentProps) {\n    const toggleable = booleanProperty(element, 'toggleable', false);\n    return (\n        <Panel.Root data-scene-id={element.id} toggleable={toggleable} defaultOpen={!booleanProperty(element, 'collapsed', false)}>\n            <Panel.Header>\n                <Panel.Title>{stringProperty(element, 'header')}</Panel.Title>\n                {toggleable && (\n                    <Panel.Trigger>\n                        <Panel.Indicator match='open'>\n                            <i className='pi pi-chevron-up' />\n                        </Panel.Indicator>\n                        <Panel.Indicator match='closed'>\n                            <i className='pi pi-chevron-down' />\n                        </Panel.Indicator>\n                    </Panel.Trigger>\n                )}\n            </Panel.Header>\n            <Panel.Content>{slots.content}</Panel.Content>\n        </Panel.Root>\n    );\n}\n"],"names":["PrimePanel","element","slots","toggleable","booleanProperty","_jsxs","Panel","Root","data-scene-id","id","defaultOpen","Header","_jsx","Title","stringProperty","Trigger","Indicator","match","i","className","Content","content"],"mappings":";;;;AAOA;;;;;;;;;;;AAWC,IACM,SAASA,UAAAA,CAAW,EAAEC,OAAO,EAAEC,KAAK,EAA4B,EAAA;IACnE,MAAMC,UAAAA,GAAaC,eAAAA,CAAgBH,OAAAA,EAAS,YAAA,EAAc,KAAA,CAAA;IAC1D,qBACII,IAAA,CAACC,MAAMC,IAAI,EAAA;AAACC,QAAAA,eAAAA,EAAeP,QAAQQ,EAAE;QAAEN,UAAAA,EAAYA,UAAAA;QAAYO,WAAAA,EAAa,CAACN,eAAAA,CAAgBH,OAAAA,EAAS,WAAA,EAAa,KAAA,CAAA;;AAC/G,0BAAAI,IAAA,CAACC,MAAMK,MAAM,EAAA;;AACT,kCAAAC,GAAA,CAACN,MAAMO,KAAK,EAAA;AAAEC,wBAAAA,QAAAA,EAAAA,cAAAA,CAAeb,OAAAA,EAAS,QAAA;;oBACrCE,UAAAA,kBACGE,IAAA,CAACC,MAAMS,OAAO,EAAA;;AACV,0CAAAH,GAAA,CAACN,MAAMU,SAAS,EAAA;gCAACC,KAAAA,EAAM,MAAA;AACnB,gCAAA,QAAA,gBAAAL,GAAA,CAACM,GAAAA,EAAAA;oCAAEC,SAAAA,EAAU;;;AAEjB,0CAAAP,GAAA,CAACN,MAAMU,SAAS,EAAA;gCAACC,KAAAA,EAAM,QAAA;AACnB,gCAAA,QAAA,gBAAAL,GAAA,CAACM,GAAAA,EAAAA;oCAAEC,SAAAA,EAAU;;;;;;;AAK7B,0BAAAP,GAAA,CAACN,MAAMc,OAAO,EAAA;AAAElB,gBAAAA,QAAAA,EAAAA,KAAAA,CAAMmB;;;;AAGlC;;;;"}

package/dist/esm/panel/PrimeScrollPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PrimeScrollPanel.d.ts","sourceRoot":"","sources":["../../../panel/PrimeScrollPanel.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAW/D,wBAAgB,gBAAgB,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,wBAAwB,+BAQ5E"}
+{"version":3,"file":"PrimeScrollPanel.d.ts","sourceRoot":"","sources":["../../../panel/PrimeScrollPanel.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAgB/D,wBAAgB,gBAAgB,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,wBAAwB,+BAW5E"}

package/dist/esm/panel/PrimeScrollPanel.js

@@ -1,22 +1,37 @@
-import { jsx } from 'react/jsx-runtime';
-import { ScrollPanel } from 'primereact/scrollpanel';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { ScrollArea } from 'primereact/scrollarea';
 import { numberProperty } from '../properties.js';
 
 /**
  * The `PrimeReact:scrollPanel` component - a bounded region with themed scrollbars.
  *
- * A height is always applied: ScrollPanel with no bound grows to fit its content and never scrolls,
+ * A height is always applied: a scroll area with no bound grows to fit its content and never scrolls,
  * which looks like the component doing nothing at all.
  *
- * In PrimeReact 11 this component is renamed `ScrollArea`.
+ * PrimeReact 11 renamed `ScrollPanel` to `ScrollArea` and split it into parts. The viewport, the content
+ * wrapper and the scrollbar are all rendered here rather than by the component, because v11 renders no
+ * part it was not given - a `ScrollArea.Root` on its own clips nothing and shows no bar. Only the
+ * vertical scrollbar is composed in, matching the fixed-height-and-full-width shape this adapter imposes;
+ * the part hides itself when the content happens to fit, so it costs nothing when it is not needed. The
+ * abstract Scene name stays `scrollPanel` so existing screens keep resolving.
  */ function PrimeScrollPanel({ element, slots }) {
-    return /*#__PURE__*/ jsx(ScrollPanel, {
+    return /*#__PURE__*/ jsxs(ScrollArea.Root, {
         "data-scene-id": element.id,
         style: {
             height: `${numberProperty(element, 'height', 200)}px`,
             width: '100%'
         },
-        children: slots.content
+        children: [
+            /*#__PURE__*/ jsx(ScrollArea.Viewport, {
+                children: /*#__PURE__*/ jsx(ScrollArea.Content, {
+                    children: slots.content
+                })
+            }),
+            /*#__PURE__*/ jsx(ScrollArea.Scrollbar, {
+                orientation: "vertical",
+                children: /*#__PURE__*/ jsx(ScrollArea.Handle, {})
+            })
+        ]
     });
 }
 

package/dist/esm/panel/PrimeScrollPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"PrimeScrollPanel.js","sources":["../../../panel/PrimeScrollPanel.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { ScrollPanel } from 'primereact/scrollpanel';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { numberProperty } from '../properties';\n\n/**\n * The `PrimeReact:scrollPanel` component - a bounded region with themed scrollbars.\n *\n * A height is always applied: ScrollPanel with no bound grows to fit its content and never scrolls,\n * which looks like the component doing nothing at all.\n *\n * In PrimeReact 11 this component is renamed `ScrollArea`.\n */\nexport function PrimeScrollPanel({ element, slots }: RegisteredComponentProps) {\n    return (\n        <ScrollPanel\n            data-scene-id={element.id}\n            style={{ height: `${numberProperty(element, 'height', 200)}px`, width: '100%' }}>\n            {slots.content}\n        </ScrollPanel>\n    );\n}\n"],"names":["PrimeScrollPanel","element","slots","_jsx","ScrollPanel","data-scene-id","id","style","height","numberProperty","width","content"],"mappings":";;;;AAOA;;;;;;;AAOC,IACM,SAASA,gBAAAA,CAAiB,EAAEC,OAAO,EAAEC,KAAK,EAA4B,EAAA;AACzE,IAAA,qBACIC,GAAA,CAACC,WAAAA,EAAAA;AACGC,QAAAA,eAAAA,EAAeJ,QAAQK,EAAE;QACzBC,KAAAA,EAAO;AAAEC,YAAAA,MAAAA,EAAQ,GAAGC,cAAAA,CAAeR,OAAAA,EAAS,QAAA,EAAU,GAAA,CAAA,CAAK,EAAE,CAAC;YAAES,KAAAA,EAAO;AAAO,SAAA;AAC7ER,QAAAA,QAAAA,EAAAA,KAAAA,CAAMS;;AAGnB;;;;"}
+{"version":3,"file":"PrimeScrollPanel.js","sources":["../../../panel/PrimeScrollPanel.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { ScrollArea } from 'primereact/scrollarea';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { numberProperty } from '../properties';\n\n/**\n * The `PrimeReact:scrollPanel` component - a bounded region with themed scrollbars.\n *\n * A height is always applied: a scroll area with no bound grows to fit its content and never scrolls,\n * which looks like the component doing nothing at all.\n *\n * PrimeReact 11 renamed `ScrollPanel` to `ScrollArea` and split it into parts. The viewport, the content\n * wrapper and the scrollbar are all rendered here rather than by the component, because v11 renders no\n * part it was not given - a `ScrollArea.Root` on its own clips nothing and shows no bar. Only the\n * vertical scrollbar is composed in, matching the fixed-height-and-full-width shape this adapter imposes;\n * the part hides itself when the content happens to fit, so it costs nothing when it is not needed. The\n * abstract Scene name stays `scrollPanel` so existing screens keep resolving.\n */\nexport function PrimeScrollPanel({ element, slots }: RegisteredComponentProps) {\n    return (\n        <ScrollArea.Root data-scene-id={element.id} style={{ height: `${numberProperty(element, 'height', 200)}px`, width: '100%' }}>\n            <ScrollArea.Viewport>\n                <ScrollArea.Content>{slots.content}</ScrollArea.Content>\n            </ScrollArea.Viewport>\n            <ScrollArea.Scrollbar orientation='vertical'>\n                <ScrollArea.Handle />\n            </ScrollArea.Scrollbar>\n        </ScrollArea.Root>\n    );\n}\n"],"names":["PrimeScrollPanel","element","slots","_jsxs","ScrollArea","Root","data-scene-id","id","style","height","numberProperty","width","_jsx","Viewport","Content","content","Scrollbar","orientation","Handle"],"mappings":";;;;AAOA;;;;;;;;;;;;AAYC,IACM,SAASA,gBAAAA,CAAiB,EAAEC,OAAO,EAAEC,KAAK,EAA4B,EAAA;IACzE,qBACIC,IAAA,CAACC,WAAWC,IAAI,EAAA;AAACC,QAAAA,eAAAA,EAAeL,QAAQM,EAAE;QAAEC,KAAAA,EAAO;AAAEC,YAAAA,MAAAA,EAAQ,GAAGC,cAAAA,CAAeT,OAAAA,EAAS,QAAA,EAAU,GAAA,CAAA,CAAK,EAAE,CAAC;YAAEU,KAAAA,EAAO;AAAO,SAAA;;AACtH,0BAAAC,GAAA,CAACR,WAAWS,QAAQ,EAAA;wCAChBD,GAAA,CAACR,WAAWU,OAAO,EAAA;AAAEZ,oBAAAA,QAAAA,EAAAA,KAAAA,CAAMa;;;AAE/B,0BAAAH,GAAA,CAACR,WAAWY,SAAS,EAAA;gBAACC,WAAAA,EAAY,UAAA;wCAC9BL,GAAA,CAACR,WAAWc,MAAM,EAAA,EAAA;;;;AAIlC;;;;"}

package/dist/esm/panel/PrimeSplitter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PrimeSplitter.d.ts","sourceRoot":"","sources":["../../../panel/PrimeSplitter.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAS/D,wBAAgB,aAAa,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,wBAAwB,+BAezE"}
+{"version":3,"file":"PrimeSplitter.d.ts","sourceRoot":"","sources":["../../../panel/PrimeSplitter.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAmB/D,wBAAgB,aAAa,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,wBAAwB,+BAqBzE"}

package/dist/esm/panel/PrimeSplitter.js

@@ -1,5 +1,6 @@
-import { jsx } from 'react/jsx-runtime';
-import { Splitter, SplitterPanel } from 'primereact/splitter';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { Fragment } from 'react';
+import { Splitter } from 'primereact/splitter';
 import { numberProperty, stringProperty } from '../properties.js';
 
 /**
@@ -7,21 +8,40 @@ import { numberProperty, stringProperty } from '../properties.js';
  *
  * One panel per child in the `content` slot, sized evenly. Splitter needs an explicit height because it
  * lays its panels out absolutely; without one the whole component collapses.
+ *
+ * PrimeReact 11 moved sizing off the individual panel and onto the root: a v10 `SplitterPanel size={50}`
+ * is now one entry in the root's `defaultSizes` array, so the even split is computed once up front rather
+ * than repeated per panel. It also stopped inserting the drag bars for you - `Splitter.Gutter` is a part
+ * the composition supplies between panels, and a splitter rendered without them is simply not resizable.
+ * `defaultSizes` is used rather than `sizes` so the component owns its sizes after the first drag; the
+ * controlled form would snap the panels back to the even split on every render.
+ *
+ * The Scene property keeps the name `layout` even though v11 calls the prop `orientation`, because a
+ * screen's property vocabulary is this package's contract with authored content.
  */ function PrimeSplitter({ element, slots }) {
     const panels = slots.content ?? [];
     const count = Math.max(panels.length, 2);
-    return /*#__PURE__*/ jsx(Splitter, {
+    return /*#__PURE__*/ jsx(Splitter.Root, {
         "data-scene-id": element.id,
-        layout: stringProperty(element, 'layout', 'horizontal'),
+        orientation: stringProperty(element, 'layout', 'horizontal'),
+        defaultSizes: Array.from({
+            length: count
+        }, ()=>100 / count),
         style: {
             height: `${numberProperty(element, 'height', 200)}px`
         },
         children: Array.from({
             length: count
-        }, (_, index)=>/*#__PURE__*/ jsx(SplitterPanel, {
-                size: 100 / count,
-                className: "flex items-center justify-center",
-                children: panels[index]
+        }, (_, index)=>/*#__PURE__*/ jsxs(Fragment, {
+                children: [
+                    index > 0 && /*#__PURE__*/ jsx(Splitter.Gutter, {
+                        children: /*#__PURE__*/ jsx(Splitter.Handle, {})
+                    }),
+                    /*#__PURE__*/ jsx(Splitter.Panel, {
+                        className: "flex items-center justify-center",
+                        children: panels[index]
+                    })
+                ]
             }, index))
     });
 }

package/dist/esm/panel/PrimeSplitter.js.map

@@ -1 +1 @@
-{"version":3,"file":"PrimeSplitter.js","sources":["../../../panel/PrimeSplitter.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { Splitter, SplitterPanel } from 'primereact/splitter';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { numberProperty, stringProperty } from '../properties';\n\n/**\n * The `PrimeReact:splitter` component - regions separated by a bar the user can drag.\n *\n * One panel per child in the `content` slot, sized evenly. Splitter needs an explicit height because it\n * lays its panels out absolutely; without one the whole component collapses.\n */\nexport function PrimeSplitter({ element, slots }: RegisteredComponentProps) {\n    const panels = slots.content ?? [];\n    const count = Math.max(panels.length, 2);\n    return (\n        <Splitter\n            data-scene-id={element.id}\n            layout={stringProperty(element, 'layout', 'horizontal') as 'horizontal' | 'vertical'}\n            style={{ height: `${numberProperty(element, 'height', 200)}px` }}>\n            {Array.from({ length: count }, (_, index) => (\n                <SplitterPanel key={index} size={100 / count} className='flex items-center justify-center'>\n                    {panels[index]}\n                </SplitterPanel>\n            ))}\n        </Splitter>\n    );\n}\n"],"names":["PrimeSplitter","element","slots","panels","content","count","Math","max","length","_jsx","Splitter","data-scene-id","id","layout","stringProperty","style","height","numberProperty","Array","from","_","index","SplitterPanel","size","className"],"mappings":";;;;AAOA;;;;;AAKC,IACM,SAASA,aAAAA,CAAc,EAAEC,OAAO,EAAEC,KAAK,EAA4B,EAAA;AACtE,IAAA,MAAMC,MAAAA,GAASD,KAAAA,CAAME,OAAO,IAAI,EAAE;AAClC,IAAA,MAAMC,QAAQC,IAAAA,CAAKC,GAAG,CAACJ,MAAAA,CAAOK,MAAM,EAAE,CAAA,CAAA;AACtC,IAAA,qBACIC,GAAA,CAACC,QAAAA,EAAAA;AACGC,QAAAA,eAAAA,EAAeV,QAAQW,EAAE;QACzBC,MAAAA,EAAQC,cAAAA,CAAeb,SAAS,QAAA,EAAU,YAAA,CAAA;QAC1Cc,KAAAA,EAAO;AAAEC,YAAAA,MAAAA,EAAQ,GAAGC,cAAAA,CAAehB,OAAAA,EAAS,QAAA,EAAU,GAAA,CAAA,CAAK,EAAE;AAAE,SAAA;AAC9DiB,QAAAA,QAAAA,EAAAA,KAAAA,CAAMC,IAAI,CAAC;YAAEX,MAAAA,EAAQH;SAAM,EAAG,CAACe,CAAAA,EAAGC,KAAAA,iBAC/BZ,GAAA,CAACa,aAAAA,EAAAA;AAA0BC,gBAAAA,IAAAA,EAAM,GAAA,GAAMlB,KAAAA;gBAAOmB,SAAAA,EAAU,kCAAA;AACnDrB,gBAAAA,QAAAA,EAAAA,MAAM,CAACkB,KAAAA;AADQA,aAAAA,EAAAA,KAAAA,CAAAA;;AAMpC;;;;"}
+{"version":3,"file":"PrimeSplitter.js","sources":["../../../panel/PrimeSplitter.tsx"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { Fragment } from 'react';\nimport { Splitter } from 'primereact/splitter';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { numberProperty, stringProperty } from '../properties';\n\n/**\n * The `PrimeReact:splitter` component - regions separated by a bar the user can drag.\n *\n * One panel per child in the `content` slot, sized evenly. Splitter needs an explicit height because it\n * lays its panels out absolutely; without one the whole component collapses.\n *\n * PrimeReact 11 moved sizing off the individual panel and onto the root: a v10 `SplitterPanel size={50}`\n * is now one entry in the root's `defaultSizes` array, so the even split is computed once up front rather\n * than repeated per panel. It also stopped inserting the drag bars for you - `Splitter.Gutter` is a part\n * the composition supplies between panels, and a splitter rendered without them is simply not resizable.\n * `defaultSizes` is used rather than `sizes` so the component owns its sizes after the first drag; the\n * controlled form would snap the panels back to the even split on every render.\n *\n * The Scene property keeps the name `layout` even though v11 calls the prop `orientation`, because a\n * screen's property vocabulary is this package's contract with authored content.\n */\nexport function PrimeSplitter({ element, slots }: RegisteredComponentProps) {\n    const panels = slots.content ?? [];\n    const count = Math.max(panels.length, 2);\n    return (\n        <Splitter.Root\n            data-scene-id={element.id}\n            orientation={stringProperty(element, 'layout', 'horizontal') as 'horizontal' | 'vertical'}\n            defaultSizes={Array.from({ length: count }, () => 100 / count)}\n            style={{ height: `${numberProperty(element, 'height', 200)}px` }}>\n            {Array.from({ length: count }, (_, index) => (\n                <Fragment key={index}>\n                    {index > 0 && (\n                        <Splitter.Gutter>\n                            <Splitter.Handle />\n                        </Splitter.Gutter>\n                    )}\n                    <Splitter.Panel className='flex items-center justify-center'>{panels[index]}</Splitter.Panel>\n                </Fragment>\n            ))}\n        </Splitter.Root>\n    );\n}\n"],"names":["PrimeSplitter","element","slots","panels","content","count","Math","max","length","_jsx","Splitter","Root","data-scene-id","id","orientation","stringProperty","defaultSizes","Array","from","style","height","numberProperty","_","index","_jsxs","Fragment","Gutter","Handle","Panel","className"],"mappings":";;;;;AAQA;;;;;;;;;;;;;;;AAeC,IACM,SAASA,aAAAA,CAAc,EAAEC,OAAO,EAAEC,KAAK,EAA4B,EAAA;AACtE,IAAA,MAAMC,MAAAA,GAASD,KAAAA,CAAME,OAAO,IAAI,EAAE;AAClC,IAAA,MAAMC,QAAQC,IAAAA,CAAKC,GAAG,CAACJ,MAAAA,CAAOK,MAAM,EAAE,CAAA,CAAA;IACtC,qBACIC,GAAA,CAACC,SAASC,IAAI,EAAA;AACVC,QAAAA,eAAAA,EAAeX,QAAQY,EAAE;QACzBC,WAAAA,EAAaC,cAAAA,CAAed,SAAS,QAAA,EAAU,YAAA,CAAA;QAC/Ce,YAAAA,EAAcC,KAAAA,CAAMC,IAAI,CAAC;YAAEV,MAAAA,EAAQH;AAAM,SAAA,EAAG,IAAM,GAAA,GAAMA,KAAAA,CAAAA;QACxDc,KAAAA,EAAO;AAAEC,YAAAA,MAAAA,EAAQ,GAAGC,cAAAA,CAAepB,OAAAA,EAAS,QAAA,EAAU,GAAA,CAAA,CAAK,EAAE;AAAE,SAAA;AAC9DgB,QAAAA,QAAAA,EAAAA,KAAAA,CAAMC,IAAI,CAAC;YAAEV,MAAAA,EAAQH;SAAM,EAAG,CAACiB,CAAAA,EAAGC,KAAAA,iBAC/BC,IAAA,CAACC,QAAAA,EAAAA;;oBACIF,KAAAA,GAAQ,CAAA,kBACLd,GAAA,CAACC,QAAAA,CAASgB,MAAM,EAAA;gDACZjB,GAAA,CAACC,SAASiB,MAAM,EAAA,EAAA;;AAGxB,kCAAAlB,GAAA,CAACC,SAASkB,KAAK,EAAA;wBAACC,SAAAA,EAAU,kCAAA;AAAoC1B,wBAAAA,QAAAA,EAAAA,MAAM,CAACoB,KAAAA;;;AAN1DA,aAAAA,EAAAA,KAAAA,CAAAA;;AAW/B;;;;"}

package/dist/esm/panel/PrimeStepper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PrimeStepper.d.ts","sourceRoot":"","sources":["../../../panel/PrimeStepper.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAU/D,wBAAgB,YAAY,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,wBAAwB,+BAwBxE"}
+{"version":3,"file":"PrimeStepper.d.ts","sourceRoot":"","sources":["../../../panel/PrimeStepper.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAsB/D,wBAAgB,YAAY,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,wBAAwB,+BAkDxE"}