@synergy-design-system/components 3.2.1 → 3.4.0

package/dist/chunks/chunk.5IMXX2BZ.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/header/header.component.ts"],
-  "sourcesContent": ["/* eslint-disable @typescript-eslint/unbound-method */\nimport { classMap } from 'lit/directives/class-map.js';\nimport { html } from 'lit/static-html.js';\nimport { property, state } from 'lit/decorators.js';\nimport type { CSSResultGroup } from 'lit';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport { HasSlotController } from '../../internal/slot.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport styles from './header.styles.js';\nimport SynIcon from '../icon/icon.js';\nimport type SynSideNav from '../side-nav/side-nav.component.js';\nimport { LocalizeController } from '../../utilities/localize.js';\nimport { watch } from '../../internal/watch.js';\n\n/**\n * @summary The <syn-header /> element provides a generic application header\n * that can be used to add applications name, toolbar and primary navigation.\n *\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-header--docs\n * @status stable\n * @since 1.10.0\n *\n * @slot label - The label for the header\n * @slot logo - The logo that should be displayed. Will fall back to the SICK logo if not provided\n * @slot meta-navigation - The meta-navigation is used to add various application toolbar icons\n *                     Best used with `<syn-icon-button />` and `<syn-drop-down />`\n * @slot navigation - This slot can be used to add an optional horizontal navigation\n * @slot open-burger-menu-icon - An icon to use in lieu of the default burger-menu=open state.\n *                      The default close icon is a 'x'.\n * @slot closed-burger-menu-icon - An icon to use in lieu of the default burger-menu=closed state.\n *                      The default open icon is a burger menu.\n *\n * @event syn-burger-menu-closed - Emitted when the burger menu is toggled to closed\n * @event syn-burger-menu-hidden - Emitted when the burger menu is toggled to hidden\n * @event syn-burger-menu-open - Emitted when the burger menu is toggled to open\n *\n * @csspart base - The component's base wrapper\n * @csspart content - The wrapper most content items reside\n * @csspart logo - The wrapper the application logo resides in\n * @csspart label - The element wrapping the application name\n * @csspart meta-navigation - The Item wrapping the optional application menu\n * @csspart navigation - The wrapper that is holding the optional top navigation section\n * @csspart burger-menu-toggle-button - The button that toggles the burger menu\n */\nexport default class SynHeader extends SynergyElement {\n  static styles: CSSResultGroup = [\n    componentStyles,\n    styles,\n  ];\n\n  static dependencies = {\n    'syn-icon': SynIcon,\n  };\n\n  private readonly hasSlotController = new HasSlotController(this, '[default]', 'logo', 'label', 'meta-navigation', 'navigation');\n\n  private readonly localize = new LocalizeController(this);\n\n  /**\n   * Internal mutation observer\n   */\n  private mutationObserver: MutationObserver;\n\n  /*\n   * #587: If the side nav is animating, we should not allow to trigger the burger menu\n   */\n  private isSideNavAnimating = false;\n\n  /**\n   * The headers label. If you need to display HTML, use the `label` slot instead.\n   */\n  @property() label = '';\n\n  /**\n   * Defines the current visibility and icon of the burger-menu icon.\n   * The menu button is added automatically if the component finds a syn-side-nav in\n   * variant=\"default\".\n   * The following values can be used:\n   * - hidden: The burger menu is not visible\n   * - open: The burger menu is visible and shows the close icon\n   * - closed: The burger menu is visible and shows the open icon\n   */\n  @property({ attribute: 'burger-menu', reflect: true }) burgerMenu: 'hidden' | 'open' | 'closed' = 'hidden';\n\n  /**\n   * The side nav\n   */\n  @state() private sideNav: SynSideNav | null;\n\n  private toggleBurgerMenu() {\n    switch (this.burgerMenu) {\n      case 'closed': this.burgerMenu = 'open'; break;\n      case 'open': this.burgerMenu = 'closed'; break;\n      default: break;\n    }\n  }\n\n  private handleBurgerMenuToggle() {\n    // If there is a side-nav in variant=\"default\", toggle the open state!\n    if (this.sideNav && this.sideNav.variant === 'default' && !this.isSideNavAnimating) {\n      this.sideNav.open = !this.sideNav.open;\n    }\n    if (!this.isSideNavAnimating) {\n      this.toggleBurgerMenu();\n    }\n  }\n\n  /**\n   * Automatically update the burger menu icon based\n   * on the state of the side-nav, if one is connected.\n   */\n  private updateBurgerMenuBasedOnSideNav() {\n    if (this.sideNav) {\n      // Hide the burger menu icon if the side-nav is not variant=\"default\"\n      if (this.sideNav.variant !== 'default') {\n        this.burgerMenu = 'hidden';\n      } else {\n        this.burgerMenu = this.sideNav.open ? 'open' : 'closed';\n      }\n    }\n  }\n\n  @watch('burgerMenu', { waitUntilFirstUpdate: true })\n  handleBurgerMenu() {\n    const myEvt: keyof GlobalEventHandlersEventMap = `syn-burger-menu-${this.burgerMenu}`;\n    this.emit(myEvt);\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n\n    this.mutationObserver = new MutationObserver(() => this.updateBurgerMenuBasedOnSideNav());\n  }\n\n  firstUpdated() {\n    // Search for a side-nav and use the first found in case of the connectSideNavigation method\n    // is not used by the user.\n    // eslint-disable-next-line @typescript-eslint/no-floating-promises\n    this.updateComplete.then(() => {\n      const sideNav = document.querySelector('syn-side-nav');\n      this.connectSideNavigation(sideNav);\n    });\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n\n    //  Remove observer\n    this.mutationObserver.disconnect();\n  }\n\n  /**\n   * Connect a `syn-side-nav` to add automatic interaction of the header with the side navigation\n   * like showing the burger menu icon and open / close handling.\n   *\n   * If no side navigation is connected, the header will use the first `syn-side-nav` element it\n   * finds.\n   *\n   * @param sideNav The side navigation to connect to the header\n   */\n  connectSideNavigation(sideNav: SynSideNav | null) {\n    this.mutationObserver.disconnect();\n\n    this.sideNav = sideNav || document.querySelector('syn-side-nav');\n    if (this.sideNav) {\n      // Need to call the method initially, if the side-nav is not open on connect time.\n      // Otherwise the mutation observer won`t trigger the method.\n      this.updateBurgerMenuBasedOnSideNav();\n      this.mutationObserver.observe(this.sideNav, { attributeFilter: ['open', 'variant'], attributes: true });\n\n      // #587: Make sure to not trigger the burger menu if the side nav is currently\n      // animating and the user clicks on the burger menu button.\n\n      // #921: Make sure to only trigger this if the source of the element is the side nav.\n      // This is because syn-nav-item also triggers show and hide events when opened or closed.\n      const isAnimating = (e: Event) => {\n        if (e.target !== this.sideNav) {\n          return;\n        }\n        this.isSideNavAnimating = true;\n      };\n\n      const isNotAnimating = (e: Event) => {\n        if (e.target !== this.sideNav) {\n          return;\n        }\n        this.isSideNavAnimating = false;\n      };\n\n      this.sideNav.addEventListener('syn-show', isAnimating);\n      this.sideNav.addEventListener('syn-hide', isAnimating);\n      this.sideNav.addEventListener('syn-after-show', isNotAnimating);\n      this.sideNav.addEventListener('syn-after-hide', isNotAnimating);\n    }\n  }\n\n  render() {\n    const hasNavigation = this.hasSlotController.test('navigation');\n    const showBurgerMenu = this.burgerMenu !== 'hidden';\n    return html`\n      <header\n        class=${classMap({\n          header: true,\n          'header--has-burger-menu': showBurgerMenu,\n          'header--has-navigation': hasNavigation,\n        })}\n        part=\"base\"\n      >\n        <!-- .header__content -->\n        <div part=\"content\" class=\"header__content\">\n\n          ${showBurgerMenu\n              ? html`\n                  <button\n                    aria-label=${this.localize.term(this.burgerMenu === 'closed' ? 'openMenu' : 'closeMenu')}\n                    class=\"header__burger-menu-toggle\"\n                    @click=${this.handleBurgerMenuToggle}\n                    part=\"burger-menu-toggle-button\"\n                    type=\"button\"\n                  >\n                    ${this.burgerMenu === 'open'\n                      ? html`\n                          <slot name=\"open-burger-menu-icon\">\n                            <syn-icon name=\"x-lg\" library=\"system\"></syn-icon>\n                          </slot>\n                        `\n                      : html`\n                          <slot name=\"closed-burger-menu-icon\">\n                            <syn-icon name=\"menu\" library=\"system\"></syn-icon>\n                          </slot>\n                        `}\n                  </button>\n                `\n              : ''}\n\n          <div part=\"logo\" class=\"header__logo\">\n            <slot name=\"logo\">\n              <syn-icon name=\"logo-color\" library=\"system\" label=\"SICK Sensor Intelligence\"></syn-icon>\n            </slot>\n          </div>\n\n          <div part=\"label\" class=\"header__label\">\n            <slot name=\"label\">\n              ${this.label}\n            </slot>\n          </div>\n\n          <div part=\"meta-navigation\" class=\"header__meta-navigation\">\n            <slot name=\"meta-navigation\"></slot>\n          </div>\n        </div>\n        <!-- /.header__content -->\n\n        <div part=\"navigation\" class=\"header__navigation\">\n          <slot name=\"navigation\"></slot>\n        </div>\n      </header>\n    `;\n  }\n}\n"],
-  "mappings": "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",
-  "names": []
-}

