kemet-ui 4.0.2 → 5.0.0

package/dist/elements/svgs.js

@@ -1,71 +0,0 @@
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp(target, key, result);
-  return result;
-};
-
-// src/elements/svgs.ts
-var svgs_exports = {};
-__export(svgs_exports, {
-  default: () => KemetSVGs
-});
-module.exports = __toCommonJS(svgs_exports);
-var import_lit = require("lit");
-var import_decorators = require("lit/decorators.js");
-var KemetSVGs = class extends import_lit.LitElement {
-  constructor() {
-    super(...arguments);
-    this.set = "svgs";
-  }
-  firstUpdated() {
-    this.slotElement = this.shadowRoot.querySelector("slot");
-    document.kemetSVGs = document.kemetSVGs || {};
-    this.populateIcons();
-    this.slotElement.addEventListener("slotchange", () => this.populateIcons());
-  }
-  render() {
-    return import_lit.html`<slot></slot>`;
-  }
-  populateIcons() {
-    const svg = this.slotElement.assignedElements()[0];
-    const svgContents = svg ? svg.querySelectorAll("defs > g") : null;
-    if (svgContents) {
-      document.kemetSVGs[this.set] = svgContents;
-    }
-  }
-};
-KemetSVGs.styles = [import_lit.css`
-    :host {
-      display: none;
-    }
-  `];
-__decorateClass([
-  (0, import_decorators.property)({ type: String })
-], KemetSVGs.prototype, "set", 2);
-__decorateClass([
-  (0, import_decorators.state)()
-], KemetSVGs.prototype, "slotElement", 2);
-KemetSVGs = __decorateClass([
-  (0, import_decorators.customElement)("kemet-svgs")
-], KemetSVGs);
-//# sourceMappingURL=svgs.js.map

