@supersoniks/concorde 4.9.98-visual-stack.1 → 5.0.0

package/dist/js/core/components/ui/badge/badge.js

@@ -1,199 +0,0 @@
-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 { html, LitElement, css } from "lit";
-import { customElement, property } from "lit/decorators.js";
-import { fontSize, } from "@supersoniks/concorde/core/components/ui/_css/size";
-const tagName = "sonic-badge";
-/**
- * Un badge simple avec deux slots, un nommé prefix et un nomé suffix de manière à pouvoir mettre (par exemple) une icone avant ou après le contenu.
- * * Le badge est comparable au bouton car il possèdent tous les deux les propriétés *type* (primary...), *variant*(outline, ghost), size(xs...)...
- * * Le badge n'est pas interactif contrairement au bouton
- */
-let Badge = class Badge extends LitElement {
-    constructor() {
-        super(...arguments);
-        /**
-         * Le type change surtout la couleur composant
-         */
-        this.type = "default";
-        /**
-         * Le composant par defaut sans se paramètre à forte afordance
-         * * ghost : composant super léger visuellement
-         * * outline : composant légé avec une bordure
-         */
-        this.variant = "default";
-        this.ellipsis = false;
-    }
-    render() {
-        return html `
-      <slot name="prefix"></slot>
-      <slot></slot>
-      <slot name="suffix"></slot>
-    `;
-    }
-};
-Badge.styles = [
-    fontSize,
-    css `
-      :host {
-        --sc-badge-gap: 0.3em;
-        --sc-badge-py: 0.35em;
-        --sc-badge-px: 0.67em;
-
-        --sc-badge-color: var(--sc-base-content, #000);
-        --sc-badge-bg: var(--sc-base-100, rgba(0, 0, 0, 0.07));
-
-        /*--sc-badge-border-width: var(--sc-form-border-width, 0.1rem);*/
-        --sc-badge-border-width: 1px;
-        --sc-badge-border-color: transparent;
-        --sc-badge-border: var(--sc-badge-border-width) solid
-          var(--sc-badge-border-color);
-
-        --sc-badge-rounded: 0.85em;
-        --sc-badge-fw: var(--sc-font-weight-base, 400);
-
-        display: inline-flex;
-        align-items: center;
-        box-sizing: border-box;
-        line-height: var(--sc-_lh);
-        border-radius: var(--sc-badge-rounded);
-
-        background: var(--sc-badge-bg);
-        color: var(--sc-badge-color);
-        font-family: var(--sc-badge-ff, var(--sc-font-family-base, sans-serif));
-        font-weight: var(--sc-badge-fw);
-        line-height: 1;
-
-        padding-top: var(--sc-badge-py);
-        padding-bottom: var(--sc-badge-py);
-        padding-left: var(--sc-badge-px);
-        padding-right: var(--sc-badge-px);
-        /**Round pour lissage px */
-        min-height: round(calc(var(--sc-badge-px) * 2), 1px);
-        min-width: round(calc(var(--sc-badge-px) * 2), 1px);
-        border: var(--sc-badge-border);
-        -webkit-print-color-adjust: exact;
-      }
-
-      /*TYPES*/
-      :host([type="primary"]) {
-        --sc-badge-color: var(--sc-primary-content, var(--sc-base, #fff));
-        --sc-badge-bg: var(--sc-primary, var(--sc-base-content, #000));
-      } 
-      :host([type="warning"]) {
-        --sc-badge-color: var(--sc-warning-content, var(--sc-base, #fff));
-        --sc-badge-bg: var(--sc-warning, var(--sc-base-content, #000));
-      }
-      :host([type="danger"]) {
-        --sc-badge-color: var(--sc-danger-content, var(--sc-base, #fff));
-        --sc-badge-bg: var(--sc-danger, var(--sc-base-content, #000));
-      }
-      :host([type="info"]) {
-        --sc-badge-color: var(--sc-info-content, var(--sc-base, #fff));
-        --sc-badge-bg: var(--sc-info, var(--sc-base-content, #000));
-      }
-      :host([type="success"]) {
-        --sc-badge-color: var(--sc-success-content, var(--sc-base, #fff));
-        --sc-badge-bg: var(--sc-success, var(--sc-base-content, #000));
-      }
-      :host([type="neutral"]) {
-        --sc-badge-color: var(--sc-base, #fff);
-        --sc-badge-bg: var(--sc-base-content, #000);
-      }
-
-      :host([contrast]),
-      :host([type="contrast"]) {
-        --sc-badge-color: var(--sc-contrast-content, #fff);
-        --sc-badge-bg: var(--sc-contrast, #000);
-      }
-
-      /*SIZE*/
-      :host {
-        gap: var(--sc-badge-gap);
-      }
-
-      :host([size="2xs"]),
-      :host([size="xs"]),
-      :host([size="sm"]) {
-        --sc-badge-gap: 0.35em;
-      }
-
-      :host([size="lg"]),
-      :host([size="xl"]) {
-        --sc-_lh: 1.2;
-        --sc-badge-gap: 0.5em;
-      }
-
-      /*OUTLINE*/
-      :host([variant="outline"][type]) {
-        border-width: var(--sc-badge-border-width) !important;
-        border-color: var(--sc-badge-bg);
-        color: var(--sc-badge-bg);
-        background: transparent;
-      }
-
-      :host([variant="outline"][type="default"]) {
-        border-color: var(--sc-base-content, #000);
-        color: var(--sc-base-content, #000);
-        background: transparent;
-      }
-
-      /*GHOST*/
-      :host([variant="ghost"][type]) {
-        color: var(--sc-badge-bg);
-        background: transparent;
-        padding: 0;
-      }
-
-      @media (forced-colors: active) {
-        :host([variant="ghost"][type]) {
-          padding: var(--sc-badge-py) var(--sc-badge-px);
-        }
-      }
-
-      :host([variant="ghost"][type="default"]) {
-        color: var(--sc-badge-color);
-        background: transparent;
-      }
-
-      :host([ellipsis]) {
-        flex-wrap: nowrap;
-        white-space: nowrap;
-        max-width: 100%;
-      }
-
-      :host([ellipsis]) slot {
-        overflow: hidden;
-        display: block;
-        text-overflow: ellipsis;
-        white-space: nowrap;
-        max-width: 100%;
-      }
-
-      slot[name="suffix"],
-      slot[name="prefix"] {
-        flex-shrink: 0;
-      }
-    `,
-];
-__decorate([
-    property({ type: String, reflect: true })
-], Badge.prototype, "type", void 0);
-__decorate([
-    property({ type: String, reflect: true })
-], Badge.prototype, "variant", void 0);
-__decorate([
-    property({ type: String, reflect: true })
-], Badge.prototype, "size", void 0);
-__decorate([
-    property({ type: Boolean, reflect: true })
-], Badge.prototype, "ellipsis", void 0);
-Badge = __decorate([
-    customElement(tagName)
-], Badge);
-export { Badge };
-//# sourceMappingURL=badge.js.map