package/dist/chunks/chunk.5OXFZJYX.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/header/header.styles.ts"],
-  "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n  :host {\n    display: block;\n  }\n\n  .header {\n    background: var(--syn-panel-background-color);\n    box-shadow: inset 0 -1px 0 0 var(--syn-header-border-color);\n  }\n\n  /**\n   * The primary content area displays one to many slotted items\n   * and contains the following items:\n   * - side nav state icon (OPTIONAL)\n   * - company or application logo\n   * - application name\n   * - meta-navigation\n   */\n  .header__content {\n    align-items: center;\n    box-sizing: content-box;\n    display: flex;\n    min-height: 40px;\n    padding: var(--syn-spacing-small) var(--syn-spacing-large);\n  }\n\n  /**\n   * The logo slot includes the application or company logo\n   */\n  .header__logo ::slotted(*),\n  .header__logo syn-icon {\n    display: block;\n  }\n\n  /**\n   * Make sure to use the correct color and outline for links\n   */\n  .header__logo ::slotted(a),\n  .header__logo ::slotted(a:hover) {\n    color: var(--syn-logo-color);\n  }\n\n  .header__logo ::slotted(a:is(:focus-visible)) {\n    outline: var(--syn-focus-ring);\n    outline-offset: var(--syn-focus-ring-offset);\n  }\n\n  /**\n   * Styles for the default logo. This makes sure the default SICK logo has the correct size and color\n   */\n  .header__logo syn-icon,\n  .header__logo syn-icon::part(svg) {\n    color: var(--syn-logo-color);\n    height: 32px;\n    width: auto;\n  }\n\n  /**\n   * The label section hosts the application name\n   */\n  .header__label {\n    color: var(--syn-typography-color-text);\n    font: var(--syn-body-large-bold);\n    padding: 0 var(--syn-spacing-2x-large);\n    white-space: nowrap;\n  }\n\n  /**\n   * The options menu holds an arbitrary list of <syn-icon-button />\n   */\n  .header__meta-navigation {\n    display: flex;\n    flex: 1;\n    gap: var(--syn-spacing-x-small);\n    justify-content: end;\n  }\n\n  .header__meta-navigation ::slotted(*) {\n    color: var(--syn-interactive-quiet-color);\n    display: contents;\n    font-size: var(--syn-font-size-x-large);\n  }\n\n  /**\n   * The horizontal top navigation section\n   */\n  .header__navigation {\n    padding: 0 var(--syn-spacing-large);\n  }\n\n  /**\n   * The burger menu icon styles\n   */\n  .header__burger-menu-toggle {\n    align-items: center;\n    background: none;\n    border: none;\n    color: var(--syn-interactive-quiet-color);\n    cursor: pointer;\n    display: flex;\n    font-size: var(--syn-font-size-x-large);\n    margin-right: calc(var(--syn-spacing-medium) + var(--syn-spacing-2x-small));\n    padding: var(--syn-spacing-x-small);\n    transition: var(--syn-transition-x-fast) color;\n  }\n\n  .header__burger-menu-toggle:hover {\n    color: var(--syn-interactive-quiet-color-hover);\n  }\n\n  .header__burger-menu-toggle:active {\n    color: var(--syn-interactive-quiet-color-active);\n  }\n\n  .header__burger-menu-toggle:focus-visible {\n    outline: var(--syn-focus-ring);\n    outline-offset: var(--syn-focus-ring-offset);\n  }\n\n  /**\n   * If the burger menu is provided, use a smaller spacing on the left side\n   */\n  .header--has-burger-menu .header__content {\n    padding-left: var(--syn-spacing-medium);\n  }\n`;\n"],
-  "mappings": ";AAAA,SAAS,WAAW;AAEpB,IAAO,wBAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
-  "names": []
-}