package/dist/elements/svgs.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/elements/svgs.ts"],"sourcesContent":["import { LitElement, html, css } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\n\n/**\n * @since 1.0.0\n * @status stable\n *\n * @tagname kemet-svgs\n * @summary A set of SVG graphics that can be referenced anywhere in a page or app.\n *\n * @prop {string} set - Defines the name for the set of svgs.\n *\n */\n\n@customElement('kemet-svgs')\nexport default class KemetSVGs extends LitElement {\n  static styles = [css`\n    :host {\n      display: none;\n    }\n  `];\n\n  @property({ type: String })\n  set: string = 'svgs';\n\n  @state()\n  slotElement: HTMLSlotElement;\n\n  firstUpdated() {\n    this.slotElement = this.shadowRoot.querySelector('slot');\n    document.kemetSVGs = document.kemetSVGs || {};\n\n    this.populateIcons();\n    this.slotElement.addEventListener('slotchange', () => this.populateIcons());\n  }\n\n  render() {\n    return html`<slot></slot>`;\n  }\n\n  populateIcons() {\n    const svg = this.slotElement.assignedElements()[0];\n    const svgContents = svg ? svg.querySelectorAll('defs > g') : null;\n\n    if (svgContents) {\n      document.kemetSVGs[this.set] = svgContents;\n    }\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'kemet-svgs': KemetSVGs\n  }\n\n  interface Document {\n    kemetSVGs: any;\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAAsC;AACtC,wBAA+C;AAc/C,IAAqB,YAArB,cAAuC,sBAAW;AAAA,EAAlD;AAAA;AAQE,eAAc;AAAA;AAAA,EAKd,eAAe;AACb,SAAK,cAAc,KAAK,WAAW,cAAc,MAAM;AACvD,aAAS,YAAY,SAAS,aAAa,CAAC;AAE5C,SAAK,cAAc;AACnB,SAAK,YAAY,iBAAiB,cAAc,MAAM,KAAK,cAAc,CAAC;AAAA,EAC5E;AAAA,EAEA,SAAS;AACP,WAAO;AAAA,EACT;AAAA,EAEA,gBAAgB;AACd,UAAM,MAAM,KAAK,YAAY,iBAAiB,EAAE,CAAC;AACjD,UAAM,cAAc,MAAM,IAAI,iBAAiB,UAAU,IAAI;AAE7D,QAAI,aAAa;AACf,eAAS,UAAU,KAAK,GAAG,IAAI;AAAA,IACjC;AAAA,EACF;AACF;AAjCqB,UACZ,SAAS,CAAC;AAAA;AAAA;AAAA;AAAA,GAIhB;AAGD;AAAA,MADC,4BAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GAPP,UAQnB;AAGA;AAAA,MADC,yBAAM;AAAA,GAVY,UAWnB;AAXmB,YAArB;AAAA,MADC,iCAAc,YAAY;AAAA,GACN;","names":[]}

package/dist/elements/svgs.mjs

@@ -1,8 +0,0 @@
-import {
-  KemetSVGs
-} from "../chunk-H4D2CASA.mjs";
-import "../chunk-SAWN7RJP.mjs";
-export {
-  KemetSVGs as default
-};
-//# sourceMappingURL=svgs.mjs.map

package/dist/elements/svgs.mjs.map

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

package/dist/elements/tab-panel.d.mts

@@ -1,33 +0,0 @@
-import * as lit_html from 'lit-html';
-import * as lit from 'lit';
-import { LitElement } from 'lit';
-
-/**
- * @since 1.0.0
- * @status stable
- *
- * @tagname kemet-tab-panel
- * @summary A panel in a set of tabs.
- *
- * @prop {boolean} selected - Is true when a panel is selected
- * @prop {string} panel - Identifies the panel to be linked by a tab
- *
- * @cssproperty --kemet-tab-panel-fade-speed - The fade speed.
- *
- */
-declare class KemetTabPanel extends LitElement {
-    static styles: lit.CSSResult[];
-    selected: boolean;
-    panel: string;
-    index: number;
-    updated(): void;
-    render(): lit_html.TemplateResult<1>;
-    a11y(): void;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'kemet-tab-panel': KemetTabPanel;
-    }
-}
-
-export { KemetTabPanel as default };

package/dist/elements/tab-panel.d.ts

@@ -1,33 +0,0 @@
-import * as lit_html from 'lit-html';
-import * as lit from 'lit';
-import { LitElement } from 'lit';
-
-/**
- * @since 1.0.0
- * @status stable
- *
- * @tagname kemet-tab-panel
- * @summary A panel in a set of tabs.
- *
- * @prop {boolean} selected - Is true when a panel is selected
- * @prop {string} panel - Identifies the panel to be linked by a tab
- *
- * @cssproperty --kemet-tab-panel-fade-speed - The fade speed.
- *
- */
-declare class KemetTabPanel extends LitElement {
-    static styles: lit.CSSResult[];
-    selected: boolean;
-    panel: string;
-    index: number;
-    updated(): void;
-    render(): lit_html.TemplateResult<1>;
-    a11y(): void;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'kemet-tab-panel': KemetTabPanel;
-    }
-}
-
-export { KemetTabPanel as default };

package/dist/elements/tab-panel.js

