@fluid-topics/ft-accordion 0.3.11 → 0.3.13

package/build/ft-accordion-item.css.d.ts

@@ -0,0 +1,7 @@
+export declare const FtAccordionItemCssVariables: {
+    horizontalSpacing: import("@fluid-topics/ft-wc-utils").FtCssVariable;
+    verticalSpacing: import("@fluid-topics/ft-wc-utils").FtCssVariable;
+    colorOutline: import("@fluid-topics/ft-wc-utils").FtCssVariable;
+};
+export declare const itemStyles: import("lit").CSSResult;
+//# sourceMappingURL=ft-accordion-item.css.d.ts.map

package/build/ft-accordion-item.css.js

@@ -0,0 +1,55 @@
+import { css } from "lit";
+import { designSystemVariables, FtCssVariableFactory } from "@fluid-topics/ft-wc-utils";
+export const FtAccordionItemCssVariables = {
+    horizontalSpacing: FtCssVariableFactory.create("--ft-accordion-toggle-horizontal-spacing", "SIZE", "16px"),
+    verticalSpacing: FtCssVariableFactory.create("--ft-accordion-toggle-vertical-spacing", "SIZE", "16px"),
+    colorOutline: FtCssVariableFactory.external(designSystemVariables.colorOutline, "Design system"),
+};
+// language=CSS
+export const itemStyles = css `
+    .ft-accordion-item {
+        display: flex;
+        flex-direction: column;
+    }
+
+    .ft-accordion-item--toggle {
+        flex-shrink: 0;
+        flex-grow: 0;
+        position: relative;
+        display: flex;
+        align-items: center;
+        cursor: pointer;
+        padding: ${FtAccordionItemCssVariables.verticalSpacing} ${FtAccordionItemCssVariables.horizontalSpacing};
+        gap: calc(${FtAccordionItemCssVariables.horizontalSpacing} / 2);
+        outline: none;
+    }
+
+    .ft-accordion-item--toggle > *:not(ft-ripple) {
+        position: relative;
+    }
+
+    .ft-accordion-item--label {
+        flex-grow: 1;
+        flex-shrink: 1;
+        display: block;
+    }
+
+    .ft-accordion-item--content {
+        box-sizing: border-box;
+        flex-shrink: 1;
+        flex-grow: 1;
+        overflow: hidden;
+        height: 0;
+    }
+
+    .ft-accordion-item--active .ft-accordion-item--content {
+        height: initial;
+        overflow: visible;
+        padding: ${FtAccordionItemCssVariables.verticalSpacing} ${FtAccordionItemCssVariables.horizontalSpacing};
+    }
+
+    .ft-accordion-item--separator {
+        border-bottom: 1px solid ${FtAccordionItemCssVariables.colorOutline};
+    }
+`;
+//# sourceMappingURL=ft-accordion-item.css.js.map

package/build/ft-accordion-item.d.ts

@@ -1,15 +1,6 @@
 import { PropertyValues } from "lit";
 import { ElementDefinitionsMap, FtLitElement } from "@fluid-topics/ft-wc-utils";