package/dist/chunks/chunk.GFX23JLA.js

@@ -1,138 +0,0 @@
-// src/components/details/details.custom.styles.ts
-import { css } from "lit";
-var details_custom_styles_default = css`
-  .details {
-    background-color: unset;
-    border-color: var(--syn-panel-border-color);
-    border-radius: var(--syn-border-radius-none);
-    border-width: 0 0 var(--syn-border-width-small);
-  }
-
-  /** #429: Use token for opacity */
-  .details--disabled {
-    opacity: var(--syn-opacity-50);
-  }
-
-  .details__summary-icon {
-    align-self: flex-start;
-    color: var(--syn-color-neutral-950);
-    font-size: var(--syn-spacing-large);
-
-    /**
-     * As we are using an alignment of "start"  instead of "center" make sure
-     * the arrow starts on the same visual line as the first line of headline text
-     */
-    position: relative;
-    top: 2px;
-  }
-
-  .details .details__summary {
-    color: var(--syn-typography-color-text);
-  }
-
-  .details__header {
-    gap: var(--syn-spacing-medium);
-  }
-
-  /**
-   * As we are using top/down arrows for the details element,
-   * we have to adjust the rotation of the icon when the details is open.
-   */
-  .details--open .details__summary-icon {
-    rotate: var(--syn-details-open-rotation);
-  }
-
-  /**
-   * Adjustments for medium variant
-   */
-  .details--size-medium .details__header {
-    padding: var(--syn-spacing-medium-large) 0;
-  }
-
-  .details--size-medium .details__content {
-    font-size: var(--syn-font-size-small);
-    line-height: var(--syn-line-height-normal);
-    padding: var(--syn-spacing-medium) 0 var(--syn-spacing-large);
-  }
-
-  .details--size-medium .details__summary {
-    font: var(--syn-body-medium-bold);
-  }
-
-  .details--size-medium .details__summary::slotted(syn-icon) {
-    /* Avoid shrinking of the icon, if the text content of the summary is very long and multi line */
-    flex-shrink: 0;
-    font-size: var(--syn-spacing-large);
-    margin-right: var(--syn-spacing-small);
-  }
-
-  /**
-   * Adjustment for large variant
-   */
-  .details--size-large .details__header {
-    padding: var(--syn-spacing-large) 0;
-  }
-
-  .details--size-large .details__content {
-    font-size: var(--syn-font-size-medium);
-    line-height: var(--syn-line-height-normal);
-    padding: var(--syn-spacing-medium-large) 0 var(--syn-spacing-large);
-  }
-
-  .details--size-large .details__summary {
-    font: var(--syn-body-large-bold);
-  }
-
-  .details--size-large .details__summary-icon {
-    font-size: var(--syn-spacing-x-large);
-  }
-
-  .details--size-large .details__summary::slotted(syn-icon) {
-    /* Avoid shrinking of the icon, if the text content of the summary is very long and multi line */
-    flex-shrink: 0;
-    font-size: var(--syn-spacing-x-large);
-    margin-right: var(--syn-spacing-small);
-  }
-
-  /**
-   * Add a visually visible hover effect to the summary element
-   */
-  .details:not(.details--disabled) .details__header:hover .details__summary,
-  .details:not(.details--disabled) .details__header:hover .details__summary-icon {
-    color: var(--syn-color-primary-700);
-  }
-
-  /**
-   *  Contained style
-   */
-  .details--contained {
-    background-color: var(--syn-panel-background-color);
-    border-radius: var(--syn-border-radius-medium);
-    border-width: var(--syn-panel-border-width);
-  }
-
-  .details--contained .details__header:focus-visible {
-    border-radius: var(--syn-border-radius-medium);
-  }
-
-  .details--size-medium.details--contained .details__header {
-    padding: var(--syn-spacing-medium-large) var(--syn-spacing-large);
-  }
-
-  .details--size-medium.details--contained .details__content {
-    padding: var(--syn-spacing-medium) var(--syn-spacing-large) var(--syn-spacing-large);
-  }
-
-  .details--size-large.details--contained .details__header {
-    padding: var(--syn-spacing-large);
-  }
-
-  .details--size-large.details--contained .details__content {
-    padding: var(--syn-spacing-medium-large) var(--syn-spacing-large) var(--syn-spacing-large);
-  }
-`;
-
-export {
-  details_custom_styles_default
-};
-//# sourceMappingURL=chunk.GFX23JLA.js.map