@@ -1,348 +0,0 @@
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp(target, key, result);
-  return result;
-};
-
-// src/elements/tab-panel.ts
-var tab_panel_exports = {};
-__export(tab_panel_exports, {
-  default: () => KemetTabPanel
-});
-module.exports = __toCommonJS(tab_panel_exports);
-var import_lit2 = require("lit");
-var import_decorators = require("lit/decorators.js");
-
-// src/styles/elements/tabs.ts
-var import_lit = require("lit");
-var stylesKemetTabs = import_lit.css`
-  :host {
-    --kemet-tabs-ink-size: 6px;
-    --kemet-tabs-ink-radius: 6px;
-    --kemet-tabs-divider-size: 1px;
-    --kemet-tabs-spacer: 1rem;
-    --kemet-tabs-transition-speed: 0.5s;
-    --kemet-tabs-divider-color: rgb(var(--kemet-color-gray-300));
-    --kemet-tabs-ink-color: rgb(var(--kemet-color-foreground));
-
-    display: flex;
-    flex-direction: column;
-    overflow: hidden;
-    position: relative;
-  }
-
-  :host([placement='bottom']) {
-    flex-direction: column-reverse;
-  }
-
-  :host([placement='left']) {
-    flex-direction: row;
-  }
-
-  :host([placement='right']) {
-    flex-direction: row-reverse;
-  }
-
-  :host([placement='left']),
-  :host([placement='right']) {
-    overflow: unset;
-  }
-
-  /* panels */
-
-  [part='panels'] > div {
-    display: flex;
-  }
-
-  :host([panel-effect='slide']) [part='panels'] {
-    transition: transform var(--kemet-tabs-transition-speed) linear;
-  }
-
-  :host([panel-effect='fade']) [part='panels'] {
-    transform: none !important;
-  }
-
-  :host([panel-effect='fade']) [part='panels'] > div {
-    flex-flow: row nowrap;
-  }
-
-  :host([placement='left']) [part='panels'],
-  :host([placement='right']) [part='panels'] {
-    transform: none !important;
-    position: relative;
-    width: 100%;
-  }
-
-  :host([placement='top']) [part='panels'] > div {
-    margin-top: var(--kemet-tabs-spacer);
-  }
-
-  :host([placement='right']) [part='panels'] > div {
-    margin-right: var(--kemet-tabs-spacer);
-  }
-
-  :host([placement='bottom']) [part='panels'] > div {
-    margin-bottom: var(--kemet-tabs-spacer);
-  }
-
-  :host([placement='left']) [part='panels'] > div {
-    margin-left: var(--kemet-tabs-spacer);
-  }
-
-  /* tablist */
-
-  [part='tablist'] {
-    display: flex;
-  }
-
-  :host([placement='left']) [part='tablist'],
-  :host([placement='right']) [part='tablist'] {
-    display: flex;
-    flex-direction: column;
-    align-items: start;
-  }
-
-  :host([tabs-align='center']) [part='tablist'] {
-    justify-content: center;
-  }
-
-  :host([tabs-align='between']) [part='tablist'] {
-    justify-content: space-between;
-  }
-
-  :host([tabs-align='evenly']) [part='tablist'] {
-    justify-content: space-evenly;
-  }
-
-  :host([tabs-align='around']) [part='tablist'] {
-    justify-content: space-around
-  }
-
-  :host([tabs-align='start']) [part='tablist'] {
-    justify-content: flex-start;
-  }
-
-  :host([tabs-align='end']) [part='tablist'] {
-    justify-content: flex-end;
-  }
-
-  :host([overflow]) [part='tablist'] {
-    justify-content: start;
-  }
-
-  /* divider */
-
-  [part='divider'] {
-    height: var(--kemet-tabs-divider-size);
-    background-color: var(--kemet-tabs-divider-color);
-  }
-
-  :host([placement='left']) [part='divider'],
-  :host([placement='right']) [part='divider'] {
-    width: var(--kemet-tabs-divider-size);
-    height: auto;
-  }
-
-  /* ink */
-
-  [part='ink'] {
-    height: var(--kemet-tabs-ink-size);
-    border-top-left-radius: var(--kemet-tabs-ink-radius);
-    border-top-right-radius: var(--kemet-tabs-ink-radius);
-    transition: all 300ms ease;
-    background-color: var(--kemet-tabs-ink-color);
-  }
-
-  :host([placement='right']) [part='ink'] {
-    width: var(--kemet-tabs-ink-size);
-    border-top-right-radius: var(--kemet-tabs-ink-radius);
-    border-bottom-right-radius: var(--kemet-tabs-ink-radius);
-    border-top-left-radius: 0px;
-    border-bottom-left-radius: 0px;
-  }
-
-  :host([placement='left']) [part='ink'] {
-    width: var(--kemet-tabs-ink-size);
-    border-top-right-radius: 0px;
-    border-bottom-right-radius: 0px;
-    border-top-left-radius: var(--kemet-tabs-ink-radius);
-    border-bottom-left-radius: var(--kemet-tabs-ink-radius);
-  }
-
-  :host([placement='bottom']) [part='ink'] {
-    border-top-right-radius: 0px;
-    border-bottom-right-radius: var(--kemet-tabs-ink-radius);
-    border-top-left-radius: 0px;
-    border-bottom-left-radius: var(--kemet-tabs-ink-radius);
-  }
-
-  /* links */
-
-  :host([overflow]) [part='links'] {
-    overflow-x: auto;
-    margin: 0 2rem;
-    scroll-behavior: smooth;
-  }
-
-  :host([overflow]) [part='links']::-webkit-scrollbar {
-    display: none;
-    width: 0;
-    background: transparent;
-  }
-
-  :host([placement='bottom']) [part='links'] {
-    display: flex;
-    flex-direction: column-reverse;
-  }
-
-  /* icon */
-
-  [icon*='chevron'] {
-    cursor: pointer;
-    position: absolute;
-    top: 1rem;
-  }
-
-  [icon='chevron-left'] {
-    left: 0;
-  }
-
-  [icon='chevron-right'] {
-    right: 0;
-  }
-
-  :host([placement='bottom']) [icon*='chevron'] {
-    top: auto;
-    bottom: 1rem;
-  }
-`;
-var stylesKemetTab = import_lit.css`
-  :host {
-    --kemet-tab-color: rgb(var(--kemet-color-foreground));
-
-    cursor: pointer;
-    display: inline-flex;
-    flex: 0 0 auto;
-    align-items: center;
-    justify-content: center;
-    white-space: nowrap;
-    padding: var(--kemet-tab-padding, 1rem);
-  }
-
-  :host([selected]) {
-    cursor: auto;
-    color: var(--kemet-tab-color);
-  }
-
-  kemet-icon-bootstrap {
-    cursor: pointer;
-    margin-left: 0.5rem;
-  }
-`;
-var stylesKemetTabPanel = import_lit.css`
-  :host {
-    --kemet-tab-panel-fade-speed: 0.5s;
-
-    width: 100%;
-    flex: 0 0 auto;
-  }
-
-  ::slotted(img) {
-    max-width: 100%;
-  }
-
-  :host(.fade) {
-    opacity: 0;
-    pointer-events: none;
-    transition: opacity var(--kemet-tab-panel-fade-speed) ease;
-  }
-
-  :host(.fade[selected]) {
-    opacity: 1;
-    pointer-events: auto;
-  }
-
-  :host(.fade.push) {
-    margin-left: -100%;
-  }
-
-  :host(.vertical) {
-    display: none;
-  }
-
-  :host(.vertical[selected]) {
-    display: block;
-  }
-
-  :host(.stacked) {
-    position: absolute;
-    z-index: -1;
-    opacity: 0;
-    visibility: hidden;
-  }
-
-  :host(.stacked[selected]) {
-    position: relative;
-    z-index: 1;
-    opacity: 1;
-    visibility: visible;
-  }
-`;
-
-// src/elements/tab-panel.ts
-var KemetTabPanel = class extends import_lit2.LitElement {
-  constructor() {
-    super(...arguments);
-    this.selected = false;
-  }
-  updated() {
-    this.a11y();
-  }
-  render() {
-    return import_lit2.html`
-      <slot></slot>
-    `;
-  }
-  a11y() {
-    this.setAttribute("role", "tabpanel");
-    if (this.selected) {
-      this.setAttribute("tabindex", "0");
-    } else {
-      this.setAttribute("tabindex", "-1");
-    }
-  }
-};
-KemetTabPanel.styles = [stylesKemetTabPanel];
-__decorateClass([
-  (0, import_decorators.property)({ type: Boolean, reflect: true })
-], KemetTabPanel.prototype, "selected", 2);
-__decorateClass([
-  (0, import_decorators.property)({ type: String })
-], KemetTabPanel.prototype, "panel", 2);
-__decorateClass([
-  (0, import_decorators.property)({ type: Number })
-], KemetTabPanel.prototype, "index", 2);
-KemetTabPanel = __decorateClass([
-  (0, import_decorators.customElement)("kemet-tab-panel")
-], KemetTabPanel);
-//# sourceMappingURL=tab-panel.js.map