package/dist/js/core/components/ui/badge/badge.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"badge.js","sourceRoot":"","sources":["../../../../../../src/core/components/ui/badge/badge.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EACL,QAAQ,GAET,MAAM,oDAAoD,CAAC;AAE5D,MAAM,OAAO,GAAG,aAAa,CAAC;AAC9B;;;;GAIG;AAEI,IAAM,KAAK,GAAX,MAAM,KAAM,SAAQ,UAAU;IAA9B;;QAkJL;;WAEG;QAEH,SAAI,GAQY,SAAS,CAAC;QAC1B;;;;WAIG;QACwC,YAAO,GAGpC,SAAS,CAAC;QAMoB,aAAQ,GAAG,KAAK,CAAC;IAS/D,CAAC;IAPC,MAAM;QACJ,OAAO,IAAI,CAAA;;;;KAIV,CAAC;IACJ,CAAC;;AApLM,YAAM,GAAG;IACd,QAAQ;IACR,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA4IF;CACF,AA/IY,CA+IX;AAMF;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;mCAShB;AAMiB;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;sCAGlB;AAKmB;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;mCAAa;AACX;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uCAAkB;AA7KlD,KAAK;IADjB,aAAa,CAAC,OAAO,CAAC;GACV,KAAK,CAsLjB"}