package/dist/chunks/chunk.GFX23JLA.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/details/details.custom.styles.ts"],
-  "sourcesContent": ["import { css } from 'lit';\n\nexport default css`\n  .details {\n    background-color: unset;\n    border-color: var(--syn-panel-border-color);\n    border-radius: var(--syn-border-radius-none);\n    border-width: 0 0 var(--syn-border-width-small);\n  }\n\n  /** #429: Use token for opacity */\n  .details--disabled {\n    opacity: var(--syn-opacity-50);\n  }\n\n  .details__summary-icon {\n    align-self: flex-start;\n    color: var(--syn-color-neutral-950);\n    font-size: var(--syn-spacing-large);\n\n    /**\n     * As we are using an alignment of \"start\"  instead of \"center\" make sure\n     * the arrow starts on the same visual line as the first line of headline text\n     */\n    position: relative;\n    top: 2px;\n  }\n\n  .details .details__summary {\n    color: var(--syn-typography-color-text);\n  }\n\n  .details__header {\n    gap: var(--syn-spacing-medium);\n  }\n\n  /**\n   * As we are using top/down arrows for the details element,\n   * we have to adjust the rotation of the icon when the details is open.\n   */\n  .details--open .details__summary-icon {\n    rotate: var(--syn-details-open-rotation);\n  }\n\n  /**\n   * Adjustments for medium variant\n   */\n  .details--size-medium .details__header {\n    padding: var(--syn-spacing-medium-large) 0;\n  }\n\n  .details--size-medium .details__content {\n    font-size: var(--syn-font-size-small);\n    line-height: var(--syn-line-height-normal);\n    padding: var(--syn-spacing-medium) 0 var(--syn-spacing-large);\n  }\n\n  .details--size-medium .details__summary {\n    font: var(--syn-body-medium-bold);\n  }\n\n  .details--size-medium .details__summary::slotted(syn-icon) {\n    /* Avoid shrinking of the icon, if the text content of the summary is very long and multi line */\n    flex-shrink: 0;\n    font-size: var(--syn-spacing-large);\n    margin-right: var(--syn-spacing-small);\n  }\n\n  /**\n   * Adjustment for large variant\n   */\n  .details--size-large .details__header {\n    padding: var(--syn-spacing-large) 0;\n  }\n\n  .details--size-large .details__content {\n    font-size: var(--syn-font-size-medium);\n    line-height: var(--syn-line-height-normal);\n    padding: var(--syn-spacing-medium-large) 0 var(--syn-spacing-large);\n  }\n\n  .details--size-large .details__summary {\n    font: var(--syn-body-large-bold);\n  }\n\n  .details--size-large .details__summary-icon {\n    font-size: var(--syn-spacing-x-large);\n  }\n\n  .details--size-large .details__summary::slotted(syn-icon) {\n    /* Avoid shrinking of the icon, if the text content of the summary is very long and multi line */\n    flex-shrink: 0;\n    font-size: var(--syn-spacing-x-large);\n    margin-right: var(--syn-spacing-small);\n  }\n\n  /**\n   * Add a visually visible hover effect to the summary element\n   */\n  .details:not(.details--disabled) .details__header:hover .details__summary,\n  .details:not(.details--disabled) .details__header:hover .details__summary-icon {\n    color: var(--syn-color-primary-700);\n  }\n\n  /**\n   *  Contained style\n   */\n  .details--contained {\n    background-color: var(--syn-panel-background-color);\n    border-radius: var(--syn-border-radius-medium);\n    border-width: var(--syn-panel-border-width);\n  }\n\n  .details--contained .details__header:focus-visible {\n    border-radius: var(--syn-border-radius-medium);\n  }\n\n  .details--size-medium.details--contained .details__header {\n    padding: var(--syn-spacing-medium-large) var(--syn-spacing-large);\n  }\n\n  .details--size-medium.details--contained .details__content {\n    padding: var(--syn-spacing-medium) var(--syn-spacing-large) var(--syn-spacing-large);\n  }\n\n  .details--size-large.details--contained .details__header {\n    padding: var(--syn-spacing-large);\n  }\n\n  .details--size-large.details--contained .details__content {\n    padding: var(--syn-spacing-medium-large) var(--syn-spacing-large) var(--syn-spacing-large);\n  }\n`;\n"],
-  "mappings": ";AAAA,SAAS,WAAW;AAEpB,IAAO,gCAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;",
-  "names": []
-}

