snice 1.13.2 → 1.13.4

package/dist/components/alert/snice-alert.js

@@ -0,0 +1,191 @@
+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;
+};
+var __metadata = (this && this.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
+import { element, property, watch, query, on, dispatch, part } from '../../src/index';
+import css from './snice-alert.css?inline';
+let SniceAlert = class SniceAlert extends HTMLElement {
+    constructor() {
+        super(...arguments);
+        this.variant = 'info';
+        this.size = 'medium';
+        this.title = '';
+        this.dismissible = false;
+        this.icon = '';
+        this.isHidden = false;
+    }
+    html() {
+        return /*html*/ `
+      <div class="alert ${this.isHidden ? 'alert--hidden' : ''}" role="alert" aria-live="polite">
+        <div part="icon-section"></div>
+        <div class="alert-content">
+          <div part="title-section"></div>
+          <div part="description-section"></div>
+        </div>
+        <div part="dismiss-section"></div>
+      </div>
+    `;
+    }
+    renderIconSection() {
+        const hasIcon = this.icon || this.shouldShowDefaultIcon();
+        return hasIcon ? /*html*/ `
+      <div class="alert-icon ${!this.icon ? 'alert-icon--default' : ''}">
+        ${this.icon || ''}
+      </div>
+    ` : '';
+    }
+    renderTitleSection() {
+        return this.title ? /*html*/ `
+      <div class="alert-title">${this.title}</div>
+    ` : '';
+    }
+    renderDescriptionSection() {
+        return /*html*/ `
+      <div class="alert-description">
+        <slot></slot>
+      </div>
+    `;
+    }
+    renderDismissSection() {
+        return this.dismissible ? /*html*/ `
+      <button class="alert-dismiss" type="button" aria-label="Dismiss alert">
+        <svg viewBox="0 0 24 24" fill="currentColor">
+          <path d="M19 6.41L17.59 5L12 10.59L6.41 5L5 6.41L10.59 12L5 17.59L6.41 19L12 13.41L17.59 19L19 17.59L13.41 12L19 6.41Z"/>
+        </svg>
+      </button>
+    ` : '';
+    }
+    css() {
+        return css;
+    }
+    shouldShowDefaultIcon() {
+        // Show default icons for variants unless explicitly disabled
+        return this.icon !== 'none';
+    }
+    handleDismiss() {
+        this.hide();
+        return {
+            variant: this.variant,
+            title: this.title
+        };
+    }
+    handleAnimationEnd(event) {
+        if (event.animationName === 'slideOut') {
+            this.isHidden = true;
+            if (this.alertElement) {
+                this.alertElement.classList.add('alert--hidden');
+                this.alertElement.classList.remove('alert--hiding');
+            }
+            this.dispatchAlertHidden();
+        }
+    }
+    dispatchAlertHidden() {
+        return {
+            variant: this.variant,
+            title: this.title
+        };
+    }
+    dispatchAlertShown() {
+        return {
+            variant: this.variant,
+            title: this.title
+        };
+    }
+    show() {
+        this.isHidden = false;
+        if (this.alertElement) {
+            this.alertElement.classList.remove('alert--hidden', 'alert--hiding');
+        }
+        this.dispatchAlertShown();
+    }
+    hide() {
+        if (this.alertElement && !this.isHidden) {
+            this.alertElement.classList.add('alert--hiding');
+        }
+    }
+};
+__decorate([
+    property({ reflect: true }),
+    __metadata("design:type", String)
+], SniceAlert.prototype, "variant", void 0);
+__decorate([
+    property({ reflect: true }),
+    __metadata("design:type", String)
+], SniceAlert.prototype, "size", void 0);
+__decorate([
+    property({ reflect: true }),
+    __metadata("design:type", Object)
+], SniceAlert.prototype, "title", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true }),
+    __metadata("design:type", Object)
+], SniceAlert.prototype, "dismissible", void 0);
+__decorate([
+    property({ reflect: true }),
+    __metadata("design:type", Object)
+], SniceAlert.prototype, "icon", void 0);
+__decorate([
+    query('.alert'),
+    __metadata("design:type", HTMLElement)
+], SniceAlert.prototype, "alertElement", void 0);
+__decorate([
+    part('icon-section'),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", void 0)
+], SniceAlert.prototype, "renderIconSection", null);
+__decorate([
+    watch('title'),
+    part('title-section'),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", void 0)
+], SniceAlert.prototype, "renderTitleSection", null);
+__decorate([
+    part('description-section'),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", void 0)
+], SniceAlert.prototype, "renderDescriptionSection", null);
+__decorate([
+    watch('dismissible'),
+    part('dismiss-section'),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", void 0)
+], SniceAlert.prototype, "renderDismissSection", null);
+__decorate([
+    on('click', '.alert-dismiss'),
+    dispatch('alert-dismiss'),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", void 0)
+], SniceAlert.prototype, "handleDismiss", null);
+__decorate([
+    on('animationend', '.alert'),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", [AnimationEvent]),
+    __metadata("design:returntype", void 0)
+], SniceAlert.prototype, "handleAnimationEnd", null);
+__decorate([
+    dispatch('alert-hidden'),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", void 0)
+], SniceAlert.prototype, "dispatchAlertHidden", null);
+__decorate([
+    dispatch('alert-shown'),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", void 0)
+], SniceAlert.prototype, "dispatchAlertShown", null);
+SniceAlert = __decorate([
+    element('snice-alert')
+], SniceAlert);
+export { SniceAlert };
+//# sourceMappingURL=snice-alert.js.map