-export interface FtAccordionItemProperties {
-    icon?: string;
-    label?: string;
-    active?: boolean;
-}
-export declare const FtAccordionItemCssVariables: {
-    horizontalSpacing: import("@fluid-topics/ft-wc-utils").FtCssVariable;
-    verticalSpacing: import("@fluid-topics/ft-wc-utils").FtCssVariable;
-    colorOutline: import("@fluid-topics/ft-wc-utils").FtCssVariable;
-};
+import { FtAccordionItemProperties } from "./ft-accordion-item.properties";
 export declare class FtAccordionItem extends FtLitElement implements FtAccordionItemProperties {
     static elementDefinitions: ElementDefinitionsMap;
     static styles: import("lit").CSSResult;

package/build/ft-accordion-item.js

@@ -4,17 +4,13 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     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 { css, html } from "lit";
+import { html } from "lit";
 import { property } from "lit/decorators.js";
-import { designSystemVariables, FtCssVariableFactory, FtLitElement } from "@fluid-topics/ft-wc-utils";
+import { FtLitElement } from "@fluid-topics/ft-wc-utils";
 import { FtRipple } from "@fluid-topics/ft-ripple";
 import { FtTypography } from "@fluid-topics/ft-typography";
 import { FtIcon } from "@fluid-topics/ft-icon";
-export const FtAccordionItemCssVariables = {
-    horizontalSpacing: FtCssVariableFactory.create("--ft-accordion-toggle-horizontal-spacing", "SIZE", "16px"),
-    verticalSpacing: FtCssVariableFactory.create("--ft-accordion-toggle-vertical-spacing", "SIZE", "16px"),
-    colorOutline: FtCssVariableFactory.external(designSystemVariables.colorOutline, "Design system"),
-};
+import { itemStyles } from "./ft-accordion-item.css";
 export class FtAccordionItem extends FtLitElement {
     constructor() {
         super(...arguments);
@@ -68,52 +64,7 @@ FtAccordionItem.elementDefinitions = {
     "ft-icon": FtIcon,
 };
 // language=CSS
-FtAccordionItem.styles = css `
-        .ft-accordion-item {
-            display: flex;
-            flex-direction: column;
-        }
-
-        .ft-accordion-item--toggle {
-            flex-shrink: 0;
-            flex-grow: 0;
-            position: relative;
-            display: flex;
-            align-items: center;
-            cursor: pointer;
-            padding: ${FtAccordionItemCssVariables.verticalSpacing} ${FtAccordionItemCssVariables.horizontalSpacing};
-            gap: calc(${FtAccordionItemCssVariables.horizontalSpacing} / 2);
-            outline: none;
-        }
-
-        .ft-accordion-item--toggle > *:not(ft-ripple) {
-            position: relative;
-        }
-
-        .ft-accordion-item--label {
-            flex-grow: 1;
-            flex-shrink: 1;
-            display: block;
-        }
-
-        .ft-accordion-item--content {
-            box-sizing: border-box;
-            flex-shrink: 1;
-            flex-grow: 1;
-            overflow: hidden;
-            height: 0;
-        }
-
-        .ft-accordion-item--active .ft-accordion-item--content {
-            height: initial;
-            overflow: visible;
-            padding: ${FtAccordionItemCssVariables.verticalSpacing} ${FtAccordionItemCssVariables.horizontalSpacing};
-        }
-
-        .ft-accordion-item--separator {
-            border-bottom: 1px solid ${FtAccordionItemCssVariables.colorOutline};
-        }
-    `;
+FtAccordionItem.styles = itemStyles;
 __decorate([
     property({ type: String })
 ], FtAccordionItem.prototype, "icon", void 0);

package/build/ft-accordion-item.properties.d.ts

@@ -0,0 +1,6 @@
+export interface FtAccordionItemProperties {
+    icon?: string;
+    label?: string;
+    active?: boolean;
+}
+//# sourceMappingURL=ft-accordion-item.properties.d.ts.map

package/build/ft-accordion-item.properties.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=ft-accordion-item.properties.js.map

package/build/ft-accordion.css.d.ts

@@ -0,0 +1,3 @@
+export declare const FtAccordionCssVariables: {};
+export declare const styles: import("lit").CSSResult;
+//# sourceMappingURL=ft-accordion.css.d.ts.map

package/build/ft-accordion.css.js

@@ -0,0 +1,9 @@
+import { css } from "lit";
+export const FtAccordionCssVariables = {};
+// language=CSS
+export const styles = css `
+    .ft-accordion {
+        box-sizing: border-box;
+    }
+`;
+//# sourceMappingURL=ft-accordion.css.js.map

package/build/ft-accordion.d.ts

@@ -1,8 +1,5 @@
 import { ElementDefinitionsMap, FtLitElement } from "@fluid-topics/ft-wc-utils";
-export interface FtAccordionProperties {
-    multi?: boolean;
-}
-export declare const FtAccordionCssVariables: {};
+import { FtAccordionProperties } from "./ft-accordion.properties";
 export declare class FtAccordion extends FtLitElement implements FtAccordionProperties {
     static elementDefinitions: ElementDefinitionsMap;
     static styles: import("lit").CSSResult;

package/build/ft-accordion.js

@@ -4,10 +4,10 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
     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 { css, html } from "lit";
+import { html } from "lit";
 import { property, query } from "lit/decorators.js";
 import { FtLitElement } from "@fluid-topics/ft-wc-utils";
-export const FtAccordionCssVariables = {};
+import { styles } from "./ft-accordion.css";
 export class FtAccordion extends FtLitElement {
     constructor() {
         super(...arguments);
@@ -29,11 +29,7 @@ export class FtAccordion extends FtLitElement {
 }
 FtAccordion.elementDefinitions = {};
 // language=CSS
-FtAccordion.styles = css `
-        .ft-accordion {
-            box-sizing: border-box;
-        }
-    `;
+FtAccordion.styles = styles;
 __decorate([
     property({ type: Boolean })
 ], FtAccordion.prototype, "multi", void 0);