package/dist/elements/tab-panel.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/elements/tab-panel.ts","../../src/styles/elements/tabs.ts"],"sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { stylesKemetTabPanel } from '../styles/elements/tabs';\n\n/**\n * @since 1.0.0\n * @status stable\n *\n * @tagname kemet-tab-panel\n * @summary A panel in a set of tabs.\n *\n * @prop {boolean} selected - Is true when a panel is selected\n * @prop {string} panel - Identifies the panel to be linked by a tab\n *\n * @cssproperty --kemet-tab-panel-fade-speed - The fade speed.\n *\n */\n\n@customElement('kemet-tab-panel')\nexport default class KemetTabPanel extends LitElement {\n  static styles = [stylesKemetTabPanel];\n\n  @property({ type: Boolean, reflect: true })\n  selected: boolean = false;\n\n  @property({ type: String })\n  panel: string;\n\n  @property({ type: Number })\n  index: number;\n\n  updated() {\n    this.a11y();\n  }\n\n  render() {\n    return html`\n      <slot></slot>\n    `;\n  }\n\n  a11y() {\n    this.setAttribute('role', 'tabpanel');\n\n    if (this.selected) {\n      this.setAttribute('tabindex', '0');\n    } else {\n      this.setAttribute('tabindex', '-1');\n    }\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'kemet-tab-panel': KemetTabPanel\n  }\n}\n","import { css } from 'lit';\n\nexport const stylesKemetTabs = css`\n  :host {\n    --kemet-tabs-ink-size: 6px;\n    --kemet-tabs-ink-radius: 6px;\n    --kemet-tabs-divider-size: 1px;\n    --kemet-tabs-spacer: 1rem;\n    --kemet-tabs-transition-speed: 0.5s;\n    --kemet-tabs-divider-color: rgb(var(--kemet-color-gray-300));\n    --kemet-tabs-ink-color: rgb(var(--kemet-color-foreground));\n\n    display: flex;\n    flex-direction: column;\n    overflow: hidden;\n    position: relative;\n  }\n\n  :host([placement='bottom']) {\n    flex-direction: column-reverse;\n  }\n\n  :host([placement='left']) {\n    flex-direction: row;\n  }\n\n  :host([placement='right']) {\n    flex-direction: row-reverse;\n  }\n\n  :host([placement='left']),\n  :host([placement='right']) {\n    overflow: unset;\n  }\n\n  /* panels */\n\n  [part='panels'] > div {\n    display: flex;\n  }\n\n  :host([panel-effect='slide']) [part='panels'] {\n    transition: transform var(--kemet-tabs-transition-speed) linear;\n  }\n\n  :host([panel-effect='fade']) [part='panels'] {\n    transform: none !important;\n  }\n\n  :host([panel-effect='fade']) [part='panels'] > div {\n    flex-flow: row nowrap;\n  }\n\n  :host([placement='left']) [part='panels'],\n  :host([placement='right']) [part='panels'] {\n    transform: none !important;\n    position: relative;\n    width: 100%;\n  }\n\n  :host([placement='top']) [part='panels'] > div {\n    margin-top: var(--kemet-tabs-spacer);\n  }\n\n  :host([placement='right']) [part='panels'] > div {\n    margin-right: var(--kemet-tabs-spacer);\n  }\n\n  :host([placement='bottom']) [part='panels'] > div {\n    margin-bottom: var(--kemet-tabs-spacer);\n  }\n\n  :host([placement='left']) [part='panels'] > div {\n    margin-left: var(--kemet-tabs-spacer);\n  }\n\n  /* tablist */\n\n  [part='tablist'] {\n    display: flex;\n  }\n\n  :host([placement='left']) [part='tablist'],\n  :host([placement='right']) [part='tablist'] {\n    display: flex;\n    flex-direction: column;\n    align-items: start;\n  }\n\n  :host([tabs-align='center']) [part='tablist'] {\n    justify-content: center;\n  }\n\n  :host([tabs-align='between']) [part='tablist'] {\n    justify-content: space-between;\n  }\n\n  :host([tabs-align='evenly']) [part='tablist'] {\n    justify-content: space-evenly;\n  }\n\n  :host([tabs-align='around']) [part='tablist'] {\n    justify-content: space-around\n  }\n\n  :host([tabs-align='start']) [part='tablist'] {\n    justify-content: flex-start;\n  }\n\n  :host([tabs-align='end']) [part='tablist'] {\n    justify-content: flex-end;\n  }\n\n  :host([overflow]) [part='tablist'] {\n    justify-content: start;\n  }\n\n  /* divider */\n\n  [part='divider'] {\n    height: var(--kemet-tabs-divider-size);\n    background-color: var(--kemet-tabs-divider-color);\n  }\n\n  :host([placement='left']) [part='divider'],\n  :host([placement='right']) [part='divider'] {\n    width: var(--kemet-tabs-divider-size);\n    height: auto;\n  }\n\n  /* ink */\n\n  [part='ink'] {\n    height: var(--kemet-tabs-ink-size);\n    border-top-left-radius: var(--kemet-tabs-ink-radius);\n    border-top-right-radius: var(--kemet-tabs-ink-radius);\n    transition: all 300ms ease;\n    background-color: var(--kemet-tabs-ink-color);\n  }\n\n  :host([placement='right']) [part='ink'] {\n    width: var(--kemet-tabs-ink-size);\n    border-top-right-radius: var(--kemet-tabs-ink-radius);\n    border-bottom-right-radius: var(--kemet-tabs-ink-radius);\n    border-top-left-radius: 0px;\n    border-bottom-left-radius: 0px;\n  }\n\n  :host([placement='left']) [part='ink'] {\n    width: var(--kemet-tabs-ink-size);\n    border-top-right-radius: 0px;\n    border-bottom-right-radius: 0px;\n    border-top-left-radius: var(--kemet-tabs-ink-radius);\n    border-bottom-left-radius: var(--kemet-tabs-ink-radius);\n  }\n\n  :host([placement='bottom']) [part='ink'] {\n    border-top-right-radius: 0px;\n    border-bottom-right-radius: var(--kemet-tabs-ink-radius);\n    border-top-left-radius: 0px;\n    border-bottom-left-radius: var(--kemet-tabs-ink-radius);\n  }\n\n  /* links */\n\n  :host([overflow]) [part='links'] {\n    overflow-x: auto;\n    margin: 0 2rem;\n    scroll-behavior: smooth;\n  }\n\n  :host([overflow]) [part='links']::-webkit-scrollbar {\n    display: none;\n    width: 0;\n    background: transparent;\n  }\n\n  :host([placement='bottom']) [part='links'] {\n    display: flex;\n    flex-direction: column-reverse;\n  }\n\n  /* icon */\n\n  [icon*='chevron'] {\n    cursor: pointer;\n    position: absolute;\n    top: 1rem;\n  }\n\n  [icon='chevron-left'] {\n    left: 0;\n  }\n\n  [icon='chevron-right'] {\n    right: 0;\n  }\n\n  :host([placement='bottom']) [icon*='chevron'] {\n    top: auto;\n    bottom: 1rem;\n  }\n`;\n\nexport const stylesKemetTab = css`\n  :host {\n    --kemet-tab-color: rgb(var(--kemet-color-foreground));\n\n    cursor: pointer;\n    display: inline-flex;\n    flex: 0 0 auto;\n    align-items: center;\n    justify-content: center;\n    white-space: nowrap;\n    padding: var(--kemet-tab-padding, 1rem);\n  }\n\n  :host([selected]) {\n    cursor: auto;\n    color: var(--kemet-tab-color);\n  }\n\n  kemet-icon-bootstrap {\n    cursor: pointer;\n    margin-left: 0.5rem;\n  }\n`;\n\nexport const stylesKemetTabPanel = css`\n  :host {\n    --kemet-tab-panel-fade-speed: 0.5s;\n\n    width: 100%;\n    flex: 0 0 auto;\n  }\n\n  ::slotted(img) {\n    max-width: 100%;\n  }\n\n  :host(.fade) {\n    opacity: 0;\n    pointer-events: none;\n    transition: opacity var(--kemet-tab-panel-fade-speed) ease;\n  }\n\n  :host(.fade[selected]) {\n    opacity: 1;\n    pointer-events: auto;\n  }\n\n  :host(.fade.push) {\n    margin-left: -100%;\n  }\n\n  :host(.vertical) {\n    display: none;\n  }\n\n  :host(.vertical[selected]) {\n    display: block;\n  }\n\n  :host(.stacked) {\n    position: absolute;\n    z-index: -1;\n    opacity: 0;\n    visibility: hidden;\n  }\n\n  :host(.stacked[selected]) {\n    position: relative;\n    z-index: 1;\n    opacity: 1;\n    visibility: visible;\n  }\n`;\n"],"mappings":"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","names":["import_lit"]}

