@pitchfork-ui/elements 0.0.0-stage → 0.2.1

package/dist/pitchfork/p-4b16ef92.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["pfCommandPaletteCss","setHidden","element","hidden","setAttribute","removeAttribute","PfCommandPalette","open","placeholder","emptyMessage","label","dismissable","pfOpenChange","pfSelect","query","matchCount","releaseScroll","activeItem","componentWillLoad","this","applyQuery","componentDidLoad","showDialog","componentDidRender","syncActiveDescendant","disconnectedCallback","unlockScroll","show","hide","syncOpen","next","previous","closeDialog","emit","handleCommandSelect","event","stopPropagation","value","detail","onSlotChange","refresh","dialog","el","shadowRoot","querySelector","input","items","Array","from","querySelectorAll","visibleItems","filter","item","hasAttribute","lockScroll","lockPageScroll","showModal","requestAnimationFrame","focus","close","onCancel","preventDefault","onClose","onDialogClick","target","onInput","group","closest","matches","matchesCommandQuery","textContent","trim","description","getAttribute","showing","length","visible","setActive","find","scrollIntoView","block","ariaActiveDescendantElement","move","action","enabled","getEnabledIndexes","current","indexOf","resolveListMove","runActive","onKeyDown","actions","Keys","ArrowDown","ArrowUp","Home","End","key","Enter","render","empty","h","Host","part","class","onClick","name","type","role","autocomplete","spellcheck","onSlotchange"],"sources":["src/components/pf-command-palette/pf-command-palette.css?tag=pf-command-palette&encapsulation=shadow","src/components/pf-command-palette/pf-command-palette.tsx"],"sourcesContent":[":host {\n  display: contents;\n}\n\n/*\n * The dialog is the backdrop: it fills the viewport and aligns the panel near\n * the top, so a click landing on it rather than on the panel is a backdrop\n * click. The explicit sizing overrides the UA's `margin: auto` and\n * `width: fit-content` for a `<dialog>`.\n */\n.dialog {\n  align-items: flex-start;\n  background: none;\n  border: 0;\n  display: none;\n  height: 100%;\n  justify-content: center;\n  max-height: 100%;\n  max-width: 100%;\n  padding: var(--space-4);\n  width: 100%;\n}\n\n.dialog[open] {\n  display: flex;\n}\n\n@media (--md) {\n  .dialog {\n    padding-top: 10vh;\n  }\n}\n\n.dialog::backdrop {\n  background: var(--pf-commandpalette-overlay-backdrop, var(--pf-overlay-backdrop));\n}\n\n.panel {\n  background: var(--pf-command-bg);\n  border: 1px solid var(--pf-command-border);\n  border-radius: var(--radius-lg);\n  box-shadow: var(--pf-commandpalette-elevation-overlay-shadow, var(--pf-elevation-overlay-shadow));\n  color: var(--pf-command-text);\n  display: grid;\n  grid-template-rows: auto minmax(0, 1fr);\n  max-height: 100%;\n  overflow: hidden;\n  width: min(560px, 100%);\n}\n\n.dialog[open] .panel {\n  animation: pf-command-panel-in var(--pf-transition-enter);\n}\n\n/* Its own copy: @keyframes do not cross a shadow boundary. */\n@keyframes pf-command-panel-in {\n  from {\n    opacity: 0;\n    transform: translateY(-8px) scale(0.98);\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .dialog[open] .panel {\n    animation: none;\n  }\n}\n\n.search {\n  align-items: center;\n  border-bottom: 1px solid var(--pf-command-border);\n  display: flex;\n  gap: var(--space-3);\n  padding: var(--space-3) var(--space-4);\n}\n\n.search-icon {\n  color: var(--pf-command-text-muted);\n  flex-shrink: 0;\n}\n\n.input {\n  background: none;\n  border: 0;\n  color: var(--pf-command-text);\n  flex: 1;\n  font-family: inherit;\n  font-size: var(--font-size-md);\n  min-width: 0;\n  outline: none;\n  padding: 0;\n}\n\n.input::placeholder {\n  color: var(--pf-command-text-muted);\n}\n\n.hint {\n  flex-shrink: 0;\n}\n\n.list {\n  overflow-y: auto;\n  padding: var(--space-2);\n}\n\n.empty {\n  color: var(--pf-command-text-muted);\n  font-size: var(--font-size-sm);\n  margin: 0;\n  padding: var(--space-4) var(--space-3);\n  text-align: center;\n}\n","import {\n  getEnabledIndexes,\n  Keys,\n  lockPageScroll,\n  matchesCommandQuery,\n  resolveListMove,\n  type ListNavigationAction,\n} from '@pitchfork-ui/core';\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Listen,\n  Method,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\n\n/*\n * `toggleAttribute` does not exist on Stencil's mock DOM -- measured, and\n * worth knowing how it fails: Stencil's `safeCall` swallows the TypeError, so\n * the filter silently did nothing and the palette rendered \"No results found\"\n * over a full list. Not exported, so this file still has one export.\n */\nconst setHidden = (element: Element, hidden: boolean) => {\n  if (hidden) element.setAttribute('hidden', '');\n  else element.removeAttribute('hidden');\n};\n\n/**\n * A searchable command list in a modal dialog.\n *\n * A native `<dialog>` opened with `showModal()`, like `pf-modal` and\n * `pf-slideout-menu`: the focus trap, Escape and the backdrop come free, and\n * the React component's `useFocusTrap` has no equivalent here. Page scroll is\n * the one part the dialog does not do, so that is core's reference-counted\n * lock.\n *\n * **The active option is set as an element, not an IDREF.** The input lives in\n * this shadow root and the options are slotted light-DOM children, and\n * `aria-activedescendant` does not cross a shadow boundary — measured against\n * Chromium's accessibility tree, where a cross-root IDREF is simply absent\n * from it. `ariaActiveDescendantElement` does resolve, because the option sits\n * in an ancestor scope of the input's tree, which is the direction element\n * reflection allows. (`pf-tooltip` needed the opposite direction — a trigger\n * referencing something inside a shadow root it does not own — and that one\n * reads back empty, which is why it copies text into `aria-description`\n * instead.)\n *\n * @slot - `pf-command-item` and `pf-command-group` children.\n * @part dialog - the native dialog, which is also the backdrop.\n * @part panel - the floating panel.\n * @part input - the search input.\n * @part list - the listbox the items are slotted into.\n * @part empty - the message shown when nothing matches.\n */\n@Component({\n  tag: 'pf-command-palette',\n  styleUrl: 'pf-command-palette.css',\n  shadow: true,\n})\nexport class PfCommandPalette {\n  @Element() el!: HTMLElement;\n\n  /** Whether the palette is showing. Reflected so the stylesheet selects on it. */\n  @Prop({ mutable: true, reflect: true }) open = false;\n\n  /** Placeholder for the search input. */\n  @Prop() placeholder = 'Search commands…';\n\n  /** Shown when the query matches nothing. */\n  @Prop() emptyMessage = 'No results found.';\n\n  /** Accessible name for the dialog. */\n  @Prop() label = 'Command palette';\n\n  /** Close on Escape or a click on the backdrop. Defaults to true. */\n  @Prop() dismissable = true;\n\n  /** Fires whenever the palette opens or closes, whoever caused it. */\n  @Event() pfOpenChange!: EventEmitter<{ open: boolean }>;\n\n  /** Fires with the chosen item's `value`. The palette then closes. */\n  @Event() pfSelect!: EventEmitter<{ value: string }>;\n\n  @State() query = '';\n  @State() matchCount = 0;\n\n  private releaseScroll: (() => void) | null = null;\n  private activeItem: HTMLElement | null = null;\n\n  /*\n   * Read the light DOM on the way in, not after mounting, so the first paint\n   * is right: filtering from `componentDidLoad` leaves `matchCount` at 0 for\n   * that first render and flashes \"No results found\" over a full list.\n   */\n  componentWillLoad() {\n    this.applyQuery();\n  }\n\n  componentDidLoad() {\n    if (this.open) this.showDialog();\n  }\n\n  componentDidRender() {\n    /*\n     * Re-applied after every render because the active option is held as a\n     * *property* on the input, and Stencil's re-render replaces nothing of the\n     * light DOM but does reset nothing of this either — the property survives,\n     * but the matching set may have changed under it, so the one place that is\n     * always right is after the render that changed it.\n     */\n    this.syncActiveDescendant();\n  }\n\n  disconnectedCallback() {\n    this.unlockScroll();\n  }\n\n  /** Opens the palette. */\n  @Method()\n  async show(): Promise<void> {\n    this.open = true;\n  }\n\n  /** Closes the palette. */\n  @Method()\n  async hide(): Promise<void> {\n    this.open = false;\n  }\n\n  @Watch('open')\n  syncOpen(next: boolean, previous: boolean) {\n    if (next) this.showDialog();\n    else this.closeDialog();\n    if (next !== previous) this.pfOpenChange.emit({ open: next });\n  }\n\n  /** A child asking to be run. The palette decides, reports and closes. */\n  @Listen('pfCommandSelect')\n  handleCommandSelect(event: CustomEvent<{ value: string }>) {\n    event.stopPropagation();\n    this.pfSelect.emit({ value: event.detail.value });\n    this.open = false;\n  }\n\n  /*\n   * Items may be added, removed or relabelled while the palette is open, so\n   * the filter is re-applied when the assignment changes. Text edited inside\n   * an already-assigned node does not fire this — the same caveat pf-tooltip\n   * documents — which is why `refresh()` exists.\n   */\n  private onSlotChange = () => {\n    this.applyQuery();\n  };\n\n  /** Re-reads the children and re-applies the current query. */\n  @Method()\n  async refresh(): Promise<void> {\n    this.applyQuery();\n  }\n\n  private get dialog() {\n    return this.el.shadowRoot?.querySelector('dialog') ?? null;\n  }\n\n  private get input() {\n    return this.el.shadowRoot?.querySelector('input') ?? null;\n  }\n\n  private items(): HTMLElement[] {\n    return Array.from(this.el.querySelectorAll<HTMLElement>('pf-command-item'));\n  }\n\n  /** The items a query left showing, which is what the arrows move through. */\n  private visibleItems(): HTMLElement[] {\n    return this.items().filter((item) => !item.hasAttribute('hidden'));\n  }\n\n  private lockScroll() {\n    if (this.releaseScroll) return;\n    this.releaseScroll = lockPageScroll();\n  }\n\n  private unlockScroll() {\n    this.releaseScroll?.();\n    this.releaseScroll = null;\n  }\n\n  private showDialog() {\n    const dialog = this.dialog;\n    if (!dialog || dialog.open) return;\n    dialog.showModal();\n    this.lockScroll();\n\n    // A fresh query each time it opens, matching the React component.\n    this.query = '';\n    this.applyQuery();\n    requestAnimationFrame(() => this.input?.focus());\n  }\n\n  private closeDialog() {\n    const dialog = this.dialog;\n    this.unlockScroll();\n    if (dialog?.open) dialog.close();\n  }\n\n  private onCancel = (event: Event) => {\n    if (!this.dismissable) event.preventDefault();\n  };\n\n  private onClose = () => {\n    this.unlockScroll();\n    if (this.open) this.open = false;\n  };\n\n  /** A click on the dialog itself landed on the backdrop, not the panel. */\n  private onDialogClick = (event: MouseEvent) => {\n    if (!this.dismissable || event.target !== this.dialog) return;\n    this.open = false;\n  };\n\n  private onInput = (event: Event) => {\n    this.query = (event.target as HTMLInputElement).value;\n    this.applyQuery();\n  };\n\n  /**\n   * Hides the items a query excludes, and any group left with none showing.\n   *\n   * The group's own label counts towards each of its items, so typing a\n   * section name narrows to that section — which is what the React component\n   * does with its `group` field.\n   */\n  private applyQuery() {\n    const query = this.query;\n\n    for (const item of this.items()) {\n      const group = item.closest('pf-command-group');\n      const matches = matchesCommandQuery(\n        {\n          label: item.textContent?.trim() ?? '',\n          description: item.getAttribute('description'),\n          group: group?.getAttribute('label') ?? null,\n        },\n        query,\n      );\n      setHidden(item, !matches);\n    }\n\n    for (const group of Array.from(this.el.querySelectorAll<HTMLElement>('pf-command-group'))) {\n      const showing = group.querySelectorAll('pf-command-item:not([hidden])').length;\n      setHidden(group, showing === 0);\n    }\n\n    const visible = this.visibleItems();\n    this.matchCount = visible.length;\n\n    // A new query starts at the top, as the React component does.\n    this.setActive(visible.find((item) => !item.hasAttribute('disabled')) ?? null);\n  }\n\n  private setActive(item: HTMLElement | null) {\n    if (this.activeItem && this.activeItem !== item) {\n      this.activeItem.removeAttribute('aria-selected');\n    }\n    this.activeItem = item;\n    item?.setAttribute('aria-selected', 'true');\n    this.syncActiveDescendant();\n    // Guarded: this also runs from componentWillLoad, and the mock DOM has no\n    // scrollIntoView at all.\n    if (item && typeof item.scrollIntoView === 'function') {\n      item.scrollIntoView({ block: 'nearest' });\n    }\n  }\n\n  /**\n   * Feature-detected: where ARIA element reflection is missing there is no\n   * cross-root equivalent, so the active option stops being *announced* while\n   * the arrows, the highlight and Enter all still work. Recorded in `todo.md`.\n   */\n  private syncActiveDescendant() {\n    const input = this.input;\n    if (!input || !('ariaActiveDescendantElement' in input)) return;\n    (\n      input as unknown as { ariaActiveDescendantElement: Element | null }\n    ).ariaActiveDescendantElement = this.activeItem;\n  }\n\n  private move(action: ListNavigationAction) {\n    const visible = this.visibleItems();\n    const enabled = getEnabledIndexes(visible, (item) => item.hasAttribute('disabled'));\n    const current = this.activeItem ? visible.indexOf(this.activeItem) : -1;\n    const next = resolveListMove(action, enabled, current);\n    if (next !== -1) this.setActive(visible[next] ?? null);\n  }\n\n  private runActive() {\n    const item = this.activeItem;\n    if (!item || item.hasAttribute('disabled')) return;\n    // The property, not the attribute: a binding that sets props would leave\n    // the attribute absent, and the reported value silently empty.\n    const value = (item as HTMLElement & { value?: string }).value;\n    this.pfSelect.emit({ value: value ?? item.getAttribute('value') ?? '' });\n    this.open = false;\n  }\n\n  /*\n   * On the panel rather than the input, so a pointer that has moved focus\n   * elsewhere inside the dialog still drives the list. Escape is left to the\n   * dialog, which handles it natively.\n   */\n  private onKeyDown = (event: KeyboardEvent) => {\n    const actions: Record<string, ListNavigationAction> = {\n      [Keys.ArrowDown]: 'next',\n      [Keys.ArrowUp]: 'previous',\n      [Keys.Home]: 'first',\n      [Keys.End]: 'last',\n    };\n\n    const action = actions[event.key];\n    if (action) {\n      event.preventDefault();\n      this.move(action);\n      return;\n    }\n\n    if (event.key === Keys.Enter) {\n      event.preventDefault();\n      this.runActive();\n    }\n  };\n\n  render() {\n    const empty = this.matchCount === 0;\n\n    return (\n      <Host>\n        <dialog\n          part=\"dialog\"\n          class=\"dialog\"\n          aria-label={this.label}\n          onCancel={this.onCancel}\n          onClose={this.onClose}\n          onClick={this.onDialogClick}\n        >\n          <div class=\"panel\" part=\"panel\" onKeyDown={this.onKeyDown}>\n            <div class=\"search\">\n              <pf-icon name=\"magnifying-glass\" class=\"search-icon\"></pf-icon>\n              <input\n                part=\"input\"\n                class=\"input\"\n                type=\"text\"\n                role=\"combobox\"\n                autocomplete=\"off\"\n                spellcheck={false}\n                aria-autocomplete=\"list\"\n                aria-expanded=\"true\"\n                aria-label={this.placeholder}\n                placeholder={this.placeholder}\n                value={this.query}\n                onInput={this.onInput}\n              />\n              <pf-kbd class=\"hint\">esc</pf-kbd>\n            </div>\n\n            <div class=\"list\" part=\"list\" role=\"listbox\" aria-label={this.label}>\n              <slot onSlotchange={this.onSlotChange} />\n              {empty && (\n                <p class=\"empty\" part=\"empty\">\n                  {this.emptyMessage}\n                </p>\n              )}\n            </div>\n          </div>\n        </dialog>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/pitchfork/p-4b7c186f.entry.js

@@ -0,0 +1,2 @@
+import{r as i,c as o,a as t,h as a,H as n}from"./p-Bm6UxEit.js";import{l as e}from"./p-DfpCerXM.js";import{s as r}from"./p-CCln56Fj.js";import{a as s}from"./p-Cta76kgc.js";const c=()=>`:host{display:block}:host([hidden]){display:none}.notification{align-items:flex-start;background:var(--pf-notification-bg);border:1px solid var(--pf-notification-border);border-radius:var(--radius-md);box-shadow:var(--pf-notification-elevation-floating-shadow, var(--pf-elevation-floating-shadow));color:var(--pf-notification-text);display:grid;gap:var(--space-3);grid-template-columns:auto minmax(0, 1fr) auto;padding:var(--space-3);width:100%;animation:pf-notification-in var(--pf-transition-enter)}@media (min-width: 768px){.notification{padding:var(--space-4)}}@keyframes pf-notification-in{from{opacity:0;transform:translateX(12px)}}:host([exiting]) .notification{animation:pf-notification-out var(--duration-moderate) var(--easing-accelerate) forwards;overflow:hidden;pointer-events:none}@keyframes pf-notification-out{from{opacity:1;transform:translateX(0);max-height:480px}to{opacity:0;transform:translateX(100%);max-height:0;margin-top:0;margin-bottom:0;padding-top:0;padding-bottom:0}}@media (prefers-reduced-motion: reduce){.notification,:host([exiting]) .notification{animation:none}}:host([variant='info']) .notification{background:color-mix(     in srgb,     var(--pf-notification-info-bg) 45%,     var(--pf-notification-mix-base)   );border-color:var(--pf-notification-info-border)}:host([variant='success']) .notification{background:color-mix(     in srgb,     var(--pf-notification-success-bg) 45%,     var(--pf-notification-mix-base)   );border-color:var(--pf-notification-success-border)}:host([variant='warning']) .notification{background:color-mix(     in srgb,     var(--pf-notification-warning-bg) 45%,     var(--pf-notification-mix-base)   );border-color:var(--pf-notification-warning-border)}:host([variant='danger']) .notification{background:color-mix(     in srgb,     var(--pf-notification-danger-bg) 45%,     var(--pf-notification-mix-base)   );border-color:var(--pf-notification-danger-border)}.icon{align-items:center;display:inline-flex;font-size:var(--font-size-lg);height:1em;justify-content:center;line-height:1;margin-top:2px;width:1em}:host([variant='info']) .icon{color:var(--pf-notification-info-icon)}:host([variant='success']) .icon{color:var(--pf-notification-success-icon)}:host([variant='warning']) .icon{color:var(--pf-notification-warning-icon)}:host([variant='danger']) .icon{color:var(--pf-notification-danger-icon)}.content{display:grid;gap:var(--space-1);min-width:0}.title{color:var(--pf-notification-text);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);line-height:1.35;margin:0}:host([variant='info']) .title{color:var(--pf-notification-info-title)}.body{color:var(--pf-notification-text-muted);font-size:var(--font-size-sm);line-height:1.45}:host([variant='info']) .body{color:var(--pf-notification-info-icon)}.body[hidden]{display:none}slot[name='action']::slotted(*){margin-top:var(--space-2)}.dismiss{align-items:center;align-self:flex-start;background:transparent;border:0;border-radius:var(--radius-sm);color:var(--pf-notification-text-muted);cursor:pointer;display:inline-flex;height:28px;justify-content:center;width:28px}:host([variant='info']) .dismiss{color:var(--pf-notification-info-icon)}.dismiss:hover,.dismiss:focus-visible{background:var(--pf-notification-bg-subtle);color:var(--pf-notification-text);outline:none}:host([variant='info']) .dismiss:hover,:host([variant='info']) .dismiss:focus-visible{background:var(--pf-notification-info-hover-bg);color:var(--pf-notification-info-hover-icon)}`;const f=class{constructor(t){i(this,t);this.pfDismiss=o(this,"pfDismiss")}get el(){return t(this)}variant="info";heading;description;dismissable=false;exiting=false;pfDismiss;hasSlottedBody=false;componentWillLoad(){this.readBody()}async dismiss(){if(this.exiting)return;this.exiting=true;await this.waitForExit();this.pfDismiss.emit()}async waitForExit(){await s(this.el.shadowRoot?.querySelector(".notification"))}readBody(){this.hasSlottedBody=Array.from(this.el.childNodes).some((i=>i.nodeType===Node.ELEMENT_NODE?!i.getAttribute("slot"):Boolean(i.textContent?.trim())))}render(){return a(n,{key:"9de454e456c98762a879e0f1e108a0a8367dbc2e"},a("div",{key:"60b5e41a64035032f4a3096c0d2fee0ede545753",class:"notification",part:"notification",role:e(this.variant)},a("span",{key:"3294482f4cc196ed29b5378664eb4724f0d41dc2",class:"icon",part:"icon","aria-hidden":"true"},a("slot",{key:"1c2d8970cbd0b7a4e90dc10ec60fa3d9160c690a",name:"icon"},a("pf-icon",{key:"83470033a1b36b3c0fd44db1e6dc0eb14d2d7b6d",name:r(this.variant)}))),a("div",{key:"61f69fbe020dfc1be756e50d1eec26e78a74c117",class:"content"},this.heading&&a("p",{key:"99cb65b4ea18b954a5297d3179cb0e0fa1289f1b",class:"title",part:"title"},this.heading),a("div",{key:"da4e2ff62296f30097110b136f08e0fe48f196ee",class:"body",part:"body",hidden:!this.hasSlottedBody&&!this.description},a("slot",{key:"745fd458de689740eba54922790b2826a59abec7",onSlotchange:()=>this.readBody()},this.description)),a("slot",{key:"af0385dd7accef3853fb861bd796592ecb0abd25",name:"action"})),this.dismissable&&a("button",{key:"ef0abf4e61771983746f9fc8e1ae1cb89e54fd0c",class:"dismiss",part:"dismiss",type:"button","aria-label":"Dismiss notification",onClick:()=>this.dismiss()},a("svg",{key:"5b9685008b5afc7443bc7cbc05d5cc85f8673875",viewBox:"0 0 16 16",width:"16",height:"16","aria-hidden":"true",focusable:"false"},a("path",{key:"afb4ecdec4e8cdfc5f6060e7a63b330f87d409a6",d:"M4 4l8 8M12 4l-8 8",stroke:"currentColor","stroke-width":"1.6","stroke-linecap":"round",fill:"none"})))))}};f.style=c();export{f as pf_notification};
+//# sourceMappingURL=p-4b7c186f.entry.js.map

package/dist/pitchfork/p-4b7c186f.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["pfNotificationCss","PfNotification","variant","heading","description","dismissable","exiting","pfDismiss","hasSlottedBody","componentWillLoad","this","readBody","dismiss","waitForExit","emit","animationsFinished","el","shadowRoot","querySelector","Array","from","childNodes","some","node","nodeType","Node","ELEMENT_NODE","getAttribute","Boolean","textContent","trim","render","h","Host","key","class","part","role","liveRegionRole","name","severityIconName","hidden","onSlotchange","type","onClick","viewBox","width","height","focusable","d","stroke","fill"],"sources":["src/components/pf-notification/pf-notification.css?tag=pf-notification&encapsulation=shadow","src/components/pf-notification/pf-notification.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\n:host([hidden]) {\n  display: none;\n}\n\n.notification {\n  align-items: flex-start;\n  background: var(--pf-notification-bg);\n  border: 1px solid var(--pf-notification-border);\n  border-radius: var(--radius-md);\n  box-shadow: var(--pf-notification-elevation-floating-shadow, var(--pf-elevation-floating-shadow));\n  color: var(--pf-notification-text);\n  display: grid;\n  gap: var(--space-3);\n  grid-template-columns: auto minmax(0, 1fr) auto;\n  padding: var(--space-3);\n  width: 100%;\n  animation: pf-notification-in var(--pf-transition-enter);\n}\n\n@media (--md) {\n  .notification {\n    padding: var(--space-4);\n  }\n}\n\n/*\n * Its own copies: @keyframes do not cross a shadow boundary, so the global\n * sheet's `pf-notification-in` is invisible from in here.\n */\n@keyframes pf-notification-in {\n  from {\n    opacity: 0;\n    transform: translateX(12px);\n  }\n}\n\n/* Slides out and collapses, so the stack above closes the gap behind it. */\n:host([exiting]) .notification {\n  animation: pf-notification-out var(--duration-moderate) var(--easing-accelerate) forwards;\n  overflow: hidden;\n  pointer-events: none;\n}\n\n@keyframes pf-notification-out {\n  from {\n    opacity: 1;\n    transform: translateX(0);\n    max-height: 480px;\n  }\n  to {\n    opacity: 0;\n    transform: translateX(100%);\n    max-height: 0;\n    margin-top: 0;\n    margin-bottom: 0;\n    padding-top: 0;\n    padding-bottom: 0;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .notification,\n  :host([exiting]) .notification {\n    animation: none;\n  }\n}\n\n:host([variant='info']) .notification {\n  background: color-mix(\n    in srgb,\n    var(--pf-notification-info-bg) 45%,\n    var(--pf-notification-mix-base)\n  );\n  border-color: var(--pf-notification-info-border);\n}\n\n:host([variant='success']) .notification {\n  background: color-mix(\n    in srgb,\n    var(--pf-notification-success-bg) 45%,\n    var(--pf-notification-mix-base)\n  );\n  border-color: var(--pf-notification-success-border);\n}\n\n:host([variant='warning']) .notification {\n  background: color-mix(\n    in srgb,\n    var(--pf-notification-warning-bg) 45%,\n    var(--pf-notification-mix-base)\n  );\n  border-color: var(--pf-notification-warning-border);\n}\n\n:host([variant='danger']) .notification {\n  background: color-mix(\n    in srgb,\n    var(--pf-notification-danger-bg) 45%,\n    var(--pf-notification-mix-base)\n  );\n  border-color: var(--pf-notification-danger-border);\n}\n\n.icon {\n  align-items: center;\n  display: inline-flex;\n  font-size: var(--font-size-lg);\n  height: 1em;\n  justify-content: center;\n  line-height: 1;\n  margin-top: 2px;\n  width: 1em;\n}\n\n:host([variant='info']) .icon {\n  color: var(--pf-notification-info-icon);\n}\n\n:host([variant='success']) .icon {\n  color: var(--pf-notification-success-icon);\n}\n\n:host([variant='warning']) .icon {\n  color: var(--pf-notification-warning-icon);\n}\n\n:host([variant='danger']) .icon {\n  color: var(--pf-notification-danger-icon);\n}\n\n.content {\n  display: grid;\n  gap: var(--space-1);\n  min-width: 0;\n}\n\n.title {\n  color: var(--pf-notification-text);\n  font-size: var(--font-size-sm);\n  font-weight: var(--font-weight-semibold);\n  line-height: 1.35;\n  margin: 0;\n}\n\n:host([variant='info']) .title {\n  color: var(--pf-notification-info-title);\n}\n\n.body {\n  color: var(--pf-notification-text-muted);\n  font-size: var(--font-size-sm);\n  line-height: 1.45;\n}\n\n:host([variant='info']) .body {\n  color: var(--pf-notification-info-icon);\n}\n\n.body[hidden] {\n  display: none;\n}\n\nslot[name='action']::slotted(*) {\n  margin-top: var(--space-2);\n}\n\n.dismiss {\n  align-items: center;\n  align-self: flex-start;\n  background: transparent;\n  border: 0;\n  border-radius: var(--radius-sm);\n  color: var(--pf-notification-text-muted);\n  cursor: pointer;\n  display: inline-flex;\n  height: 28px;\n  justify-content: center;\n  width: 28px;\n}\n\n:host([variant='info']) .dismiss {\n  color: var(--pf-notification-info-icon);\n}\n\n.dismiss:hover,\n.dismiss:focus-visible {\n  background: var(--pf-notification-bg-subtle);\n  color: var(--pf-notification-text);\n  outline: none;\n}\n\n:host([variant='info']) .dismiss:hover,\n:host([variant='info']) .dismiss:focus-visible {\n  background: var(--pf-notification-info-hover-bg);\n  color: var(--pf-notification-info-hover-icon);\n}\n","import {\n  animationsFinished,\n  liveRegionRole,\n  severityIconName,\n  type LiveRegionVariant,\n} from '@pitchfork-ui/core';\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n} from '@stencil/core';\n\nexport type PfNotificationVariant = LiveRegionVariant;\n\n/**\n * A notification: an icon, a heading, a body and an optional dismiss button.\n *\n * The role comes from core's `liveRegionRole`, so `warning` and `danger`\n * announce assertively and `info` and `success` wait their turn. The React\n * component used to be `role=\"status\"` for all four — the rule lived in\n * `Alert` and nowhere else — which is why the mapping is now shared.\n *\n * @slot - the body, used instead of the `description` prop when present.\n * @slot icon - replaces the icon the variant would choose.\n * @slot action - buttons or links under the body.\n * @part notification - the root box.\n * @part icon - the icon's box.\n * @part title - the heading.\n * @part body - the description's box.\n * @part dismiss - the dismiss button.\n */\n@Component({\n  tag: 'pf-notification',\n  styleUrl: 'pf-notification.css',\n  shadow: true,\n})\nexport class PfNotification {\n  @Element() el!: HTMLElement;\n\n  /** Severity. Reflected, because the stylesheet selects on it. */\n  @Prop({ reflect: true }) variant: PfNotificationVariant = 'info';\n\n  /** The bold first line. */\n  @Prop() heading?: string;\n\n  /** The body, when nothing is slotted. */\n  @Prop() description?: string;\n\n  /** Render the dismiss button. */\n  @Prop({ reflect: true }) dismissable = false;\n\n  /** Set while the exit animation plays. Reflected for the stylesheet. */\n  @Prop({ mutable: true, reflect: true }) exiting = false;\n\n  /**\n   * Fires once the notification has finished leaving, which is the point at\n   * which its owner should remove it from the DOM.\n   */\n  @Event() pfDismiss!: EventEmitter<void>;\n\n  @State() hasSlottedBody = false;\n\n  componentWillLoad() {\n    this.readBody();\n  }\n\n  /**\n   * Starts the exit animation and resolves when it has finished, having\n   * emitted `pfDismiss`. Calling it twice is harmless.\n   */\n  @Method()\n  async dismiss(): Promise<void> {\n    if (this.exiting) return;\n    this.exiting = true;\n    await this.waitForExit();\n    this.pfDismiss.emit();\n  }\n\n  /**\n   * Waits for the exit animation, or returns straight away when there is not\n   * one. Core's, so `pf-alert` and the React `useExitAnimation` wait the same\n   * way — and none of them waits on a guessed duration.\n   */\n  private async waitForExit(): Promise<void> {\n    await animationsFinished(this.el.shadowRoot?.querySelector('.notification'));\n  }\n\n  private readBody() {\n    this.hasSlottedBody = Array.from(this.el.childNodes).some((node) =>\n      node.nodeType === Node.ELEMENT_NODE\n        ? !(node as Element).getAttribute('slot')\n        : Boolean(node.textContent?.trim()),\n    );\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class=\"notification\" part=\"notification\" role={liveRegionRole(this.variant)}>\n          <span class=\"icon\" part=\"icon\" aria-hidden=\"true\">\n            <slot name=\"icon\">\n              <pf-icon name={severityIconName(this.variant)}></pf-icon>\n            </slot>\n          </span>\n\n          <div class=\"content\">\n            {this.heading && (\n              <p class=\"title\" part=\"title\">\n                {this.heading}\n              </p>\n            )}\n\n            <div class=\"body\" part=\"body\" hidden={!this.hasSlottedBody && !this.description}>\n              <slot onSlotchange={() => this.readBody()}>{this.description}</slot>\n            </div>\n\n            <slot name=\"action\" />\n          </div>\n\n          {this.dismissable && (\n            <button\n              class=\"dismiss\"\n              part=\"dismiss\"\n              type=\"button\"\n              aria-label=\"Dismiss notification\"\n              onClick={() => this.dismiss()}\n            >\n              <svg viewBox=\"0 0 16 16\" width=\"16\" height=\"16\" aria-hidden=\"true\" focusable=\"false\">\n                <path\n                  d=\"M4 4l8 8M12 4l-8 8\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"1.6\"\n                  stroke-linecap=\"round\"\n                  fill=\"none\"\n                />\n              </svg>\n            </button>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"4KAAA,MAAMA,EAAoB,IAAM,i6G,MC2CnBC,EAAc,M,oFAIAC,QAAiC,OAGlDC,QAGAC,YAGiBC,YAAc,MAGCC,QAAU,MAMzCC,UAEAC,eAAiB,MAE1B,iBAAAC,GACEC,KAAKC,U,CAQP,aAAMC,GACJ,GAAIF,KAAKJ,QAAS,OAClBI,KAAKJ,QAAU,WACTI,KAAKG,cACXH,KAAKH,UAAUO,M,CAQT,iBAAMD,SACNE,EAAmBL,KAAKM,GAAGC,YAAYC,cAAc,iB,CAGrD,QAAAP,GACND,KAAKF,eAAiBW,MAAMC,KAAKV,KAAKM,GAAGK,YAAYC,MAAMC,GACzDA,EAAKC,WAAaC,KAAKC,cACjBH,EAAiBI,aAAa,QAChCC,QAAQL,EAAKM,aAAaC,S,CAIlC,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAM,eAAeC,KAAK,eAAeC,KAAMC,EAAe5B,KAAKR,UACtE8B,EAAA,QAAAE,IAAA,2CAAMC,MAAM,OAAOC,KAAK,OAAM,cAAa,QACzCJ,EAAA,QAAAE,IAAA,2CAAMK,KAAK,QACTP,EAAA,WAAAE,IAAA,2CAASK,KAAMC,EAAiB9B,KAAKR,aAIzC8B,EAAA,OAAAE,IAAA,2CAAKC,MAAM,WACRzB,KAAKP,SACJ6B,EAAA,KAAAE,IAAA,2CAAGC,MAAM,QAAQC,KAAK,SACnB1B,KAAKP,SAIV6B,EAAA,OAAAE,IAAA,2CAAKC,MAAM,OAAOC,KAAK,OAAOK,QAAS/B,KAAKF,iBAAmBE,KAAKN,aAClE4B,EAAA,QAAAE,IAAA,2CAAMQ,aAAc,IAAMhC,KAAKC,YAAaD,KAAKN,cAGnD4B,EAAA,QAAAE,IAAA,2CAAMK,KAAK,YAGZ7B,KAAKL,aACJ2B,EAAA,UAAAE,IAAA,2CACEC,MAAM,UACNC,KAAK,UACLO,KAAK,SAAQ,aACF,uBACXC,QAAS,IAAMlC,KAAKE,WAEpBoB,EAAA,OAAAE,IAAA,2CAAKW,QAAQ,YAAYC,MAAM,KAAKC,OAAO,KAAI,cAAa,OAAOC,UAAU,SAC3EhB,EAAA,QAAAE,IAAA,2CACEe,EAAE,qBACFC,OAAO,eAAc,eACR,MAAK,iBACH,QACfC,KAAK,Y","ignoreList":[]}

package/dist/pitchfork/p-4df4eed8.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as e,a as r,h as i,H as a}from"./p-Bm6UxEit.js";import{c as o}from"./p-DfpCerXM.js";import{r as s}from"./p-CAz7-p8y.js";import{s as n,g as d,r as l}from"./p-Fiuz9ck7.js";import{a as c}from"./p-Cr6IXrUk.js";import"./p-g4FlTDZx.js";var h=[{command:"bold",label:"Bold",text:"B"},{command:"italic",label:"Italic",text:"I"},{command:"underline",label:"Underline",text:"U"},{command:"insertUnorderedList",label:"Bulleted list",text:"• List",separatorBefore:true},{command:"insertOrderedList",label:"Numbered list",text:"1. List"},{command:"removeFormat",label:"Clear formatting",text:"Clear"}];function f(t){if(!t)return"";const e=t.trim();if(!e.startsWith("<p>")||!e.endsWith("</p>"))return t;if(e.indexOf("</p>")!==e.length-4)return t;return e.slice(3,-4)}const p=()=>`:host{display:block}:host([hidden]){display:none}.field{display:grid;gap:var(--space-2)}.label{color:var(--pf-field-label);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.required{color:var(--pf-field-required);margin-inline-start:var(--space-1)}.description{color:var(--pf-field-description);font-size:var(--font-size-sm);margin:0}.error{color:var(--pf-field-error);font-size:var(--font-size-sm);margin:0}.box{background:var(--pf-rte-bg);border:1px solid var(--pf-rte-border);border-radius:var(--radius-md);overflow:hidden}.box:focus-within{border-color:var(--pf-rte-focus-border);box-shadow:var(--pf-rte-focus-ring, var(--pf-focus-ring))}.box--invalid{border-color:var(--pf-rte-invalid-border)}.box--disabled{opacity:var(--pf-rte-disabled-opacity, 0.75)}.toolbar{align-items:center;background:var(--pf-rte-bg-subtle);border-bottom:1px solid var(--pf-rte-border);display:flex;flex-wrap:wrap;gap:var(--space-1);padding:var(--space-2)}.tool{background:transparent;border:1px solid transparent;border-radius:var(--radius-sm);color:var(--pf-rte-text);cursor:pointer;font:inherit;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);min-height:28px;padding:0 var(--space-2)}.tool:hover:not(:disabled){background:var(--pf-rte-bg);border-color:var(--pf-rte-border)}.tool:focus-visible{box-shadow:var(--pf-rte-focus-ring, var(--pf-focus-ring));outline:none}.tool:disabled{cursor:not-allowed;opacity:var(--pf-rte-disabled-opacity, 0.55)}.divider{background:var(--pf-rte-border);height:18px;margin:0 var(--space-1);width:1px}.editor{color:var(--pf-rte-text);font:inherit;line-height:1.5;min-height:var(--pf-rte-min-height, 140px);outline:none;overflow-wrap:anywhere;padding:var(--space-3)}.editor p{margin:0 0 0.75em}.editor p:last-child{margin-bottom:0}.editor:empty::before{color:var(--pf-rte-text-muted);content:attr(data-placeholder);pointer-events:none}.count{color:var(--pf-rte-text-muted);font-size:var(--font-size-sm);margin:0;text-align:end}`;const b=class{constructor(r){t(this,r);this.pfChange=e(this,"pfChange");if(r.$hostElement$["s-ei"]){this.internals=r.$hostElement$["s-ei"]}else{this.internals=r.$hostElement$.attachInternals();r.$hostElement$["s-ei"]=this.internals}}internals;get el(){return r(this)}name;value="";label;description;error;placeholder="Start typing...";minHeight=140;characterMax;required=false;disabled=false;pfChange;characterCount=0;initialValue="";lastWithinLimit="";editor;toolbar;componentWillLoad(){this.initialValue=this.value??"";this.syncFormState()}componentDidLoad(){this.writeValueIntoEditor();if(this.toolbar)n(d(this.toolbar))}handleValueChange(){this.writeValueIntoEditor();this.syncFormState()}syncFormState(){const t=this.editor?.textContent??"";this.internals.setFormValue(this.value??"");c(this.internals,t.trim().length>0,this.required,this.error)}async checkValidity(){return this.internals.checkValidity()}async reportValidity(){return this.internals.reportValidity()}async getValidationMessage(){return this.internals.validationMessage}async format(t){this.runCommand(t)}formResetCallback(){this.value=this.initialValue;this.writeValueIntoEditor()}writeValueIntoEditor(){const t=f(this.value??"");if(this.editor&&this.editor.innerHTML!==t)this.editor.innerHTML=t;this.lastWithinLimit=t;this.characterCount=this.editor?.textContent?.length??0}onInput=()=>{if(!this.editor)return;const t=this.editor.textContent?.length??0;if(typeof this.characterMax==="number"&&t>this.characterMax){this.editor.innerHTML=this.lastWithinLimit;this.characterCount=this.editor.textContent?.length??0;return}this.lastWithinLimit=this.editor.innerHTML;this.characterCount=t;this.value=this.editor.innerHTML;this.syncFormState();this.pfChange.emit({value:this.value})};runCommand(t){if(!this.editor||this.disabled)return;this.editor.focus();document.execCommand?.(t);this.onInput()}onToolbarKeyDown=t=>{if(t.defaultPrevented||!this.toolbar)return;const e=l(t.key,"horizontal");if(!e)return;const r=d(this.toolbar);const i=r.indexOf(this.el.shadowRoot?.activeElement);if(i===-1)return;const a=s(e,r.map(((t,e)=>e)),i);if(a>=0){t.preventDefault();r[a].focus()}};onToolbarFocusIn=t=>{if(this.toolbar)n(d(this.toolbar),t.target)};render(){const t=typeof this.characterMax==="number";const e=o(this.description&&"description",this.error&&"error",t&&"count");return i(a,{key:"1e777ccc50af79784ab6348ff378ebc505919fb2"},i("div",{key:"432f2eaa3288f993ec43423cccc29461713d0231",class:"field",part:"field"},this.label&&i("label",{key:"04fea69f6c553e6f0a9008696ec9a65b5741ba42",class:"label",part:"label",id:"label",htmlFor:"editor"},this.label,this.required&&i("span",{key:"104964261dc140c4aa59b3831ed40bdcd298b714",class:"required","aria-hidden":"true"},"*")),i("div",{key:"221e3f47b1bec4663155ad201bef63e1533eeb85",class:{box:true,"box--invalid":Boolean(this.error),"box--disabled":this.disabled}},i("div",{key:"20e03010935746f7491ec091395c698520d65f1b",class:"toolbar",part:"toolbar",role:"toolbar","aria-label":"Formatting options","aria-orientation":"horizontal",ref:t=>this.toolbar=t,onKeyDown:this.onToolbarKeyDown,onFocusin:this.onToolbarFocusIn},h.map((t=>[t.separatorBefore?i("span",{class:"divider","aria-hidden":"true"}):null,i("button",{type:"button",class:"tool",part:"tool","data-command":t.command,"aria-label":t.label,disabled:this.disabled,onMouseDown:t=>t.preventDefault(),onClick:()=>this.runCommand(t.command)},t.text)]))),i("div",{key:"ee4fa67a3c45efe5fb9d4e9f77d1a639fcee5c1a",id:"editor",class:"editor",part:"editor",role:"textbox","aria-multiline":"true","aria-labelledby":this.label?"label":null,"aria-required":this.required?"true":null,"aria-invalid":this.error?"true":null,"aria-describedby":e,"aria-disabled":this.disabled?"true":null,contentEditable:!this.disabled,"data-placeholder":this.placeholder,style:{"--pf-rte-min-height":`${this.minHeight}px`},ref:t=>this.editor=t,onInput:this.onInput})),this.description&&i("p",{key:"e55178dd64e111d6940a9a2de5541a1adfefef8d",class:"description",part:"description",id:"description"},this.description),this.error&&i("p",{key:"118e10b3463e82ef5af5f0a51df45693b864b695",class:"error",part:"error",id:"error"},this.error),t&&i("p",{key:"c8163c0bb3c46c1ea8c6b0def9179fbd93dffa56",class:"count",part:"count",id:"count","aria-live":"polite"},this.characterCount,"/",this.characterMax)))}static get formAssociated(){return true}static get watchers(){return{value:[{handleValueChange:0}],error:[{syncFormState:0}],required:[{syncFormState:0}]}}};b.style=p();export{b as pf_rich_text_editor};
+//# sourceMappingURL=p-4df4eed8.entry.js.map

package/dist/pitchfork/p-4df4eed8.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["RICH_TEXT_COMMANDS","command","label","text","separatorBefore","stripOuterParagraph","html","trimmed","trim","startsWith","endsWith","indexOf","length","slice","pfRichTextEditorCss","PfRichTextEditor","internals","name","value","description","error","placeholder","minHeight","characterMax","required","disabled","pfChange","characterCount","initialValue","lastWithinLimit","editor","toolbar","componentWillLoad","this","syncFormState","componentDidLoad","writeValueIntoEditor","syncRovingTabIndex","getRovingItems","handleValueChange","textContent","setFormValue","applyControlValidity","checkValidity","reportValidity","getValidationMessage","validationMessage","format","runCommand","formResetCallback","next","innerHTML","onInput","emit","focus","document","execCommand","onToolbarKeyDown","event","defaultPrevented","action","resolveRovingKey","key","items","current","el","shadowRoot","activeElement","resolveListMove","map","_","index","preventDefault","onToolbarFocusIn","target","render","hasCount","describedBy","composeDescribedBy","h","Host","class","part","id","htmlFor","box","Boolean","role","ref","node","onKeyDown","onFocusin","tool","type","onMouseDown","onClick","contentEditable","style"],"sources":["../core/dist/rich-text.js","src/components/pf-rich-text-editor/pf-rich-text-editor.css?tag=pf-rich-text-editor&encapsulation=shadow","src/components/pf-rich-text-editor/pf-rich-text-editor.tsx"],"sourcesContent":["//#region src/rich-text.ts\n/**\n* The toolbar, as data.\n*\n* Shared so the two layers cannot offer different buttons, or the same\n* buttons under different names — a design system whose editor is `B I U` in\n* one framework and `B I U S` in another is two editors.\n*/\nvar RICH_TEXT_COMMANDS = [\n\t{\n\t\tcommand: \"bold\",\n\t\tlabel: \"Bold\",\n\t\ttext: \"B\"\n\t},\n\t{\n\t\tcommand: \"italic\",\n\t\tlabel: \"Italic\",\n\t\ttext: \"I\"\n\t},\n\t{\n\t\tcommand: \"underline\",\n\t\tlabel: \"Underline\",\n\t\ttext: \"U\"\n\t},\n\t{\n\t\tcommand: \"insertUnorderedList\",\n\t\tlabel: \"Bulleted list\",\n\t\ttext: \"• List\",\n\t\tseparatorBefore: true\n\t},\n\t{\n\t\tcommand: \"insertOrderedList\",\n\t\tlabel: \"Numbered list\",\n\t\ttext: \"1. List\"\n\t},\n\t{\n\t\tcommand: \"removeFormat\",\n\t\tlabel: \"Clear formatting\",\n\t\ttext: \"Clear\"\n\t}\n];\n/**\n* Drops a single wrapping `<p>` from a value, leaving everything else alone.\n*\n* A contenteditable browsers have been left to themselves wraps a first line\n* in `<p>` in some engines and not others, so a value round-tripped through\n* one and set into another gains a level of nesting each time. Stripping one\n* outer paragraph is what keeps `value` stable.\n*\n* The check that matters is that the first `</p>` **is** the last one. The\n* React `RichTextEditor` tested `startsWith('<p>')`, `endsWith('</p>')`,\n* `indexOf('<p>') === 0` and `lastIndexOf('</p>') === length - 4`, every one\n* of which is true of `<p>a</p><p>b</p>` — two paragraphs, which it then cut\n* into the broken fragment `a</p><p>b`. Measured against that exact input.\n*/\nfunction stripOuterParagraph(html) {\n\tif (!html) return \"\";\n\tconst trimmed = html.trim();\n\tif (!trimmed.startsWith(\"<p>\") || !trimmed.endsWith(\"</p>\")) return html;\n\tif (trimmed.indexOf(\"</p>\") !== trimmed.length - 4) return html;\n\treturn trimmed.slice(3, -4);\n}\n//#endregion\nexport { RICH_TEXT_COMMANDS, stripOuterParagraph };\n",":host {\n  display: block;\n}\n\n:host([hidden]) {\n  display: none;\n}\n\n.field {\n  display: grid;\n  gap: var(--space-2);\n}\n\n.label {\n  color: var(--pf-field-label);\n  font-size: var(--font-size-sm);\n  font-weight: var(--font-weight-medium);\n}\n\n.required {\n  color: var(--pf-field-required);\n  margin-inline-start: var(--space-1);\n}\n\n.description {\n  color: var(--pf-field-description);\n  font-size: var(--font-size-sm);\n  margin: 0;\n}\n\n.error {\n  color: var(--pf-field-error);\n  font-size: var(--font-size-sm);\n  margin: 0;\n}\n\n.box {\n  background: var(--pf-rte-bg);\n  border: 1px solid var(--pf-rte-border);\n  border-radius: var(--radius-md);\n  overflow: hidden;\n}\n\n.box:focus-within {\n  border-color: var(--pf-rte-focus-border);\n  box-shadow: var(--pf-rte-focus-ring, var(--pf-focus-ring));\n}\n\n.box--invalid {\n  border-color: var(--pf-rte-invalid-border);\n}\n\n.box--disabled {\n  opacity: var(--pf-rte-disabled-opacity, 0.75);\n}\n\n.toolbar {\n  align-items: center;\n  background: var(--pf-rte-bg-subtle);\n  border-bottom: 1px solid var(--pf-rte-border);\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--space-1);\n  padding: var(--space-2);\n}\n\n.tool {\n  background: transparent;\n  border: 1px solid transparent;\n  border-radius: var(--radius-sm);\n  color: var(--pf-rte-text);\n  cursor: pointer;\n  font: inherit;\n  font-size: var(--font-size-sm);\n  font-weight: var(--font-weight-medium);\n  min-height: 28px;\n  padding: 0 var(--space-2);\n}\n\n.tool:hover:not(:disabled) {\n  background: var(--pf-rte-bg);\n  border-color: var(--pf-rte-border);\n}\n\n.tool:focus-visible {\n  box-shadow: var(--pf-rte-focus-ring, var(--pf-focus-ring));\n  outline: none;\n}\n\n.tool:disabled {\n  cursor: not-allowed;\n  opacity: var(--pf-rte-disabled-opacity, 0.55);\n}\n\n.divider {\n  background: var(--pf-rte-border);\n  height: 18px;\n  margin: 0 var(--space-1);\n  width: 1px;\n}\n\n.editor {\n  color: var(--pf-rte-text);\n  font: inherit;\n  line-height: 1.5;\n  min-height: var(--pf-rte-min-height, 140px);\n  outline: none;\n  overflow-wrap: anywhere;\n  padding: var(--space-3);\n}\n\n/*\n * The browser's own paragraphs, which `execCommand` and Enter both produce.\n * There is no `::slotted` involved: this content is in the shadow root,\n * written there imperatively, so a plain descendant selector reaches it.\n */\n.editor p {\n  margin: 0 0 0.75em;\n}\n\n.editor p:last-child {\n  margin-bottom: 0;\n}\n\n.editor:empty::before {\n  color: var(--pf-rte-text-muted);\n  content: attr(data-placeholder);\n  pointer-events: none;\n}\n\n.count {\n  color: var(--pf-rte-text-muted);\n  font-size: var(--font-size-sm);\n  margin: 0;\n  text-align: end;\n}\n","import {\n  RICH_TEXT_COMMANDS,\n  composeDescribedBy,\n  getRovingItems,\n  resolveListMove,\n  resolveRovingKey,\n  stripOuterParagraph,\n  syncRovingTabIndex,\n} from '@pitchfork-ui/core';\nimport {\n  AttachInternals,\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport { applyControlValidity } from '../../form-validity';\n\n/**\n * A form-associated rich-text field over a `contenteditable`.\n *\n * The toolbar is core's list, so this and the React `RichTextEditor` cannot\n * offer different buttons, and the value is normalised with core's\n * `stripOuterParagraph`, so they cannot disagree about what a round trip\n * looks like.\n *\n * Two things differ from the React component, both deliberate:\n *\n * - **The toolbar is one tab stop**, with the arrows moving inside it, which\n *   is the ARIA toolbar pattern and what `pf-toolbar` already does. The React\n *   version is six tab stops inside a `role=\"toolbar\"`, so tabbing past the\n *   field walks every button; `todo.md` has that.\n * - **It is a real form control.** `formAssociated` with `ElementInternals` is\n *   what puts the value in `FormData`; a `contenteditable` is not a form\n *   control in any framework, and the React component's value reaches a form\n *   only if the consumer wires it there themselves.\n *\n * `document.execCommand` is deprecated and is still the only way to apply\n * formatting inside a `contenteditable` without a dependency, which is the\n * same trade the React component makes.\n *\n * @part field - the wrapper around label, toolbar, editor and messages.\n * @part label - the label element.\n * @part toolbar - the formatting toolbar.\n * @part tool - one toolbar button.\n * @part editor - the editable area.\n * @part count - the character counter.\n * @part description - the hint text.\n * @part error - the error message.\n */\n@Component({\n  tag: 'pf-rich-text-editor',\n  styleUrl: 'pf-rich-text-editor.css',\n  formAssociated: true,\n  shadow: true,\n})\nexport class PfRichTextEditor {\n  @AttachInternals() internals!: ElementInternals;\n\n  @Element() el!: HTMLElement;\n\n  /**\n   * Submitted under this name.\n   *\n   * Reflected, because a form-associated custom element takes its submission\n   * name from the `name` content attribute rather than from this property.\n   */\n  @Prop({ reflect: true }) name?: string;\n\n  /** The field's value, as HTML. */\n  @Prop({ mutable: true }) value = '';\n\n  @Prop() label?: string;\n\n  @Prop() description?: string;\n\n  /** Error message from the consumer. Its presence marks the control invalid. */\n  @Prop() error?: string;\n\n  @Prop() placeholder = 'Start typing...';\n\n  /** The editable area's smallest height, in pixels. */\n  @Prop() minHeight = 140;\n\n  /** The most characters of text the field will hold. */\n  @Prop() characterMax?: number;\n\n  @Prop({ reflect: true }) required = false;\n\n  @Prop({ reflect: true }) disabled = false;\n\n  /** Fires when the value changes, however it changed. */\n  @Event() pfChange!: EventEmitter<{ value: string }>;\n\n  /** The text length, which the counter shows. */\n  @State() characterCount = 0;\n\n  /** The value a reset restores, captured before `value` can be replaced. */\n  private initialValue = '';\n\n  /** The last value inside the character limit, which an overrun reverts to. */\n  private lastWithinLimit = '';\n\n  private editor?: HTMLElement;\n\n  private toolbar?: HTMLElement;\n\n  componentWillLoad() {\n    this.initialValue = this.value ?? '';\n    this.syncFormState();\n  }\n\n  componentDidLoad() {\n    this.writeValueIntoEditor();\n    if (this.toolbar) syncRovingTabIndex(getRovingItems(this.toolbar));\n  }\n\n  @Watch('value')\n  handleValueChange() {\n    this.writeValueIntoEditor();\n    this.syncFormState();\n  }\n\n  @Watch('error')\n  @Watch('required')\n  syncFormState() {\n    const text = this.editor?.textContent ?? '';\n    this.internals.setFormValue(this.value ?? '');\n    applyControlValidity(this.internals, text.trim().length > 0, this.required, this.error);\n  }\n\n  @Method()\n  async checkValidity(): Promise<boolean> {\n    return this.internals.checkValidity();\n  }\n\n  @Method()\n  async reportValidity(): Promise<boolean> {\n    return this.internals.reportValidity();\n  }\n\n  @Method()\n  async getValidationMessage(): Promise<string> {\n    return this.internals.validationMessage;\n  }\n\n  /** Applies one of the toolbar's commands, as pressing its button does. */\n  @Method()\n  async format(command: string) {\n    this.runCommand(command);\n  }\n\n  /**\n   * A reset restores the value the control started with, not an empty string —\n   * the rule a native `<input value=\"initial\">` follows.\n   */\n  formResetCallback() {\n    this.value = this.initialValue;\n    this.writeValueIntoEditor();\n  }\n\n  /**\n   * The editable area's content is written imperatively, never rendered.\n   *\n   * A `contenteditable` that a vdom also owns is a fight: the person types,\n   * the DOM changes under the renderer, and the next render puts the old\n   * content back with the caret at the start. So the element renders an empty\n   * box once and sets `innerHTML` only when the value it holds and the value\n   * in the box actually differ.\n   */\n  private writeValueIntoEditor() {\n    const next = stripOuterParagraph(this.value ?? '');\n    if (this.editor && this.editor.innerHTML !== next) this.editor.innerHTML = next;\n\n    this.lastWithinLimit = next;\n    this.characterCount = this.editor?.textContent?.length ?? 0;\n  }\n\n  private onInput = () => {\n    if (!this.editor) return;\n\n    const length = this.editor.textContent?.length ?? 0;\n\n    /*\n     * Over the limit: put the last good value back rather than let the\n     * content grow. The caret lands at the start of the box, which is the\n     * cost of this approach and the reason a limit should be generous.\n     */\n    if (typeof this.characterMax === 'number' && length > this.characterMax) {\n      this.editor.innerHTML = this.lastWithinLimit;\n      this.characterCount = this.editor.textContent?.length ?? 0;\n      return;\n    }\n\n    this.lastWithinLimit = this.editor.innerHTML;\n    this.characterCount = length;\n    this.value = this.editor.innerHTML;\n    this.syncFormState();\n    this.pfChange.emit({ value: this.value });\n  };\n\n  private runCommand(command: string) {\n    if (!this.editor || this.disabled) return;\n\n    this.editor.focus();\n    /*\n     * Deprecated, and still the only way to format inside a\n     * `contenteditable` without a dependency. It is also the one DOM call\n     * here that a test project cannot make: Stencil's mock DOM has no\n     * `execCommand` at all, so the toolbar is browser-tested.\n     */\n    document.execCommand?.(command);\n    this.onInput();\n  }\n\n  /** The toolbar is one tab stop, with the arrows moving inside it. */\n  private onToolbarKeyDown = (event: KeyboardEvent) => {\n    if (event.defaultPrevented || !this.toolbar) return;\n\n    const action = resolveRovingKey(event.key, 'horizontal');\n    if (!action) return;\n\n    const items = getRovingItems(this.toolbar);\n    const current = items.indexOf(this.el.shadowRoot?.activeElement as HTMLElement);\n    if (current === -1) return;\n\n    const next = resolveListMove(\n      action,\n      items.map((_, index) => index),\n      current,\n    );\n    if (next >= 0) {\n      event.preventDefault();\n      items[next].focus();\n    }\n  };\n\n  private onToolbarFocusIn = (event: FocusEvent) => {\n    if (this.toolbar) syncRovingTabIndex(getRovingItems(this.toolbar), event.target as HTMLElement);\n  };\n\n  render() {\n    const hasCount = typeof this.characterMax === 'number';\n    const describedBy = composeDescribedBy(\n      this.description && 'description',\n      this.error && 'error',\n      hasCount && 'count',\n    );\n\n    return (\n      <Host>\n        <div class=\"field\" part=\"field\">\n          {this.label && (\n            <label class=\"label\" part=\"label\" id=\"label\" htmlFor=\"editor\">\n              {this.label}\n              {this.required && (\n                <span class=\"required\" aria-hidden=\"true\">\n                  *\n                </span>\n              )}\n            </label>\n          )}\n\n          <div\n            class={{\n              box: true,\n              'box--invalid': Boolean(this.error),\n              'box--disabled': this.disabled,\n            }}\n          >\n            <div\n              class=\"toolbar\"\n              part=\"toolbar\"\n              role=\"toolbar\"\n              aria-label=\"Formatting options\"\n              aria-orientation=\"horizontal\"\n              ref={(node) => (this.toolbar = node)}\n              onKeyDown={this.onToolbarKeyDown}\n              onFocusin={this.onToolbarFocusIn}\n            >\n              {RICH_TEXT_COMMANDS.map((tool) => [\n                tool.separatorBefore ? <span class=\"divider\" aria-hidden=\"true\"></span> : null,\n                <button\n                  type=\"button\"\n                  class=\"tool\"\n                  part=\"tool\"\n                  data-command={tool.command}\n                  aria-label={tool.label}\n                  disabled={this.disabled}\n                  // A press must not take the caret out of the editor, or the\n                  // command has no selection to apply to.\n                  onMouseDown={(event: MouseEvent) => event.preventDefault()}\n                  onClick={() => this.runCommand(tool.command)}\n                >\n                  {tool.text}\n                </button>,\n              ])}\n            </div>\n\n            {/*\n              Rendered empty, once. Its content is set imperatively, because a\n              vdom that also owned it would put the old content back under the\n              person's caret on the next render.\n            */}\n            <div\n              id=\"editor\"\n              class=\"editor\"\n              part=\"editor\"\n              role=\"textbox\"\n              aria-multiline=\"true\"\n              aria-labelledby={this.label ? 'label' : null}\n              aria-required={this.required ? 'true' : null}\n              aria-invalid={this.error ? 'true' : null}\n              aria-describedby={describedBy}\n              aria-disabled={this.disabled ? 'true' : null}\n              contentEditable={!this.disabled}\n              data-placeholder={this.placeholder}\n              style={{ '--pf-rte-min-height': `${this.minHeight}px` }}\n              ref={(node) => (this.editor = node)}\n              onInput={this.onInput}\n            ></div>\n          </div>\n\n          {this.description && (\n            <p class=\"description\" part=\"description\" id=\"description\">\n              {this.description}\n            </p>\n          )}\n\n          {this.error && (\n            <p class=\"error\" part=\"error\" id=\"error\">\n              {this.error}\n            </p>\n          )}\n\n          {hasCount && (\n            <p class=\"count\" part=\"count\" id=\"count\" aria-live=\"polite\">\n              {this.characterCount}/{this.characterMax}\n            </p>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/pitchfork/p-4dfe7e8a.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as t,a as i,h as r,H as a}from"./p-Bm6UxEit.js";import{a as s}from"./p-Cr6IXrUk.js";import{c as n}from"./p-Cy_kHPeC.js";const o=()=>`:host{display:inline-block}:host([hidden]){display:none}.field{align-items:center;display:inline-flex;gap:var(--space-2)}.input{appearance:none;background:var(--pf-switch-track-bg);border-radius:var(--radius-full);cursor:pointer;height:24px;margin:0;position:relative;transition:background-color 120ms ease;width:44px}.input::after{background:var(--pf-switch-thumb-bg);border-radius:50%;content:'';height:20px;left:2px;position:absolute;top:2px;transition:transform 120ms ease;width:20px}.input:checked{background:var(--pf-switch-track-checked-bg)}.input:checked::after{transform:translateX(20px)}.input:focus-visible{box-shadow:var(--pf-switch-focus-ring, var(--pf-focus-ring));outline:none}.input:disabled{cursor:not-allowed;opacity:0.55}.input:disabled+.label{cursor:not-allowed;opacity:0.65}.label{color:var(--pf-switch-label-text);font-size:var(--font-size-md)}.error{color:var(--pf-switch-field-error, var(--pf-field-error));font-size:var(--font-size-sm);margin:var(--space-1) 0 0}@media (prefers-reduced-motion: reduce){.input,.input::after{transition:none}}`;const c=class{constructor(i){e(this,i);this.pfChange=t(this,"pfChange");if(i.$hostElement$["s-ei"]){this.internals=i.$hostElement$["s-ei"]}else{this.internals=i.$hostElement$.attachInternals();i.$hostElement$["s-ei"]=this.internals}}get el(){return i(this)}internals;name;checked=false;value="on";label;error;required=false;disabled=false;pfChange;initialChecked=false;componentWillLoad(){this.initialChecked=this.checked;this.syncFormState()}syncFormState(){this.internals.setFormValue(this.checked?this.value:null);s(this.internals,this.checked,this.required,this.error)}async checkValidity(){return this.internals.checkValidity()}async reportValidity(){return this.internals.reportValidity()}async getValidationMessage(){return this.internals.validationMessage}formResetCallback(){this.checked=this.initialChecked}onChange=e=>{this.checked=e.target.checked;this.pfChange.emit({checked:this.checked,value:this.value})};render(){return r(a,{key:"4c521d4d2e26f0adf9542c8eb490fedf78b6361a"},r("div",{key:"3d7dcdfd665db7435e49b1ad93518b380d63c52e",class:"field",part:"field"},r("input",{key:"936c2972a1249d1bfd5aeac3fc4e590e51360487",id:"input","aria-label":n(this.el,this.label),part:"input",class:"input",type:"checkbox",role:"switch",name:this.name,value:this.value,checked:this.checked,required:this.required,disabled:this.disabled,"aria-invalid":this.error?"true":null,"aria-describedby":this.error?"error":null,onChange:this.onChange}),this.label&&r("label",{key:"90aad05c07c0a81c785de9aad998c876b3f4ae21",class:"label",part:"label",htmlFor:"input"},this.label)),this.error&&r("p",{key:"d2904bfb254bb2ae9699c50e6ab4fe150beb98e8",class:"error",part:"error",id:"error"},this.error))}static get delegatesFocus(){return true}static get formAssociated(){return true}static get watchers(){return{checked:[{syncFormState:0}],error:[{syncFormState:0}],required:[{syncFormState:0}],value:[{syncFormState:0}]}}};c.style=o();export{c as pf_switch};
+//# sourceMappingURL=p-4dfe7e8a.entry.js.map

package/dist/pitchfork/p-4dfe7e8a.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["pfSwitchCss","PfSwitch","internals","name","checked","value","label","error","required","disabled","pfChange","initialChecked","componentWillLoad","this","syncFormState","setFormValue","applyControlValidity","checkValidity","reportValidity","getValidationMessage","validationMessage","formResetCallback","onChange","event","target","emit","render","h","Host","key","class","part","id","controlAriaLabel","el","type","role","htmlFor"],"sources":["src/components/pf-switch/pf-switch.css?tag=pf-switch&encapsulation=shadow","src/components/pf-switch/pf-switch.tsx"],"sourcesContent":[":host {\n  display: inline-block;\n}\n\n:host([hidden]) {\n  display: none;\n}\n\n.field {\n  align-items: center;\n  display: inline-flex;\n  gap: var(--space-2);\n}\n\n.input {\n  appearance: none;\n  background: var(--pf-switch-track-bg);\n  border-radius: var(--radius-full);\n  cursor: pointer;\n  height: 24px;\n  margin: 0;\n  position: relative;\n  transition: background-color 120ms ease;\n  width: 44px;\n}\n\n/* The thumb. */\n.input::after {\n  background: var(--pf-switch-thumb-bg);\n  border-radius: 50%;\n  content: '';\n  height: 20px;\n  left: 2px;\n  position: absolute;\n  top: 2px;\n  transition: transform 120ms ease;\n  width: 20px;\n}\n\n.input:checked {\n  background: var(--pf-switch-track-checked-bg);\n}\n\n.input:checked::after {\n  transform: translateX(20px);\n}\n\n.input:focus-visible {\n  box-shadow: var(--pf-switch-focus-ring, var(--pf-focus-ring));\n  outline: none;\n}\n\n.input:disabled {\n  cursor: not-allowed;\n  opacity: 0.55;\n}\n\n.input:disabled + .label {\n  cursor: not-allowed;\n  opacity: 0.65;\n}\n\n.label {\n  color: var(--pf-switch-label-text);\n  font-size: var(--font-size-md);\n}\n\n.error {\n  color: var(--pf-switch-field-error, var(--pf-field-error));\n  font-size: var(--font-size-sm);\n  margin: var(--space-1) 0 0;\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .input,\n  .input::after {\n    transition: none;\n  }\n}\n","import {\n  AttachInternals,\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  Watch,\n} from '@stencil/core';\n\nimport { applyControlValidity } from '../../form-validity';\nimport { controlAriaLabel } from '../../control-label';\n\n/**\n * A form-associated on/off switch.\n *\n * Built on a native checkbox with `role=\"switch\"`, exactly as the React\n * component is: a switch is a checkbox whose two states are \"on\" and \"off\"\n * rather than \"selected\" and \"not selected\", and the role is the only\n * difference assistive technology needs.\n *\n * @part field - the wrapper around control and label.\n * @part input - the native checkbox carrying role=\"switch\".\n * @part label - the label element.\n */\n@Component({\n  tag: 'pf-switch',\n  styleUrl: 'pf-switch.css',\n  formAssociated: true,\n  shadow: { delegatesFocus: true },\n})\nexport class PfSwitch {\n  @Element() el!: HTMLElement;\n\n  @AttachInternals() internals!: ElementInternals;\n\n  /**\n   * Submitted under this name.\n   *\n   * Reflected, because a form-associated custom element takes its submission\n   * name from the `name` *content attribute* -- not from this property. A\n   * framework wrapper that sets properties rather than attributes (the\n   * generated React bindings do) would otherwise leave the control nameless\n   * and absent from the submission, with every other sign of working.\n   */\n  @Prop({ reflect: true }) name?: string;\n\n  /** Whether the switch is on. Reflected so the stylesheet can select on it. */\n  @Prop({ mutable: true, reflect: true }) checked = false;\n\n  /**\n   * What is submitted when on. Mirrors the native attribute, whose default is\n   * also `on` — a checkbox with no value still submits something.\n   */\n  @Prop() value = 'on';\n\n  /** Visible label, rendered in the same root so `for` actually associates. */\n  @Prop() label?: string;\n\n  /** Error message. Its presence is what marks the control invalid. */\n  @Prop() error?: string;\n\n  @Prop({ reflect: true }) required = false;\n\n  @Prop({ reflect: true }) disabled = false;\n\n  /** Fires when the user turns the switch on or off. */\n  @Event() pfChange!: EventEmitter<{ checked: boolean; value: string }>;\n\n  /** The state a form reset restores, which is the initial attribute. */\n  private initialChecked = false;\n\n  componentWillLoad() {\n    this.initialChecked = this.checked;\n    this.syncFormState();\n  }\n\n  @Watch('checked')\n  @Watch('error')\n  @Watch('required')\n  @Watch('value')\n  syncFormState() {\n    /*\n     * `null`, not an empty string, when off: an unchecked checkbox is\n     * absent from the submission entirely, rather than present and empty.\n     * That is what a server distinguishing \"unticked\" from \"not sent\" relies\n     * on, and it is what a native checkbox does.\n     */\n    this.internals.setFormValue(this.checked ? this.value : null);\n    applyControlValidity(this.internals, this.checked, this.required, this.error);\n  }\n\n  /** A form-associated custom element does not inherit this. */\n  @Method()\n  async checkValidity(): Promise<boolean> {\n    return this.internals.checkValidity();\n  }\n\n  /** As `checkValidity`, but also shows the browser's validation message. */\n  @Method()\n  async reportValidity(): Promise<boolean> {\n    return this.internals.reportValidity();\n  }\n\n  /** The message explaining why the control is invalid, or an empty string. */\n  @Method()\n  async getValidationMessage(): Promise<string> {\n    return this.internals.validationMessage;\n  }\n\n  /**\n   * A reset restores the initial state, not `false` — a native\n   * `<input type=checkbox checked>` comes back on.\n   */\n  formResetCallback() {\n    this.checked = this.initialChecked;\n  }\n\n  private onChange = (event: Event) => {\n    this.checked = (event.target as HTMLInputElement).checked;\n    this.pfChange.emit({ checked: this.checked, value: this.value });\n  };\n\n  render() {\n    return (\n      <Host>\n        <div class=\"field\" part=\"field\">\n          <input\n            id=\"input\"\n            aria-label={controlAriaLabel(this.el, this.label)}\n            part=\"input\"\n            class=\"input\"\n            type=\"checkbox\"\n            role=\"switch\"\n            name={this.name}\n            value={this.value}\n            checked={this.checked}\n            required={this.required}\n            disabled={this.disabled}\n            aria-invalid={this.error ? 'true' : null}\n            aria-describedby={this.error ? 'error' : null}\n            onChange={this.onChange}\n          />\n          {this.label && (\n            <label class=\"label\" part=\"label\" htmlFor=\"input\">\n              {this.label}\n            </label>\n          )}\n        </div>\n        {this.error && (\n          <p class=\"error\" part=\"error\" id=\"error\">\n            {this.error}\n          </p>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"wIAAA,MAAMA,EAAc,IAAM,4iC,MCkCbC,EAAQ,M,mPAGAC,UAWMC,KAGeC,QAAU,MAM1CC,MAAQ,KAGRC,MAGAC,MAEiBC,SAAW,MAEXC,SAAW,MAG3BC,SAGDC,eAAiB,MAEzB,iBAAAC,GACEC,KAAKF,eAAiBE,KAAKT,QAC3BS,KAAKC,e,CAOP,aAAAA,GAOED,KAAKX,UAAUa,aAAaF,KAAKT,QAAUS,KAAKR,MAAQ,MACxDW,EAAqBH,KAAKX,UAAWW,KAAKT,QAASS,KAAKL,SAAUK,KAAKN,M,CAKzE,mBAAMU,GACJ,OAAOJ,KAAKX,UAAUe,e,CAKxB,oBAAMC,GACJ,OAAOL,KAAKX,UAAUgB,gB,CAKxB,0BAAMC,GACJ,OAAON,KAAKX,UAAUkB,iB,CAOxB,iBAAAC,GACER,KAAKT,QAAUS,KAAKF,c,CAGdW,SAAYC,IAClBV,KAAKT,QAAWmB,EAAMC,OAA4BpB,QAClDS,KAAKH,SAASe,KAAK,CAAErB,QAASS,KAAKT,QAASC,MAAOQ,KAAKR,OAAQ,EAGlE,MAAAqB,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAM,QAAQC,KAAK,SACtBJ,EAAA,SAAAE,IAAA,2CACEG,GAAG,QAAO,aACEC,EAAiBpB,KAAKqB,GAAIrB,KAAKP,OAC3CyB,KAAK,QACLD,MAAM,QACNK,KAAK,WACLC,KAAK,SACLjC,KAAMU,KAAKV,KACXE,MAAOQ,KAAKR,MACZD,QAASS,KAAKT,QACdI,SAAUK,KAAKL,SACfC,SAAUI,KAAKJ,SAAQ,eACTI,KAAKN,MAAQ,OAAS,KAAI,mBACtBM,KAAKN,MAAQ,QAAU,KACzCe,SAAUT,KAAKS,WAEhBT,KAAKP,OACJqB,EAAA,SAAAE,IAAA,2CAAOC,MAAM,QAAQC,KAAK,QAAQM,QAAQ,SACvCxB,KAAKP,QAIXO,KAAKN,OACJoB,EAAA,KAAAE,IAAA,2CAAGC,MAAM,QAAQC,KAAK,QAAQC,GAAG,SAC9BnB,KAAKN,O","ignoreList":[]}

package/dist/pitchfork/p-4e785310.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as e,h as i,H as a}from"./p-Bm6UxEit.js";const s=()=>`:host{border-bottom:1px solid var(--pf-table-border);color:var(--pf-table-text);display:table-cell;font-size:var(--font-size-sm);line-height:1.4;padding:var(--pf-table-cell-padding-block, 14px) var(--space-3);vertical-align:middle}:host([hidden]){display:none}@media (min-width: 768px){:host{padding-inline:var(--space-4)}}:host([head]){background:var(--pf-table-bg-subtle);color:var(--pf-table-text-muted);font-weight:var(--font-weight-semibold);position:var(--pf-table-head-position, static);top:0;z-index:1}:host([last]){border-bottom:0}:host([align='left']){text-align:start}:host([align='center']){text-align:center}:host([align='right']){text-align:end}.sort{align-items:center;background:transparent;border:0;color:inherit;cursor:pointer;display:inline-flex;font:inherit;gap:var(--space-2);justify-content:inherit;padding:0;width:100%}.sort:hover,.sort:focus-visible{color:var(--pf-table-text);outline:none}.indicator{display:inline-flex;font-size:var(--font-size-2xs);line-height:1;opacity:0.7}`;const o=class{constructor(i){t(this,i);this.pfTableSort=e(this,"pfTableSort")}head=false;last=false;align="left";width;sortKey;sortable=false;sort="none";pfTableSort;onSort=()=>{if(!this.sortKey)return;this.pfTableSort.emit({key:this.sortKey})};render(){const t=this.head&&this.sortable&&Boolean(this.sortKey);return i(a,{key:"419a9736fa82721764ea58179c56000a4eed5c25",role:this.head?"columnheader":"cell","aria-sort":t?this.sort:null,style:this.width?{width:this.width}:undefined},t?i("button",{type:"button",class:"sort",part:"sort",onClick:this.onSort},i("span",{class:"label"},i("slot",null)),i("span",{class:"indicator",part:"indicator","aria-hidden":"true"},this.sort==="ascending"?"^":this.sort==="descending"?"v":"-")):i("slot",null))}};o.style=s();export{o as pf_table_cell};
+//# sourceMappingURL=p-4e785310.entry.js.map

package/dist/pitchfork/p-4e785310.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["pfTableCellCss","PfTableCell","head","last","align","width","sortKey","sortable","sort","pfTableSort","onSort","this","emit","key","render","Boolean","h","Host","role","style","undefined","type","class","part","onClick"],"sources":["src/components/pf-table-cell/pf-table-cell.css?tag=pf-table-cell&encapsulation=shadow","src/components/pf-table-cell/pf-table-cell.tsx"],"sourcesContent":[":host {\n  border-bottom: 1px solid var(--pf-table-border);\n  color: var(--pf-table-text);\n  display: table-cell;\n  font-size: var(--font-size-sm);\n  line-height: 1.4;\n  padding: var(--pf-table-cell-padding-block, 14px) var(--space-3);\n  vertical-align: middle;\n}\n\n:host([hidden]) {\n  display: none;\n}\n\n@media (--md) {\n  :host {\n    padding-inline: var(--space-4);\n  }\n}\n\n:host([head]) {\n  background: var(--pf-table-bg-subtle);\n  color: var(--pf-table-text-muted);\n  font-weight: var(--font-weight-semibold);\n  /*\n   * Read from the table rather than told: `sticky` only when the table asked\n   * for a sticky header, `static` otherwise.\n   */\n  position: var(--pf-table-head-position, static);\n  top: 0;\n  z-index: 1;\n}\n\n/* The table's own border is the rule under the last row. */\n:host([last]) {\n  border-bottom: 0;\n}\n\n:host([align='left']) {\n  text-align: start;\n}\n\n:host([align='center']) {\n  text-align: center;\n}\n\n:host([align='right']) {\n  text-align: end;\n}\n\n.sort {\n  align-items: center;\n  background: transparent;\n  border: 0;\n  color: inherit;\n  cursor: pointer;\n  display: inline-flex;\n  font: inherit;\n  gap: var(--space-2);\n  /* Follows the cell's own alignment rather than fighting it. */\n  justify-content: inherit;\n  padding: 0;\n  width: 100%;\n}\n\n.sort:hover,\n.sort:focus-visible {\n  color: var(--pf-table-text);\n  outline: none;\n}\n\n.indicator {\n  display: inline-flex;\n  font-size: var(--font-size-2xs);\n  line-height: 1;\n  opacity: 0.7;\n}\n","import { Component, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\n\nexport type PfTableCellAlign = 'left' | 'center' | 'right';\n\n/**\n * One cell of a `pf-table` row.\n *\n * A header cell carries `columnheader` rather than `cell`, which the row tells\n * it; `sortable` turns the label into a button that asks the table to sort.\n * The table answers by writing `sort` back, which is what `aria-sort` and the\n * indicator read — the ask and the answer kept apart, as everywhere else here.\n *\n * @slot - the cell's content.\n * @part sort - the header's sort button, when `sortable` is set.\n * @part indicator - the sort indicator inside that button.\n */\n@Component({\n  tag: 'pf-table-cell',\n  styleUrl: 'pf-table-cell.css',\n  shadow: true,\n})\nexport class PfTableCell {\n  /** Set by the row: a header cell. Reflected, so the stylesheet reads it. */\n  @Prop({ mutable: true, reflect: true }) head = false;\n\n  /** Set by the row: a cell in the last body row, which drops its rule. */\n  @Prop({ mutable: true, reflect: true }) last = false;\n\n  /** Which way the content sits. Reflected for the stylesheet. */\n  @Prop({ reflect: true }) align: PfTableCellAlign = 'left';\n\n  /** A column width, as any CSS length. Only a header cell's is read. */\n  @Prop() width?: string;\n\n  /**\n   * Identifies the column in the table's sort state. A header cell with one\n   * and `sortable` set is the only thing that can be sorted on.\n   *\n   * Reflected because the generated bindings set props as properties, so\n   * without it a consumer selecting `pf-table-cell[sort-key=\"...\"]` finds\n   * nothing. The table reads the property.\n   */\n  @Prop({ reflect: true }) sortKey?: string;\n\n  /** Offer to sort on this column. Reflected for the stylesheet. */\n  @Prop({ reflect: true }) sortable = false;\n\n  /** Set by the table: how this column is sorted, if it is. */\n  @Prop({ mutable: true }) sort: 'ascending' | 'descending' | 'none' = 'none';\n\n  /** Asks the table to sort on this column. The table decides which way. */\n  @Event() pfTableSort!: EventEmitter<{ key: string }>;\n\n  private onSort = () => {\n    if (!this.sortKey) return;\n    this.pfTableSort.emit({ key: this.sortKey });\n  };\n\n  render() {\n    const sortable = this.head && this.sortable && Boolean(this.sortKey);\n\n    return (\n      <Host\n        role={this.head ? 'columnheader' : 'cell'}\n        aria-sort={sortable ? this.sort : null}\n        style={this.width ? { width: this.width } : undefined}\n      >\n        {sortable ? (\n          <button type=\"button\" class=\"sort\" part=\"sort\" onClick={this.onSort}>\n            <span class=\"label\">\n              <slot />\n            </span>\n            {/* Decorative: `aria-sort` on the header is what is announced. */}\n            <span class=\"indicator\" part=\"indicator\" aria-hidden=\"true\">\n              {this.sort === 'ascending' ? '^' : this.sort === 'descending' ? 'v' : '-'}\n            </span>\n          </button>\n        ) : (\n          <slot />\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAiB,IAAM,6+B,MCqBhBC,EAAW,M,gEAEkBC,KAAO,MAGPC,KAAO,MAGtBC,MAA0B,OAG3CC,MAUiBC,QAGAC,SAAW,MAGXC,KAA4C,OAG5DC,YAEDC,OAAS,KACf,IAAKC,KAAKL,QAAS,OACnBK,KAAKF,YAAYG,KAAK,CAAEC,IAAKF,KAAKL,SAAU,EAG9C,MAAAQ,GACE,MAAMP,EAAWI,KAAKT,MAAQS,KAAKJ,UAAYQ,QAAQJ,KAAKL,SAE5D,OACEU,EAACC,EAAI,CAAAJ,IAAA,2CACHK,KAAMP,KAAKT,KAAO,eAAiB,OAAM,YAC9BK,EAAWI,KAAKH,KAAO,KAClCW,MAAOR,KAAKN,MAAQ,CAAEA,MAAOM,KAAKN,OAAUe,WAE3Cb,EACCS,EAAA,UAAQK,KAAK,SAASC,MAAM,OAAOC,KAAK,OAAOC,QAASb,KAAKD,QAC3DM,EAAA,QAAMM,MAAM,SACVN,EAAA,cAGFA,EAAA,QAAMM,MAAM,YAAYC,KAAK,YAAW,cAAa,QAClDZ,KAAKH,OAAS,YAAc,IAAMG,KAAKH,OAAS,aAAe,IAAM,MAI1EQ,EAAA,a","ignoreList":[]}

package/dist/pitchfork/p-4e7c51e4.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as t,a,h as s,H as i}from"./p-Bm6UxEit.js";import{o as n,p as o}from"./p-CC7AyfOt.js";import{K as r}from"./p-g4FlTDZx.js";const p=()=>`:host{display:inline-flex}:host([hidden]){display:none}.panel{inset:auto;margin:0;background:var(--pf-popover-bg);border:1px solid var(--pf-popover-border);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);color:var(--pf-popover-text);max-width:min(320px, calc(100vw - 2 * var(--space-4)));padding:var(--space-3);width:max-content}.panel:focus-visible{outline:none}.panel:popover-open{animation:pf-popover-in var(--duration-fast) var(--easing-decelerate)}@keyframes pf-popover-in{from{opacity:0;transform:translateY(-4px)}}@media (prefers-reduced-motion: reduce){.panel:popover-open{animation:none}}`;const h=class{constructor(a){e(this,a);this.pfOpenChange=t(this,"pfOpenChange")}get el(){return a(this)}open=false;align="start";label;dismissable=true;pfOpenChange;stopObserving;componentDidLoad(){this.syncTrigger();if(this.open)this.showPanel()}disconnectedCallback(){this.stopObserving?.()}async show(){this.open=true}async hide(){this.open=false}syncOpen(e,t){if(e)this.showPanel();else this.hidePanel();this.syncTrigger();if(e!==t)this.pfOpenChange.emit({open:e})}get panel(){return this.el.shadowRoot?.querySelector('[part="panel"]')??null}get trigger(){return this.el.firstElementChild}syncTrigger(){const e=this.trigger;if(!e)return;e.setAttribute("aria-haspopup","dialog");e.setAttribute("aria-expanded",this.open?"true":"false")}showPanel(){const e=this.panel;if(!e||e.matches(":popover-open"))return;e.showPopover();this.stopObserving?.();this.stopObserving=n({getAnchor:()=>this.trigger,getFloating:()=>e,align:this.align,matchAnchorWidth:false,flip:true,onChange:({left:t,top:a})=>o(e,t,a)});e.focus()}hidePanel(){this.stopObserving?.();this.stopObserving=undefined;const e=this.panel;if(e?.matches(":popover-open"))e.hidePopover()}handleClick(e){const t=this.trigger;if(!t||!e.composedPath().includes(t))return;this.open=!this.open}handleKeyDown(e){if(e.key!==r.Escape||this.dismissable||!this.open)return;e.stopPropagation();this.open=false}onToggle=e=>{const t=e.newState==="open";if(t!==this.open)this.open=t};render(){return s(i,{key:"df31f83d35301ca9e0cee9952b990ed09d9bb1a3"},s("slot",{key:"a302c69a56ff5e286b5d78b7fd17c0592bc5268d",onSlotchange:()=>this.syncTrigger()}),s("div",{key:"e1e7272e02705426eb375e4397cbc8941ccfb995",class:"panel",part:"panel",popover:this.dismissable?"auto":"manual",role:"dialog","aria-label":this.label,tabindex:"-1",onToggle:this.onToggle},s("slot",{key:"56c901b8c16a17dc5725e49c55262e0218262595",name:"content"})))}static get watchers(){return{open:[{syncOpen:0}]}}};h.style=p();export{h as pf_popover};
+//# sourceMappingURL=p-4e7c51e4.entry.js.map

package/dist/pitchfork/p-4e7c51e4.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["pfPopoverCss","PfPopover","open","align","label","dismissable","pfOpenChange","stopObserving","componentDidLoad","this","syncTrigger","showPanel","disconnectedCallback","show","hide","syncOpen","next","previous","hidePanel","emit","panel","el","shadowRoot","querySelector","trigger","firstElementChild","setAttribute","matches","showPopover","observeAnchoredPosition","getAnchor","getFloating","matchAnchorWidth","flip","onChange","left","top","placePopover","focus","undefined","hidePopover","handleClick","event","composedPath","includes","handleKeyDown","key","Keys","Escape","stopPropagation","onToggle","newState","render","h","Host","onSlotchange","class","part","popover","role","tabindex","name"],"sources":["src/components/pf-popover/pf-popover.css?tag=pf-popover&encapsulation=shadow","src/components/pf-popover/pf-popover.tsx"],"sourcesContent":[":host {\n  display: inline-flex;\n}\n\n:host([hidden]) {\n  display: none;\n}\n\n/*\n * `inset: auto` and `margin: 0` are essential, not tidying -- see\n * `src/place-popover.ts`, which sets the same two inline and explains the\n * measurement. They are declared in both places deliberately: here so the\n * cascade carries them for the whole life of the panel, and inline so a panel\n * is still positioned where this stylesheet has not been applied.\n */\n.panel {\n  inset: auto;\n  margin: 0;\n  background: var(--pf-popover-bg);\n  border: 1px solid var(--pf-popover-border);\n  border-radius: var(--radius-md);\n  box-shadow: var(--shadow-lg);\n  color: var(--pf-popover-text);\n  max-width: min(320px, calc(100vw - 2 * var(--space-4)));\n  padding: var(--space-3);\n  width: max-content;\n}\n\n.panel:focus-visible {\n  outline: none;\n}\n\n.panel:popover-open {\n  animation: pf-popover-in var(--duration-fast) var(--easing-decelerate);\n}\n\n/* Its own copy: @keyframes do not cross a shadow boundary. */\n@keyframes pf-popover-in {\n  from {\n    opacity: 0;\n    transform: translateY(-4px);\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .panel:popover-open {\n    animation: none;\n  }\n}\n","import { Keys, observeAnchoredPosition } from '@pitchfork-ui/core';\n\nimport { placePopover } from '../../place-popover';\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Listen,\n  Method,\n  Prop,\n  Watch,\n} from '@stencil/core';\n\n/**\n * An interactive panel anchored to its trigger.\n *\n * `popover=\"auto\"` rather than `manual`, because the browser then does\n * light-dismiss and Escape itself — measured from inside a shadow root with\n * trusted input: a real outside click and a real Escape both close an `auto`\n * popover while a `manual` one stays open. That is less code than\n * `onOutsideInteraction` and it composes with the top-layer stack, so a\n * popover inside a popover closes in the right order.\n *\n * @slot - the trigger.\n * @slot content - the panel's content.\n * @part panel - the floating panel.\n */\n@Component({\n  tag: 'pf-popover',\n  styleUrl: 'pf-popover.css',\n  shadow: true,\n})\nexport class PfPopover {\n  @Element() el!: HTMLElement;\n\n  /** Whether the panel is showing. Reflected so the stylesheet can select on it. */\n  @Prop({ mutable: true, reflect: true }) open = false;\n\n  /** Which edge of the trigger the panel lines up with. */\n  @Prop() align: 'start' | 'end' = 'start';\n\n  /** Accessible name for the panel, which is a dialog. */\n  @Prop() label?: string;\n\n  /**\n   * Close on an outside click or Escape. Defaults to true.\n   *\n   * This is the `auto`/`manual` popover switch: turning it off hands the\n   * consumer responsibility for closing, which is what a popover holding an\n   * unfinished form wants.\n   */\n  @Prop() dismissable = true;\n\n  /** Fires whenever the panel opens or closes, whoever caused it. */\n  @Event() pfOpenChange!: EventEmitter<{ open: boolean }>;\n\n  private stopObserving?: () => void;\n\n  componentDidLoad() {\n    this.syncTrigger();\n    if (this.open) this.showPanel();\n  }\n\n  disconnectedCallback() {\n    this.stopObserving?.();\n  }\n\n  /** Opens the panel. */\n  @Method()\n  async show(): Promise<void> {\n    this.open = true;\n  }\n\n  /** Closes the panel. */\n  @Method()\n  async hide(): Promise<void> {\n    this.open = false;\n  }\n\n  /**\n   * The one place a state change is announced, whatever caused it: a trigger\n   * click, `show()`/`hide()`, a consumer writing the prop, or the browser's own\n   * light-dismiss mirrored in below.\n   *\n   * Emitting from the `toggle` handler instead looked right and fired for none\n   * of the user-driven paths — by the time `toggle` arrives the click handler\n   * has already moved `open`, so the guard there saw no change. A consumer\n   * mirroring this value back sets `open` to what it already is, which Stencil\n   * does not treat as a change, so there is no loop.\n   */\n  @Watch('open')\n  syncOpen(next: boolean, previous: boolean) {\n    if (next) this.showPanel();\n    else this.hidePanel();\n    this.syncTrigger();\n    if (next !== previous) this.pfOpenChange.emit({ open: next });\n  }\n\n  private get panel() {\n    return this.el.shadowRoot?.querySelector<HTMLElement>('[part=\"panel\"]') ?? null;\n  }\n\n  private get trigger() {\n    return this.el.firstElementChild as HTMLElement | null;\n  }\n\n  /**\n   * The trigger's disclosure state.\n   *\n   * `aria-controls` is deliberately absent: it is an IDREF, and an IDREF does\n   * not cross a shadow boundary, so pointing it at the panel's id would leave\n   * a dangling reference — worse than none. `aria-expanded` and\n   * `aria-haspopup` carry what a screen reader announces here.\n   */\n  private syncTrigger() {\n    const trigger = this.trigger;\n    if (!trigger) return;\n    trigger.setAttribute('aria-haspopup', 'dialog');\n    trigger.setAttribute('aria-expanded', this.open ? 'true' : 'false');\n  }\n\n  private showPanel() {\n    const panel = this.panel;\n    if (!panel || panel.matches(':popover-open')) return;\n\n    panel.showPopover();\n    this.stopObserving?.();\n    this.stopObserving = observeAnchoredPosition({\n      getAnchor: () => this.trigger,\n      getFloating: () => panel,\n      align: this.align,\n      // A popover sizes to its own content rather than to the trigger, and\n      // flips above when there is no room below.\n      matchAnchorWidth: false,\n      flip: true,\n      onChange: ({ left, top }) => placePopover(panel, left, top),\n    });\n\n    // The panel is a dialog, so focus belongs inside it once it is showing.\n    panel.focus();\n  }\n\n  private hidePanel() {\n    this.stopObserving?.();\n    this.stopObserving = undefined;\n    const panel = this.panel;\n    if (panel?.matches(':popover-open')) panel.hidePopover();\n  }\n\n  @Listen('click')\n  handleClick(event: MouseEvent) {\n    const trigger = this.trigger;\n    // Only the trigger toggles. A click inside the panel is the content's.\n    if (!trigger || !event.composedPath().includes(trigger)) return;\n    this.open = !this.open;\n  }\n\n  /**\n   * Escape for the `manual` case only. An `auto` popover is dismissed by the\n   * browser, and handling it here as well would fight that.\n   */\n  @Listen('keydown')\n  handleKeyDown(event: KeyboardEvent) {\n    if (event.key !== Keys.Escape || this.dismissable || !this.open) return;\n    event.stopPropagation();\n    this.open = false;\n  }\n\n  /**\n   * Mirrors a change the browser made — light-dismiss, or being closed because\n   * another popover took the top layer — back into `open`, which then announces\n   * it through the watch above. Without this a consumer's `open` goes stale\n   * after a dismiss they did not initiate.\n   */\n  private onToggle = (event: Event) => {\n    const next = (event as ToggleEvent).newState === 'open';\n    if (next !== this.open) this.open = next;\n  };\n\n  render() {\n    return (\n      <Host>\n        <slot onSlotchange={() => this.syncTrigger()} />\n        <div\n          class=\"panel\"\n          part=\"panel\"\n          popover={this.dismissable ? 'auto' : 'manual'}\n          role=\"dialog\"\n          aria-label={this.label}\n          tabindex=\"-1\"\n          onToggle={this.onToggle}\n        >\n          <slot name=\"content\" />\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"0IAAA,MAAMA,EAAe,IAAM,mmB,MCmCdC,EAAS,M,0FAIoBC,KAAO,MAGvCC,MAAyB,QAGzBC,MASAC,YAAc,KAGbC,aAEDC,cAER,gBAAAC,GACEC,KAAKC,cACL,GAAID,KAAKP,KAAMO,KAAKE,W,CAGtB,oBAAAC,GACEH,KAAKF,iB,CAKP,UAAMM,GACJJ,KAAKP,KAAO,I,CAKd,UAAMY,GACJL,KAAKP,KAAO,K,CAed,QAAAa,CAASC,EAAeC,GACtB,GAAID,EAAMP,KAAKE,iBACVF,KAAKS,YACVT,KAAKC,cACL,GAAIM,IAASC,EAAUR,KAAKH,aAAaa,KAAK,CAAEjB,KAAMc,G,CAGxD,SAAYI,GACV,OAAOX,KAAKY,GAAGC,YAAYC,cAA2B,mBAAqB,I,CAG7E,WAAYC,GACV,OAAOf,KAAKY,GAAGI,iB,CAWT,WAAAf,GACN,MAAMc,EAAUf,KAAKe,QACrB,IAAKA,EAAS,OACdA,EAAQE,aAAa,gBAAiB,UACtCF,EAAQE,aAAa,gBAAiBjB,KAAKP,KAAO,OAAS,Q,CAGrD,SAAAS,GACN,MAAMS,EAAQX,KAAKW,MACnB,IAAKA,GAASA,EAAMO,QAAQ,iBAAkB,OAE9CP,EAAMQ,cACNnB,KAAKF,kBACLE,KAAKF,cAAgBsB,EAAwB,CAC3CC,UAAW,IAAMrB,KAAKe,QACtBO,YAAa,IAAMX,EACnBjB,MAAOM,KAAKN,MAGZ6B,iBAAkB,MAClBC,KAAM,KACNC,SAAU,EAAGC,OAAMC,SAAUC,EAAajB,EAAOe,EAAMC,KAIzDhB,EAAMkB,O,CAGA,SAAApB,GACNT,KAAKF,kBACLE,KAAKF,cAAgBgC,UACrB,MAAMnB,EAAQX,KAAKW,MACnB,GAAIA,GAAOO,QAAQ,iBAAkBP,EAAMoB,a,CAI7C,WAAAC,CAAYC,GACV,MAAMlB,EAAUf,KAAKe,QAErB,IAAKA,IAAYkB,EAAMC,eAAeC,SAASpB,GAAU,OACzDf,KAAKP,MAAQO,KAAKP,I,CAQpB,aAAA2C,CAAcH,GACZ,GAAIA,EAAMI,MAAQC,EAAKC,QAAUvC,KAAKJ,cAAgBI,KAAKP,KAAM,OACjEwC,EAAMO,kBACNxC,KAAKP,KAAO,K,CASNgD,SAAYR,IAClB,MAAM1B,EAAQ0B,EAAsBS,WAAa,OACjD,GAAInC,IAASP,KAAKP,KAAMO,KAAKP,KAAOc,CAAI,EAG1C,MAAAoC,GACE,OACEC,EAACC,EAAI,CAAAR,IAAA,4CACHO,EAAA,QAAAP,IAAA,2CAAMS,aAAc,IAAM9C,KAAKC,gBAC/B2C,EAAA,OAAAP,IAAA,2CACEU,MAAM,QACNC,KAAK,QACLC,QAASjD,KAAKJ,YAAc,OAAS,SACrCsD,KAAK,SAAQ,aACDlD,KAAKL,MACjBwD,SAAS,KACTV,SAAUzC,KAAKyC,UAEfG,EAAA,QAAAP,IAAA,2CAAMe,KAAK,a","ignoreList":[]}

package/dist/pitchfork/p-50ad12be.entry.js

@@ -0,0 +1,2 @@
+import{r as i,h as e,H as r}from"./p-Bm6UxEit.js";const n=()=>`@keyframes pf-spin{to{transform:rotate(360deg)}}:host{animation:pf-spin 0.8s linear infinite;border:3px solid color-mix(in srgb, var(--pf-loading-border) 75%, transparent);border-radius:50%;border-top-color:var(--pf-loading-accent);display:inline-block;flex:0 0 auto;height:var(--pf-spinner-size, 24px);min-height:12px;min-width:12px;width:var(--pf-spinner-size, 24px)}:host([hidden]){display:none}.sr-only{border:0;clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}@media (prefers-reduced-motion: reduce){:host{animation-duration:0.01ms;animation-iteration-count:1}}`;const a=class{constructor(e){i(this,e)}size=24;label="Loading";render(){return e(r,{key:"34cbe91125995cfa2cca9f4d988214ec9984f860",role:"status","aria-label":this.label,style:{"--pf-spinner-size":`${this.size}px`}},e("span",{key:"d5d50df4e6ec207337f1a418d39724d5c62314af",class:"sr-only",part:"label"},this.label))}};a.style=n();export{a as pf_loading_spinner};
+//# sourceMappingURL=p-50ad12be.entry.js.map

package/dist/pitchfork/p-50ad12be.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["pfLoadingSpinnerCss","PfLoadingSpinner","size","label","render","h","Host","key","role","this","style","class","part"],"sources":["src/components/pf-loading-spinner/pf-loading-spinner.css?tag=pf-loading-spinner&encapsulation=shadow","src/components/pf-loading-spinner/pf-loading-spinner.tsx"],"sourcesContent":["/*\n * `@keyframes` do not cross a shadow boundary. In the React library pf-spin is\n * declared once in LoadingIndicators.css and every component picks it up from\n * the global sheet; here each shadow root needs its own copy.\n */\n@keyframes pf-spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n:host {\n  animation: pf-spin 0.8s linear infinite;\n  border: 3px solid color-mix(in srgb, var(--pf-loading-border) 75%, transparent);\n  border-radius: 50%;\n  border-top-color: var(--pf-loading-accent);\n  display: inline-block;\n  flex: 0 0 auto;\n  height: var(--pf-spinner-size, 24px);\n  min-height: 12px;\n  min-width: 12px;\n  width: var(--pf-spinner-size, 24px);\n}\n\n:host([hidden]) {\n  display: none;\n}\n\n/*\n * The React library reaches a global `.pf-sr-only` for this. A shadow root\n * cannot, so each of these elements declares its own copy.\n */\n.sr-only {\n  border: 0;\n  clip: rect(0 0 0 0);\n  clip-path: inset(50%);\n  height: 1px;\n  margin: -1px;\n  overflow: hidden;\n  padding: 0;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n}\n\n@media (prefers-reduced-motion: reduce) {\n  :host {\n    animation-duration: 0.01ms;\n    animation-iteration-count: 1;\n  }\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n/**\n * An indeterminate spinner.\n *\n * @part label - the visually hidden text the live region announces.\n */\n@Component({\n  tag: 'pf-loading-spinner',\n  styleUrl: 'pf-loading-spinner.css',\n  shadow: true,\n})\nexport class PfLoadingSpinner {\n  /** Diameter in pixels. */\n  @Prop() size = 24;\n\n  /** Accessible name, announced by the live region. */\n  @Prop() label = 'Loading';\n\n  render() {\n    /*\n     * `role` and `aria-label` go on the host so the element is the live region,\n     * and the hidden text gives that region something to announce — an empty\n     * live region named only by `aria-label` is not reliably read out. The\n     * React component carries both for the same reason.\n     */\n    return (\n      <Host role=\"status\" aria-label={this.label} style={{ '--pf-spinner-size': `${this.size}px` }}>\n        <span class=\"sr-only\" part=\"label\">\n          {this.label}\n        </span>\n      </Host>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAsB,IAAM,gpB,MCYrBC,EAAgB,M,yBAEnBC,KAAO,GAGPC,MAAQ,UAEhB,MAAAC,GAOE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,KAAK,SAAQ,aAAaC,KAAKN,MAAOO,MAAO,CAAE,oBAAqB,GAAGD,KAAKP,WAChFG,EAAA,QAAAE,IAAA,2CAAMI,MAAM,UAAUC,KAAK,SACxBH,KAAKN,O","ignoreList":[]}

package/dist/pitchfork/p-51353d53.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as e,a as i,h as s,H as r}from"./p-Bm6UxEit.js";import{o as a,p as o}from"./p-CC7AyfOt.js";import{c as n}from"./p-DfpCerXM.js";import{i as l,K as c}from"./p-g4FlTDZx.js";import{g as h,r as d}from"./p-CAz7-p8y.js";import{a as p}from"./p-Cr6IXrUk.js";import{c as f}from"./p-Cy_kHPeC.js";var u=500;function b(t){return t.length===1&&t!==" "}function v(t,e){if(!b(e))return t;return t+e.toLowerCase()}function g(t){return t.length>0&&[...t].every((e=>e===t[0]))}function m(t,e,i=-1,s=()=>false){if(!e||t.length===0)return-1;const r=g(e);const a=r?e[0]:e;const o=i<0?0:r?i+1:i;for(let e=0;e<t.length;e+=1){const i=(o+e)%t.length;if(s(i))continue;if(t[i]?.trim().toLowerCase().startsWith(a))return i}return-1}const y=()=>`:host{display:block;--pf-option-text:var(--pf-select-input-text, var(--pf-input-text));--pf-option-text-disabled:var(--pf-select-input-placeholder, var(--pf-input-placeholder));--pf-option-active-bg:var(--pf-select-option-active-bg);--pf-option-active-text:var(--pf-select-option-active-text)}:host([hidden]){display:none}.field{display:grid;gap:var(--space-1)}.label{color:var(--pf-input-label-text, var(--pf-input-text));font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.required{color:var(--pf-select-invalid-border);margin-inline-start:var(--space-1)}.trigger{align-items:center;background:var(--pf-input-bg);border:1px solid var(--pf-input-border);border-radius:var(--radius-md);color:var(--pf-input-text);cursor:pointer;display:flex;font-family:inherit;font-size:var(--font-size-sm);gap:var(--space-2);justify-content:space-between;padding:var(--space-2) var(--space-3);text-align:start;width:100%}.trigger:hover:not(:disabled){border-color:var(--pf-input-border-hover)}.trigger:focus-visible{border-color:var(--pf-select-focus-border);box-shadow:var(--pf-focus-ring);outline:none}.trigger:disabled{cursor:not-allowed;opacity:0.6}.trigger--invalid{border-color:var(--pf-select-invalid-border)}.value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.value--placeholder{color:var(--pf-input-placeholder)}.chevron{align-items:center;display:inline-flex;flex-shrink:0;transition:transform var(--pf-transition-fast)}:host([open]) .chevron{transform:rotate(180deg)}@media (prefers-reduced-motion: reduce){.chevron{transition:none}}.listbox{inset:auto;margin:0;background:var(--pf-select-menu-bg);border:1px solid var(--pf-select-menu-border);border-radius:var(--radius-md);box-shadow:var(--pf-elevation-popover-shadow);padding:var(--space-1)}.listbox:popover-open{animation:pf-select-in var(--pf-transition-enter)}@keyframes pf-select-in{from{opacity:0;transform:translateY(-4px)}}@media (prefers-reduced-motion: reduce){.listbox:popover-open{animation:none}}`;const x={[c.ArrowDown]:"next",[c.ArrowUp]:"previous",[c.Home]:"first",[c.End]:"last"};const k=class{constructor(i){t(this,i);this.pfChange=e(this,"pfChange");this.pfOpenChange=e(this,"pfOpenChange");if(i.$hostElement$["s-ei"]){this.internals=i.$hostElement$["s-ei"]}else{this.internals=i.$hostElement$.attachInternals();i.$hostElement$["s-ei"]=this.internals}}get el(){return i(this)}internals;name;value="";open=false;label;description;error;placeholder="Select an option";required=false;disabled=false;maxVisibleOptions;pfChange;pfOpenChange;selectedLabel="";initialValue="";stopObserving;activeOption=null;typeahead="";typeaheadTimer;componentWillLoad(){this.initialValue=this.value??"";this.syncFormState();this.syncOptions()}componentDidRender(){this.syncActiveDescendant()}disconnectedCallback(){this.stopObserving?.();if(this.typeaheadTimer)clearTimeout(this.typeaheadTimer)}syncFormState(){this.internals.setFormValue(this.value||null);p(this.internals,Boolean(this.value),this.required,this.error)}syncOptions(){const t=this.options();let e="";for(const i of t){const t=this.optionValue(i)===this.value&&this.value!=="";i.selected=t;if(t)e=i.textContent?.trim()??""}this.selectedLabel=e}syncOpen(t,e){if(t)this.showListbox();else this.hideListbox();if(t!==e)this.pfOpenChange.emit({open:t})}async show(){if(!this.disabled)this.open=true}async hide(){this.open=false}async checkValidity(){return this.internals.checkValidity()}async reportValidity(){return this.internals.reportValidity()}async getValidationMessage(){return this.internals.validationMessage}formResetCallback(){this.value=this.initialValue}onSlotChange=()=>{this.syncOptions()};async refresh(){this.syncOptions()}options(){return Array.from(this.el.querySelectorAll("pf-option"))}enabled(){return this.options().filter((t=>!t.hasAttribute("disabled")))}optionValue(t){return t.value??t.getAttribute("value")??""}get listbox(){return this.el.shadowRoot?.querySelector('[part="listbox"]')??null}get trigger(){return this.el.shadowRoot?.querySelector('[part="trigger"]')??null}showListbox(){const t=this.listbox;if(this.disabled||!t||t.matches(":popover-open"))return;t.showPopover();this.stopObserving?.();this.stopObserving=a({getAnchor:()=>this.trigger,getFloating:()=>t,matchAnchorWidth:true,flip:true,onChange:({left:e,top:i,width:s,minWidth:r})=>{o(t,e,i);if(s!==undefined)t.style.width=`${s}px`;if(r!==undefined)t.style.minWidth=`${r}px`}});const e=this.options();const i=e.find((t=>this.optionValue(t)===this.value));this.setActive(i&&!i.hasAttribute("disabled")?i:this.enabled()[0]??null)}hideListbox(){this.stopObserving?.();this.stopObserving=undefined;this.clearTypeahead();const t=this.listbox;if(t?.matches(":popover-open"))t.hidePopover()}onToggle=t=>{const e=t.newState==="open";if(this.open!==e)this.open=e;if(!e)this.trigger?.focus()};setActive(t){for(const e of this.options()){if(e!==t)e.active=false}if(t)t.active=true;this.activeOption=t;this.syncActiveDescendant();if(t&&typeof t.scrollIntoView==="function"){t.scrollIntoView({block:"nearest"})}}syncActiveDescendant(){const t=this.trigger;if(!t||!("ariaActiveDescendantElement"in t))return;t.ariaActiveDescendantElement=this.open?this.activeOption:null}commit(t){if(t.hasAttribute("disabled"))return;const e=this.optionValue(t);this.open=false;this.trigger?.focus();if(e===this.value)return;this.value=e;this.pfChange.emit({value:e})}handleOptionSelect(t){t.stopPropagation();if(this.disabled)return;const e=this.options().find((e=>this.optionValue(e)===t.detail.value));if(e)this.commit(e)}move(t){const e=this.options();const i=h(e,(t=>t.hasAttribute("disabled")));const s=this.activeOption?e.indexOf(this.activeOption):-1;const r=d(t,i,s);if(r!==-1)this.setActive(e[r]??null)}clearTypeahead(){if(this.typeaheadTimer)clearTimeout(this.typeaheadTimer);this.typeaheadTimer=undefined;this.typeahead=""}handleTypeahead(t){this.typeahead=v(this.typeahead,t);if(this.typeaheadTimer)clearTimeout(this.typeaheadTimer);this.typeaheadTimer=setTimeout((()=>this.clearTypeahead()),u);const e=this.options();const i=e.map((t=>t.textContent??""));const s=this.activeOption?e.indexOf(this.activeOption):-1;const r=m(i,this.typeahead,s,(t=>e[t].hasAttribute("disabled")));if(r===-1)return;if(this.open)this.setActive(e[r]);else this.commit(e[r])}handleKeyDown(t){if(this.disabled||t.defaultPrevented)return;const e=x[t.key];if(e){t.preventDefault();if(!this.open)this.open=true;else this.move(e);return}if(l(t.key)){t.preventDefault();if(!this.open){this.open=true}else if(this.activeOption){this.commit(this.activeOption)}return}if(b(t.key)){t.preventDefault();this.handleTypeahead(t.key)}}render(){const t=n(this.description&&"description",this.error&&"error");return s(r,{key:"ccb96054293516751523dc6b89d3fd3bb3e08902"},s("div",{key:"65d6ca23015f8371f02715f1b3cf862122c94932",class:"field",part:"field"},this.label&&s("label",{key:"580a891de1e1c60481a494ab5f915e0c8528d511",class:"label",part:"label",htmlFor:"trigger"},this.label,this.required&&s("span",{key:"dd0e347bcfafdca6eba7dc06f596215b47331e8f",class:"required","aria-hidden":"true"},"*")),s("button",{key:"7c6b543a99a06b9d18a6339e0aa3c6ad3d2eb260",id:"trigger","aria-label":f(this.el,this.label),part:"trigger",class:{trigger:true,"trigger--invalid":Boolean(this.error)},type:"button",role:"combobox",disabled:this.disabled,"aria-haspopup":"listbox","aria-expanded":this.open?"true":"false","aria-controls":"listbox","aria-invalid":this.error?"true":null,"aria-required":this.required?"true":null,"aria-describedby":t,onClick:()=>{if(!this.disabled)this.open=!this.open}},s("span",{key:"032fb5d8de622dde393a5100ce69d08944916bb9",class:{value:true,"value--placeholder":!this.selectedLabel}},this.selectedLabel||this.placeholder),s("span",{key:"eae5f550a6b4f16a27a044220db57236aebd31b8",class:"chevron","aria-hidden":"true"},s("pf-icon",{key:"7983ac569e121be6a98822cdbec4c46ae43dc99e",name:"chevron-down"}))),this.description&&s("p",{key:"c27fc89569900855af8966fcec3246f7f12c1d20",class:"description",part:"description",id:"description"},this.description),this.error&&s("p",{key:"6d805181ffb58622ed41e688195bdf58511e7efa",class:"error",part:"error",id:"error"},this.error)),s("div",{key:"2dbc1adeaf68449ffaf32fc07d694d4c66860e90",id:"listbox",part:"listbox",class:"listbox",popover:"auto",role:"listbox","aria-label":this.label??this.placeholder,style:this.maxVisibleOptions?{maxHeight:`calc(${this.maxVisibleOptions} * 36px)`,overflowY:"auto"}:undefined,onToggle:this.onToggle},s("slot",{key:"02373173990a5e9ecad005b21f1a4b11d2cef032",onSlotchange:this.onSlotChange})))}static get formAssociated(){return true}static get watchers(){return{value:[{syncFormState:0},{syncOptions:0}],error:[{syncFormState:0}],required:[{syncFormState:0}],open:[{syncOpen:0}]}}};k.style=y();export{k as pf_select};
+//# sourceMappingURL=p-51353d53.entry.js.map

package/dist/pitchfork/p-51353d53.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["TYPEAHEAD_TIMEOUT_MS","isTypeaheadKey","key","length","nextTypeaheadBuffer","buffer","toLowerCase","isCycling","every","char","findTypeaheadMatch","labels","fromIndex","isDisabled","cycling","needle","start","step","index","trim","startsWith","pfSelectCss","MOVES","Keys","ArrowDown","ArrowUp","Home","End","PfSelect","internals","name","value","open","label","description","error","placeholder","required","disabled","maxVisibleOptions","pfChange","pfOpenChange","selectedLabel","initialValue","stopObserving","activeOption","typeahead","typeaheadTimer","componentWillLoad","this","syncFormState","syncOptions","componentDidRender","syncActiveDescendant","disconnectedCallback","clearTimeout","setFormValue","applyControlValidity","Boolean","options","option","selected","optionValue","textContent","syncOpen","next","previous","showListbox","hideListbox","emit","show","hide","checkValidity","reportValidity","getValidationMessage","validationMessage","formResetCallback","onSlotChange","refresh","Array","from","el","querySelectorAll","enabled","filter","hasAttribute","getAttribute","listbox","shadowRoot","querySelector","trigger","panel","matches","showPopover","observeAnchoredPosition","getAnchor","getFloating","matchAnchorWidth","flip","onChange","left","top","width","minWidth","placePopover","undefined","style","chosen","find","setActive","clearTypeahead","hidePopover","onToggle","event","nowOpen","newState","focus","other","active","scrollIntoView","block","ariaActiveDescendantElement","commit","handleOptionSelect","stopPropagation","candidate","detail","move","action","enabledIndexes","getEnabledIndexes","current","indexOf","resolveListMove","handleTypeahead","setTimeout","map","match","handleKeyDown","defaultPrevented","preventDefault","isActivationKey","render","describedBy","composeDescribedBy","h","Host","class","part","htmlFor","id","controlAriaLabel","type","role","onClick","popover","maxHeight","overflowY","onSlotchange"],"sources":["../core/dist/typeahead.js","src/components/pf-select/pf-select.css?tag=pf-select&encapsulation=shadow","src/components/pf-select/pf-select.tsx"],"sourcesContent":["//#region src/typeahead.ts\n/**\n* Printable-character typeahead for a listbox, menu or tree.\n*\n* The ARIA listbox pattern expects it: typing `b` jumps to the next option\n* beginning with `b`, and typing `br` narrows to `br`. The React `Select` has\n* none of this — `todo.md` has the fix — so the rules live here, where\n* `<pf-select>` and every later `pf-combobox` / `pf-multi-select` /\n* `pf-tree-view` read the same ones.\n*\n* Core owns the matching; the rendering layer owns the buffer and its timer,\n* because a timer is state and core is never a state container.\n*/\n/** How long a quiet gap ends one typeahead word, in milliseconds. */\nvar TYPEAHEAD_TIMEOUT_MS = 500;\n/**\n* Whether a key should go into the buffer at all.\n*\n* One character, so `Enter`, `ArrowDown` and `Escape` are excluded by length\n* rather than by a list that would need keeping up to date. A space is\n* deliberately *not* typeahead: in a listbox it selects.\n*/\nfunction isTypeaheadKey(key) {\n\treturn key.length === 1 && key !== \" \";\n}\n/**\n* The buffer after `key`: lower-cased and appended, nothing more.\n*\n* A repeat is *not* special-cased here. Pressing `b` four times means \"the\n* fourth option starting with b\" rather than \"an option starting with bbbb\",\n* but that is a matching question, so `findTypeaheadMatch` reads it off the\n* buffer's shape instead — which keeps this function a plain append and lets\n* the caller hold one string.\n*/\nfunction nextTypeaheadBuffer(buffer, key) {\n\tif (!isTypeaheadKey(key)) return buffer;\n\treturn buffer + key.toLowerCase();\n}\n/**\n* True when the buffer is one character repeated — including just once.\n*\n* The single-character case is the important one, and requiring two got it\n* wrong: pressing `b` while already on Banana has to move to Blackberry, the\n* way a native `<select>` does, not sit still because Banana also starts with\n* `b`. Found by a browser test on `pf-select`.\n*/\nfunction isCycling(buffer) {\n\treturn buffer.length > 0 && [...buffer].every((char) => char === buffer[0]);\n}\n/**\n* The index of the option the buffer points at, or -1.\n*\n* Searches from `fromIndex` and wraps, so a match behind the current option is\n* still found. Two modes:\n*\n* - **Narrowing** (`br`): the current option is included, because typing more\n*   of the label you are already on should keep you there rather than skip to\n*   the next `br`.\n* - **Cycling** (`b`, `bb`, `bbb`): one character repeated, searched from\n*   *after* the current option — so pressing one letter walks through the\n*   options beginning with it, which is what a native `<select>` does.\n*\n* A disabled option is never matched: the keyboard would land somewhere it\n* cannot act, which is worse than not moving.\n*/\nfunction findTypeaheadMatch(labels, buffer, fromIndex = -1, isDisabled = () => false) {\n\tif (!buffer || labels.length === 0) return -1;\n\tconst cycling = isCycling(buffer);\n\tconst needle = cycling ? buffer[0] : buffer;\n\tconst start = fromIndex < 0 ? 0 : cycling ? fromIndex + 1 : fromIndex;\n\tfor (let step = 0; step < labels.length; step += 1) {\n\t\tconst index = (start + step) % labels.length;\n\t\tif (isDisabled(index)) continue;\n\t\tif (labels[index]?.trim().toLowerCase().startsWith(needle)) return index;\n\t}\n\treturn -1;\n}\n//#endregion\nexport { TYPEAHEAD_TIMEOUT_MS, findTypeaheadMatch, isTypeaheadKey, nextTypeaheadBuffer };\n","/*\n * The generic set pf-option reads, mapped to this control's own family. They\n * inherit through the shadow boundary, so a slotted option is themed by the\n * listbox it sits in without knowing which that is.\n */\n:host {\n  display: block;\n  --pf-option-text: var(--pf-select-input-text, var(--pf-input-text));\n  --pf-option-text-disabled: var(--pf-select-input-placeholder, var(--pf-input-placeholder));\n  --pf-option-active-bg: var(--pf-select-option-active-bg);\n  --pf-option-active-text: var(--pf-select-option-active-text);\n}\n\n:host([hidden]) {\n  display: none;\n}\n\n.field {\n  display: grid;\n  gap: var(--space-1);\n}\n\n.label {\n  color: var(--pf-input-label-text, var(--pf-input-text));\n  font-size: var(--font-size-sm);\n  font-weight: var(--font-weight-medium);\n}\n\n.required {\n  color: var(--pf-select-invalid-border);\n  margin-inline-start: var(--space-1);\n}\n\n.trigger {\n  align-items: center;\n  background: var(--pf-input-bg);\n  border: 1px solid var(--pf-input-border);\n  border-radius: var(--radius-md);\n  color: var(--pf-input-text);\n  cursor: pointer;\n  display: flex;\n  font-family: inherit;\n  font-size: var(--font-size-sm);\n  gap: var(--space-2);\n  justify-content: space-between;\n  padding: var(--space-2) var(--space-3);\n  text-align: start;\n  width: 100%;\n}\n\n.trigger:hover:not(:disabled) {\n  border-color: var(--pf-input-border-hover);\n}\n\n.trigger:focus-visible {\n  border-color: var(--pf-select-focus-border);\n  box-shadow: var(--pf-focus-ring);\n  outline: none;\n}\n\n.trigger:disabled {\n  cursor: not-allowed;\n  opacity: 0.6;\n}\n\n.trigger--invalid {\n  border-color: var(--pf-select-invalid-border);\n}\n\n.value {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.value--placeholder {\n  color: var(--pf-input-placeholder);\n}\n\n.chevron {\n  align-items: center;\n  display: inline-flex;\n  flex-shrink: 0;\n  transition: transform var(--pf-transition-fast);\n}\n\n:host([open]) .chevron {\n  transform: rotate(180deg);\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .chevron {\n    transition: none;\n  }\n}\n\n/*\n * See src/place-popover.ts: `inset: auto; margin: 0` are what make the\n * coordinates mean what they say, since the UA stylesheet centres a popover.\n */\n.listbox {\n  inset: auto;\n  margin: 0;\n  background: var(--pf-select-menu-bg);\n  border: 1px solid var(--pf-select-menu-border);\n  border-radius: var(--radius-md);\n  box-shadow: var(--pf-elevation-popover-shadow);\n  padding: var(--space-1);\n}\n\n.listbox:popover-open {\n  animation: pf-select-in var(--pf-transition-enter);\n}\n\n/* Its own copy: @keyframes do not cross a shadow boundary. */\n@keyframes pf-select-in {\n  from {\n    opacity: 0;\n    transform: translateY(-4px);\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .listbox:popover-open {\n    animation: none;\n  }\n}\n","import {\n  composeDescribedBy,\n  findTypeaheadMatch,\n  getEnabledIndexes,\n  isActivationKey,\n  Keys,\n  nextTypeaheadBuffer,\n  observeAnchoredPosition,\n  resolveListMove,\n  TYPEAHEAD_TIMEOUT_MS,\n  isTypeaheadKey,\n  type ListNavigationAction,\n} from '@pitchfork-ui/core';\n\nimport { applyControlValidity } from '../../form-validity';\nimport { controlAriaLabel } from '../../control-label';\nimport { placePopover } from '../../place-popover';\nimport {\n  AttachInternals,\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Listen,\n  Method,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\n\nconst MOVES: Record<string, ListNavigationAction> = {\n  [Keys.ArrowDown]: 'next',\n  [Keys.ArrowUp]: 'previous',\n  [Keys.Home]: 'first',\n  [Keys.End]: 'last',\n};\n\n/**\n * A form-associated single-choice select over `pf-option` children.\n *\n * The first of Wave 5, and the worked example for §2.1: the options are child\n * elements, so a label is a slot and can hold anything, where the React\n * `Select`'s `options` array can only hold a string.\n *\n * **It has typeahead, which the React component does not.** Typing `b` jumps\n * to the next option beginning with `b`, `br` narrows, and `bbb` cycles — the\n * ARIA listbox pattern, and the matching is core's so a later `pf-combobox`\n * answers the same keystrokes. `todo.md` has the React fix.\n *\n * Form-associated, so the value submits by itself. The React component fakes\n * that with a hidden `<input>` beside the trigger.\n *\n * The active option is set as an *element*, not an IDREF: the trigger is in\n * this shadow root and the options are slotted light DOM, and a cross-root\n * IDREF is absent from the accessibility tree — measured. `aria-controls` does\n * work, because the listbox itself is in this same root.\n *\n * @slot - the `pf-option` children.\n * @part field - the wrapper around label, control and messages.\n * @part label - the label element.\n * @part trigger - the combobox button.\n * @part listbox - the floating listbox the options are slotted into.\n * @part description - the hint text below the control.\n * @part error - the error message below the control.\n */\n@Component({\n  tag: 'pf-select',\n  styleUrl: 'pf-select.css',\n  formAssociated: true,\n  shadow: true,\n})\nexport class PfSelect {\n  @Element() el!: HTMLElement;\n  @AttachInternals() internals!: ElementInternals;\n\n  /** Submitted under this name. Reflected; the submission reads the attribute. */\n  @Prop({ reflect: true }) name?: string;\n\n  /** The chosen option's value, or empty. */\n  @Prop({ mutable: true, reflect: true }) value = '';\n\n  /** Whether the listbox is showing. Reflected for the stylesheet. */\n  @Prop({ mutable: true, reflect: true }) open = false;\n\n  @Prop() label?: string;\n\n  @Prop() description?: string;\n\n  @Prop() error?: string;\n\n  @Prop() placeholder = 'Select an option';\n\n  @Prop({ reflect: true }) required = false;\n\n  @Prop({ reflect: true }) disabled = false;\n\n  /** Options to show before the listbox scrolls. Unset means it fits them all. */\n  @Prop() maxVisibleOptions?: number;\n\n  /** Fires when the chosen value changes. */\n  @Event() pfChange!: EventEmitter<{ value: string }>;\n\n  /** Fires whenever the listbox opens or closes, whoever caused it. */\n  @Event() pfOpenChange!: EventEmitter<{ open: boolean }>;\n\n  /** The label of the chosen option, for the trigger to show. */\n  @State() selectedLabel = '';\n\n  private initialValue = '';\n  private stopObserving?: () => void;\n  private activeOption: HTMLElement | null = null;\n  private typeahead = '';\n  private typeaheadTimer?: ReturnType<typeof setTimeout>;\n\n  componentWillLoad() {\n    this.initialValue = this.value ?? '';\n    this.syncFormState();\n    this.syncOptions();\n  }\n\n  componentDidRender() {\n    this.syncActiveDescendant();\n  }\n\n  disconnectedCallback() {\n    this.stopObserving?.();\n    if (this.typeaheadTimer) clearTimeout(this.typeaheadTimer);\n  }\n\n  @Watch('value')\n  @Watch('error')\n  @Watch('required')\n  syncFormState() {\n    this.internals.setFormValue(this.value || null);\n    applyControlValidity(this.internals, Boolean(this.value), this.required, this.error);\n  }\n\n  /** The value changed, so the children's `selected` and the trigger follow. */\n  @Watch('value')\n  syncOptions() {\n    const options = this.options();\n    let label = '';\n\n    for (const option of options) {\n      const selected = this.optionValue(option) === this.value && this.value !== '';\n      (option as HTMLElement & { selected: boolean }).selected = selected;\n      if (selected) label = option.textContent?.trim() ?? '';\n    }\n\n    this.selectedLabel = label;\n  }\n\n  @Watch('open')\n  syncOpen(next: boolean, previous: boolean) {\n    if (next) this.showListbox();\n    else this.hideListbox();\n    if (next !== previous) this.pfOpenChange.emit({ open: next });\n  }\n\n  @Method()\n  async show(): Promise<void> {\n    if (!this.disabled) this.open = true;\n  }\n\n  @Method()\n  async hide(): Promise<void> {\n    this.open = false;\n  }\n\n  @Method()\n  async checkValidity(): Promise<boolean> {\n    return this.internals.checkValidity();\n  }\n\n  @Method()\n  async reportValidity(): Promise<boolean> {\n    return this.internals.reportValidity();\n  }\n\n  @Method()\n  async getValidationMessage(): Promise<string> {\n    return this.internals.validationMessage;\n  }\n\n  /** A reset restores the value the control started with, not an empty one. */\n  formResetCallback() {\n    this.value = this.initialValue;\n  }\n\n  /** An option added or removed while mounted; re-mark the children. */\n  private onSlotChange = () => {\n    this.syncOptions();\n  };\n\n  /** Re-reads the options, for a label edited in place (which fires no slotchange). */\n  @Method()\n  async refresh(): Promise<void> {\n    this.syncOptions();\n  }\n\n  private options(): HTMLElement[] {\n    return Array.from(this.el.querySelectorAll<HTMLElement>('pf-option'));\n  }\n\n  private enabled(): HTMLElement[] {\n    return this.options().filter((option) => !option.hasAttribute('disabled'));\n  }\n\n  /** The property, never the attribute: a binding may only have set the former. */\n  private optionValue(option: HTMLElement): string {\n    return (option as HTMLElement & { value?: string }).value ?? option.getAttribute('value') ?? '';\n  }\n\n  private get listbox() {\n    return this.el.shadowRoot?.querySelector<HTMLElement>('[part=\"listbox\"]') ?? null;\n  }\n\n  private get trigger() {\n    return this.el.shadowRoot?.querySelector<HTMLButtonElement>('[part=\"trigger\"]') ?? null;\n  }\n\n  private showListbox() {\n    const panel = this.listbox;\n    if (this.disabled || !panel || panel.matches(':popover-open')) return;\n\n    panel.showPopover();\n    this.stopObserving?.();\n    this.stopObserving = observeAnchoredPosition({\n      getAnchor: () => this.trigger,\n      getFloating: () => panel,\n      // The listbox matches the trigger's width, as the React component does.\n      matchAnchorWidth: true,\n      flip: true,\n      /*\n       * `width` *and* `minWidth`: core reports whichever the mode calls for\n       * and leaves the other undefined — `matchAnchorWidth: true` gives a\n       * `width`, false gives a `minWidth`. Reading only `minWidth`, which is\n       * what pf-dropdown needs, left the listbox at its intrinsic 156px beside\n       * a 1216px trigger. The smoke test against a real build caught it.\n       */\n      onChange: ({ left, top, width, minWidth }) => {\n        placePopover(panel, left, top);\n        if (width !== undefined) panel.style.width = `${width}px`;\n        if (minWidth !== undefined) panel.style.minWidth = `${minWidth}px`;\n      },\n    });\n\n    /*\n     * Opens on the chosen option, or the first selectable one. Landing\n     * anywhere else would make the arrows start from somewhere the user has\n     * no reason to expect.\n     */\n    const options = this.options();\n    const chosen = options.find((option) => this.optionValue(option) === this.value);\n    this.setActive(\n      chosen && !chosen.hasAttribute('disabled') ? chosen : (this.enabled()[0] ?? null),\n    );\n  }\n\n  private hideListbox() {\n    this.stopObserving?.();\n    this.stopObserving = undefined;\n    this.clearTypeahead();\n    const panel = this.listbox;\n    if (panel?.matches(':popover-open')) panel.hidePopover();\n  }\n\n  private onToggle = (event: ToggleEvent) => {\n    const nowOpen = event.newState === 'open';\n    if (this.open !== nowOpen) this.open = nowOpen;\n    if (!nowOpen) this.trigger?.focus();\n  };\n\n  private setActive(option: HTMLElement | null) {\n    for (const other of this.options()) {\n      if (other !== option) (other as HTMLElement & { active: boolean }).active = false;\n    }\n    if (option) (option as HTMLElement & { active: boolean }).active = true;\n\n    this.activeOption = option;\n    this.syncActiveDescendant();\n    if (option && typeof option.scrollIntoView === 'function') {\n      option.scrollIntoView({ block: 'nearest' });\n    }\n  }\n\n  /**\n   * Feature-detected. Where ARIA element reflection is missing there is no\n   * cross-root equivalent, so the active option stops being *announced* while\n   * the arrows and Enter still work — recorded in `todo.md`.\n   */\n  private syncActiveDescendant() {\n    const trigger = this.trigger;\n    if (!trigger || !('ariaActiveDescendantElement' in trigger)) return;\n    (\n      trigger as unknown as { ariaActiveDescendantElement: Element | null }\n    ).ariaActiveDescendantElement = this.open ? this.activeOption : null;\n  }\n\n  private commit(option: HTMLElement) {\n    if (option.hasAttribute('disabled')) return;\n\n    const next = this.optionValue(option);\n    this.open = false;\n    this.trigger?.focus();\n\n    if (next === this.value) return;\n    this.value = next;\n    this.pfChange.emit({ value: next });\n  }\n\n  /** An option asked to be taken. The select decides, reports and closes. */\n  @Listen('pfOptionSelect')\n  handleOptionSelect(event: CustomEvent<{ value: string }>) {\n    event.stopPropagation();\n    if (this.disabled) return;\n\n    const option = this.options().find(\n      (candidate) => this.optionValue(candidate) === event.detail.value,\n    );\n    if (option) this.commit(option);\n  }\n\n  private move(action: ListNavigationAction) {\n    const options = this.options();\n    const enabledIndexes = getEnabledIndexes(options, (option) => option.hasAttribute('disabled'));\n    const current = this.activeOption ? options.indexOf(this.activeOption) : -1;\n    const next = resolveListMove(action, enabledIndexes, current);\n    if (next !== -1) this.setActive(options[next] ?? null);\n  }\n\n  private clearTypeahead() {\n    if (this.typeaheadTimer) clearTimeout(this.typeaheadTimer);\n    this.typeaheadTimer = undefined;\n    this.typeahead = '';\n  }\n\n  /**\n   * Typeahead. The buffer and its timer live here, because a timer is state\n   * and core is never a state container; the matching is core's.\n   */\n  private handleTypeahead(key: string) {\n    this.typeahead = nextTypeaheadBuffer(this.typeahead, key);\n\n    if (this.typeaheadTimer) clearTimeout(this.typeaheadTimer);\n    this.typeaheadTimer = setTimeout(() => this.clearTypeahead(), TYPEAHEAD_TIMEOUT_MS);\n\n    const options = this.options();\n    const labels = options.map((option) => option.textContent ?? '');\n    const from = this.activeOption ? options.indexOf(this.activeOption) : -1;\n    const match = findTypeaheadMatch(labels, this.typeahead, from, (index) =>\n      options[index].hasAttribute('disabled'),\n    );\n\n    if (match === -1) return;\n\n    /*\n     * Closed, typeahead *chooses* rather than merely highlighting: that is\n     * what a native `<select>` does, and with no listbox on screen a\n     * highlight nobody can see would be no feedback at all.\n     */\n    if (this.open) this.setActive(options[match]);\n    else this.commit(options[match]);\n  }\n\n  @Listen('keydown')\n  handleKeyDown(event: KeyboardEvent) {\n    if (this.disabled || event.defaultPrevented) return;\n\n    const move = MOVES[event.key];\n    if (move) {\n      event.preventDefault();\n      // Down or Up on a closed select opens it, as a combobox should.\n      if (!this.open) this.open = true;\n      else this.move(move);\n      return;\n    }\n\n    if (isActivationKey(event.key)) {\n      event.preventDefault();\n      if (!this.open) {\n        this.open = true;\n      } else if (this.activeOption) {\n        this.commit(this.activeOption);\n      }\n      return;\n    }\n\n    // Escape is the browser's while the listbox is a `popover=\"auto\"`.\n    if (isTypeaheadKey(event.key)) {\n      event.preventDefault();\n      this.handleTypeahead(event.key);\n    }\n  }\n\n  render() {\n    const describedBy = composeDescribedBy(\n      this.description && 'description',\n      this.error && 'error',\n    );\n\n    return (\n      <Host>\n        <div class=\"field\" part=\"field\">\n          {this.label && (\n            <label class=\"label\" part=\"label\" htmlFor=\"trigger\">\n              {this.label}\n              {this.required && (\n                <span class=\"required\" aria-hidden=\"true\">\n                  *\n                </span>\n              )}\n            </label>\n          )}\n\n          <button\n            id=\"trigger\"\n            aria-label={controlAriaLabel(this.el, this.label)}\n            part=\"trigger\"\n            class={{ trigger: true, 'trigger--invalid': Boolean(this.error) }}\n            type=\"button\"\n            role=\"combobox\"\n            disabled={this.disabled}\n            aria-haspopup=\"listbox\"\n            aria-expanded={this.open ? 'true' : 'false'}\n            /* Same shadow root as the listbox, so this IDREF resolves. */\n            aria-controls=\"listbox\"\n            aria-invalid={this.error ? 'true' : null}\n            aria-required={this.required ? 'true' : null}\n            aria-describedby={describedBy}\n            onClick={() => {\n              if (!this.disabled) this.open = !this.open;\n            }}\n          >\n            <span class={{ value: true, 'value--placeholder': !this.selectedLabel }}>\n              {this.selectedLabel || this.placeholder}\n            </span>\n            <span class=\"chevron\" aria-hidden=\"true\">\n              <pf-icon name=\"chevron-down\"></pf-icon>\n            </span>\n          </button>\n\n          {this.description && (\n            <p class=\"description\" part=\"description\" id=\"description\">\n              {this.description}\n            </p>\n          )}\n          {this.error && (\n            <p class=\"error\" part=\"error\" id=\"error\">\n              {this.error}\n            </p>\n          )}\n        </div>\n\n        <div\n          id=\"listbox\"\n          part=\"listbox\"\n          class=\"listbox\"\n          popover=\"auto\"\n          role=\"listbox\"\n          aria-label={this.label ?? this.placeholder}\n          style={\n            this.maxVisibleOptions\n              ? { maxHeight: `calc(${this.maxVisibleOptions} * 36px)`, overflowY: 'auto' }\n              : undefined\n          }\n          onToggle={this.onToggle}\n        >\n          <slot onSlotchange={this.onSlotChange} />\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/pitchfork/p-51528462.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as r,H as a}from"./p-Bm6UxEit.js";const t=()=>`:host{align-items:center;display:inline-flex;gap:var(--space-2)}:host([hidden]){display:none}.link{color:var(--pf-breadcrumbs-link-color);font-size:var(--font-size-sm);line-height:1.4;text-decoration:none}a.link:hover{color:var(--pf-breadcrumbs-link-hover-color);text-decoration:underline}:host([current-page]) .link,.link[aria-current='page']{color:var(--pf-breadcrumbs-link-current-color);font-weight:var(--font-weight-medium);text-decoration:none}.separator{color:var(--pf-breadcrumbs-separator-color);display:inline-flex;font-size:var(--font-size-xs);line-height:1}`;const n=class{constructor(r){e(this,r)}href;current=false;currentPage=false;last=false;separator="/";render(){const e=r("slot",{key:"9867775efe95a88c9d79894089761a835aec4a2c"});return r(a,{key:"ed743e2c769ac704621241b6c63857e0919d7386",role:"listitem"},this.href?r("a",{class:"link",part:"link",href:this.href,"aria-current":this.currentPage?"page":null},e):r("span",{class:"link",part:"link","aria-current":this.currentPage?"page":null},e),!this.last&&r("span",{key:"0bf16efee1d46f196bbf61555d05042b0bb8040d",class:"separator",part:"separator","aria-hidden":"true"},this.separator))}};n.style=t();export{n as pf_breadcrumb};
+//# sourceMappingURL=p-51528462.entry.js.map

package/dist/pitchfork/p-51528462.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["pfBreadcrumbCss","PfBreadcrumb","href","current","currentPage","last","separator","render","label","h","key","Host","role","this","class","part"],"sources":["src/components/pf-breadcrumb/pf-breadcrumb.css?tag=pf-breadcrumb&encapsulation=shadow","src/components/pf-breadcrumb/pf-breadcrumb.tsx"],"sourcesContent":[":host {\n  align-items: center;\n  display: inline-flex;\n  gap: var(--space-2);\n}\n\n:host([hidden]) {\n  display: none;\n}\n\n.link {\n  color: var(--pf-breadcrumbs-link-color);\n  font-size: var(--font-size-sm);\n  line-height: 1.4;\n  text-decoration: none;\n}\n\na.link:hover {\n  color: var(--pf-breadcrumbs-link-hover-color);\n  text-decoration: underline;\n}\n\n/*\n * `current-page` is the group's answer, not the consumer's `current` ask --\n * a trail where nothing was marked has a current page all the same, and this\n * is the attribute that says which.\n */\n:host([current-page]) .link,\n.link[aria-current='page'] {\n  color: var(--pf-breadcrumbs-link-current-color);\n  font-weight: var(--font-weight-medium);\n  text-decoration: none;\n}\n\n.separator {\n  color: var(--pf-breadcrumbs-separator-color);\n  display: inline-flex;\n  font-size: var(--font-size-xs);\n  line-height: 1;\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n/**\n * One crumb in a `pf-breadcrumbs` trail.\n *\n * With an `href` it renders a link; without one it renders a plain span, which\n * is both what a current page wants and the way to use a framework's own\n * router — slot an `<a routerLink>` or a `<Link>` in and leave `href` unset.\n *\n * `currentPage`, `last` and `separator` are the group's to set: only it can\n * see the trail. A consumer asks by setting `current`; the group resolves the\n * trail with core's rule and writes the answer to `currentPage`.\n *\n * @slot - the crumb's label.\n * @part link - the link, or the span standing in for one.\n * @part separator - the separator after this crumb. Absent on the last.\n */\n@Component({\n  tag: 'pf-breadcrumb',\n  styleUrl: 'pf-breadcrumb.css',\n  shadow: true,\n})\nexport class PfBreadcrumb {\n  /** Where the crumb goes. Reflected; a consumer's stylesheet reads it. */\n  @Prop({ reflect: true }) href?: string;\n\n  /**\n   * Set it to mark this crumb as the current page, rather than letting the\n   * last crumb be it.\n   *\n   * This is the *asking* half, and the group never writes it — `currentPage`\n   * below is the answer. Keeping the two apart is what lets the trail change:\n   * if the group wrote its answer back here, the crumb that happened to be\n   * last would look like a crumb the consumer had marked, and appending\n   * another would leave the mark behind on it.\n   */\n  @Prop({ reflect: true }) current = false;\n\n  /**\n   * Set by the group: the resolved current page, which is the one thing that\n   * renders `aria-current=\"page\"`. Exactly one crumb in a trail carries it.\n   */\n  @Prop({ mutable: true, reflect: true }) currentPage = false;\n\n  /** Set by the group: no separator is drawn after the last crumb. */\n  @Prop({ mutable: true, reflect: true }) last = false;\n\n  /** Set by the group from its own `separator`. */\n  @Prop({ mutable: true }) separator = '/';\n\n  render() {\n    const label = <slot />;\n\n    return (\n      <Host role=\"listitem\">\n        {this.href ? (\n          <a\n            class=\"link\"\n            part=\"link\"\n            href={this.href}\n            aria-current={this.currentPage ? 'page' : null}\n          >\n            {label}\n          </a>\n        ) : (\n          <span class=\"link\" part=\"link\" aria-current={this.currentPage ? 'page' : null}>\n            {label}\n          </span>\n        )}\n        {!this.last && (\n          <span class=\"separator\" part=\"separator\" aria-hidden=\"true\">\n            {this.separator}\n          </span>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAkB,IAAM,4jB,MCsBjBC,EAAY,M,yBAEEC,KAYAC,QAAU,MAMKC,YAAc,MAGdC,KAAO,MAGtBC,UAAY,IAErC,MAAAC,GACE,MAAMC,EAAQC,EAAA,QAAAC,IAAA,6CAEd,OACED,EAACE,EAAI,CAAAD,IAAA,2CAACE,KAAK,YACRC,KAAKX,KACJO,EAAA,KACEK,MAAM,OACNC,KAAK,OACLb,KAAMW,KAAKX,KAAI,eACDW,KAAKT,YAAc,OAAS,MAEzCI,GAGHC,EAAA,QAAMK,MAAM,OAAOC,KAAK,OAAM,eAAeF,KAAKT,YAAc,OAAS,MACtEI,IAGHK,KAAKR,MACLI,EAAA,QAAAC,IAAA,2CAAMI,MAAM,YAAYC,KAAK,YAAW,cAAa,QAClDF,KAAKP,W","ignoreList":[]}

package/dist/pitchfork/p-578db1a6.entry.js

@@ -0,0 +1,2 @@
+import{r as t,a as e,h as s,H as a}from"./p-Bm6UxEit.js";const i=()=>`:host{display:grid;gap:0}:host([hidden]){display:none}slot{display:contents}`;const n=class{constructor(e){t(this,e)}get el(){return e(this)}label;componentWillLoad(){this.sync()}componentDidLoad(){this.sync()}handleLabelChange(){this.sync()}async refresh(){this.sync()}get items(){return Array.from(this.el.querySelectorAll("pf-timeline-item")).filter((t=>t.parentElement===this.el))}sync(){const t=this.items;for(const[e,s]of t.entries()){s.last=e===t.length-1}}render(){return s(a,{key:"53a5400e234a874e685694c80275a9f09089dd14",role:"list","aria-label":this.label},s("slot",{key:"020e56e751cf207b5b3a083952dbfe36549ad9a0",onSlotchange:()=>this.refresh()}))}static get watchers(){return{label:[{handleLabelChange:0}]}}};n.style=i();export{n as pf_timeline};
+//# sourceMappingURL=p-578db1a6.entry.js.map

package/dist/pitchfork/p-578db1a6.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["pfTimelineCss","PfTimeline","label","componentWillLoad","this","sync","componentDidLoad","handleLabelChange","refresh","items","Array","from","el","querySelectorAll","filter","item","parentElement","index","entries","last","length","render","h","Host","key","role","onSlotchange"],"sources":["src/components/pf-timeline/pf-timeline.css?tag=pf-timeline&encapsulation=shadow","src/components/pf-timeline/pf-timeline.tsx"],"sourcesContent":[":host {\n  display: grid;\n  gap: 0;\n}\n\n:host([hidden]) {\n  display: none;\n}\n\n/* The entries have to be grid items of the host, not of a box inside it. */\nslot {\n  display: contents;\n}\n","import { Component, Element, h, Host, Method, Prop, Watch } from '@stencil/core';\n\n/**\n * A vertical timeline over `pf-timeline-item` children.\n *\n * The group owns the one thing an entry cannot see: whether it is the last,\n * which decides both the connector running down to the next entry and the\n * space below the content.\n *\n * @slot - the `pf-timeline-item` children.\n */\n@Component({\n  tag: 'pf-timeline',\n  styleUrl: 'pf-timeline.css',\n  shadow: true,\n})\nexport class PfTimeline {\n  @Element() el!: HTMLElement;\n\n  /**\n   * The timeline's accessible name. A list of entries is worth naming, and a\n   * consumer can only do it from out here.\n   */\n  @Prop() label?: string;\n\n  /** The light DOM is readable here, so first paint is already right. */\n  componentWillLoad() {\n    this.sync();\n  }\n\n  componentDidLoad() {\n    this.sync();\n  }\n\n  @Watch('label')\n  handleLabelChange() {\n    this.sync();\n  }\n\n  /** Re-reads the children, for a consumer who moved them imperatively. */\n  @Method()\n  async refresh() {\n    this.sync();\n  }\n\n  /** Direct children only: a nested timeline owns its own entries. */\n  private get items(): HTMLElement[] {\n    return Array.from(this.el.querySelectorAll<HTMLElement>('pf-timeline-item')).filter(\n      (item) => item.parentElement === this.el,\n    );\n  }\n\n  private sync() {\n    const items = this.items;\n    for (const [index, item] of items.entries()) {\n      (item as HTMLElement & { last: boolean }).last = index === items.length - 1;\n    }\n  }\n\n  render() {\n    return (\n      <Host role=\"list\" aria-label={this.label}>\n        <slot onSlotchange={() => this.refresh()} />\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAgB,IAAM,+E,MCgBfC,EAAU,M,iDAObC,MAGR,iBAAAC,GACEC,KAAKC,M,CAGP,gBAAAC,GACEF,KAAKC,M,CAIP,iBAAAE,GACEH,KAAKC,M,CAKP,aAAMG,GACJJ,KAAKC,M,CAIP,SAAYI,GACV,OAAOC,MAAMC,KAAKP,KAAKQ,GAAGC,iBAA8B,qBAAqBC,QAC1EC,GAASA,EAAKC,gBAAkBZ,KAAKQ,I,CAIlC,IAAAP,GACN,MAAMI,EAAQL,KAAKK,MACnB,IAAK,MAAOQ,EAAOF,KAASN,EAAMS,UAAW,CAC1CH,EAAyCI,KAAOF,IAAUR,EAAMW,OAAS,C,EAI9E,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,KAAK,OAAM,aAAarB,KAAKF,OACjCoB,EAAA,QAAAE,IAAA,2CAAME,aAAc,IAAMtB,KAAKI,Y","ignoreList":[]}

package/dist/pitchfork/p-5b98848c.entry.js

@@ -0,0 +1,2 @@
+import{r as a,a as e,h as t,H as r}from"./p-Bm6UxEit.js";import{r as s}from"./p-DToIJg5W.js";const i=()=>`:host{background:var(--pf-sidebar-nav-bg);border:1px solid var(--pf-sidebar-nav-border);border-radius:var(--pf-sidebar-nav-radius, var(--radius-md));display:flex;flex-direction:column;min-height:0;width:100%;--pf-nav-item-text:var(--pf-sidebar-nav-text-muted);--pf-nav-item-hover-text:var(--pf-sidebar-nav-text);--pf-nav-item-hover-bg:var(--pf-sidebar-nav-bg-subtle);--pf-nav-item-current-text:var(--pf-sidebar-nav-text);--pf-nav-item-current-bg:var(--pf-sidebar-nav-bg-subtle)}:host([hidden]){display:none}@media (min-width: 768px){:host{min-height:var(--pf-sidebar-nav-min-height, 360px);width:min(100%, var(--pf-sidebar-nav-width, 280px))}}.header,.footer{padding:var(--space-3)}.header{border-bottom:1px solid var(--pf-sidebar-nav-border)}.footer{border-top:1px solid var(--pf-sidebar-nav-border);margin-top:auto}.header.empty,.footer.empty{display:none}.nav{display:grid;gap:var(--space-3);padding:var(--space-3)}.nav slot{display:contents}`;const n=class{constructor(e){a(this,e)}get el(){return e(this)}label="Sidebar navigation";hasHeader=false;hasFooter=false;componentWillLoad(){this.sync()}componentDidLoad(){this.sync()}handleStructureChange(a){a.stopPropagation();this.sync()}async refresh(){this.sync()}get items(){const a=a=>{for(let e=a.parentElement;e;e=e.parentElement){const a=e.tagName.toLowerCase();if(a==="pf-sidebar-navigation"||a==="pf-header-navigation"){return e===this.el}}return false};return Array.from(this.el.querySelectorAll("pf-nav-item")).filter(a)}isCurrent(a){return a.current??a.hasAttribute("current")}sync(){const a=a=>Array.from(this.el.children).some((e=>e.getAttribute("slot")===a));this.hasHeader=a("header");this.hasFooter=a("footer");const e=this.items;const t=s(e.map((a=>({current:this.isCurrent(a)}))));for(const[a,r]of e.entries()){const e=r;e.currentPage=a===t;e.orientation="vertical"}}render(){return t(r,{key:"32d3374c206ae575f3b572e249203d9b5e1b5c66"},t("div",{key:"18ddded266a900836c09b26b3716bb4e4d17a027",class:{header:true,empty:!this.hasHeader},part:"header"},t("slot",{key:"8a74ca32bb1574d64bf6bfca53b799580fae5980",name:"header",onSlotchange:()=>this.refresh()})),t("nav",{key:"b4168ab94367d2e7086ec82aa08d81e92540d1f3",class:"nav",part:"nav","aria-label":this.label},t("slot",{key:"afa43f3d6f1b247e527a3d1e6a11ac585dd8fdd9",onSlotchange:()=>this.refresh()})),t("div",{key:"00afd1800a0aff350f73422823431287457ad2a9",class:{footer:true,empty:!this.hasFooter},part:"footer"},t("slot",{key:"cf899e9e6cab4199f7ed5846ea2fdb4011e71672",name:"footer",onSlotchange:()=>this.refresh()})))}};n.style=i();export{n as pf_sidebar_navigation};
+//# sourceMappingURL=p-5b98848c.entry.js.map

package/dist/pitchfork/p-5b98848c.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["pfSidebarNavigationCss","PfSidebarNavigation","label","hasHeader","hasFooter","componentWillLoad","this","sync","componentDidLoad","handleStructureChange","event","stopPropagation","refresh","items","ownedByThis","item","node","parentElement","tag","tagName","toLowerCase","el","Array","from","querySelectorAll","filter","isCurrent","current","hasAttribute","slotted","name","children","some","child","getAttribute","currentIndex","resolveCurrentNavItem","map","index","entries","currentPage","orientation","render","h","Host","key","class","header","empty","part","onSlotchange","footer"],"sources":["src/components/pf-sidebar-navigation/pf-sidebar-navigation.css?tag=pf-sidebar-navigation&encapsulation=shadow","src/components/pf-sidebar-navigation/pf-sidebar-navigation.tsx"],"sourcesContent":[":host {\n  background: var(--pf-sidebar-nav-bg);\n  border: 1px solid var(--pf-sidebar-nav-border);\n  border-radius: var(--pf-sidebar-nav-radius, var(--radius-md));\n  display: flex;\n  flex-direction: column;\n  min-height: 0;\n  width: 100%;\n\n  /*\n   * The bridge to the shared item. `pf-header-navigation` defines the same\n   * five from its own aliases; custom properties inherit through the shadow\n   * boundary, which is how one item element takes its colours from whichever\n   * navigation it is slotted into.\n   */\n  --pf-nav-item-text: var(--pf-sidebar-nav-text-muted);\n  --pf-nav-item-hover-text: var(--pf-sidebar-nav-text);\n  --pf-nav-item-hover-bg: var(--pf-sidebar-nav-bg-subtle);\n  --pf-nav-item-current-text: var(--pf-sidebar-nav-text);\n  --pf-nav-item-current-bg: var(--pf-sidebar-nav-bg-subtle);\n}\n\n:host([hidden]) {\n  display: none;\n}\n\n/* Mobile first: full width, growing to a fixed column on a wider screen. */\n@media (--md) {\n  :host {\n    min-height: var(--pf-sidebar-nav-min-height, 360px);\n    width: min(100%, var(--pf-sidebar-nav-width, 280px));\n  }\n}\n\n.header,\n.footer {\n  padding: var(--space-3);\n}\n\n.header {\n  border-bottom: 1px solid var(--pf-sidebar-nav-border);\n}\n\n.footer {\n  border-top: 1px solid var(--pf-sidebar-nav-border);\n  /* Pushed to the bottom, so a short navigation still has it at the foot. */\n  margin-top: auto;\n}\n\n/*\n * Both classes rather than a bare `.empty`: an empty box here would draw a\n * rule across the sidebar, which is the most visible version of the\n * can't-collapse-a-slot-wrapper problem.\n */\n.header.empty,\n.footer.empty {\n  display: none;\n}\n\n.nav {\n  display: grid;\n  gap: var(--space-3);\n  padding: var(--space-3);\n}\n\n/* The sections are grid children of the nav, not of a box inside it. */\n.nav slot {\n  display: contents;\n}\n","import { resolveCurrentNavItem } from '@pitchfork-ui/core';\nimport { Component, Element, h, Host, Listen, Method, Prop, State } from '@stencil/core';\n\n/**\n * A sidebar navigation over `pf-nav-item` children, optionally grouped into\n * `pf-nav-section`s.\n *\n * The group owns the one thing an item cannot know: which item is the current\n * page. Core's rule decides, so the React `SidebarNavigation` marks the same\n * one — and the resolution runs across every section rather than within one,\n * because `aria-current=\"page\"` names the one page the reader is on and a\n * sidebar with two marked sections would claim two.\n *\n * As with `pf-header-navigation`, the host is not a landmark of its own: the\n * React component renders an `<aside>`, and an element cannot know whether it\n * is the page's complementary region. Only the `<nav>` is rendered.\n *\n * Items are grouped: the default slot takes `pf-nav-section` children, each\n * of which owns its own `<ul>`. A navigation with no section titles is one\n * untitled section, which is exactly what the React `sections` array is — and\n * it is also the only arrangement that keeps the list semantics honest, since\n * a `<ul>` here would be a list whose children were sections rather than\n * items.\n *\n * @slot - the `pf-nav-section` children.\n * @slot header - a box above the navigation, such as a product switcher.\n * @slot footer - a box below it, pushed to the bottom.\n * @part header - the header's box.\n * @part nav - the navigation landmark.\n * @part footer - the footer's box.\n */\n@Component({\n  tag: 'pf-sidebar-navigation',\n  styleUrl: 'pf-sidebar-navigation.css',\n  shadow: true,\n})\nexport class PfSidebarNavigation {\n  @Element() el!: HTMLElement;\n\n  /** The navigation's accessible name. */\n  @Prop() label = 'Sidebar navigation';\n\n  /**\n   * Whether anything was slotted into `header` and `footer`.\n   *\n   * Asked in JS: both boxes carry a border and padding, so an empty one draws\n   * a rule across the sidebar for no reason, and a wrapper around a slot\n   * cannot be collapsed from CSS. The same arrangement as\n   * `pf-slideout-menu`'s footer.\n   */\n  @State() hasHeader = false;\n  @State() hasFooter = false;\n\n  /** The light DOM is readable here, so first paint is already right. */\n  componentWillLoad() {\n    this.sync();\n  }\n\n  componentDidLoad() {\n    this.sync();\n  }\n\n  /**\n   * A section's items moved, or an item's `current` changed. Either way the\n   * resolution has to run again.\n   *\n   * `slotchange` is not composed, so this is the only way the navigation\n   * hears about an item appended inside a section — and an item's `current`\n   * arriving as a *property* fires no DOM event at all, which is why the item\n   * emits this too. The event comes from a slotted child in the navigation's\n   * own tree, so `event.target` is the section or the item rather than the\n   * host — nothing is retargeted, which is what makes a host listener safe\n   * here and not on a child in the shadow root.\n   */\n  @Listen('pfNavStructure')\n  handleStructureChange(event: CustomEvent<void>) {\n    event.stopPropagation();\n    this.sync();\n  }\n\n  /**\n   * Re-reads the items, for a consumer who changed something the group reads\n   * and has no event for.\n   */\n  @Method()\n  async refresh() {\n    this.sync();\n  }\n\n  /**\n   * Every item this navigation owns, in document order, however deeply a\n   * section nests it — but not one belonging to a navigation nested inside\n   * this one.\n   */\n  private get items(): HTMLElement[] {\n    /*\n     * The walk up is written out rather than done with `closest`, which would\n     * need a comma selector the mock DOM may not take. The first navigation\n     * above an item is the one that owns it, so a navigation nested inside\n     * this one keeps its own.\n     */\n    const ownedByThis = (item: HTMLElement) => {\n      for (let node = item.parentElement; node; node = node.parentElement) {\n        const tag = node.tagName.toLowerCase();\n        if (tag === 'pf-sidebar-navigation' || tag === 'pf-header-navigation') {\n          return node === this.el;\n        }\n      }\n      return false;\n    };\n\n    return Array.from(this.el.querySelectorAll<HTMLElement>('pf-nav-item')).filter(ownedByThis);\n  }\n\n  /**\n   * The property if the item has upgraded, the attribute if it has not:\n   * `componentWillLoad` can run before a child parsed from HTML upgrades.\n   */\n  private isCurrent(item: HTMLElement) {\n    return (item as HTMLElement & { current?: boolean }).current ?? item.hasAttribute('current');\n  }\n\n  private sync() {\n    const slotted = (name: string) =>\n      Array.from(this.el.children).some((child) => child.getAttribute('slot') === name);\n\n    this.hasHeader = slotted('header');\n    this.hasFooter = slotted('footer');\n\n    const items = this.items;\n    const currentIndex = resolveCurrentNavItem(\n      items.map((item) => ({ current: this.isCurrent(item) })),\n    );\n\n    for (const [index, item] of items.entries()) {\n      const node = item as HTMLElement & { currentPage: boolean; orientation: string };\n      node.currentPage = index === currentIndex;\n      node.orientation = 'vertical';\n    }\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class={{ header: true, empty: !this.hasHeader }} part=\"header\">\n          <slot name=\"header\" onSlotchange={() => this.refresh()} />\n        </div>\n\n        <nav class=\"nav\" part=\"nav\" aria-label={this.label}>\n          <slot onSlotchange={() => this.refresh()} />\n        </nav>\n\n        <div class={{ footer: true, empty: !this.hasFooter }} part=\"footer\">\n          <slot name=\"footer\" onSlotchange={() => this.refresh()} />\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"6FAAA,MAAMA,EAAyB,IAAM,o7B,MCoCxBC,EAAmB,M,iDAItBC,MAAQ,qBAUPC,UAAY,MACZC,UAAY,MAGrB,iBAAAC,GACEC,KAAKC,M,CAGP,gBAAAC,GACEF,KAAKC,M,CAgBP,qBAAAE,CAAsBC,GACpBA,EAAMC,kBACNL,KAAKC,M,CAQP,aAAMK,GACJN,KAAKC,M,CAQP,SAAYM,GAOV,MAAMC,EAAeC,IACnB,IAAK,IAAIC,EAAOD,EAAKE,cAAeD,EAAMA,EAAOA,EAAKC,cAAe,CACnE,MAAMC,EAAMF,EAAKG,QAAQC,cACzB,GAAIF,IAAQ,yBAA2BA,IAAQ,uBAAwB,CACrE,OAAOF,IAASV,KAAKe,E,EAGzB,OAAO,KAAK,EAGd,OAAOC,MAAMC,KAAKjB,KAAKe,GAAGG,iBAA8B,gBAAgBC,OAAOX,E,CAOzE,SAAAY,CAAUX,GAChB,OAAQA,EAA6CY,SAAWZ,EAAKa,aAAa,U,CAG5E,IAAArB,GACN,MAAMsB,EAAWC,GACfR,MAAMC,KAAKjB,KAAKe,GAAGU,UAAUC,MAAMC,GAAUA,EAAMC,aAAa,UAAYJ,IAE9ExB,KAAKH,UAAY0B,EAAQ,UACzBvB,KAAKF,UAAYyB,EAAQ,UAEzB,MAAMhB,EAAQP,KAAKO,MACnB,MAAMsB,EAAeC,EACnBvB,EAAMwB,KAAKtB,IAAI,CAAQY,QAASrB,KAAKoB,UAAUX,QAGjD,IAAK,MAAOuB,EAAOvB,KAASF,EAAM0B,UAAW,CAC3C,MAAMvB,EAAOD,EACbC,EAAKwB,YAAcF,IAAUH,EAC7BnB,EAAKyB,YAAc,U,EAIvB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAO,CAAEC,OAAQ,KAAMC,OAAQ1C,KAAKH,WAAa8C,KAAK,UACzDN,EAAA,QAAAE,IAAA,2CAAMf,KAAK,SAASoB,aAAc,IAAM5C,KAAKM,aAG/C+B,EAAA,OAAAE,IAAA,2CAAKC,MAAM,MAAMG,KAAK,MAAK,aAAa3C,KAAKJ,OAC3CyC,EAAA,QAAAE,IAAA,2CAAMK,aAAc,IAAM5C,KAAKM,aAGjC+B,EAAA,OAAAE,IAAA,2CAAKC,MAAO,CAAEK,OAAQ,KAAMH,OAAQ1C,KAAKF,WAAa6C,KAAK,UACzDN,EAAA,QAAAE,IAAA,2CAAMf,KAAK,SAASoB,aAAc,IAAM5C,KAAKM,a","ignoreList":[]}

package/dist/pitchfork/p-6066ce98.entry.js

@@ -0,0 +1,2 @@
+import{r as t,a as e,h as s,H as a}from"./p-Bm6UxEit.js";import{c as n,n as i,C as r,p as l,a as o,d as c,f as d,g as h,s as p,h as f,i as g,e as y}from"./p-CmX-kVk-.js";import"./p-COAc4ZDB.js";const u=()=>`:host{display:flex;flex-direction:column;gap:var(--space-3);width:100%}:host([hidden]){display:none}.svg{display:block;height:auto;overflow:visible;width:100%}.empty{align-items:center;color:var(--pf-chart-text-muted);display:flex;font-size:var(--font-size-sm);height:120px;justify-content:center}.grid{stroke:var(--pf-chart-grid);stroke-width:1}.tick{fill:var(--pf-chart-text-muted);font-family:inherit;font-size:var(--font-size-2xs)}.tick--y{dominant-baseline:middle;text-anchor:end}.tick--x{dominant-baseline:hanging;text-anchor:middle}.axis-label{fill:var(--pf-chart-text-muted);font-family:inherit;font-size:var(--font-size-2xs);text-anchor:middle}.dot{opacity:0;transition:opacity 80ms ease}.svg:hover .dot{opacity:1}.legend{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-4);list-style:none;margin:0;padding:0;padding-inline-start:var(--pf-chart-plot-inset-left, 0)}.legend.legend--hidden{display:none}.legend slot{display:contents}@media (prefers-reduced-motion: reduce){.dot{transition:none}}`;const m=class{constructor(e){t(this,e)}get el(){return e(this)}data=[];area=false;curved=true;showLegend=true;yAxisLabel;label;series=[];componentWillLoad(){this.sync()}componentDidLoad(){this.sync()}async refresh(){this.sync()}get seriesElements(){return Array.from(this.el.children).filter((t=>t.tagName.toLowerCase()==="pf-chart-series"))}get rows(){const t=this.data;if(Array.isArray(t))return t;try{const e=JSON.parse(String(t||"[]"));return Array.isArray(e)?e:[]}catch{return[]}}sync(){const t=this.seriesElements;this.series=t.map(((t,e)=>{const s=t;const a=n(e,s.color??t.getAttribute("color")??undefined);t.swatch=a;return{key:s.seriesKey??t.getAttribute("series-key")??"",color:a,dashed:s.dashed??t.hasAttribute("dashed")}}))}render(){const t=this.rows;const e=this.series;if(t.length===0||e.length===0){return s(a,null,s("div",{class:"empty",part:"empty"},s("slot",{name:"empty"},"No data")),s("ul",{class:"legend legend--hidden",part:"legend"},s("slot",{onSlotchange:()=>this.refresh()})))}const n=(t,e)=>Number(t[e]??0);const u=Math.max(0,...e.flatMap((e=>t.map((t=>n(t,e.key))))));const m=i(u);const x=m[m.length-1];const k=y(t.length);const v=o.top+c.height;return s(a,{style:{"--pf-chart-plot-inset-left":`${o.left/r.width*100}%`}},s("svg",{class:"svg",part:"svg",viewBox:`0 0 ${r.width} ${r.height}`,role:"img","aria-label":this.label??this.yAxisLabel??"Line chart"},m.map((t=>{const e=l(t,x);return s("g",null,s("line",{class:"grid",part:"grid",x1:o.left,y1:e,x2:o.left+c.width,y2:e}),s("text",{class:"tick tick--y",part:"tick",x:o.left-8,y:e},d(t)))})),t.map(((e,a)=>a%k===0?s("text",{class:"tick tick--x",part:"tick",x:h(a,t.length),y:v+20},e.label):null)),this.yAxisLabel&&s("text",{class:"axis-label",x:-112,y:14,transform:"rotate(-90)"},this.yAxisLabel),e.map((e=>{const a=t.map(((s,a)=>({x:h(a,t.length),y:l(n(s,e.key),x)})));const i=this.curved?p(a):f(a);return s("g",null,this.area&&s("path",{class:"area",part:"area",d:g(i,a),fill:e.color,"fill-opacity":"0.12",stroke:"none"}),s("path",{class:"line",part:"line",d:i,fill:"none",stroke:e.color,"stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round","stroke-dasharray":e.dashed?"6 4":undefined}),a.map(((a,i)=>s("circle",{class:"dot",part:"dot",cx:a.x,cy:a.y,r:"3.5",fill:e.color},s("title",null,`${t[i].label}: ${d(n(t[i],e.key))}`)))))}))),s("ul",{class:{legend:true,"legend--hidden":!this.showLegend||e.length<2},part:"legend"},s("slot",{onSlotchange:()=>this.refresh()})))}static get watchers(){return{data:[{sync:0}]}}};m.style=u();export{m as pf_line_chart};
+//# sourceMappingURL=p-6066ce98.entry.js.map

package/dist/pitchfork/p-6066ce98.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["pfLineChartCss","PfLineChart","data","area","curved","showLegend","yAxisLabel","label","series","componentWillLoad","this","sync","componentDidLoad","refresh","seriesElements","Array","from","el","children","filter","child","tagName","toLowerCase","rows","raw","isArray","parsed","JSON","parse","String","elements","map","element","index","node","color","chartSeriesColor","getAttribute","undefined","swatch","key","seriesKey","dashed","hasAttribute","render","length","h","Host","class","part","name","onSlotchange","valueAt","row","Number","highest","Math","max","flatMap","item","ticks","niceAxisTicks","maxTick","labelStep","axisLabelStep","floor","CHART_PADDING","top","CHART_PLOT","height","style","left","CHART_VIEW","width","viewBox","role","tick","y","plotY","x1","y1","x2","y2","x","formatAxisTick","plotX","transform","points","line","smoothSeriesPath","straightSeriesPath","d","areaSeriesPath","fill","stroke","point","cx","cy","r","legend"],"sources":["src/components/pf-line-chart/pf-line-chart.css?tag=pf-line-chart&encapsulation=shadow","src/components/pf-line-chart/pf-line-chart.tsx"],"sourcesContent":[":host {\n  display: flex;\n  flex-direction: column;\n  gap: var(--space-3);\n  width: 100%;\n}\n\n:host([hidden]) {\n  display: none;\n}\n\n.svg {\n  display: block;\n  height: auto;\n  /* The y-axis label is drawn outside the plot, so the box must not clip. */\n  overflow: visible;\n  width: 100%;\n}\n\n.empty {\n  align-items: center;\n  color: var(--pf-chart-text-muted);\n  display: flex;\n  font-size: var(--font-size-sm);\n  height: 120px;\n  justify-content: center;\n}\n\n.grid {\n  stroke: var(--pf-chart-grid);\n  stroke-width: 1;\n}\n\n.tick {\n  fill: var(--pf-chart-text-muted);\n  font-family: inherit;\n  font-size: var(--font-size-2xs);\n}\n\n.tick--y {\n  dominant-baseline: middle;\n  text-anchor: end;\n}\n\n.tick--x {\n  dominant-baseline: hanging;\n  text-anchor: middle;\n}\n\n.axis-label {\n  fill: var(--pf-chart-text-muted);\n  font-family: inherit;\n  font-size: var(--font-size-2xs);\n  text-anchor: middle;\n}\n\n/* The dots appear on hover, so the line reads cleanly at rest. */\n.dot {\n  opacity: 0;\n  transition: opacity 80ms ease;\n}\n\n.svg:hover .dot {\n  opacity: 1;\n}\n\n.legend {\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--space-2) var(--space-4);\n  list-style: none;\n  margin: 0;\n  /*\n   * Lines the legend's start edge up with the plot area: the SVG is inset by\n   * the y-axis gutter, and the inset is set inline from the chart's geometry.\n   */\n  padding: 0;\n  padding-inline-start: var(--pf-chart-plot-inset-left, 0);\n}\n\n/*\n * Hidden rather than dropped, so the series stay slotted and `slotchange`\n * still fires. Two classes deep, because the tie breaks on source order.\n */\n.legend.legend--hidden {\n  display: none;\n}\n\n/* The series are flex children of the list, not of a box inside it. */\n.legend slot {\n  display: contents;\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .dot {\n    transition: none;\n  }\n}\n","import {\n  CHART_PADDING,\n  CHART_PLOT,\n  CHART_VIEW,\n  areaSeriesPath,\n  axisLabelStep,\n  chartSeriesColor,\n  formatAxisTick,\n  niceAxisTicks,\n  plotX,\n  plotY,\n  smoothSeriesPath,\n  straightSeriesPath,\n} from '@pitchfork-ui/core';\nimport { Component, Element, h, Host, Method, Prop, State, Watch } from '@stencil/core';\n\n/** One row of a chart's data: a label and a number per series. */\nexport type PfChartRow = { label: string } & Record<string, string | number>;\n\n/**\n * A line or area chart over `pf-chart-series` children.\n *\n * The split follows what the data is: the rows are bulk numbers and live in a\n * property, while the series are the part with names and colours and live in\n * the light DOM, where a consumer can loop over them and where the legend can\n * reach their labels.\n *\n * Every scale and path is core's, so this and the React `LineChart` draw the\n * same chart — the axis labels and the geometry have to come from the same\n * tick scale, or the gridlines say one thing and the line says another.\n *\n * @slot - the `pf-chart-series` children.\n * @slot empty - what to show when there is nothing to draw.\n * @part svg - the drawing.\n * @part grid - one gridline.\n * @part tick - one axis label.\n * @part line - one series' line.\n * @part area - one series' fill, on the area variant.\n * @part dot - one data point.\n * @part legend - the list the series are slotted into.\n * @part empty - the empty state's box.\n */\n@Component({\n  tag: 'pf-line-chart',\n  styleUrl: 'pf-line-chart.css',\n  shadow: true,\n})\nexport class PfLineChart {\n  @Element() el!: HTMLElement;\n\n  /**\n   * The rows to plot.\n   *\n   * An array for a framework consumer, or JSON for plain HTML, because\n   * Stencil coerces an attribute only for the primitive types it recognises.\n   */\n  @Prop() data: PfChartRow[] | string = [];\n\n  /** Fill under each line. Reflected. */\n  @Prop({ reflect: true }) area = false;\n\n  /** Curve the lines through their points rather than joining them straight. */\n  @Prop({ reflect: true }) curved = true;\n\n  @Prop({ reflect: true }) showLegend = true;\n\n  /** Printed down the y axis, and used as the chart's name when it has none. */\n  @Prop() yAxisLabel?: string;\n\n  /** The chart's accessible name. */\n  @Prop() label?: string;\n\n  /** The series, read from the light DOM. */\n  @State() series: { key: string; color: string; dashed: boolean }[] = [];\n\n  /** The light DOM is readable here, so first paint is already right. */\n  componentWillLoad() {\n    this.sync();\n  }\n\n  componentDidLoad() {\n    this.sync();\n  }\n\n  /** Re-reads the series, for a consumer who changed one through a property. */\n  @Method()\n  async refresh() {\n    this.sync();\n  }\n\n  /**\n   * Direct children only: a nested chart owns its own series.\n   *\n   * Named `seriesElements`, not `children`: a component class's members land\n   * on the custom element itself, so a getter called `children` shadows\n   * `Element.children` and anything that walks it recurses for ever.\n   */\n  private get seriesElements(): HTMLElement[] {\n    return Array.from(this.el.children).filter(\n      (child) => child.tagName.toLowerCase() === 'pf-chart-series',\n    ) as HTMLElement[];\n  }\n\n  private get rows(): PfChartRow[] {\n    const raw = this.data;\n    if (Array.isArray(raw)) return raw;\n\n    try {\n      const parsed = JSON.parse(String(raw || '[]'));\n      return Array.isArray(parsed) ? parsed : [];\n    } catch {\n      // A malformed attribute is an empty chart, not a thrown render.\n      return [];\n    }\n  }\n\n  @Watch('data')\n  sync() {\n    const elements = this.seriesElements;\n\n    this.series = elements.map((element, index) => {\n      const node = element as HTMLElement & {\n        seriesKey?: string;\n        color?: string;\n        dashed?: boolean;\n      };\n      const color = chartSeriesColor(\n        index,\n        node.color ?? element.getAttribute('color') ?? undefined,\n      );\n\n      (element as HTMLElement & { swatch: string }).swatch = color;\n\n      return {\n        key: node.seriesKey ?? element.getAttribute('series-key') ?? '',\n        color,\n        dashed: node.dashed ?? element.hasAttribute('dashed'),\n      };\n    });\n  }\n\n  render() {\n    const rows = this.rows;\n    const series = this.series;\n\n    if (rows.length === 0 || series.length === 0) {\n      return (\n        <Host>\n          <div class=\"empty\" part=\"empty\">\n            <slot name=\"empty\">No data</slot>\n          </div>\n          {/* The list stays in the tree, or `slotchange` never fires again. */}\n          <ul class=\"legend legend--hidden\" part=\"legend\">\n            <slot onSlotchange={() => this.refresh()} />\n          </ul>\n        </Host>\n      );\n    }\n\n    const valueAt = (row: PfChartRow, key: string) => Number(row[key] ?? 0);\n    const highest = Math.max(\n      0,\n      ...series.flatMap((item) => rows.map((row) => valueAt(row, item.key))),\n    );\n    const ticks = niceAxisTicks(highest);\n    const maxTick = ticks[ticks.length - 1];\n    const labelStep = axisLabelStep(rows.length);\n    const floor = CHART_PADDING.top + CHART_PLOT.height;\n\n    return (\n      <Host\n        style={{\n          // Lets the legend's start edge line up with the plot area.\n          '--pf-chart-plot-inset-left': `${(CHART_PADDING.left / CHART_VIEW.width) * 100}%`,\n        }}\n      >\n        <svg\n          class=\"svg\"\n          part=\"svg\"\n          viewBox={`0 0 ${CHART_VIEW.width} ${CHART_VIEW.height}`}\n          role=\"img\"\n          aria-label={this.label ?? this.yAxisLabel ?? 'Line chart'}\n        >\n          {ticks.map((tick) => {\n            const y = plotY(tick, maxTick);\n            return (\n              <g>\n                <line\n                  class=\"grid\"\n                  part=\"grid\"\n                  x1={CHART_PADDING.left}\n                  y1={y}\n                  x2={CHART_PADDING.left + CHART_PLOT.width}\n                  y2={y}\n                />\n                <text class=\"tick tick--y\" part=\"tick\" x={CHART_PADDING.left - 8} y={y}>\n                  {formatAxisTick(tick)}\n                </text>\n              </g>\n            );\n          })}\n\n          {rows.map((row, index) =>\n            index % labelStep === 0 ? (\n              <text class=\"tick tick--x\" part=\"tick\" x={plotX(index, rows.length)} y={floor + 20}>\n                {row.label}\n              </text>\n            ) : null,\n          )}\n\n          {this.yAxisLabel && (\n            <text\n              class=\"axis-label\"\n              x={-(CHART_PADDING.top + CHART_PLOT.height / 2)}\n              y={14}\n              transform=\"rotate(-90)\"\n            >\n              {this.yAxisLabel}\n            </text>\n          )}\n\n          {series.map((item) => {\n            const points = rows.map((row, index) => ({\n              x: plotX(index, rows.length),\n              y: plotY(valueAt(row, item.key), maxTick),\n            }));\n            const line = this.curved ? smoothSeriesPath(points) : straightSeriesPath(points);\n\n            return (\n              <g>\n                {this.area && (\n                  <path\n                    class=\"area\"\n                    part=\"area\"\n                    d={areaSeriesPath(line, points)}\n                    fill={item.color}\n                    fill-opacity=\"0.12\"\n                    stroke=\"none\"\n                  />\n                )}\n                <path\n                  class=\"line\"\n                  part=\"line\"\n                  d={line}\n                  fill=\"none\"\n                  stroke={item.color}\n                  stroke-width=\"2\"\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\"\n                  stroke-dasharray={item.dashed ? '6 4' : undefined}\n                />\n                {points.map((point, index) => (\n                  <circle\n                    class=\"dot\"\n                    part=\"dot\"\n                    cx={point.x}\n                    cy={point.y}\n                    r=\"3.5\"\n                    fill={item.color}\n                  >\n                    <title>{`${rows[index].label}: ${formatAxisTick(\n                      valueAt(rows[index], item.key),\n                    )}`}</title>\n                  </circle>\n                ))}\n              </g>\n            );\n          })}\n        </svg>\n\n        <ul\n          class={{ legend: true, 'legend--hidden': !this.showLegend || series.length < 2 }}\n          part=\"legend\"\n        >\n          <slot onSlotchange={() => this.refresh()} />\n        </ul>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/pitchfork/p-643f7e00.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as a,H as r}from"./p-Bm6UxEit.js";const s=()=>`:host{background:var(--pf-carousel-slide-background, transparent);color:var(--pf-carousel-slide-text);flex:0 0 100%;min-width:0;padding:var(--pf-carousel-slide-padding, 0)}:host([hidden]){display:none}`;const i=class{constructor(a){e(this,a)}active=false;position=1;total=1;render(){return a(r,{key:"5b8c82c4edca6c10ea5b20f1122cc62d8d37f0d5",role:"group","aria-roledescription":"slide","aria-label":`Slide ${this.position} of ${this.total}`,"aria-hidden":this.active?null:"true",inert:!this.active},a("slot",{key:"36ea0239c2c53b175e94f701cc047eabd4e1d41d"}))}};i.style=s();export{i as pf_carousel_slide};
+//# sourceMappingURL=p-643f7e00.entry.js.map

package/dist/pitchfork/p-643f7e00.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["pfCarouselSlideCss","PfCarouselSlide","active","position","total","render","h","Host","key","role","this","inert"],"sources":["src/components/pf-carousel-slide/pf-carousel-slide.css?tag=pf-carousel-slide&encapsulation=shadow","src/components/pf-carousel-slide/pf-carousel-slide.tsx"],"sourcesContent":[":host {\n  background: var(--pf-carousel-slide-background, transparent);\n  color: var(--pf-carousel-slide-text);\n  /* One slide per viewport, which is what the track's transform steps by. */\n  flex: 0 0 100%;\n  min-width: 0;\n  padding: var(--pf-carousel-slide-padding, 0);\n}\n\n:host([hidden]) {\n  display: none;\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n/**\n * One slide of a `pf-carousel`.\n *\n * The carousel tells it where it sits and whether it is the one on show; it\n * owns only what that means for itself — chiefly that an off-screen slide is\n * `inert`, so the focusable content inside it cannot be tabbed to while it is\n * scrolled out of sight.\n *\n * @slot - the slide's content.\n */\n@Component({\n  tag: 'pf-carousel-slide',\n  styleUrl: 'pf-carousel-slide.css',\n  shadow: true,\n})\nexport class PfCarouselSlide {\n  /** Set by the carousel: the slide on show. Reflected for the stylesheet. */\n  @Prop({ mutable: true, reflect: true }) active = false;\n\n  /** Set by the carousel: this slide's place, counting from 1. */\n  @Prop({ mutable: true }) position = 1;\n\n  /** Set by the carousel: how many slides there are. */\n  @Prop({ mutable: true }) total = 1;\n\n  render() {\n    return (\n      <Host\n        role=\"group\"\n        aria-roledescription=\"slide\"\n        aria-label={`Slide ${this.position} of ${this.total}`}\n        aria-hidden={this.active ? null : 'true'}\n        /*\n         * `inert` as well as `aria-hidden`: the slide is still laid out, just\n         * scrolled out of view, so without it a button inside the next slide\n         * is a tab stop nobody can see. The same reason an accordion's closed\n         * panel is inert.\n         */\n        inert={!this.active}\n      >\n        <slot />\n      </Host>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAqB,IAAM,4M,MCiBpBC,EAAe,M,yBAEcC,OAAS,MAGxBC,SAAW,EAGXC,MAAQ,EAEjC,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,KAAK,QAAO,uBACS,QAAO,aAChB,SAASC,KAAKP,eAAeO,KAAKN,QAAO,cACxCM,KAAKR,OAAS,KAAO,OAOlCS,OAAQD,KAAKR,QAEbI,EAAA,QAAAE,IAAA,6C","ignoreList":[]}

package/dist/pitchfork/p-685f817b.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as t,h as a,H as r}from"./p-Bm6UxEit.js";const i=()=>`:host{border-top:1px solid var(--pf-accordion-border);display:block}:host(:first-child){border-top:0}:host([hidden]){display:none}.heading{font-size:inherit;font-weight:inherit;margin:0}.trigger{align-items:center;background:transparent;border:0;color:var(--pf-accordion-trigger-text);cursor:pointer;display:flex;font:inherit;font-weight:var(--font-weight-medium);gap:var(--space-3);justify-content:space-between;padding:var(--space-3) var(--space-4);text-align:start;width:100%}.trigger:hover:not(:disabled){background:var(--pf-accordion-trigger-bg-hover)}.trigger:focus-visible{box-shadow:var(--pf-focus-ring);outline:none}.trigger:disabled{cursor:not-allowed;opacity:0.5}.icon{align-items:center;color:var(--pf-accordion-icon);display:inline-flex;flex-shrink:0;transition:transform var(--pf-transition-fast)}:host([expanded]) .icon{transform:rotate(180deg)}.panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--pf-transition-medium)}:host([expanded]) .panel{grid-template-rows:1fr}.content{color:var(--pf-accordion-content-text);min-height:0;overflow:hidden}.inner{padding:0 var(--space-4) var(--space-4)}@media (prefers-reduced-motion: reduce){.panel,.icon{transition:none}}`;const n=class{constructor(a){e(this,a);this.pfAccordionToggle=t(this,"pfAccordionToggle")}value="";disabled=false;expanded=false;headingLevel=3;pfAccordionToggle;get level(){const e=Math.round(Number(this.headingLevel));if(!Number.isFinite(e))return 3;return Math.min(Math.max(e,2),6)}onClick=()=>{if(this.disabled)return;this.pfAccordionToggle.emit({value:this.value})};render(){const e=`h${this.level}`;return a(r,{key:"35e729954b5bd58447dc4d3bc4f9e57e7bf0bdff"},a(e,{key:"455c96a2d76607ee70cc3f6f81a64f43ccc047c8",class:"heading",part:"heading"},a("button",{key:"4fdeae121e827c2cab00c9f583b0282be828c743",type:"button",id:"trigger",class:"trigger",part:"trigger","aria-expanded":this.expanded?"true":"false","aria-controls":"panel",disabled:this.disabled,onClick:this.onClick},a("span",{key:"10cabf948a5cbe16ddaeedd379e2c5485f92b568",class:"title",part:"title"},a("slot",{key:"1d050d2bd6a0ed6f0494cd9b4afa96e9abb21211",name:"title"})),a("span",{key:"f4a3dd3d8f519538f53623cbb9fe24b03b138db6",class:"icon",part:"icon","aria-hidden":"true"},a("pf-icon",{key:"53e79af5f641fc306bb6b80dc8166847d084224f",name:"chevron-down"})))),a("div",{key:"2dc77acf0e8cfe6f9ab01af1adb3cec47de80f2f",class:"panel",part:"panel"},a("div",{key:"e1531908c103894b176438690f08578b0ed964b6",class:"content",part:"content",id:"panel",role:"region","aria-labelledby":"trigger",inert:!this.expanded},a("div",{key:"9f21bf640cd85cd22fc90d1376140f3f74b9a69b",class:"inner",part:"inner"},a("slot",{key:"3e92f2c1f5cea1e8ab89f67633b0659935505161"})))))}static get delegatesFocus(){return true}};n.style=i();export{n as pf_accordion_item};
+//# sourceMappingURL=p-685f817b.entry.js.map