package/dist/components/alert/snice-alert.js.map

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

package/dist/components/alert/snice-alert.types.d.ts

@@ -0,0 +1,11 @@
+export type AlertVariant = 'info' | 'success' | 'warning' | 'error';
+export type AlertSize = 'small' | 'medium' | 'large';
+export interface SniceAlertElement extends HTMLElement {
+    variant: AlertVariant;
+    size: AlertSize;
+    title: string;
+    dismissible: boolean;
+    icon: string;
+    show(): void;
+    hide(): void;
+}

package/dist/components/alert/snice-alert.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=snice-alert.types.js.map

package/dist/components/alert/snice-alert.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"snice-alert.types.js","sourceRoot":"","sources":["../../../components/alert/snice-alert.types.ts"],"names":[],"mappings":""}

package/dist/components/avatar/snice-avatar.d.ts

@@ -0,0 +1,24 @@
+import type { AvatarSize, AvatarShape, SniceAvatarElement } from './snice-avatar.types';
+export declare class SniceAvatar extends HTMLElement implements SniceAvatarElement {
+    src: string;
+    alt: string;
+    name: string;
+    size: AvatarSize;
+    shape: AvatarShape;
+    fallbackColor: string;
+    fallbackBackground: string;
+    imageElement?: HTMLImageElement;
+    fallbackElement?: HTMLElement;
+    private imageError;
+    html(): string;
+    renderImageSection(): string;
+    renderFallbackSection(): string;
+    css(): string;
+    init(): void;
+    private setupImageHandlers;
+    handleImageLoad(): void;
+    handleImageError(): void;
+    getInitials(name: string): string;
+    private getColorClass;
+    private renderIcon;
+}

package/dist/components/avatar/snice-avatar.js

