@k2b/ui 0.2.0 → 0.4.0

package/dist/ssr/layout/DetailPanel.js

@@ -32,9 +32,10 @@ var _tmpl$ = ["<div class=\"k2b-detail-panel__header-leading\">", "</div>"],
   _tmpl$25 = ["<div class=\"k2b-detail-panel__section-actions\">", "</div>"],
   _tmpl$26 = ["<div class=\"k2b-detail-panel__section-body\">", "</div>"],
   _tmpl$27 = ["<section", "><header class=\"k2b-detail-panel__section-header\">", "<div class=\"k2b-detail-panel__section-copy\"><h3", ">", "</h3>", "</div>", "", "</header>", "</section>"];
-import { createEffect, createSignal, createUniqueId, Show, splitProps } from "solid-js";
+import { children, createEffect, createSignal, createUniqueId, Show, splitProps } from "solid-js";
 import { Button, ButtonLink } from "../actions/Button";
 import { Dropdown } from "../actions/Dropdown";
+import { createScrollFade } from "./scroll-fade";
 const classNames = (base, extra) => extra ? `${base} ${extra}` : base;
 const DetailPanelHeader = props => _$ssr(_tmpl$7, _$ssrAttribute("class", _$escape(classNames("k2b-detail-panel__header", props.class), true), false), _$escape(_$createComponent(Show, {
   get when() {
@@ -84,7 +85,11 @@ const DetailPanelHeader = props => _$ssr(_tmpl$7, _$ssrAttribute("class", _$esca
     return _$ssr(_tmpl$6, _$escape(props.primaryActions));
   }
 })));
-const DetailPanelBody = props => _$ssr(_tmpl$9, _$ssrAttribute("class", _$escape(classNames("k2b-detail-panel__body", props.class), true), false) + _$ssrAttribute("data-scroll-preserve", _$escape(props.scrollPreserveKey, true), false), _$escape(props.children));
+const DetailPanelBody = props => {
+  let body;
+  createScrollFade(() => body, () => props.scrollFade !== false);
+  return _$ssr(_tmpl$9, _$ssrAttribute("class", _$escape(classNames("k2b-detail-panel__body", props.class), true), false) + _$ssrAttribute("data-scroll-fade-mode", props.scrollFade !== false ? "both" : _$escape(undefined, true), false) + _$ssrAttribute("data-scroll-preserve", _$escape(props.scrollPreserveKey, true), false), _$escape(props.children));
+};
 const DetailPanelSummary = props => {
   const headingId = `k2b-detail-panel-summary-${createUniqueId()}`;
   return _$ssr(_tmpl$1, _$ssrAttribute("class", _$escape(classNames("k2b-detail-panel__summary", props.class), true), false) + _$ssrAttribute("aria-labelledby", _$escape(headingId, true), false), _$ssrAttribute("id", _$escape(headingId, true), false), _$escape(props.title), _$escape(_$createComponent(Show, {
@@ -230,6 +235,8 @@ const DetailPanelSection = props => {
     });
   });
   const className = () => classNames("k2b-detail-panel__section", props.class);
+  // Resolve once: reading `props.children` twice would instantiate the section body twice.
+  const resolved = children(() => props.children);
   return _$createComponent(Show, {
     get when() {
       return props.collapsible;
@@ -265,10 +272,10 @@ const DetailPanelSection = props => {
         }
       })), _$escape(_$createComponent(Show, {
         get when() {
-          return props.children !== undefined;
+          return resolved();
         },
         get children() {
-          return _$ssr(_tmpl$26, _$escape(props.children));
+          return _$ssr(_tmpl$26, _$escape(resolved()));
         }
       })));
     },

package/dist/ssr/layout/DetailPanel.js.map

@@ -1 +1 @@
-{"version":3,"names":["createEffect","createSignal","createUniqueId","Show","splitProps","Button","ButtonLink","Dropdown","classNames","base","extra","DetailPanelHeader","props","_$ssr","_tmpl$7","_$ssrAttribute","_$escape","class","_$createComponent","when","icon","children","_tmpl$8","leading","_tmpl$","title","subtitle","meta","_tmpl$4","_tmpl$2","_tmpl$3","actions","_tmpl$5","primaryActions","_tmpl$6","DetailPanelBody","_tmpl$9","scrollPreserveKey","DetailPanelSummary","headingId","_tmpl$1","_tmpl$0","DetailPanelGroup","_tmpl$10","label","DetailPanelSectionIcon","_tmpl$11","tone","DetailPanelActionContent","_tmpl$12","_tmpl$14","description","_tmpl$13","trailing","_tmpl$15","DetailPanelAction","local","rest","className","content","action","href","undefined","fallback","_$mergeProps","variant","size","menuItems","length","_tmpl$17","Root","items","align","menuLabel","Trigger","iconOnly","_tmpl$16","DetailPanelSection","bodyId","internalOpen","setInternalOpen","defaultOpen","open","expand","collapse","body","toggle","next","disabled","onOpenChange","expanded","queueMicrotask","active","ownerDocument","activeElement","focus","contains","collapsible","_tmpl$27","_tmpl$22","_tmpl$25","_tmpl$26","_tmpl$24","onClick","_tmpl$19","_tmpl$18","_tmpl$20","_tmpl$21","_tmpl$23","DetailPanel","Header","Body","Summary","Group","Section","Action"],"sources":["layout/DetailPanel.tsx"],"sourcesContent":["import { createEffect, createSignal, createUniqueId, type JSX, Show, splitProps } from \"solid-js\";\nimport { Button, ButtonLink, type ButtonLinkProps, type ButtonProps } from \"../actions/Button\";\nimport { Dropdown, type DropdownItem } from \"../actions/Dropdown\";\n\nexport type DetailPanelProps = {\n  children: JSX.Element;\n  class?: string;\n};\n\ntype DetailPanelHeaderBaseProps = {\n  title: JSX.Element;\n  subtitle?: JSX.Element;\n  meta?: JSX.Element;\n  actions?: JSX.Element;\n  primaryActions?: JSX.Element;\n  class?: string;\n};\n\nexport type DetailPanelHeaderProps = DetailPanelHeaderBaseProps &\n  (\n    | {\n        leading?: JSX.Element;\n        icon?: never;\n      }\n    | {\n        leading?: never;\n        icon?: string;\n      }\n  );\n\nexport type DetailPanelBodyProps = {\n  children: JSX.Element;\n  scrollPreserveKey?: string;\n  class?: string;\n};\n\nexport type DetailPanelSummaryProps = {\n  title: JSX.Element;\n  children: JSX.Element;\n  actions?: JSX.Element;\n  class?: string;\n};\n\nexport type DetailPanelGroupProps = {\n  children: JSX.Element;\n  label?: string;\n  class?: string;\n};\n\nexport type DetailPanelTone = \"accent\" | \"neutral\" | \"success\" | \"warning\" | \"danger\";\n\ntype DetailPanelSectionBaseProps = {\n  title: JSX.Element;\n  icon?: string;\n  tone?: DetailPanelTone;\n  description?: JSX.Element;\n  meta?: JSX.Element;\n  class?: string;\n};\n\ntype DetailPanelActionBaseProps = {\n  title: JSX.Element;\n  description?: JSX.Element;\n  leading?: JSX.Element;\n  trailing?: JSX.Element;\n  class?: string;\n};\n\ntype DetailPanelActionMenuProps =\n  | {\n      menuItems?: never;\n      menuLabel?: never;\n    }\n  | {\n      menuItems: readonly DropdownItem[];\n      menuLabel: string;\n    };\n\nexport type DetailPanelActionLinkProps = DetailPanelActionBaseProps &\n  DetailPanelActionMenuProps &\n  Omit<ButtonLinkProps, \"children\" | \"class\" | \"size\" | \"title\" | \"variant\"> & {\n    href: string;\n  };\n\nexport type DetailPanelActionButtonProps = DetailPanelActionBaseProps &\n  DetailPanelActionMenuProps &\n  Omit<ButtonProps, \"children\" | \"class\" | \"size\" | \"title\" | \"variant\"> & {\n    href?: never;\n  };\n\nexport type DetailPanelActionProps = DetailPanelActionLinkProps | DetailPanelActionButtonProps;\n\nexport type DetailPanelSectionProps = DetailPanelSectionBaseProps &\n  (\n    | {\n        children?: JSX.Element;\n        actions?: JSX.Element;\n        collapsible?: false;\n        defaultOpen?: never;\n        open?: never;\n        onOpenChange?: never;\n        disabled?: never;\n      }\n    | {\n        children: JSX.Element;\n        actions?: never;\n        collapsible: true;\n        defaultOpen?: boolean;\n        open?: boolean;\n        onOpenChange?: (open: boolean) => void;\n        disabled?: boolean;\n      }\n  );\n\ntype DetailPanelComponent = ((props: DetailPanelProps) => JSX.Element) & {\n  Header: (props: DetailPanelHeaderProps) => JSX.Element;\n  Body: (props: DetailPanelBodyProps) => JSX.Element;\n  Summary: (props: DetailPanelSummaryProps) => JSX.Element;\n  Group: (props: DetailPanelGroupProps) => JSX.Element;\n  Section: (props: DetailPanelSectionProps) => JSX.Element;\n  Action: (props: DetailPanelActionProps) => JSX.Element;\n};\n\nconst classNames = (base: string, extra?: string): string => (extra ? `${base} ${extra}` : base);\n\nconst DetailPanelHeader = (props: DetailPanelHeaderProps): JSX.Element => (\n  <header class={classNames(\"k2b-detail-panel__header\", props.class)}>\n    <div class=\"k2b-detail-panel__header-main\">\n      <Show when={props.icon}>\n        {(icon) => (\n          <span class=\"k2b-detail-panel__header-icon\" aria-hidden=\"true\">\n            <i class={icon()} />\n          </span>\n        )}\n      </Show>\n      <Show when={props.leading}>\n        <div class=\"k2b-detail-panel__header-leading\">{props.leading}</div>\n      </Show>\n      <div class=\"k2b-detail-panel__heading\">\n        <h2>{props.title}</h2>\n        <Show when={props.subtitle || props.meta}>\n          <div class=\"k2b-detail-panel__supporting\">\n            <Show when={props.subtitle}>\n              <p>{props.subtitle}</p>\n            </Show>\n            <Show when={props.meta}>\n              <div class=\"k2b-detail-panel__meta\">{props.meta}</div>\n            </Show>\n          </div>\n        </Show>\n      </div>\n      <Show when={props.actions}>\n        <div class=\"k2b-detail-panel__actions\">{props.actions}</div>\n      </Show>\n    </div>\n    <Show when={props.primaryActions}>\n      <div class=\"k2b-detail-panel__primary-actions\">{props.primaryActions}</div>\n    </Show>\n  </header>\n);\n\nconst DetailPanelBody = (props: DetailPanelBodyProps): JSX.Element => (\n  <div class={classNames(\"k2b-detail-panel__body\", props.class)} data-scroll-preserve={props.scrollPreserveKey}>\n    {props.children}\n  </div>\n);\n\nconst DetailPanelSummary = (props: DetailPanelSummaryProps): JSX.Element => {\n  const headingId = `k2b-detail-panel-summary-${createUniqueId()}`;\n\n  return (\n    <section class={classNames(\"k2b-detail-panel__summary\", props.class)} aria-labelledby={headingId}>\n      <header class=\"k2b-detail-panel__summary-header\">\n        <h3 id={headingId}>{props.title}</h3>\n        <Show when={props.actions}>\n          <div class=\"k2b-detail-panel__summary-actions\">{props.actions}</div>\n        </Show>\n      </header>\n      <div class=\"k2b-detail-panel__summary-body\">{props.children}</div>\n    </section>\n  );\n};\n\nconst DetailPanelGroup = (props: DetailPanelGroupProps): JSX.Element => (\n  <div class={classNames(\"k2b-detail-panel__group\", props.class)} role=\"group\" aria-label={props.label}>\n    {props.children}\n  </div>\n);\n\nconst DetailPanelSectionIcon = (props: Pick<DetailPanelSectionBaseProps, \"icon\" | \"tone\">): JSX.Element => (\n  <Show when={props.icon}>\n    {(icon) => (\n      <span class=\"k2b-detail-panel__section-icon\" data-tone={props.tone ?? \"neutral\"} aria-hidden=\"true\">\n        <i class={icon()} />\n      </span>\n    )}\n  </Show>\n);\n\nconst DetailPanelActionContent = (props: DetailPanelActionBaseProps): JSX.Element => (\n  <>\n    <Show when={props.leading}>\n      <span class=\"k2b-detail-panel__action-leading\">{props.leading}</span>\n    </Show>\n    <span class=\"k2b-detail-panel__action-copy\">\n      <span class=\"k2b-detail-panel__action-title\">{props.title}</span>\n      <Show when={props.description}>\n        <span class=\"k2b-detail-panel__action-description\">{props.description}</span>\n      </Show>\n    </span>\n    <Show when={props.trailing}>\n      <span class=\"k2b-detail-panel__action-trailing\">{props.trailing}</span>\n    </Show>\n  </>\n);\n\nconst DetailPanelAction = (props: DetailPanelActionProps): JSX.Element => {\n  const [local, rest] = splitProps(props, [\"class\", \"description\", \"href\", \"leading\", \"menuItems\", \"menuLabel\", \"title\", \"trailing\"]);\n  const className = classNames(\"k2b-detail-panel__action\", local.class);\n  const content = () => (\n    <DetailPanelActionContent title={local.title} description={local.description} leading={local.leading} trailing={local.trailing} />\n  );\n\n  const action = () => (\n    <Show\n      when={local.href !== undefined}\n      fallback={\n        <Button\n          {...(rest as Omit<DetailPanelActionButtonProps, keyof DetailPanelActionBaseProps>)}\n          class={className}\n          variant=\"ghost\"\n          size=\"sm\"\n        >\n          {content()}\n        </Button>\n      }\n    >\n      <ButtonLink\n        {...(rest as Omit<DetailPanelActionLinkProps, keyof DetailPanelActionBaseProps | \"href\">)}\n        href={local.href as string}\n        class={className}\n        variant=\"ghost\"\n        size=\"sm\"\n      >\n        {content()}\n      </ButtonLink>\n    </Show>\n  );\n\n  return (\n    <Show when={local.menuItems?.length} fallback={action()}>\n      <div class=\"k2b-detail-panel__action-row\">\n        {action()}\n        <Dropdown.Root items={local.menuItems ?? []} align=\"end\" label={local.menuLabel} class=\"k2b-detail-panel__action-menu\">\n          <Dropdown.Trigger iconOnly size=\"sm\" variant=\"ghost\" label={local.menuLabel} class=\"k2b-detail-panel__action-menu-trigger\">\n            <i class=\"ti ti-dots\" aria-hidden=\"true\" />\n          </Dropdown.Trigger>\n        </Dropdown.Root>\n      </div>\n    </Show>\n  );\n};\n\nconst DetailPanelSection = (props: DetailPanelSectionProps): JSX.Element => {\n  const headingId = `k2b-detail-panel-section-${createUniqueId()}`;\n  const bodyId = `${headingId}-body`;\n  const [internalOpen, setInternalOpen] = createSignal(props.defaultOpen ?? false);\n  const open = () => props.open ?? internalOpen();\n  let expand: HTMLButtonElement | undefined;\n  let collapse: HTMLButtonElement | undefined;\n  let body: HTMLDivElement | undefined;\n  const toggle = (next: boolean) => {\n    if (props.disabled) return;\n    if (props.open === undefined) setInternalOpen(next);\n    props.onOpenChange?.(next);\n  };\n  createEffect(() => {\n    const expanded = open();\n    // Restore focus only when its current control becomes hidden, including\n    // a parent-controlled collapse while focus is inside an editor.\n    queueMicrotask(() => {\n      if (expanded !== open()) return;\n      const active = expand?.ownerDocument.activeElement;\n      if (expanded && active === expand) collapse?.focus();\n      if (!expanded && (active === collapse || (active && body?.contains(active)))) expand?.focus();\n    });\n  });\n  const className = () => classNames(\"k2b-detail-panel__section\", props.class);\n\n  return (\n    <Show\n      when={props.collapsible}\n      fallback={\n        <section class={className()} aria-labelledby={headingId}>\n          <header class=\"k2b-detail-panel__section-header\">\n            <DetailPanelSectionIcon icon={props.icon} tone={props.tone} />\n            <div class=\"k2b-detail-panel__section-copy\">\n              <h3 id={headingId}>{props.title}</h3>\n              <Show when={props.description}>\n                <p>{props.description}</p>\n              </Show>\n            </div>\n            <Show when={props.meta}>\n              <div class=\"k2b-detail-panel__section-meta\">{props.meta}</div>\n            </Show>\n            <Show when={props.actions}>\n              <div class=\"k2b-detail-panel__section-actions\">{props.actions}</div>\n            </Show>\n          </header>\n          <Show when={props.children !== undefined}>\n            <div class=\"k2b-detail-panel__section-body\">{props.children}</div>\n          </Show>\n        </section>\n      }\n    >\n      <section class={className()} aria-labelledby={open() ? headingId : `${headingId}-closed`} data-open={open()}>\n        <div hidden={open()}>\n          <Button\n            ref={expand}\n            variant=\"ghost\"\n            class=\"k2b-detail-panel__section-summary\"\n            disabled={props.disabled}\n            aria-expanded={false}\n            aria-controls={bodyId}\n            onClick={() => toggle(true)}\n          >\n            <DetailPanelSectionIcon icon={props.icon} tone={props.tone} />\n            <span class=\"k2b-detail-panel__section-copy\">\n              <span id={`${headingId}-closed`} class=\"k2b-detail-panel__section-title\">\n                {props.title}\n              </span>\n              <Show when={props.description}>\n                <span class=\"k2b-detail-panel__section-description\">{props.description}</span>\n              </Show>\n            </span>\n            <Show when={props.meta}>\n              <span class=\"k2b-detail-panel__section-meta\">{props.meta}</span>\n            </Show>\n            <i class=\"ti ti-chevron-down\" aria-hidden=\"true\" />\n          </Button>\n        </div>\n        <div hidden={!open()}>\n          <header class=\"k2b-detail-panel__section-header\">\n            <DetailPanelSectionIcon icon={props.icon} tone={props.tone} />\n            <div class=\"k2b-detail-panel__section-copy\">\n              <h3 id={headingId}>{props.title}</h3>\n              <Show when={props.description}>\n                <p>{props.description}</p>\n              </Show>\n            </div>\n            <Show when={props.meta}>\n              <div class=\"k2b-detail-panel__section-meta\">{props.meta}</div>\n            </Show>\n            <Button\n              ref={collapse}\n              variant=\"ghost\"\n              size=\"sm\"\n              disabled={props.disabled}\n              aria-labelledby={headingId}\n              aria-expanded={true}\n              aria-controls={bodyId}\n              onClick={() => toggle(false)}\n            >\n              <i class=\"ti ti-chevron-up\" aria-hidden=\"true\" />\n            </Button>\n          </header>\n        </div>\n        <div ref={body} id={bodyId} hidden={!open()} class=\"k2b-detail-panel__section-body\">\n          {props.children}\n        </div>\n      </section>\n    </Show>\n  );\n};\n\nconst DetailPanel = ((props: DetailPanelProps): JSX.Element => (\n  <div class={classNames(\"k2b-detail-panel\", props.class)}>{props.children}</div>\n)) as DetailPanelComponent;\n\nDetailPanel.Header = DetailPanelHeader;\nDetailPanel.Body = DetailPanelBody;\nDetailPanel.Summary = DetailPanelSummary;\nDetailPanel.Group = DetailPanelGroup;\nDetailPanel.Section = DetailPanelSection;\nDetailPanel.Action = DetailPanelAction;\n\nexport default DetailPanel;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["children","createEffect","createSignal","createUniqueId","Show","splitProps","Button","ButtonLink","Dropdown","createScrollFade","classNames","base","extra","DetailPanelHeader","props","_$ssr","_tmpl$7","_$ssrAttribute","_$escape","class","_$createComponent","when","icon","_tmpl$8","leading","_tmpl$","title","subtitle","meta","_tmpl$4","_tmpl$2","_tmpl$3","actions","_tmpl$5","primaryActions","_tmpl$6","DetailPanelBody","body","scrollFade","_tmpl$9","undefined","scrollPreserveKey","DetailPanelSummary","headingId","_tmpl$1","_tmpl$0","DetailPanelGroup","_tmpl$10","label","DetailPanelSectionIcon","_tmpl$11","tone","DetailPanelActionContent","_tmpl$12","_tmpl$14","description","_tmpl$13","trailing","_tmpl$15","DetailPanelAction","local","rest","className","content","action","href","fallback","_$mergeProps","variant","size","menuItems","length","_tmpl$17","Root","items","align","menuLabel","Trigger","iconOnly","_tmpl$16","DetailPanelSection","bodyId","internalOpen","setInternalOpen","defaultOpen","open","expand","collapse","toggle","next","disabled","onOpenChange","expanded","queueMicrotask","active","ownerDocument","activeElement","focus","contains","resolved","collapsible","_tmpl$27","_tmpl$22","_tmpl$25","_tmpl$26","_tmpl$24","onClick","_tmpl$19","_tmpl$18","_tmpl$20","_tmpl$21","_tmpl$23","DetailPanel","Header","Body","Summary","Group","Section","Action"],"sources":["layout/DetailPanel.tsx"],"sourcesContent":["import { children, createEffect, createSignal, createUniqueId, type JSX, Show, splitProps } from \"solid-js\";\nimport { Button, ButtonLink, type ButtonLinkProps, type ButtonProps } from \"../actions/Button\";\nimport { Dropdown, type DropdownItem } from \"../actions/Dropdown\";\nimport { createScrollFade } from \"./scroll-fade\";\n\nexport type DetailPanelProps = {\n  children: JSX.Element;\n  class?: string;\n};\n\ntype DetailPanelHeaderBaseProps = {\n  title: JSX.Element;\n  subtitle?: JSX.Element;\n  meta?: JSX.Element;\n  actions?: JSX.Element;\n  primaryActions?: JSX.Element;\n  class?: string;\n};\n\nexport type DetailPanelHeaderProps = DetailPanelHeaderBaseProps &\n  (\n    | {\n        leading?: JSX.Element;\n        icon?: never;\n      }\n    | {\n        leading?: never;\n        icon?: string;\n      }\n  );\n\nexport type DetailPanelBodyProps = {\n  scrollFade?: boolean;\n  children: JSX.Element;\n  scrollPreserveKey?: string;\n  class?: string;\n};\n\nexport type DetailPanelSummaryProps = {\n  title: JSX.Element;\n  children: JSX.Element;\n  actions?: JSX.Element;\n  class?: string;\n};\n\nexport type DetailPanelGroupProps = {\n  children: JSX.Element;\n  label?: string;\n  class?: string;\n};\n\nexport type DetailPanelTone = \"accent\" | \"neutral\" | \"success\" | \"warning\" | \"danger\";\n\ntype DetailPanelSectionBaseProps = {\n  title: JSX.Element;\n  icon?: string;\n  tone?: DetailPanelTone;\n  description?: JSX.Element;\n  meta?: JSX.Element;\n  class?: string;\n};\n\ntype DetailPanelActionBaseProps = {\n  title: JSX.Element;\n  description?: JSX.Element;\n  leading?: JSX.Element;\n  trailing?: JSX.Element;\n  class?: string;\n};\n\ntype DetailPanelActionMenuProps =\n  | {\n      menuItems?: never;\n      menuLabel?: never;\n    }\n  | {\n      menuItems: readonly DropdownItem[];\n      menuLabel: string;\n    };\n\nexport type DetailPanelActionLinkProps = DetailPanelActionBaseProps &\n  DetailPanelActionMenuProps &\n  Omit<ButtonLinkProps, \"children\" | \"class\" | \"size\" | \"title\" | \"variant\"> & {\n    href: string;\n  };\n\nexport type DetailPanelActionButtonProps = DetailPanelActionBaseProps &\n  DetailPanelActionMenuProps &\n  Omit<ButtonProps, \"children\" | \"class\" | \"size\" | \"title\" | \"variant\"> & {\n    href?: never;\n  };\n\nexport type DetailPanelActionProps = DetailPanelActionLinkProps | DetailPanelActionButtonProps;\n\nexport type DetailPanelSectionProps = DetailPanelSectionBaseProps &\n  (\n    | {\n        children?: JSX.Element;\n        actions?: JSX.Element;\n        collapsible?: false;\n        defaultOpen?: never;\n        open?: never;\n        onOpenChange?: never;\n        disabled?: never;\n      }\n    | {\n        children: JSX.Element;\n        actions?: never;\n        collapsible: true;\n        defaultOpen?: boolean;\n        open?: boolean;\n        onOpenChange?: (open: boolean) => void;\n        disabled?: boolean;\n      }\n  );\n\ntype DetailPanelComponent = ((props: DetailPanelProps) => JSX.Element) & {\n  Header: (props: DetailPanelHeaderProps) => JSX.Element;\n  Body: (props: DetailPanelBodyProps) => JSX.Element;\n  Summary: (props: DetailPanelSummaryProps) => JSX.Element;\n  Group: (props: DetailPanelGroupProps) => JSX.Element;\n  Section: (props: DetailPanelSectionProps) => JSX.Element;\n  Action: (props: DetailPanelActionProps) => JSX.Element;\n};\n\nconst classNames = (base: string, extra?: string): string => (extra ? `${base} ${extra}` : base);\n\nconst DetailPanelHeader = (props: DetailPanelHeaderProps): JSX.Element => (\n  <header class={classNames(\"k2b-detail-panel__header\", props.class)}>\n    <div class=\"k2b-detail-panel__header-main\">\n      <Show when={props.icon}>\n        {(icon) => (\n          <span class=\"k2b-detail-panel__header-icon\" aria-hidden=\"true\">\n            <i class={icon()} />\n          </span>\n        )}\n      </Show>\n      <Show when={props.leading}>\n        <div class=\"k2b-detail-panel__header-leading\">{props.leading}</div>\n      </Show>\n      <div class=\"k2b-detail-panel__heading\">\n        <h2>{props.title}</h2>\n        <Show when={props.subtitle || props.meta}>\n          <div class=\"k2b-detail-panel__supporting\">\n            <Show when={props.subtitle}>\n              <p>{props.subtitle}</p>\n            </Show>\n            <Show when={props.meta}>\n              <div class=\"k2b-detail-panel__meta\">{props.meta}</div>\n            </Show>\n          </div>\n        </Show>\n      </div>\n      <Show when={props.actions}>\n        <div class=\"k2b-detail-panel__actions\">{props.actions}</div>\n      </Show>\n    </div>\n    <Show when={props.primaryActions}>\n      <div class=\"k2b-detail-panel__primary-actions\">{props.primaryActions}</div>\n    </Show>\n  </header>\n);\n\nconst DetailPanelBody = (props: DetailPanelBodyProps): JSX.Element => {\n  let body!: HTMLDivElement;\n  createScrollFade(\n    () => body,\n    () => props.scrollFade !== false,\n  );\n  return (\n    <div\n      ref={body}\n      class={classNames(\"k2b-detail-panel__body\", props.class)}\n      data-scroll-fade-mode={props.scrollFade !== false ? \"both\" : undefined}\n      data-scroll-preserve={props.scrollPreserveKey}\n    >\n      {props.children}\n    </div>\n  );\n};\n\nconst DetailPanelSummary = (props: DetailPanelSummaryProps): JSX.Element => {\n  const headingId = `k2b-detail-panel-summary-${createUniqueId()}`;\n\n  return (\n    <section class={classNames(\"k2b-detail-panel__summary\", props.class)} aria-labelledby={headingId}>\n      <header class=\"k2b-detail-panel__summary-header\">\n        <h3 id={headingId}>{props.title}</h3>\n        <Show when={props.actions}>\n          <div class=\"k2b-detail-panel__summary-actions\">{props.actions}</div>\n        </Show>\n      </header>\n      <div class=\"k2b-detail-panel__summary-body\">{props.children}</div>\n    </section>\n  );\n};\n\nconst DetailPanelGroup = (props: DetailPanelGroupProps): JSX.Element => (\n  <div class={classNames(\"k2b-detail-panel__group\", props.class)} role=\"group\" aria-label={props.label}>\n    {props.children}\n  </div>\n);\n\nconst DetailPanelSectionIcon = (props: Pick<DetailPanelSectionBaseProps, \"icon\" | \"tone\">): JSX.Element => (\n  <Show when={props.icon}>\n    {(icon) => (\n      <span class=\"k2b-detail-panel__section-icon\" data-tone={props.tone ?? \"neutral\"} aria-hidden=\"true\">\n        <i class={icon()} />\n      </span>\n    )}\n  </Show>\n);\n\nconst DetailPanelActionContent = (props: DetailPanelActionBaseProps): JSX.Element => (\n  <>\n    <Show when={props.leading}>\n      <span class=\"k2b-detail-panel__action-leading\">{props.leading}</span>\n    </Show>\n    <span class=\"k2b-detail-panel__action-copy\">\n      <span class=\"k2b-detail-panel__action-title\">{props.title}</span>\n      <Show when={props.description}>\n        <span class=\"k2b-detail-panel__action-description\">{props.description}</span>\n      </Show>\n    </span>\n    <Show when={props.trailing}>\n      <span class=\"k2b-detail-panel__action-trailing\">{props.trailing}</span>\n    </Show>\n  </>\n);\n\nconst DetailPanelAction = (props: DetailPanelActionProps): JSX.Element => {\n  const [local, rest] = splitProps(props, [\"class\", \"description\", \"href\", \"leading\", \"menuItems\", \"menuLabel\", \"title\", \"trailing\"]);\n  const className = classNames(\"k2b-detail-panel__action\", local.class);\n  const content = () => (\n    <DetailPanelActionContent title={local.title} description={local.description} leading={local.leading} trailing={local.trailing} />\n  );\n\n  const action = () => (\n    <Show\n      when={local.href !== undefined}\n      fallback={\n        <Button\n          {...(rest as Omit<DetailPanelActionButtonProps, keyof DetailPanelActionBaseProps>)}\n          class={className}\n          variant=\"ghost\"\n          size=\"sm\"\n        >\n          {content()}\n        </Button>\n      }\n    >\n      <ButtonLink\n        {...(rest as Omit<DetailPanelActionLinkProps, keyof DetailPanelActionBaseProps | \"href\">)}\n        href={local.href as string}\n        class={className}\n        variant=\"ghost\"\n        size=\"sm\"\n      >\n        {content()}\n      </ButtonLink>\n    </Show>\n  );\n\n  return (\n    <Show when={local.menuItems?.length} fallback={action()}>\n      <div class=\"k2b-detail-panel__action-row\">\n        {action()}\n        <Dropdown.Root items={local.menuItems ?? []} align=\"end\" label={local.menuLabel} class=\"k2b-detail-panel__action-menu\">\n          <Dropdown.Trigger iconOnly size=\"sm\" variant=\"ghost\" label={local.menuLabel} class=\"k2b-detail-panel__action-menu-trigger\">\n            <i class=\"ti ti-dots\" aria-hidden=\"true\" />\n          </Dropdown.Trigger>\n        </Dropdown.Root>\n      </div>\n    </Show>\n  );\n};\n\nconst DetailPanelSection = (props: DetailPanelSectionProps): JSX.Element => {\n  const headingId = `k2b-detail-panel-section-${createUniqueId()}`;\n  const bodyId = `${headingId}-body`;\n  const [internalOpen, setInternalOpen] = createSignal(props.defaultOpen ?? false);\n  const open = () => props.open ?? internalOpen();\n  let expand: HTMLButtonElement | undefined;\n  let collapse: HTMLButtonElement | undefined;\n  let body: HTMLDivElement | undefined;\n  const toggle = (next: boolean) => {\n    if (props.disabled) return;\n    if (props.open === undefined) setInternalOpen(next);\n    props.onOpenChange?.(next);\n  };\n  createEffect(() => {\n    const expanded = open();\n    // Restore focus only when its current control becomes hidden, including\n    // a parent-controlled collapse while focus is inside an editor.\n    queueMicrotask(() => {\n      if (expanded !== open()) return;\n      const active = expand?.ownerDocument.activeElement;\n      if (expanded && active === expand) collapse?.focus();\n      if (!expanded && (active === collapse || (active && body?.contains(active)))) expand?.focus();\n    });\n  });\n  const className = () => classNames(\"k2b-detail-panel__section\", props.class);\n  // Resolve once: reading `props.children` twice would instantiate the section body twice.\n  const resolved = children(() => props.children);\n\n  return (\n    <Show\n      when={props.collapsible}\n      fallback={\n        <section class={className()} aria-labelledby={headingId}>\n          <header class=\"k2b-detail-panel__section-header\">\n            <DetailPanelSectionIcon icon={props.icon} tone={props.tone} />\n            <div class=\"k2b-detail-panel__section-copy\">\n              <h3 id={headingId}>{props.title}</h3>\n              <Show when={props.description}>\n                <p>{props.description}</p>\n              </Show>\n            </div>\n            <Show when={props.meta}>\n              <div class=\"k2b-detail-panel__section-meta\">{props.meta}</div>\n            </Show>\n            <Show when={props.actions}>\n              <div class=\"k2b-detail-panel__section-actions\">{props.actions}</div>\n            </Show>\n          </header>\n          <Show when={resolved()}>\n            <div class=\"k2b-detail-panel__section-body\">{resolved()}</div>\n          </Show>\n        </section>\n      }\n    >\n      <section class={className()} aria-labelledby={open() ? headingId : `${headingId}-closed`} data-open={open()}>\n        <div hidden={open()}>\n          <Button\n            ref={expand}\n            variant=\"ghost\"\n            class=\"k2b-detail-panel__section-summary\"\n            disabled={props.disabled}\n            aria-expanded={false}\n            aria-controls={bodyId}\n            onClick={() => toggle(true)}\n          >\n            <DetailPanelSectionIcon icon={props.icon} tone={props.tone} />\n            <span class=\"k2b-detail-panel__section-copy\">\n              <span id={`${headingId}-closed`} class=\"k2b-detail-panel__section-title\">\n                {props.title}\n              </span>\n              <Show when={props.description}>\n                <span class=\"k2b-detail-panel__section-description\">{props.description}</span>\n              </Show>\n            </span>\n            <Show when={props.meta}>\n              <span class=\"k2b-detail-panel__section-meta\">{props.meta}</span>\n            </Show>\n            <i class=\"ti ti-chevron-down\" aria-hidden=\"true\" />\n          </Button>\n        </div>\n        <div hidden={!open()}>\n          <header class=\"k2b-detail-panel__section-header\">\n            <DetailPanelSectionIcon icon={props.icon} tone={props.tone} />\n            <div class=\"k2b-detail-panel__section-copy\">\n              <h3 id={headingId}>{props.title}</h3>\n              <Show when={props.description}>\n                <p>{props.description}</p>\n              </Show>\n            </div>\n            <Show when={props.meta}>\n              <div class=\"k2b-detail-panel__section-meta\">{props.meta}</div>\n            </Show>\n            <Button\n              ref={collapse}\n              variant=\"ghost\"\n              size=\"sm\"\n              disabled={props.disabled}\n              aria-labelledby={headingId}\n              aria-expanded={true}\n              aria-controls={bodyId}\n              onClick={() => toggle(false)}\n            >\n              <i class=\"ti ti-chevron-up\" aria-hidden=\"true\" />\n            </Button>\n          </header>\n        </div>\n        <div ref={body} id={bodyId} hidden={!open()} class=\"k2b-detail-panel__section-body\">\n          {props.children}\n        </div>\n      </section>\n    </Show>\n  );\n};\n\nconst DetailPanel = ((props: DetailPanelProps): JSX.Element => (\n  <div class={classNames(\"k2b-detail-panel\", props.class)}>{props.children}</div>\n)) as DetailPanelComponent;\n\nDetailPanel.Header = DetailPanelHeader;\nDetailPanel.Body = DetailPanelBody;\nDetailPanel.Summary = DetailPanelSummary;\nDetailPanel.Group = DetailPanelGroup;\nDetailPanel.Section = DetailPanelSection;\nDetailPanel.Action = DetailPanelAction;\n\nexport default DetailPanel;\n"],"mappings":"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","ignoreList":[]}

package/dist/ssr/layout/Navigation.js

@@ -0,0 +1,181 @@
+import { ssrStyleProperty as _$ssrStyleProperty } from "solid-js/web";
+import { ssrAttribute as _$ssrAttribute } from "solid-js/web";
+import { ssr as _$ssr } from "solid-js/web";
+import { escape as _$escape } from "solid-js/web";
+import { createComponent as _$createComponent } from "solid-js/web";
+var _tmpl$ = ["<ul class=\"k2b-navigation__list\">", "</ul>"],
+  _tmpl$2 = ["<i", " aria-hidden=\"true\"></i>"],
+  _tmpl$3 = ["<small>", "</small>"],
+  _tmpl$4 = ["<span class=\"k2b-navigation__copy\"><span>", "</span>", "</span>"],
+  _tmpl$5 = ["<span class=\"k2b-navigation__color\" style=\"", "\"></span>"],
+  _tmpl$6 = ["<span class=\"k2b-navigation__badge\">", "</span>"],
+  _tmpl$7 = ["<button type=\"button\" class=\"k2b-navigation__disclosure\"", "", "><i", " aria-hidden=\"true\"></i></button>"],
+  _tmpl$8 = "<i class=\"ti ti-dots\" aria-hidden=\"true\"></i>",
+  _tmpl$9 = ["<div", ">", "</div>"],
+  _tmpl$0 = ["<li><div class=\"k2b-navigation__row\"", ">", "", "", "</div>", "</li>"],
+  _tmpl$1 = ["<button type=\"button\" class=\"k2b-navigation__control\"", ">", "", "</button>"],
+  _tmpl$10 = ["<nav class=\"k2b-navigation\"", ">", "</nav>"];
+import { documentNavigate, Link } from "@k2b/ssr/nav";
+import { createSignal, For, Show } from "solid-js";
+import { Dropdown } from "../actions/Dropdown";
+import { useUiMessages } from "../intl/messages";
+export default function Navigation(props) {
+  const messages = useUiMessages();
+  const [expanded, setExpanded] = createSignal({});
+  const ready = async () => (await props.beforeSelect?.()) !== false;
+  const activate = async id => {
+    if (await ready()) await props.navigation.activate(id);
+  };
+  const Rows = rows => _$ssr(_tmpl$, _$escape(_$createComponent(For, {
+    get each() {
+      return rows.items.map(item => item.id);
+    },
+    children: id => {
+      const item = () => rows.items.find(entry => entry.id === id);
+      const disabled = () => rows.disabled || item().disabled;
+      const open = () => expanded()[id] ?? item().defaultExpanded ?? true;
+      const toggle = () => setExpanded(current => ({
+        ...current,
+        [id]: !open()
+      }));
+      const content = () => [_$createComponent(Show, {
+        get when() {
+          return item().icon;
+        },
+        get children() {
+          return _$ssr(_tmpl$2, _$ssrAttribute("class", _$escape(item().icon, true), false));
+        }
+      }), _$ssr(_tmpl$4, _$escape(item().label), _$escape(_$createComponent(Show, {
+        get when() {
+          return item().description;
+        },
+        get children() {
+          return _$ssr(_tmpl$3, _$escape(item().description));
+        }
+      }))), _$createComponent(Show, {
+        get when() {
+          return item().color;
+        },
+        get children() {
+          return _$ssr(_tmpl$5, _$ssrStyleProperty("background-color:", _$escape(item().color, true)));
+        }
+      }), _$createComponent(Show, {
+        get when() {
+          return item().badge !== undefined;
+        },
+        get children() {
+          return _$ssr(_tmpl$6, _$escape(item().badge));
+        }
+      })];
+      return _$ssr(_tmpl$0, _$ssrAttribute("data-active", _$escape(item().active || undefined, true), false), _$escape(_$createComponent(Show, {
+        get when() {
+          return item().href;
+        },
+        get fallback() {
+          return _$ssr(_tmpl$1, _$ssrAttribute("disabled", disabled(), true) + _$ssrAttribute("aria-expanded", !item().action ? _$escape(open(), true) : _$escape(undefined, true), false), _$escape(content()), _$escape(_$createComponent(Show, {
+            get when() {
+              return !item().action && item().children?.length;
+            },
+            get children() {
+              return _$ssr(_tmpl$2, _$ssrAttribute("class", open() ? "ti ti-chevron-down" : "ti ti-chevron-right", false));
+            }
+          })));
+        },
+        children: href => _$createComponent(Link, {
+          "class": "k2b-navigation__control",
+          get href() {
+            return href();
+          },
+          get ["aria-current"]() {
+            return item().active ? "page" : undefined;
+          },
+          get ["aria-disabled"]() {
+            return disabled() || undefined;
+          },
+          get tabIndex() {
+            return disabled() ? -1 : undefined;
+          },
+          get scroll() {
+            return item().scroll;
+          },
+          onNavigate: async event => {
+            if (!(await ready())) return;
+            if (item().navigation === "enhanced" && props.navigation.onNavigate) await props.navigation.onNavigate(event);else event.fallback();
+          },
+          onClick: event => {
+            if (disabled()) {
+              event.preventDefault();
+              return;
+            }
+            if (!item().action || event.button !== 0 || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey) return;
+            // Local opening can fetch before committing navigation, outside a view transition.
+            event.preventDefault();
+            void activate(id);
+          },
+          get children() {
+            return content();
+          }
+        })
+      })), _$escape(_$createComponent(Show, {
+        get when() {
+          return (item().href || item().action) && item().children?.length;
+        },
+        get children() {
+          return _$ssr(_tmpl$7, _$ssrAttribute("aria-label", _$escape(item().label, true), false) + _$ssrAttribute("aria-expanded", _$escape(open(), true), false), _$ssrAttribute("disabled", disabled(), true), _$ssrAttribute("class", open() ? "ti ti-chevron-down" : "ti ti-chevron-right", false));
+        }
+      })), _$escape(_$createComponent(Show, {
+        get when() {
+          return item().actions?.length;
+        },
+        get children() {
+          return _$createComponent(Dropdown.Root, {
+            get items() {
+              return (item().actions ?? []).map(action => ({
+                label: action.label,
+                icon: action.icon,
+                disabled: disabled() || action.disabled,
+                action: () => {
+                  if (action.href) void ready().then(allowed => {
+                    if (allowed) documentNavigate(action.href);
+                  });else void activate(action.id);
+                }
+              }));
+            },
+            get children() {
+              return _$createComponent(Dropdown.Trigger, {
+                iconOnly: true,
+                get label() {
+                  return `${item().label}: ${messages().rowAction}`;
+                },
+                variant: "ghost",
+                get children() {
+                  return _$ssr(_tmpl$8);
+                }
+              });
+            }
+          });
+        }
+      })), _$escape(_$createComponent(Show, {
+        get when() {
+          return item().children?.length;
+        },
+        get children() {
+          return _$ssr(_tmpl$9, _$ssrAttribute("hidden", !open(), true), _$escape(_$createComponent(Rows, {
+            get items() {
+              return item().children ?? [];
+            },
+            get disabled() {
+              return disabled();
+            }
+          })));
+        }
+      })));
+    }
+  })));
+  return _$ssr(_tmpl$10, _$ssrAttribute("aria-label", _$escape(props.label, true), false), _$escape(_$createComponent(Rows, {
+    get items() {
+      return props.navigation.items();
+    }
+  })));
+}
+//# sourceMappingURL=Navigation.js.map

package/dist/ssr/layout/Navigation.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["documentNavigate","Link","createSignal","For","Show","Dropdown","useUiMessages","Navigation","props","messages","expanded","setExpanded","ready","beforeSelect","activate","id","navigation","Rows","rows","_$ssr","_tmpl$","_$escape","_$createComponent","each","items","map","item","children","find","entry","disabled","open","defaultExpanded","toggle","current","content","when","icon","_tmpl$2","_$ssrAttribute","_tmpl$4","label","description","_tmpl$3","color","_tmpl$5","_$ssrStyleProperty","badge","undefined","_tmpl$6","_tmpl$0","active","href","fallback","_tmpl$1","action","length","aria-current","aria-disabled","tabIndex","scroll","onNavigate","event","onClick","preventDefault","button","metaKey","ctrlKey","shiftKey","altKey","_tmpl$7","actions","Root","then","allowed","Trigger","iconOnly","rowAction","variant","_tmpl$8","_tmpl$9","_tmpl$10"],"sources":["layout/Navigation.tsx"],"sourcesContent":["import { documentNavigate, Link } from \"@k2b/ssr/nav\";\nimport { createSignal, For, Show } from \"solid-js\";\nimport { Dropdown } from \"../actions/Dropdown\";\nimport { useUiMessages } from \"../intl/messages\";\nimport type { NavigationController, NavigationItem } from \"./navigation-model\";\n\nexport type NavigationProps = {\n  navigation: NavigationController;\n  label: string;\n  /** A host can finish dismissing its menu before the selected operation runs. */\n  beforeSelect?: () => boolean | void | Promise<boolean | void>;\n};\n\nexport default function Navigation(props: NavigationProps) {\n  const messages = useUiMessages();\n  const [expanded, setExpanded] = createSignal<Record<string, boolean>>({});\n  const ready = async () => (await props.beforeSelect?.()) !== false;\n  const activate = async (id: string) => {\n    if (await ready()) await props.navigation.activate(id);\n  };\n  const Rows = (rows: { items: readonly NavigationItem[]; disabled?: boolean }) => (\n    <ul class=\"k2b-navigation__list\">\n      <For each={rows.items.map((item) => item.id)}>\n        {(id) => {\n          const item = () => rows.items.find((entry) => entry.id === id)!;\n          const disabled = () => rows.disabled || item().disabled;\n          const open = () => expanded()[id] ?? item().defaultExpanded ?? true;\n          const toggle = () => setExpanded((current) => ({ ...current, [id]: !open() }));\n          const content = () => (\n            <>\n              <Show when={item().icon}>\n                <i class={item().icon} aria-hidden=\"true\" />\n              </Show>\n              <span class=\"k2b-navigation__copy\">\n                <span>{item().label}</span>\n                <Show when={item().description}>\n                  <small>{item().description}</small>\n                </Show>\n              </span>\n              <Show when={item().color}>\n                <span class=\"k2b-navigation__color\" style={{ \"background-color\": item().color }} />\n              </Show>\n              <Show when={item().badge !== undefined}>\n                <span class=\"k2b-navigation__badge\">{item().badge}</span>\n              </Show>\n            </>\n          );\n          return (\n            <li>\n              <div class=\"k2b-navigation__row\" data-active={item().active || undefined}>\n                <Show\n                  when={item().href}\n                  fallback={\n                    <button\n                      type=\"button\"\n                      class=\"k2b-navigation__control\"\n                      disabled={disabled()}\n                      aria-expanded={!item().action ? open() : undefined}\n                      onClick={() => (item().action ? void activate(id) : toggle())}\n                    >\n                      {content()}\n                      <Show when={!item().action && item().children?.length}>\n                        <i class={open() ? \"ti ti-chevron-down\" : \"ti ti-chevron-right\"} aria-hidden=\"true\" />\n                      </Show>\n                    </button>\n                  }\n                >\n                  {(href) => (\n                    <Link\n                      class=\"k2b-navigation__control\"\n                      href={href()}\n                      aria-current={item().active ? \"page\" : undefined}\n                      aria-disabled={disabled() || undefined}\n                      tabIndex={disabled() ? -1 : undefined}\n                      scroll={item().scroll}\n                      onNavigate={async (event) => {\n                        if (!(await ready())) return;\n                        if (item().navigation === \"enhanced\" && props.navigation.onNavigate) await props.navigation.onNavigate(event);\n                        else event.fallback();\n                      }}\n                      onClick={(event) => {\n                        if (disabled()) {\n                          event.preventDefault();\n                          return;\n                        }\n                        if (!item().action || event.button !== 0 || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey)\n                          return;\n                        // Local opening can fetch before committing navigation, outside a view transition.\n                        event.preventDefault();\n                        void activate(id);\n                      }}\n                    >\n                      {content()}\n                    </Link>\n                  )}\n                </Show>\n                <Show when={(item().href || item().action) && item().children?.length}>\n                  <button\n                    type=\"button\"\n                    class=\"k2b-navigation__disclosure\"\n                    aria-label={item().label}\n                    aria-expanded={open()}\n                    disabled={disabled()}\n                    onClick={toggle}\n                  >\n                    <i class={open() ? \"ti ti-chevron-down\" : \"ti ti-chevron-right\"} aria-hidden=\"true\" />\n                  </button>\n                </Show>\n                <Show when={item().actions?.length}>\n                  <Dropdown.Root\n                    items={(item().actions ?? []).map((action) => ({\n                      label: action.label,\n                      icon: action.icon,\n                      disabled: disabled() || action.disabled,\n                      action: () => {\n                        if (action.href)\n                          void ready().then((allowed) => {\n                            if (allowed) documentNavigate(action.href!);\n                          });\n                        else void activate(action.id);\n                      },\n                    }))}\n                  >\n                    <Dropdown.Trigger iconOnly label={`${item().label}: ${messages().rowAction}`} variant=\"ghost\">\n                      <i class=\"ti ti-dots\" aria-hidden=\"true\" />\n                    </Dropdown.Trigger>\n                  </Dropdown.Root>\n                </Show>\n              </div>\n              <Show when={item().children?.length}>\n                <div hidden={!open()}>\n                  <Rows items={item().children ?? []} disabled={disabled()} />\n                </div>\n              </Show>\n            </li>\n          );\n        }}\n      </For>\n    </ul>\n  );\n  return (\n    <nav class=\"k2b-navigation\" aria-label={props.label}>\n      <Rows items={props.navigation.items()} />\n    </nav>\n  );\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/ssr/layout/PanelDialog.js

@@ -9,13 +9,20 @@ var _tmpl$ = ["<p>", "</p>"],
   _tmpl$5 = ["<i", " aria-hidden=\"true\"></i>"],
   _tmpl$6 = ["<div class=\"k2b-panel-dialog__body\"", ">", "</div>"],
   _tmpl$7 = ["<footer class=\"k2b-panel-dialog__footer\"", ">", "</footer>"],
-  _tmpl$8 = ["<section class=\"k2b-panel-dialog__section\"", "><header>", "<div><h3>", "</h3>", "</div>", "</header><div class=\"k2b-panel-dialog__section-body\">", "</div></section>"],
-  _tmpl$9 = ["<span class=\"k2b-panel-dialog__section-icon\"><i", " aria-hidden=\"true\"></i></span>"],
-  _tmpl$0 = ["<div class=\"k2b-panel-dialog\"", ">", "</div>"];
-import { createContext, Show, useContext } from "solid-js";
+  _tmpl$8 = ["<span class=\"k2b-panel-dialog__section-subtitle\">", "</span>"],
+  _tmpl$9 = ["<span class=\"k2b-panel-dialog__section-copy\"><span id=\"", "\" class=\"k2b-panel-dialog__section-title\">", "</span>", "</span>"],
+  _tmpl$0 = "<i class=\"ti ti-eye\" aria-hidden=\"true\"></i>",
+  _tmpl$1 = ["<div", ">", "</div>"],
+  _tmpl$10 = "<i class=\"ti ti-eye-off\" aria-hidden=\"true\"></i>",
+  _tmpl$11 = ["<section class=\"k2b-panel-dialog__section\"", ">", "<header", ">", "<div><h3", ">", "</h3>", "</div>", "", "</header><div id=\"", "\" class=\"k2b-panel-dialog__section-body\"", ">", "</div></section>"],
+  _tmpl$12 = ["<span class=\"k2b-panel-dialog__section-icon\"><i", " aria-hidden=\"true\"></i></span>"],
+  _tmpl$13 = ["<div class=\"k2b-panel-dialog\"", ">", "</div>"];
+import { createContext, createEffect, createSignal, createUniqueId, Show, useContext } from "solid-js";
+import { Button } from "../actions/Button";
 import { Tabs } from "../actions/Tabs";
 import { prompts } from "../feedback/prompts";
 import { resolveUiMessages, useUiMessages } from "../intl/messages";
+import { createScrollFade } from "./scroll-fade";
 const PanelDialogSurfaceContext = createContext("contained");
 const usePanelDialogSurface = () => useContext(PanelDialogSurfaceContext);
 const panelDialogBasePanelClass = "k2b-dialog k2b-panel-dialog-frame";
@@ -78,28 +85,106 @@ const PanelDialogHeader = props => {
     }
   })));
 };