package/dist/elements/tab-panel.mjs

@@ -1,9 +0,0 @@
-import {
-  KemetTabPanel
-} from "../chunk-JBDFJW7Y.mjs";
-import "../chunk-5LCSEF3N.mjs";
-import "../chunk-SAWN7RJP.mjs";
-export {
-  KemetTabPanel as default
-};
-//# sourceMappingURL=tab-panel.mjs.map

package/dist/elements/tab-panel.mjs.map

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

package/dist/elements/tab.d.mts

@@ -1,43 +0,0 @@
-import * as lit_html from 'lit-html';
-import * as lit from 'lit';
-import { LitElement } from 'lit';
-
-/**
- * @since 1.0.0
- * @status stable
- *
- * @tagname kemet-tab
- * @summary A tab in a set of tabs.
- *
- * @prop {boolean} selected - Is true when the tab is selected
- * @prop {string} link - Links to a panel name
- * @prop {boolean} closable - Determines if the tab can be closed
- *
- * @cssproperty --kemet-tab-padding - The padding of the tab.
- * @cssproperty --kemet-tab-color - The color of the selected tab.
- *
- * @event kemet-selected - Fires when a tab is selected
- * @event kemet-closed - Fires when the tab should close
- *
- */
-declare class KemetTab extends LitElement {
-    static styles: lit.CSSResult[];
-    index: number;
-    selected: boolean;
-    link: string;
-    closable: boolean;
-    firstUpdated(): void;
-    updated(): void;
-    render(): lit_html.TemplateResult<1>;
-    select(): void;
-    a11y(): void;
-    makeCloseable(): lit_html.TemplateResult<1>;
-    handleClosable(): void;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'kemet-tab': KemetTab;
-    }
-}
-
-export { KemetTab as default };