@@ -0,0 +1,177 @@
+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;
+};
+var __metadata = (this && this.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
+import { element, property, watch, query, ready, on, part } from '../../src/index';
+import css from './snice-avatar.css?inline';
+let SniceAvatar = class SniceAvatar extends HTMLElement {
+    constructor() {
+        super(...arguments);
+        this.src = '';
+        this.alt = '';
+        this.name = '';
+        this.size = 'medium';
+        this.shape = 'circle';
+        this.fallbackColor = '#ffffff';
+        this.fallbackBackground = '';
+        this.imageError = false;
+    }
+    html() {
+        const colorClass = this.fallbackBackground ? '' : this.getColorClass(this.name);
+        const bgStyle = this.fallbackBackground ? `style="--avatar-bg: ${this.fallbackBackground}; --avatar-color: ${this.fallbackColor}"` : '';
+        return /*html*/ `
+      <div class="avatar ${colorClass}" ${bgStyle}>
+        <div part="image-section"></div>
+        <div part="fallback-section"></div>
+      </div>
+    `;
+    }
+    renderImageSection() {
+        return this.src ? /*html*/ `
+      <img class="avatar-image ${this.imageError ? 'avatar-image--error' : ''}" 
+           src="${this.src}" 
+           alt="${this.alt || this.name}"
+           loading="lazy">
+    ` : '';
+    }
+    renderFallbackSection() {
+        const initials = this.getInitials(this.name);
+        return /*html*/ `
+      <div class="avatar-fallback ${!this.src || this.imageError ? 'avatar-fallback--visible' : ''}">
+        ${initials || this.renderIcon()}
+      </div>
+    `;
+    }
+    css() {
+        return css;
+    }
+    init() {
+        this.setupImageHandlers();
+    }
+    setupImageHandlers() {
+        if (this.imageElement) {
+            this.imageElement.addEventListener('load', this.handleImageLoad.bind(this));
+            this.imageElement.addEventListener('error', this.handleImageError.bind(this));
+        }
+    }
+    handleImageLoad() {
+        this.imageError = false;
+        this.renderImageSection();
+        this.renderFallbackSection();
+    }
+    handleImageError() {
+        this.imageError = true;
+        this.renderImageSection();
+        this.renderFallbackSection();
+    }
+    getInitials(name) {
+        if (!name)
+            return '';
+        const words = name.trim().split(/\s+/);
+        if (words.length === 1) {
+            return words[0].substring(0, 2).toUpperCase();
+        }
+        return (words[0][0] + words[words.length - 1][0]).toUpperCase();
+    }
+    getColorClass(name) {
+        if (!name)
+            return '';
+        const colors = [
+            'red', 'orange', 'yellow', 'lime', 'green',
+            'teal', 'cyan', 'sky', 'blue', 'indigo',
+            'violet', 'purple', 'fuchsia', 'pink', 'rose'
+        ];
+        // Hash the name to get a consistent index
+        let hash = 0;
+        for (let i = 0; i < name.length; i++) {
+            hash = name.charCodeAt(i) + ((hash << 5) - hash);
+        }
+        const colorIndex = Math.abs(hash) % colors.length;
+        return `avatar--${colors[colorIndex]}`;
+    }
+    renderIcon() {
+        return /*html*/ `
+      <svg class="avatar-icon" viewBox="0 0 24 24" fill="currentColor">
+        <path d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"/>
+      </svg>
+    `;
+    }
+};
+__decorate([
+    property({ reflect: true }),
+    __metadata("design:type", Object)
+], SniceAvatar.prototype, "src", void 0);
+__decorate([
+    property({ reflect: true }),
+    __metadata("design:type", Object)
+], SniceAvatar.prototype, "alt", void 0);
+__decorate([
+    property({ reflect: true }),
+    __metadata("design:type", Object)
+], SniceAvatar.prototype, "name", void 0);
+__decorate([
+    property({ reflect: true }),
+    __metadata("design:type", String)
+], SniceAvatar.prototype, "size", void 0);
+__decorate([
+    property({ reflect: true }),
+    __metadata("design:type", String)
+], SniceAvatar.prototype, "shape", void 0);
+__decorate([
+    property({ attribute: 'fallback-color', reflect: true }),
+    __metadata("design:type", Object)
+], SniceAvatar.prototype, "fallbackColor", void 0);
+__decorate([
+    property({ attribute: 'fallback-background', reflect: true }),
+    __metadata("design:type", Object)
+], SniceAvatar.prototype, "fallbackBackground", void 0);
+__decorate([
+    query('.avatar-image'),
+    __metadata("design:type", HTMLImageElement)
+], SniceAvatar.prototype, "imageElement", void 0);
+__decorate([
+    query('.avatar-fallback'),
+    __metadata("design:type", HTMLElement)
+], SniceAvatar.prototype, "fallbackElement", void 0);
+__decorate([
+    watch('src'),
+    part('image-section'),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", void 0)
+], SniceAvatar.prototype, "renderImageSection", null);
+__decorate([
+    watch('name'),
+    part('fallback-section'),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", void 0)
+], SniceAvatar.prototype, "renderFallbackSection", null);
+__decorate([
+    ready(),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", void 0)
+], SniceAvatar.prototype, "init", null);
+__decorate([
+    on('load', '.avatar-image'),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", void 0)
+], SniceAvatar.prototype, "handleImageLoad", null);
+__decorate([
+    on('error', '.avatar-image'),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", void 0)
+], SniceAvatar.prototype, "handleImageError", null);
+SniceAvatar = __decorate([
+    element('snice-avatar')
+], SniceAvatar);
+export { SniceAvatar };
+//# sourceMappingURL=snice-avatar.js.map

package/dist/components/avatar/snice-avatar.js.map

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

package/dist/components/avatar/snice-avatar.types.d.ts

@@ -0,0 +1,12 @@
+export type AvatarSize = 'xs' | 'small' | 'medium' | 'large' | 'xl' | 'xxl';
+export type AvatarShape = 'circle' | 'square' | 'rounded';
+export interface SniceAvatarElement extends HTMLElement {
+    src: string;
+    alt: string;
+    name: string;
+    size: AvatarSize;
+    shape: AvatarShape;
+    fallbackColor: string;
+    fallbackBackground: string;
+    getInitials(name: string): string;
+}

package/dist/components/avatar/snice-avatar.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=snice-avatar.types.js.map

package/dist/components/avatar/snice-avatar.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"snice-avatar.types.js","sourceRoot":"","sources":["../../../components/avatar/snice-avatar.types.ts"],"names":[],"mappings":""}

