@fabric-msft/fabric-web 4.0.0-beta.1 → 5.0.0

package/dist/esm/components/accordion-menu-panel/accordion-menu-panel.js

@@ -1,14 +1,15 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
+import { observable, attr, FASTElement, Updates } from '@microsoft/fast-element';
+import { keyEscape, keySpace, keyEnter, uniqueId } from '@microsoft/fast-web-utilities';
+import { toggleState } from '../../util/element-internals.js';
+import '../menu-list/menu-list.js';
+
+var __decorate = globalThis && globalThis.__decorate || function (decorators, target, key, desc) {
+  var c = arguments.length,
+    r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
+    d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { attr, FASTElement, observable, Updates } from "@microsoft/fast-element";
-import { keyEnter, keySpace, keyEscape, uniqueId } from "@microsoft/fast-web-utilities";
-import { StartEnd } from "@fluentui/web-components";
-import { applyMixins } from "../../util/apply-mixins";
-import { toggleState } from "../../util/element-internals";
 /**
  * AccordionMenuPanel
  * @summary An AccordionMenuPanel component that provides expandable and collapsible sections within an accordion menu.
@@ -68,192 +69,187 @@ import { toggleState } from "../../util/element-internals";
  * @tagname fabric-accordion-menu-panel
  * @public
  */
-export class AccordionMenuPanel extends FASTElement {
-    /** Constructor for the AccordionMenuPanel component. */
-    constructor() {
-        super();
-        /** Internal element state used to manage the component. */
-        this.elementInternals = this.attachInternals();
-        /** The menu list element if present */
-        this.menuList = [];
-        /**
-         * Handles click events.
-         * @param e - The click event.
-         */
-        this.handleClick = (e) => {
-            if (this.disabled) {
-                e.preventDefault();
-                return;
-            }
-            this.expanded = !this.expanded;
-        };
-        /**
-         * Handles keydown events.
-         * @param e - The keyboard event.
-         */
-        this.handleKeyDown = (e) => {
-            var _a;
-            if (e.defaultPrevented) {
-                return;
-            }
-            if (e.key === "Tab") {
-                return true;
-            }
-            switch (e.key) {
-                case keyEnter:
-                case keySpace:
-                    e.preventDefault();
-                    this.expanded = !this.expanded;
-                    break;
-                case keyEscape:
-                    if (this.expanded) {
-                        e.preventDefault();
-                        this.expanded = false;
-                        (_a = this.headingElement) === null || _a === void 0 ? void 0 : _a.focus();
-                    }
-                    break;
-                default:
-                    return;
-            }
-        };
-        /**
-         * Expands or collapses the item.
-         *
-         * @public
-         * @remarks
-         * HTML attribute: expanded
-         */
-        this.expanded = false;
-        /**
-         * Disables an accordion item
-         *
-         * @public
-         * @remarks
-         * HTML attribute: disabled
-         */
-        this.disabled = false;
-        /**
-         * The item ID
-         *
-         * @public
-         * @remarks
-         * HTML Attribute: id
-         */
-        this.id = uniqueId("accordion-");
-        /**
-         * Sets the width of the focus state.
-         *
-         * @public
-         * @remarks
-         * HTML Attribute: block
-         */
-        this.block = false;
-        this.elementInternals.role = "button";
-    }
-    /** Lifecycle method called when the component is connected to the DOM. */
-    connectedCallback() {
-        super.connectedCallback();
-    }
-    /** Lifecycle method called when the component is disconnected from the DOM. */
-    disconnectedCallback() {
-        super.disconnectedCallback();
-    }
+class AccordionMenuPanel extends FASTElement {
+  /** Constructor for the AccordionMenuPanel component. */
+  constructor() {
+    super();
+    /** Internal element state used to manage the component. */
+    this.elementInternals = this.attachInternals();
+    /** The menu list element if present */
+    this.menuList = [];
     /**
-     * Focus the first menu item in the menu list
+     * Handles click events.
+     * @param e - The click event.
      */
-    focusFirstMenuItem() {
-        if (!this.menuList) {
-            return;
-        }
-        Updates.enqueue(() => {
-            var _a;
-            if (this.menuList) {
-                const menuList = this.menuList;
-                if ((_a = menuList[0]) === null || _a === void 0 ? void 0 : _a.menuItems) {
-                    const menuItem = menuList[0].menuItems[0];
-                    menuItem.focus();
-                }
-            }
-        });
-    }
+    this.handleClick = e => {
+      if (this.disabled) {
+        e.preventDefault();
+        return;
+      }
+      this.expanded = !this.expanded;
+    };
     /**
-     * Handles expanded changes
-     * @param prev - previous value
-     * @param next - next value
+     * Handles keydown events.
+     * @param e - The keyboard event.
      */
-    expandedChanged(prev, next) {
-        if (next !== prev) {
-            toggleState(this.elementInternals, "expanded", next);
-            this.$emit("expanded-change", { expanded: next });
-            if (next) {
-                console.log("next", next);
-                this.focusFirstMenuItem();
-            }
-        }
-    }
+    this.handleKeyDown = e => {
+      var _a;
+      if (e.defaultPrevented) {
+        return;
+      }
+      if (e.key === "Tab") {
+        return true;
+      }
+      switch (e.key) {
+        case keyEnter:
+        case keySpace:
+          e.preventDefault();
+          this.expanded = !this.expanded;
+          break;
+        case keyEscape:
+          if (this.expanded) {
+            e.preventDefault();
+            this.expanded = false;
+            (_a = this.headingElement) === null || _a === void 0 ? void 0 : _a.focus();
+          }
+          break;
+        default:
+          return;
+      }
+    };
     /**
-     * Handles disabled changes
-     * @param prev - previous value
-     * @param next - next value
+     * Expands or collapses the item.
+     *
+     * @public
+     * @remarks
+     * HTML attribute: expanded
      */
-    disabledChanged(prev, next) {
-        toggleState(this.elementInternals, "disabled", next);
-    }
+    this.expanded = false;
     /**
-     * Handles changes to size attribute
-     * @param prev - previous value
-     * @param next - next value
+     * Disables an accordion item
+     *
+     * @public
+     * @remarks
+     * HTML attribute: disabled
      */
-    sizeChanged(prev, next) {
-        if (prev) {
-            toggleState(this.elementInternals, prev, false);
-        }
-        if (next) {
-            toggleState(this.elementInternals, next, true);
-        }
-    }
+    this.disabled = false;
     /**
-     * Handles changes to block attribute
-     * @param prev - previous value
-     * @param next - next value
+     * The item ID
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: id
      */
-    blockChanged(prev, next) {
-        toggleState(this.elementInternals, "block", next);
-    }
+    this.id = uniqueId("accordion-");
     /**
-     * Handles changes to marker-position attribute
-     * @param prev - previous value
-     * @param next - next value
+     * Sets the width of the focus state.
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: block
      */
-    markerPositionChanged(prev, next) {
-        if (prev) {
-            toggleState(this.elementInternals, `align-${prev}`, false);
-        }
-        if (next) {
-            toggleState(this.elementInternals, `align-${next}`, true);
+    this.block = false;
+    this.elementInternals.role = "button";
+  }
+  /** Lifecycle method called when the component is connected to the DOM. */
+  connectedCallback() {
+    super.connectedCallback();
+  }
+  /** Lifecycle method called when the component is disconnected from the DOM. */
+  disconnectedCallback() {
+    super.disconnectedCallback();
+  }
+  /**
+   * Focus the first menu item in the menu list
+   */
+  focusFirstMenuItem() {
+    if (!this.menuList) {
+      return;
+    }
+    Updates.enqueue(() => {
+      var _a;
+      if (this.menuList) {
+        const menuList = this.menuList;
+        if ((_a = menuList[0]) === null || _a === void 0 ? void 0 : _a.menuItems) {
+          const menuItem = menuList[0].menuItems[0];
+          menuItem.focus();
         }
+      }
+    });
+  }
+  /**
+   * Handles expanded changes
+   * @param prev - previous value
+   * @param next - next value
+   */
+  expandedChanged(prev, next) {
+    if (next !== prev) {
+      toggleState(this.elementInternals, "expanded", next);
+      this.$emit("expanded-change", {
+        expanded: next
+      });
+      if (next) {
+        this.focusFirstMenuItem();
+      }
+    }
+  }
+  /**
+   * Handles disabled changes
+   * @param prev - previous value
+   * @param next - next value
+   */
+  disabledChanged(prev, next) {
+    toggleState(this.elementInternals, "disabled", next);
+  }
+  /**
+   * Handles changes to size attribute
+   * @param prev - previous value
+   * @param next - next value
+   */
+  sizeChanged(prev, next) {
+    if (prev) {
+      toggleState(this.elementInternals, prev, false);
+    }
+    if (next) {
+      toggleState(this.elementInternals, next, true);
+    }
+  }
+  /**
+   * Handles changes to block attribute
+   * @param prev - previous value
+   * @param next - next value
+   */
+  blockChanged(prev, next) {
+    toggleState(this.elementInternals, "block", next);
+  }
+  /**
+   * Handles changes to marker-position attribute
+   * @param prev - previous value
+   * @param next - next value
+   */
+  markerPositionChanged(prev, next) {
+    if (prev) {
+      toggleState(this.elementInternals, `align-${prev}`, false);
+    }
+    if (next) {
+      toggleState(this.elementInternals, `align-${next}`, true);
     }
+  }
 }
-__decorate([
-    observable
-], AccordionMenuPanel.prototype, "menuList", void 0);
-__decorate([
-    attr({ mode: "boolean" })
-], AccordionMenuPanel.prototype, "expanded", void 0);
-__decorate([
-    attr({ mode: "boolean" })
-], AccordionMenuPanel.prototype, "disabled", void 0);
-__decorate([
-    attr
-], AccordionMenuPanel.prototype, "id", void 0);
-__decorate([
-    attr
-], AccordionMenuPanel.prototype, "size", void 0);
-__decorate([
-    attr({ mode: "boolean" })
-], AccordionMenuPanel.prototype, "block", void 0);
-__decorate([
-    attr({ attribute: "marker-position" })
-], AccordionMenuPanel.prototype, "markerPosition", void 0);
-applyMixins(AccordionMenuPanel, StartEnd);
-//# sourceMappingURL=accordion-menu-panel.js.map
+__decorate([observable], AccordionMenuPanel.prototype, "menuList", void 0);
+__decorate([attr({
+  mode: "boolean"
+})], AccordionMenuPanel.prototype, "expanded", void 0);
+__decorate([attr({
+  mode: "boolean"
+})], AccordionMenuPanel.prototype, "disabled", void 0);
+__decorate([attr], AccordionMenuPanel.prototype, "id", void 0);
+__decorate([attr], AccordionMenuPanel.prototype, "size", void 0);
+__decorate([attr({
+  mode: "boolean"
+})], AccordionMenuPanel.prototype, "block", void 0);
+__decorate([attr({
+  attribute: "marker-position"
+})], AccordionMenuPanel.prototype, "markerPosition", void 0);
+
+export { AccordionMenuPanel };

package/dist/esm/components/accordion-menu-panel/accordion-menu-panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"accordion-menu-panel.js","sourceRoot":"","sources":["../../../../../../../src/components/accordion-menu-panel/accordion-menu-panel.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"accordion-menu-panel.js","sourceRoot":"","sources":["../../../../../../../src/components/accordion-menu-panel/accordion-menu-panel.ts"],"names":[],"mappings":"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"}

package/dist/esm/components/accordion-menu-panel/accordion-menu-panel.options.js

@@ -1,17 +1,20 @@
 /**
  * An Accordion Menu Panel header font size can be small, medium, large, and extra-large
+ * @public
  */
-export const AccordionMenuPanelSize = {
-    small: "small",
-    medium: "medium",
-    large: "large",
-    extraLarge: "extra-large"
+const AccordionMenuPanelSizes = {
+  small: "small",
+  medium: "medium",
+  large: "large",
+  extraLarge: "extra-large"
 };
 /**
  * An Accordion Menu Panel expand/collapse icon can appear at the start or end of the accordion
+ * @public
  */
-export const AccordionMenuPanelMarkerPosition = {
-    start: "start",
-    end: "end"
+const AccordionMenuPanelMarkerPositions = {
+  start: "start",
+  end: "end"
 };
-//# sourceMappingURL=accordion-menu-panel.options.js.map
+
+export { AccordionMenuPanelMarkerPositions, AccordionMenuPanelSizes };

package/dist/esm/components/accordion-menu-panel/accordion-menu-panel.options.js.map

@@ -1 +1 @@
-{"version":3,"file":"accordion-menu-panel.options.js","sourceRoot":"","sources":["../../../../../../../src/components/accordion-menu-panel/accordion-menu-panel.options.ts"],"names":[],"mappings":"AAKA;;GAEG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG;IACpC,KAAK,EAAE,OAAO;IACd,MAAM,EAAE,QAAQ;IAChB,KAAK,EAAE,OAAO;IACd,UAAU,EAAE,aAAa;CACjB,CAAC;AAQX;;GAEG;AACH,MAAM,CAAC,MAAM,gCAAgC,GAAG;IAC9C,KAAK,EAAE,OAAO;IACd,GAAG,EAAE,KAAK;CACF,CAAC"}
+{"version":3,"file":"accordion-menu-panel.options.js","sourceRoot":"","sources":["../../../../../../../src/components/accordion-menu-panel/accordion-menu-panel.options.ts"],"names":[],"mappings":"AAEA;;;GAGG;AACH,MAAM,CAAC,MAAM,uBAAuB,GAAG;IACrC,KAAK,EAAE,OAAO;IACd,MAAM,EAAE,QAAQ;IAChB,KAAK,EAAE,OAAO;IACd,UAAU,EAAE,aAAa;CACjB,CAAC;AAQX;;;GAGG;AACH,MAAM,CAAC,MAAM,iCAAiC,GAAG;IAC/C,KAAK,EAAE,OAAO;IACd,GAAG,EAAE,KAAK;CACF,CAAC"}

package/dist/esm/components/accordion-menu-panel/accordion-menu-panel.styles.js

@@ -1,156 +1,13 @@
-import { css } from "@microsoft/fast-element";
-import { alignEndState, disabledState, expandedState, extraLargeState, largeState, smallState } from "../styles/states/states";
-import { borderRadiusMedium, colorNeutralBackground1Hover, colorNeutralForeground1, colorNeutralForeground2Hover, colorNeutralForeground2Pressed, colorNeutralForegroundDisabled, colorStrokeFocus2, colorTransparentBackground, fontFamilyBase, fontSizeBase200, fontSizeBase300, fontSizeBase400, fontSizeBase500, fontWeightRegular, lineHeightBase200, lineHeightBase300, lineHeightBase400, lineHeightBase500, spacingHorizontalS, spacingHorizontalSNudge, spacingHorizontalXS, display, colorNeutralBackground1Pressed } from "@fluentui/web-components";
-export const styles = css `
-  ${display("block")}
-
-  :host {
-    contain: content;
-    position: relative;
-  }
-
-  :host(:focus-visible) {
-    outline: none;
-  }
-
-  :host(:focus-visible) .heading {
-    border-radius: ${borderRadiusMedium};
-    outline: 2px solid ${colorStrokeFocus2};
-  }
-
-  :host([marker-position="start"]) .heading {
-    flex-direction: row-reverse;
-  }
-
-  :host([marker-position="end"]) .heading {
-    flex-direction: row;
-  }
-
-  .heading {
-    display: flex;
-    justify-content: space-between;
-    height: 32px;
-    align-items: center;
-    position: relative;
-    padding-inline: ${spacingHorizontalS} ${spacingHorizontalS};
-    border-radius: ${borderRadiusMedium};
-    font-family: ${fontFamilyBase};
-    font-size: ${fontSizeBase300};
-    font-weight: ${fontWeightRegular};
-    line-height: ${lineHeightBase300};
-    grid-template-columns: auto auto 1fr auto;
-    padding: 0px 10px;
-    margin: 1px;
-    gap: ${spacingHorizontalXS};
-    cursor: pointer;
-    color: ${colorNeutralForeground1};
-    background: ${colorTransparentBackground};
-    transition: background-color 0.2s ease-in-out;
-  }
-
-  .heading * {
-    pointer-events: none;
-  }
-
-  .heading:hover {
-    background: ${colorNeutralBackground1Hover};
-    color: ${colorNeutralForeground2Hover};
-  }
-
-  .heading:active {
-    background: ${colorNeutralBackground1Pressed};
-    color: ${colorNeutralForeground2Pressed};
-  }
-
-  .heading-content {
-    flex: 1;
-    display: flex;
-    align-items: center;
-  }
-
-  .content {
-    display: none;
-  }
-
-  :where(.default-marker-collapsed, .default-marker-expanded),
-  ::slotted(:is([slot="marker-collapsed"], [slot="marker-expanded"])) {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    pointer-events: none;
-    position: relative;
-    height: 100%;
-    transition: transform 0.2s ease-in-out;
-  }
+import { css } from '@microsoft/fast-element';
+import { disabledState, expandedState, smallState, largeState, extraLargeState, alignEndState } from '../styles/states/states.js';
+import { display, borderRadiusMedium, colorStrokeFocus2, spacingHorizontalS, fontFamilyBase, fontSizeBase300, fontWeightRegular, lineHeightBase300, spacingHorizontalMNudge, spacingHorizontalXS, colorNeutralForeground1, colorTransparentBackground, colorNeutralBackground1Hover, colorNeutralForeground2Hover, colorNeutralBackground1Pressed, colorNeutralForeground2Pressed, colorNeutralForegroundDisabled, fontSizeBase200, lineHeightBase200, fontSizeBase400, lineHeightBase400, fontSizeBase500, lineHeightBase500, spacingHorizontalXXS, spacingHorizontalSNudge } from '@fluentui/web-components';
+import { sizeVerticalXXXL } from '@fabric-msft/theme';
 
-  ::slotted([slot="start"]) {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    padding-right: ${spacingHorizontalS};
-  }
-
-  :host(${disabledState}) .heading {
-    color: ${colorNeutralForegroundDisabled};
-    cursor: not-allowed;
-  }
-
-  :host(${disabledState}) svg {
-    filter: invert(89%) sepia(0%) saturate(569%) hue-rotate(155deg)
-      brightness(88%) contrast(87%);
-  }
-
-  :host(${expandedState}) .content {
-    display: block;
-  }
-
-  :host(${expandedState}) .default-marker-collapsed,
-  :host(${expandedState}) ::slotted([slot="marker-collapsed"]),
-  :host(:not(${expandedState})) :is(.default-marker-expanded, .content),
-  :host(:not(${expandedState})) ::slotted([slot="marker-expanded"]) {
-    display: none;
-  }
-
-  :host(${expandedState}) ::slotted([slot="marker-expanded"]),
-  :host(:not(${expandedState})) ::slotted([slot="marker-collapsed"]) {
-    display: flex;
-  }
-
-  :host(${smallState}) .heading {
-    font-size: ${fontSizeBase200};
-    line-height: ${lineHeightBase200};
-  }
-
-  :host(${largeState}) .heading {
-    font-size: ${fontSizeBase400};
-    line-height: ${lineHeightBase400};
-  }
-
-  :host(${extraLargeState}) .heading {
-    font-size: ${fontSizeBase500};
-    line-height: ${lineHeightBase500};
-  }
-
-  :host(${alignEndState}) :slotted([slot="start"]) {
-    grid-column: 1 / span 1;
-  }
-
-  :host(${alignEndState})
-    :is(.default-marker-collapsed, .default-marker-expanded) {
-    padding-inline-start: ${spacingHorizontalS};
-    padding-inline-end: 2px;
-  }
-
-  :host([block]) {
-    max-width: 100%;
-  }
+const styles = css`
+  ${display("block")}
 
-  :host(${alignEndState}) .heading {
-    padding-inline: ${spacingHorizontalS};
-  }
+  :host{contain:content;position:relative}:host(:focus-visible){outline:none}:host(:focus-visible) .heading{border-radius:${borderRadiusMedium};outline:2px solid ${colorStrokeFocus2}}:host([marker-position="start"]) .heading{flex-direction:row-reverse}:host([marker-position="end"]) .heading{flex-direction:row}.heading{display:flex;justify-content:space-between;height:${sizeVerticalXXXL};align-items:center;position:relative;padding-inline:${spacingHorizontalS} ${spacingHorizontalS};border-radius:${borderRadiusMedium};font-family:${fontFamilyBase};font-size:${fontSizeBase300};font-weight:${fontWeightRegular};line-height:${lineHeightBase300};grid-template-columns:auto auto 1fr auto;padding:0px ${spacingHorizontalMNudge};margin:1px;gap:${spacingHorizontalXS};cursor:pointer;color:${colorNeutralForeground1};background:${colorTransparentBackground};transition:background-color 0.2s ease-in-out}.heading *{pointer-events:none}.heading:hover{background:${colorNeutralBackground1Hover};color:${colorNeutralForeground2Hover}}.heading:active{background:${colorNeutralBackground1Pressed};color:${colorNeutralForeground2Pressed}}.heading-content{flex:1;display:flex;align-items:center}.content{display:none}:where(.default-marker-collapsed,.default-marker-expanded),::slotted(:is([slot="marker-collapsed"],[slot="marker-expanded"])){display:flex;align-items:center;justify-content:center;pointer-events:none;position:relative;height:100%;transition:transform 0.2s ease-in-out}::slotted([slot="start"]){display:flex;justify-content:center;align-items:center;padding-inline-end:${spacingHorizontalS}}:host(${disabledState}) .heading{color:${colorNeutralForegroundDisabled};cursor:not-allowed}:host(${disabledState}) svg{filter:invert(89%) sepia(0%) saturate(569%) hue-rotate(155deg)
+      brightness(88%) contrast(87%)}:host(${expandedState}) .content{display:block}:host(${expandedState}) .default-marker-collapsed,:host(${expandedState}) ::slotted([slot="marker-collapsed"]),:host(:not(${expandedState})) :is(.default-marker-expanded,.content),:host(:not(${expandedState})) ::slotted([slot="marker-expanded"]){display:none}:host(${expandedState}) ::slotted([slot="marker-expanded"]),:host(:not(${expandedState})) ::slotted([slot="marker-collapsed"]){display:flex}:host(${smallState}) .heading{font-size:${fontSizeBase200};line-height:${lineHeightBase200}}:host(${largeState}) .heading{font-size:${fontSizeBase400};line-height:${lineHeightBase400}}:host(${extraLargeState}) .heading{font-size:${fontSizeBase500};line-height:${lineHeightBase500}}:host(${alignEndState}) :slotted([slot="start"]){grid-column:1 / span 1}:host(${alignEndState})
+    :is(.default-marker-collapsed,.default-marker-expanded){padding-inline-start:${spacingHorizontalS};padding-inline-end:${spacingHorizontalXXS}}:host([block]){max-width:100%}:host(${alignEndState}) .heading{padding-inline:${spacingHorizontalS}}:host(${alignEndState}:has([slot='start'])) .heading{padding-inline:${spacingHorizontalSNudge} ${spacingHorizontalS}}`;
 
-  :host(${alignEndState}:has([slot='start'])) .heading {
-    padding-inline: ${spacingHorizontalSNudge} ${spacingHorizontalS};
-  }
-`;
-//# sourceMappingURL=accordion-menu-panel.styles.js.map
+export { styles };

package/dist/esm/components/accordion-menu-panel/accordion-menu-panel.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"accordion-menu-panel.styles.js","sourceRoot":"","sources":["../../../../../../../src/components/accordion-menu-panel/accordion-menu-panel.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EACL,aAAa,EAEb,aAAa,EACb,aAAa,EACb,eAAe,EACf,UAAU,EACV,UAAU,EACX,MAAM,yBAAyB,CAAC;AACjC,OAAO,EACL,kBAAkB,EAElB,4BAA4B,EAE5B,uBAAuB,EACvB,4BAA4B,EAC5B,8BAA8B,EAC9B,8BAA8B,EAC9B,iBAAiB,EACjB,0BAA0B,EAC1B,cAAc,EACd,eAAe,EACf,eAAe,EACf,eAAe,EACf,eAAe,EACf,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,kBAAkB,EAClB,uBAAuB,EACvB,mBAAmB,EACnB,OAAO,EACP,8BAA8B,EAC/B,MAAM,0BAA0B,CAAC;AAElC,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,OAAO,CAAC;;;;;;;;;;;;qBAYC,kBAAkB;yBACd,iBAAiB;;;;;;;;;;;;;;;;;sBAiBpB,kBAAkB,IAAI,kBAAkB;qBACzC,kBAAkB;mBACpB,cAAc;iBAChB,eAAe;mBACb,iBAAiB;mBACjB,iBAAiB;;;;WAIzB,mBAAmB;;aAEjB,uBAAuB;kBAClB,0BAA0B;;;;;;;;;kBAS1B,4BAA4B;aACjC,4BAA4B;;;;kBAIvB,8BAA8B;aACnC,8BAA8B;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBA4BtB,kBAAkB;;;UAG7B,aAAa;aACV,8BAA8B;;;;UAIjC,aAAa;;;;;UAKb,aAAa;;;;UAIb,aAAa;UACb,aAAa;eACR,aAAa;eACb,aAAa;;;;UAIlB,aAAa;eACR,aAAa;;;;UAIlB,UAAU;iBACH,eAAe;mBACb,iBAAiB;;;UAG1B,UAAU;iBACH,eAAe;mBACb,iBAAiB;;;UAG1B,eAAe;iBACR,eAAe;mBACb,iBAAiB;;;UAG1B,aAAa;;;;UAIb,aAAa;;4BAEK,kBAAkB;;;;;;;;UAQpC,aAAa;sBACD,kBAAkB;;;UAG9B,aAAa;sBACD,uBAAuB,IAAI,kBAAkB;;CAElE,CAAC"}
+{"version":3,"file":"accordion-menu-panel.styles.js","sourceRoot":"","sources":["../../../../../../../src/components/accordion-menu-panel/accordion-menu-panel.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EACL,aAAa,EACb,aAAa,EACb,aAAa,EACb,eAAe,EACf,UAAU,EACV,UAAU,EACX,MAAM,4BAA4B,CAAC;AACpC,OAAO,EACL,kBAAkB,EAClB,4BAA4B,EAC5B,uBAAuB,EACvB,4BAA4B,EAC5B,8BAA8B,EAC9B,8BAA8B,EAC9B,iBAAiB,EACjB,0BAA0B,EAC1B,cAAc,EACd,eAAe,EACf,eAAe,EACf,eAAe,EACf,eAAe,EACf,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,uBAAuB,EACvB,kBAAkB,EAClB,uBAAuB,EACvB,mBAAmB,EACnB,oBAAoB,EACpB,OAAO,EACP,8BAA8B,EAC/B,MAAM,0BAA0B,CAAC;AAClC,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAEtD,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;IACrB,OAAO,CAAC,OAAO,CAAC;;;;;;;;;;;;qBAYC,kBAAkB;yBACd,iBAAiB;;;;;;;;;;;;;;cAc5B,gBAAgB;;;sBAGR,kBAAkB,IAAI,kBAAkB;qBACzC,kBAAkB;mBACpB,cAAc;iBAChB,eAAe;mBACb,iBAAiB;mBACjB,iBAAiB;;mBAEjB,uBAAuB;;WAE/B,mBAAmB;;aAEjB,uBAAuB;kBAClB,0BAA0B;;;;;;;;;kBAS1B,4BAA4B;aACjC,4BAA4B;;;;kBAIvB,8BAA8B;aACnC,8BAA8B;;;;;;;;;;;;;;;;;;;;;;;;;;;;0BA4BjB,kBAAkB;;;UAGlC,aAAa;aACV,8BAA8B;;;;UAIjC,aAAa;;;;;UAKb,aAAa;;;;UAIb,aAAa;UACb,aAAa;eACR,aAAa;eACb,aAAa;;;;UAIlB,aAAa;eACR,aAAa;;;;UAIlB,UAAU;iBACH,eAAe;mBACb,iBAAiB;;;UAG1B,UAAU;iBACH,eAAe;mBACb,iBAAiB;;;UAG1B,eAAe;iBACR,eAAe;mBACb,iBAAiB;;;UAG1B,aAAa;;;;UAIb,aAAa;;4BAEK,kBAAkB;0BACpB,oBAAoB;;;;;;;UAOpC,aAAa;sBACD,kBAAkB;;;UAG9B,aAAa;sBACD,uBAAuB,IAAI,kBAAkB;;CAElE,CAAC"}