package/dist/chunks/chunk.TAZAKWO5.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/components/details/details.component.ts"],
-  "sourcesContent": ["/* eslint-disable */\nimport { animateTo, shimKeyframesHeightAuto, stopAnimations } from '../../internal/animate.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { getAnimation, setDefaultAnimation } from '../../utilities/animation-registry.js';\nimport { html } from 'lit';\nimport { LocalizeController } from '../../utilities/localize.js';\nimport { property, query } from 'lit/decorators.js';\nimport { waitForEvent } from '../../internal/event.js';\nimport { watch } from '../../internal/watch.js';\nimport componentStyles from '../../styles/component.styles.js';\nimport SynergyElement from '../../internal/synergy-element.js';\nimport SynIcon from '../icon/icon.component.js';\nimport styles from './details.styles.js';\nimport customStyles from './details.custom.styles.js';\nimport type { CSSResultGroup } from 'lit';\nimport { enableDefaultSettings } from '../../utilities/defaultSettings/decorator.js';\n\n/**\n * @summary Details show a brief summary and expand to show additional content.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-details--docs\n * @status stable\n * @since 2.0\n *\n * @dependency syn-icon\n *\n * @slot - The details' main content.\n * @slot summary - The details' summary. Alternatively, you can use the `summary` attribute.\n * @slot expand-icon - Optional expand icon to use instead of the default. Works best with `<syn-icon>`.\n * @slot collapse-icon - Optional collapse icon to use instead of the default. Works best with `<syn-icon>`.\n *\n * @event syn-show - Emitted when the details opens.\n * @event syn-after-show - Emitted after the details opens and all animations are complete.\n * @event syn-hide - Emitted when the details closes.\n * @event syn-after-hide - Emitted after the details closes and all animations are complete.\n *\n * @csspart base - The component's base wrapper.\n * @csspart header - The header that wraps both the summary and the expand/collapse icon.\n * @csspart summary - The container that wraps the summary.\n * @csspart summary-icon - The container that wraps the expand/collapse icons.\n * @csspart content - The details content.\n * @csspart body - The container that wraps the details content.\n *\n * @animation details.show - The animation to use when showing details. You can use `height: auto` with this animation.\n * @animation details.hide - The animation to use when hiding details. You can use `height: auto` with this animation.\n *\n * @cssproperty --syn-details-open-rotation - The rotation angle of the summary icon when the details is open.\n */\n@enableDefaultSettings('SynDetails')\nexport default class SynDetails extends SynergyElement {\n  static styles: CSSResultGroup = [componentStyles, styles, customStyles];\n\n  static dependencies = {\n    'syn-icon': SynIcon\n  };\n\n  private readonly localize = new LocalizeController(this);\n\n  @query('.details') details: HTMLDetailsElement;\n  @query('.details__header') header: HTMLElement;\n  @query('.details__body') body: HTMLElement;\n  @query('.details__expand-icon-slot') expandIconSlot: HTMLSlotElement;\n\n  detailsObserver: MutationObserver;\n\n  /**\n   * Indicates whether or not the details is open. You can toggle this attribute to show and hide the details, or you\n   * can use the `show()` and `hide()` methods and this attribute will reflect the details' open state.\n   */\n  @property({ type: Boolean, reflect: true }) open = false;\n\n  /** The summary to show in the header. If you need to display HTML, use the `summary` slot instead. */\n  @property() summary: string;\n\n  /** Disables the details so it can't be toggled. */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /** Draws the details as contained element. */\n  @property({ type: Boolean, reflect: true }) contained = false;\n\n  /** The details's size. */\n  @property({ reflect: true }) size: 'medium' | 'large' = 'medium';\n\n  firstUpdated() {\n    this.body.style.height = this.open ? 'auto' : '0';\n    if (this.open) {\n      this.details.open = true;\n    }\n\n    this.detailsObserver = new MutationObserver(changes => {\n      for (const change of changes) {\n        if (change.type === 'attributes' && change.attributeName === 'open') {\n          if (this.details.open) {\n            this.show();\n          } else {\n            this.hide();\n          }\n        }\n      }\n    });\n    this.detailsObserver.observe(this.details, { attributes: true });\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.detailsObserver?.disconnect();\n  }\n\n  private handleSummaryClick(event: MouseEvent) {\n    event.preventDefault();\n\n    if (!this.disabled) {\n      if (this.open) {\n        this.hide();\n      } else {\n        this.show();\n      }\n      this.header.focus();\n    }\n  }\n\n  private handleSummaryKeyDown(event: KeyboardEvent) {\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault();\n\n      if (this.open) {\n        this.hide();\n      } else {\n        this.show();\n      }\n    }\n\n    if (event.key === 'ArrowUp' || event.key === 'ArrowLeft') {\n      event.preventDefault();\n      this.hide();\n    }\n\n    if (event.key === 'ArrowDown' || event.key === 'ArrowRight') {\n      event.preventDefault();\n      this.show();\n    }\n  }\n\n  @watch('open', { waitUntilFirstUpdate: true })\n  async handleOpenChange() {\n    if (this.open) {\n      this.details.open = true;\n      // Show\n      const slShow = this.emit('syn-show', { cancelable: true });\n      if (slShow.defaultPrevented) {\n        this.open = false;\n        this.details.open = false;\n        return;\n      }\n\n      await stopAnimations(this.body);\n\n      const { keyframes, options } = getAnimation(this, 'details.show', { dir: this.localize.dir() });\n      await animateTo(this.body, shimKeyframesHeightAuto(keyframes, this.body.scrollHeight), options);\n      this.body.style.height = 'auto';\n\n      this.emit('syn-after-show');\n    } else {\n      // Hide\n      const slHide = this.emit('syn-hide', { cancelable: true });\n      if (slHide.defaultPrevented) {\n        this.details.open = true;\n        this.open = true;\n        return;\n      }\n\n      await stopAnimations(this.body);\n\n      const { keyframes, options } = getAnimation(this, 'details.hide', { dir: this.localize.dir() });\n      await animateTo(this.body, shimKeyframesHeightAuto(keyframes, this.body.scrollHeight), options);\n      this.body.style.height = 'auto';\n\n      this.details.open = false;\n      this.emit('syn-after-hide');\n    }\n  }\n\n  /** Shows the details. */\n  async show() {\n    if (this.open || this.disabled) {\n      return undefined;\n    }\n\n    this.open = true;\n    return waitForEvent(this, 'syn-after-show');\n  }\n\n  /** Hides the details */\n  async hide() {\n    if (!this.open || this.disabled) {\n      return undefined;\n    }\n\n    this.open = false;\n    return waitForEvent(this, 'syn-after-hide');\n  }\n\n  render() {\n    return html`\n      <details\n        part=\"base\"\n        class=${classMap({\n          details: true,\n          'details--size-medium': this.size === 'medium',\n          'details--size-large': this.size === 'large',\n          'details--open': this.open,\n          'details--disabled': this.disabled,\n          'details--contained': this.contained,\n        })}\n      >\n        <summary\n          part=\"header\"\n          id=\"header\"\n          class=\"details__header\"\n          role=\"button\"\n          aria-expanded=${this.open ? 'true' : 'false'}\n          aria-controls=\"content\"\n          aria-disabled=${this.disabled ? 'true' : 'false'}\n          tabindex=${this.disabled ? '-1' : '0'}\n          @click=${this.handleSummaryClick}\n          @keydown=${this.handleSummaryKeyDown}\n        >\n          <slot name=\"summary\" part=\"summary\" class=\"details__summary\">${this.summary}</slot>\n\n          <span part=\"summary-icon\" class=\"details__summary-icon\">\n            <slot name=\"expand-icon\">\n              <syn-icon library=\"system\" name=\"details-open\"></syn-icon>\n            </slot>\n            <slot name=\"collapse-icon\">\n              <syn-icon library=\"system\" name=\"details-close\"></syn-icon>\n            </slot>\n          </span>\n        </summary>\n\n        <div class=\"details__body\" part=\"body\" role=\"region\" aria-labelledby=\"header\">\n          <slot part=\"content\" id=\"content\" class=\"details__content\"></slot>\n        </div>\n      </details>\n    `;\n  }\n}\n\nsetDefaultAnimation('details.show', {\n  keyframes: [\n    { height: '0', opacity: '0' },\n    { height: 'auto', opacity: '1' }\n  ],\n  options: { duration: 250, easing: 'linear' }\n});\n\nsetDefaultAnimation('details.hide', {\n  keyframes: [\n    { height: 'auto', opacity: '1' },\n    { height: '0', opacity: '0' }\n  ],\n  options: { duration: 250, easing: 'linear' }\n});\n"],
-  "mappings": "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",
-  "names": []
-}

package/dist/components/details/details.custom.styles.d.ts

@@ -1,2 +0,0 @@
-declare const _default: import("lit").CSSResult;
-export default _default;

package/dist/components/details/details.custom.styles.js

@@ -1,8 +0,0 @@
-import {
-  details_custom_styles_default
-} from "../../chunks/chunk.GFX23JLA.js";
-import "../../chunks/chunk.MO2GTRUM.js";
-export {
-  details_custom_styles_default as default
-};
-//# sourceMappingURL=details.custom.styles.js.map

package/dist/components/details/details.custom.styles.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": [],
-  "sourcesContent": [],
-  "mappings": "",
-  "names": []
-}