package/dist/components/badge/snice-badge.d.ts

@@ -0,0 +1,25 @@
+import type { BadgeVariant, BadgePosition, BadgeSize, SniceBadgeElement } from './snice-badge.types';
+export declare class SniceBadge extends HTMLElement implements SniceBadgeElement {
+    content: string;
+    count: number;
+    max: number;
+    dot: boolean;
+    variant: BadgeVariant;
+    position: BadgePosition;
+    inline: boolean;
+    size: BadgeSize;
+    pulse: boolean;
+    offset: number;
+    badgeElement?: HTMLElement;
+    html(): string;
+    renderBadgeSection(): string;
+    css(): string;
+    private getDisplayContent;
+    private shouldShowBadge;
+    init(): void;
+    updateOffset(): void;
+    setBadgeContent(content: string): void;
+    setBadgeCount(count: number): void;
+    showDot(): void;
+    hide(): void;
+}

package/dist/components/badge/snice-badge.js

@@ -0,0 +1,157 @@
+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;
+};
+var __metadata = (this && this.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
+import { element, property, watch, query, ready, part } from '../../src/index';
+import css from './snice-badge.css?inline';
+let SniceBadge = class SniceBadge extends HTMLElement {
+    constructor() {
+        super(...arguments);
+        this.content = '';
+        this.count = 0;
+        this.max = 99;
+        this.dot = false;
+        this.variant = 'default';
+        this.position = 'top-right';
+        this.inline = false;
+        this.size = 'medium';
+        this.pulse = false;
+        this.offset = 0;
+    }
+    html() {
+        return /*html*/ `
+      <div class="badge-wrapper">
+        <slot></slot>
+        <div part="badge-section"></div>
+      </div>
+    `;
+    }
+    renderBadgeSection() {
+        const displayContent = this.getDisplayContent();
+        const showBadge = this.shouldShowBadge();
+        if (!showBadge)
+            return '';
+        return /*html*/ `
+      <span class="badge ${this.dot ? 'badge--dot' : ''} ${this.pulse ? 'badge--pulse' : ''}" 
+            aria-label="${displayContent}"
+            role="status">
+        ${!this.dot ? displayContent : ''}
+      </span>
+    `;
+    }
+    css() {
+        return css;
+    }
+    getDisplayContent() {
+        if (this.dot)
+            return 'notification';
+        if (this.content)
+            return this.content;
+        if (this.count > 0) {
+            return this.count > this.max ? `${this.max}+` : String(this.count);
+        }
+        return '';
+    }
+    shouldShowBadge() {
+        return this.dot || this.content !== '' || this.count > 0;
+    }
+    init() {
+        this.updateOffset();
+    }
+    updateOffset() {
+        this.style.setProperty('--badge-offset', `${this.offset}px`);
+    }
+    setBadgeContent(content) {
+        this.content = content;
+        this.count = 0;
+        this.dot = false;
+    }
+    setBadgeCount(count) {
+        this.count = count;
+        this.content = '';
+        this.dot = false;
+    }
+    showDot() {
+        this.dot = true;
+        this.content = '';
+        this.count = 0;
+    }
+    hide() {
+        this.dot = false;
+        this.content = '';
+        this.count = 0;
+    }
+};
+__decorate([
+    property({ reflect: true }),
+    __metadata("design:type", Object)
+], SniceBadge.prototype, "content", void 0);
+__decorate([
+    property({ type: Number, reflect: true }),
+    __metadata("design:type", Object)
+], SniceBadge.prototype, "count", void 0);
+__decorate([
+    property({ type: Number, reflect: true }),
+    __metadata("design:type", Object)
+], SniceBadge.prototype, "max", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true }),
+    __metadata("design:type", Object)
+], SniceBadge.prototype, "dot", void 0);
+__decorate([
+    property({ reflect: true }),
+    __metadata("design:type", String)
+], SniceBadge.prototype, "variant", void 0);
+__decorate([
+    property({ reflect: true }),
+    __metadata("design:type", String)
+], SniceBadge.prototype, "position", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true }),
+    __metadata("design:type", Object)
+], SniceBadge.prototype, "inline", void 0);
+__decorate([
+    property({ reflect: true }),
+    __metadata("design:type", String)
+], SniceBadge.prototype, "size", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true }),
+    __metadata("design:type", Object)
+], SniceBadge.prototype, "pulse", void 0);
+__decorate([
+    property({ type: Number, reflect: true }),
+    __metadata("design:type", Object)
+], SniceBadge.prototype, "offset", void 0);
+__decorate([
+    query('.badge'),
+    __metadata("design:type", HTMLElement)
+], SniceBadge.prototype, "badgeElement", void 0);
+__decorate([
+    watch('content', 'count', 'max', 'dot', 'pulse'),
+    part('badge-section'),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", void 0)
+], SniceBadge.prototype, "renderBadgeSection", null);
+__decorate([
+    ready(),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", void 0)
+], SniceBadge.prototype, "init", null);
+__decorate([
+    watch('offset'),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", void 0)
+], SniceBadge.prototype, "updateOffset", null);
+SniceBadge = __decorate([
+    element('snice-badge')
+], SniceBadge);
+export { SniceBadge };
+//# sourceMappingURL=snice-badge.js.map

package/dist/components/badge/snice-badge.js.map

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

package/dist/components/badge/snice-badge.types.d.ts

@@ -0,0 +1,15 @@
+export type BadgeVariant = 'default' | 'primary' | 'success' | 'warning' | 'error' | 'info';
+export type BadgePosition = 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left';
+export type BadgeSize = 'small' | 'medium' | 'large';
+export interface SniceBadgeElement extends HTMLElement {
+    content: string;
+    count: number;
+    max: number;
+    dot: boolean;
+    variant: BadgeVariant;
+    position: BadgePosition;
+    inline: boolean;
+    size: BadgeSize;
+    pulse: boolean;
+    offset: number;
+}

package/dist/components/badge/snice-badge.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=snice-badge.types.js.map

package/dist/components/badge/snice-badge.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"snice-badge.types.js","sourceRoot":"","sources":["../../../components/badge/snice-badge.types.ts"],"names":[],"mappings":""}