package/dist/elements/tab.d.ts

@@ -1,43 +0,0 @@
-import * as lit_html from 'lit-html';
-import * as lit from 'lit';
-import { LitElement } from 'lit';
-
-/**
- * @since 1.0.0
- * @status stable
- *
- * @tagname kemet-tab
- * @summary A tab in a set of tabs.
- *
- * @prop {boolean} selected - Is true when the tab is selected
- * @prop {string} link - Links to a panel name
- * @prop {boolean} closable - Determines if the tab can be closed
- *
- * @cssproperty --kemet-tab-padding - The padding of the tab.
- * @cssproperty --kemet-tab-color - The color of the selected tab.
- *
- * @event kemet-selected - Fires when a tab is selected
- * @event kemet-closed - Fires when the tab should close
- *
- */
-declare class KemetTab extends LitElement {
-    static styles: lit.CSSResult[];
-    index: number;
-    selected: boolean;
-    link: string;
-    closable: boolean;
-    firstUpdated(): void;
-    updated(): void;
-    render(): lit_html.TemplateResult<1>;
-    select(): void;
-    a11y(): void;
-    makeCloseable(): lit_html.TemplateResult<1>;
-    handleClosable(): void;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'kemet-tab': KemetTab;
-    }
-}
-
-export { KemetTab as default };