-const PanelDialogBody = props => _$ssr(_tmpl$6, _$ssrAttribute("data-scroll-preserve", _$escape(props.scrollPreserveKey, true), false) + _$ssrAttribute("data-surface", _$escape(usePanelDialogSurface(), true), false), _$escape(props.children));
+const PanelDialogBody = props => {
+  let body;
+  createScrollFade(() => body, () => props.scrollFade !== false);
+  return _$ssr(_tmpl$6, _$ssrAttribute("data-scroll-preserve", _$escape(props.scrollPreserveKey, true), false) + _$ssrAttribute("data-surface", _$escape(usePanelDialogSurface(), true), false) + _$ssrAttribute("data-scroll-fade-mode", props.scrollFade !== false ? "both" : _$escape(undefined, true), false), _$escape(props.children));
+};
 const PanelDialogFooter = props => _$ssr(_tmpl$7, _$ssrAttribute("data-surface", _$escape(usePanelDialogSurface(), true), false), _$escape(props.children));
-const PanelDialogSection = props => _$ssr(_tmpl$8, _$ssrAttribute("data-surface", _$escape(usePanelDialogSurface(), true), false), _$escape(_$createComponent(Show, {
-  get when() {
-    return props.icon;
-  },
-  children: icon => _$ssr(_tmpl$9, _$ssrAttribute("class", _$escape(icon(), true), false))
-})), _$escape(props.title), _$escape(_$createComponent(Show, {
-  get when() {
-    return props.subtitle;
-  },
-  get children() {
-    return _$ssr(_tmpl$, _$escape(props.subtitle));
-  }
-})), _$escape(_$createComponent(Show, {
-  get when() {
-    return props.actions;
-  },
-  get children() {
-    return _$ssr(_tmpl$2, _$escape(props.actions));
-  }
-})), _$escape(props.children));
+const PanelDialogSection = props => {
+  const id = `k2b-panel-dialog-section-${createUniqueId()}`;
+  const [internalOpen, setInternalOpen] = createSignal(props.defaultOpen ?? false);
+  const open = () => !props.hideable || (props.open ?? internalOpen());
+  let section;
+  let expand;
+  let collapse;
+  const toggle = next => {
+    if (props.disabled) return;
+    if (props.open === undefined) setInternalOpen(next);
+    props.onOpenChange?.(next);
+  };
+  createEffect(() => {
+    if (!props.hideable) return;
+    const expanded = open();
+    queueMicrotask(() => {
+      if (expanded !== open()) return;
+      const active = section?.ownerDocument.activeElement;
+      if (expanded && active === expand) collapse?.focus();
+      if (!expanded && active && active !== expand && section?.contains(active)) expand?.focus();
+    });
+  });
+  return _$ssr(_tmpl$11, _$ssrAttribute("data-surface", _$escape(usePanelDialogSurface(), true), false) + _$ssrAttribute("data-hideable", _$escape(props.hideable || undefined, true), false) + _$ssrAttribute("data-open", props.hideable ? _$escape(open(), true) : _$escape(undefined, true), false) + _$ssrAttribute("aria-labelledby", open() ? _$escape(id, true) : `${_$escape(id, true)}-closed`, false), _$escape(_$createComponent(Show, {
+    get when() {
+      return props.hideable;
+    },
+    get children() {
+      return _$ssr(_tmpl$1, _$ssrAttribute("hidden", open(), true), _$escape(_$createComponent(Button, {
+        variant: "ghost",
+        "class": "k2b-panel-dialog__section-summary",
+        get disabled() {
+          return props.disabled;
+        },
+        "aria-expanded": false,
+        "aria-controls": `${id}-body`,
+        onClick: () => toggle(true),
+        get children() {
+          return [_$createComponent(Show, {
+            get when() {
+              return props.icon;
+            },
+            children: icon => _$ssr(_tmpl$5, _$ssrAttribute("class", _$escape(icon(), true), false))
+          }), _$ssr(_tmpl$9, `${_$escape(id, true)}-closed`, _$escape(props.title), _$escape(_$createComponent(Show, {
+            get when() {
+              return props.subtitle;
+            },
+            get children() {
+              return _$ssr(_tmpl$8, _$escape(props.subtitle));
+            }
+          }))), _$ssr(_tmpl$0)];
+        }
+      })));
+    }
+  })), _$ssrAttribute("hidden", !open(), true), _$escape(_$createComponent(Show, {
+    get when() {
+      return props.icon;
+    },
+    children: icon => _$ssr(_tmpl$12, _$ssrAttribute("class", _$escape(icon(), true), false))
+  })), _$ssrAttribute("id", _$escape(id, true), false), _$escape(props.title), _$escape(_$createComponent(Show, {
+    get when() {
+      return props.subtitle;
+    },
+    get children() {
+      return _$ssr(_tmpl$, _$escape(props.subtitle));
+    }
+  })), _$escape(_$createComponent(Show, {
+    get when() {
+      return props.actions;
+    },
+    get children() {
+      return _$ssr(_tmpl$2, _$escape(props.actions));
+    }
+  })), _$escape(_$createComponent(Show, {
+    get when() {
+      return props.hideable;
+    },
+    get children() {
+      return _$createComponent(Button, {
+        variant: "ghost",
+        size: "sm",
+        get disabled() {
+          return props.disabled;
+        },
+        "aria-labelledby": id,
+        "aria-expanded": true,
+        "aria-controls": `${id}-body`,
+        onClick: () => toggle(false),
+        get children() {
+          return _$ssr(_tmpl$10);
+        }
+      });
+    }
+  })), `${_$escape(id, true)}-body`, _$ssrAttribute("hidden", !open(), true), _$escape(props.children));
+};
 const PanelDialogTabs = props => {
   const messages = useUiMessages();
   return _$createComponent(Tabs, {
@@ -123,7 +208,7 @@ const PanelDialog = props => {
   return _$createComponent(PanelDialogSurfaceContext.Provider, {
     value: surface,
     get children() {
-      return _$ssr(_tmpl$0, _$ssrAttribute("data-surface", _$escape(surface, true), false), _$escape(props.children));
+      return _$ssr(_tmpl$13, _$ssrAttribute("data-surface", _$escape(surface, true), false), _$escape(props.children));
     }
   });
 };