bromcom-ui-next 0.1.30 → 0.1.31

package/dist/components/p-5_TgtzQU.js

@@ -0,0 +1,119 @@
+import { p as proxyCustomElement, H, c as createEvent, h } from './index.js';
+import { t as tv } from './p-CEcVC0yX.js';
+
+const alertCss = ".flex{display:flex}:host{--bcm-alert-bg:var(--bcm-ui-color-background-default-default);--bcm-alert-text:var(--bcm-ui-color-text-default);--bcm-alert-radius:6px;display:flex;width:100%}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.static{position:static}.relative{position:relative}.hidden{display:none}.size-4{height:1rem;width:1rem}.size-5{height:1.25rem;width:1.25rem}.size-8{height:2rem;width:2rem}.h-1\\.5{height:.375rem}.h-10{height:2.5rem}.h-full{height:100%}.w-\\[50px\\]{width:50px}.w-full{width:100%}.min-w-0{min-width:0}.min-w-\\[3ch\\]{min-width:3ch}.max-w-64{max-width:16rem}.flex-1{flex:1 1 0%}.flex-shrink{flex-shrink:1}.flex-shrink-0,.shrink-0{flex-shrink:0}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.select-none{user-select:none}.appearance-none{appearance:none}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.items-start{align-items:flex-start}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:.25rem}.gap-1\\.5{gap:.375rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.space-y-1>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-bottom:calc(.25rem*var(--tw-space-y-reverse));margin-top:calc(.25rem*(1 - var(--tw-space-y-reverse)))}.overflow-hidden,.truncate{overflow:hidden}.truncate{text-overflow:ellipsis;white-space:nowrap}.rounded{border-radius:var(--bcm-ui-border-radius-default,6px)}.rounded-full{border-radius:var(--bcm-ui-border-radius-full,9999px)}.border{border-width:1px}.border-dashed{border-style:dashed}.border-none{border-style:none}.border-color-default{border-color:var(--bcm-ui-color-border-default)}.border-color-disabled{border-color:var(--bcm-ui-color-border-disabled)}.border-color-primary{border-color:var(--bcm-ui-color-border-primary)}.bg-color-basic-masterpage{background-color:var(--bcm-ui-color-background-basic-masterpage)}.bg-color-default{background-color:var(--bcm-ui-color-background-default-default)}.bg-color-disabled{background-color:var(--bcm-ui-color-background-disabled-default)}.bg-color-primary{background-color:var(--bcm-ui-color-background-primary-default)}.bg-color-soft-blue{background-color:var(--bcm-ui-color-background-soft-blue-default)}.bg-transparent{background-color:transparent}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.py-1\\.5{padding-bottom:.375rem;padding-top:.375rem}.py-4{padding-bottom:1rem;padding-top:1rem}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-size-10{font-size:var(--bcm-ui-font-size-10,36px);line-height:var(--bcm-ui-line-height-10,44px)}.text-size-2{font-size:var(--bcm-ui-font-size-2,10px);line-height:var(--bcm-ui-line-height-2,12px)}.text-size-3{font-size:var(--bcm-ui-font-size-3,12px);line-height:var(--bcm-ui-line-height-3,16px)}.text-size-4{font-size:var(--bcm-ui-font-size-4,14px);line-height:var(--bcm-ui-line-height-4,20px)}.text-size-8{font-size:var(--bcm-ui-font-size-8,24px);line-height:var(--bcm-ui-line-height-8,32px)}.font-medium{font-weight:500}.text-color-caption{color:var(--bcm-ui-color-text-caption)}.text-color-default{color:var(--bcm-ui-color-text-default)}.text-color-disabled{color:var(--bcm-ui-color-text-disabled)}.text-color-helper{color:var(--bcm-ui-color-text-helper)}.text-color-icon-default{color:var(--bcm-ui-color-text-icon-default)}.text-color-label{color:var(--bcm-ui-color-text-label)}.text-color-primary{color:var(--bcm-ui-color-text-primary)}.no-underline{text-decoration-line:none}.opacity-60{opacity:.6}.shadow{--tw-shadow:var(--bcm-ui-box-shadow-default);--tw-shadow-colored:var(--bcm-ui-box-shadow-default);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-colors{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.hover\\:bg-color-default-hover:hover{background-color:var(--bcm-ui-color-background-default-hover)}.hover\\:underline:hover{text-decoration-line:underline}.hover\\:no-underline:hover{text-decoration-line:none}.flex-shrink-0{flex-shrink:0}.rounded-\\[--bcm-alert-radius\\]{border-radius:var(--bcm-alert-radius)}.bg-\\[--bcm-alert-bg\\]{background-color:var(--bcm-alert-bg)}.py-2{padding-bottom:.5rem;padding-top:.5rem}.py-2\\.5{padding-bottom:.625rem;padding-top:.625rem}.text-size-5{font-size:var(--bcm-ui-font-size-5,16px);line-height:var(--bcm-ui-line-height-5,24px)}.text-size-6{font-size:var(--bcm-ui-font-size-6,18px);line-height:var(--bcm-ui-line-height-6,24px)}.text-\\[--bcm-alert-text\\]{color:var(--bcm-alert-text)}";
+
+const BcmAlert = /*@__PURE__*/ proxyCustomElement(class BcmAlert extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+        this.bcmDismiss = createEvent(this, "bcmDismiss", 7);
+    }
+    /** Alert status type */
+    status = 'default';
+    /** Alert size variant */
+    size = 'medium';
+    /** Alert style variant */
+    kind = 'filled';
+    /** Whether alert can be dismissed */
+    dismissible = true;
+    /** Whether to show status icon */
+    showStatusIcon = true;
+    bcmDismiss;
+    /**
+     * Handles alert dismissal
+     * @private
+     */
+    onDismiss() {
+        this.bcmDismiss.emit();
+    }
+    getStatusIcon() {
+        const statusIcon = {
+            info: 'fa-regular fa-info-circle',
+            error: 'fa-regular fa-exclamation-circle',
+            warning: 'fa-regular fa-exclamation-triangle',
+            success: 'fa-regular fa-check-circle',
+        };
+        return statusIcon[this.status];
+    }
+    get alertClass() {
+        return tv({
+            slots: {
+                base: 'alert bcm-ui-element font-medium flex w-full items-center justify-between bg-[--bcm-alert-bg] text-[--bcm-alert-text] rounded-[--bcm-alert-radius] px-3 gap-3',
+                section: 'flex items-center gap-2',
+            },
+            variants: {
+                size: {
+                    small: {
+                        base: 'py-1.5 text-size-4',
+                    },
+                    medium: {
+                        base: 'py-2 text-size-5',
+                    },
+                    large: {
+                        base: 'py-2.5 text-size-6',
+                    },
+                },
+            },
+        }, {
+            twMerge: false,
+        });
+    }
+    get alertStyles() {
+        let colorStatus = {
+            info: 'var(--bcm-ui-color-background-palette-blue-default)',
+            error: 'var(--bcm-ui-color-background-palette-red-default)',
+            warning: 'var(--bcm-ui-color-background-palette-yellow-default)',
+            success: 'var(--bcm-ui-color-background-palette-green-default)',
+            default: 'var(--bcm-ui-color-background-palette-gray-default)',
+        };
+        let textStatusColor = {
+            info: 'var(--bcm-ui-color-text-info)',
+            error: 'var(--bcm-ui-color-text-error)',
+            warning: 'var(--bcm-ui-color-text-warning)',
+            success: 'var(--bcm-ui-color-text-success)',
+            default: 'var(--bcm-ui-color-text-default)',
+        };
+        const statusKey = this.status in colorStatus ? this.status : 'default';
+        return this.kind === 'filled' ? {
+            '--bcm-alert-bg': colorStatus[statusKey],
+            '--bcm-alert-text': textStatusColor[statusKey],
+        } : {
+            '--bcm-alert-bg': 'transparent',
+            '--bcm-alert-text': textStatusColor[statusKey],
+        };
+    }
+    render() {
+        const { base, section } = this.alertClass({ size: this.size });
+        return (h("div", { key: '9a850444b4bf1cf19988e8ec3231ba9841b64434', role: "alert", "aria-live": "assertive", "aria-atomic": "true", class: base(), style: this.alertStyles }, h("div", { key: '728538fac235e8a9778d9cbf0af44e9cec2d225a', class: section() + " flex-1 min-w-0" }, this.showStatusIcon && h("bcm-icon", { key: 'ed7975a709372ffce93945ec26bf8a9ef233da78', "icon-name": this.getStatusIcon() }), h("div", { key: 'cc455de5ddf104eadd827e6e9124551694994c0f', class: "min-w-0" }, h("slot", { key: '3f8019ac16f41796374eeaf7c7c87d728c5211e5' }))), h("div", { key: '29ec075e042b61199340fcafde06a7f72c35e72d', class: section() + " flex-shrink-0" }, h("div", { key: 'e754fc3d78c60376db4bd54c6a2f84617ff94ae7', part: "action" }, h("slot", { key: '1a7b8139b497ad750d1b204149fa264e73b00d6b', name: "action" })), h("span", { key: '6287c52814354308a992bde5b50e3f2cd061dcdb', part: "icon" }, this.dismissible && h("bcm-icon", { key: '342f3cac9ed4c2e4e28cab0d494c65e6b53027e8', onClick: () => this.onDismiss(), class: "cursor-pointer", "icon-name": "fa-regular fa-xmark" })))));
+    }
+    static get style() { return alertCss; }
+}, [257, "bcm-alert", {
+        "status": [1],
+        "size": [1],
+        "kind": [1],
+        "dismissible": [4],
+        "showStatusIcon": [4, "show-status-icon"]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["bcm-alert"];
+    components.forEach(tagName => { switch (tagName) {
+        case "bcm-alert":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, BcmAlert);
+            }
+            break;
+    } });
+}
+defineCustomElement();
+
+export { BcmAlert as B, defineCustomElement as d };
+//# sourceMappingURL=p-5_TgtzQU.js.map
+
+//# sourceMappingURL=p-5_TgtzQU.js.map

package/dist/components/p-5_TgtzQU.js.map

@@ -0,0 +1 @@
+{"file":"p-5_TgtzQU.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/alert/alert.css?tag=bcm-alert&encapsulation=shadow","src/components/alert/alert.component.tsx"],"sourcesContent":[":host {\n  display: flex;\n  width: 100%;\n  --bcm-alert-bg: var(--bcm-ui-color-background-default-default);\n  --bcm-alert-text: var(--bcm-ui-color-text-default);\n  --bcm-alert-radius: 6px;\n}","import { Component, ComponentInterface, h, Prop, Event, EventEmitter } from '@stencil/core';\nimport { AlertKind, AlertSize, AlertStatus } from './types';\nimport { tv } from '@utils/tv';\n\n/**\n * Alert component that displays messages with different statuses and styles\n * @class BcmAlert\n */\n@Component({\n  tag: 'bcm-alert',\n  styleUrl: 'alert.css',\n  shadow: true,\n})\nexport class BcmAlert implements ComponentInterface {\n  /** Alert status type */\n  @Prop()\n  status?: AlertStatus = 'default';\n\n  /** Alert size variant */\n  @Prop()\n  size?: AlertSize = 'medium';\n\n  /** Alert style variant */\n  @Prop()\n  kind?: AlertKind = 'filled';\n\n  /** Whether alert can be dismissed */\n  @Prop()\n  dismissible?: boolean = true;\n\n  /** Whether to show status icon */\n  @Prop()\n  showStatusIcon?: boolean = true;\n\n  @Event() bcmDismiss: EventEmitter<void>;\n\n  /**\n   * Handles alert dismissal\n   * @private\n   */\n  private onDismiss() {\n    this.bcmDismiss.emit();\n  }\n\n  private getStatusIcon() {\n    const statusIcon = {\n      info: 'fa-regular fa-info-circle',\n      error: 'fa-regular fa-exclamation-circle',\n      warning: 'fa-regular fa-exclamation-triangle',\n      success: 'fa-regular fa-check-circle',\n    };\n    return statusIcon[this.status];\n  }\n\n  private get alertClass() {\n    return tv(\n      {\n        slots: {\n          base: 'alert bcm-ui-element font-medium flex w-full items-center justify-between bg-[--bcm-alert-bg] text-[--bcm-alert-text] rounded-[--bcm-alert-radius] px-3 gap-3',\n          section: 'flex items-center gap-2',\n        },\n        variants: {\n          size: {\n            small: {\n              base: 'py-1.5 text-size-4',\n            },\n            medium: {\n              base: 'py-2 text-size-5',\n            },\n            large: {\n              base: 'py-2.5 text-size-6',\n            },\n          },\n        },\n      },\n      {\n        twMerge: false,\n      },\n    );\n  }\n\n  private get alertStyles() {\n    let colorStatus = {\n      info: 'var(--bcm-ui-color-background-palette-blue-default)',\n      error: 'var(--bcm-ui-color-background-palette-red-default)',\n      warning: 'var(--bcm-ui-color-background-palette-yellow-default)',\n      success: 'var(--bcm-ui-color-background-palette-green-default)',\n      default: 'var(--bcm-ui-color-background-palette-gray-default)',\n    };\n\n    let textStatusColor = {\n      info: 'var(--bcm-ui-color-text-info)',\n      error: 'var(--bcm-ui-color-text-error)',\n      warning: 'var(--bcm-ui-color-text-warning)',\n      success: 'var(--bcm-ui-color-text-success)',\n      default: 'var(--bcm-ui-color-text-default)',\n    };\n\n    const statusKey = this.status in colorStatus ? this.status : 'default';\n\n    return this.kind === 'filled' ? {\n      '--bcm-alert-bg': colorStatus[statusKey],\n      '--bcm-alert-text': textStatusColor[statusKey],\n    } : {\n      '--bcm-alert-bg': 'transparent',\n      '--bcm-alert-text': textStatusColor[statusKey],\n    };\n  }\n\n  render() {\n    const { base, section } = this.alertClass({ size: this.size });\n    return (\n      <div role=\"alert\" aria-live=\"assertive\" aria-atomic=\"true\" class={base()} style={this.alertStyles}>\n        <div class={section() + \" flex-1 min-w-0\"}>\n          {this.showStatusIcon && <bcm-icon icon-name={this.getStatusIcon()}></bcm-icon>}\n          <div class=\"min-w-0\">\n            <slot></slot>\n          </div>\n        </div>\n        <div class={section() + \" flex-shrink-0\"}>\n          <div part=\"action\">\n            <slot name=\"action\"></slot>\n          </div>\n          <span part=\"icon\">{this.dismissible && <bcm-icon onClick={() => this.onDismiss()} class=\"cursor-pointer\" icon-name=\"fa-regular fa-xmark\"></bcm-icon>}</span>\n        </div>\n      </div>\n    );\n  }\n}"],"version":3}

package/dist/components/p-RlBWOSgL.js

@@ -0,0 +1,179 @@
+import { p as proxyCustomElement, H, h } from './index.js';
+import { t as tv } from './p-CEcVC0yX.js';
+
+const badgeCss = ".relative{position:relative}:host{--bcm-badge-bg:var(--bcm-ui-color-background-default-default);--bcm-badge-text:var(--bcm-ui-color-text-default);--bcm-badge-radius:9999px;display:inline-block;position:relative}::slotted([slot=badge]){color:var(--bcm-badge-text);font-weight:500}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.-right-0\\.5{right:-.125rem}.-top-0\\.5{top:-.125rem}.right-0{right:0}.top-0{top:0}.inline-flex{display:inline-flex}.h-10{height:2.5rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-full{height:100%}.w-10{width:2.5rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-full{width:100%}.items-center{align-items:center}.justify-center{justify-content:center}.rounded-\\[--bcm-ui-radius\\]{border-radius:var(--bcm-ui-radius)}.rounded-full{border-radius:var(--bcm-ui-border-radius-full,9999px)}.bg-\\[--bcm-avatar-bg\\]{background-color:var(--bcm-avatar-bg)}.text-size-4{font-size:var(--bcm-ui-font-size-4,14px);line-height:var(--bcm-ui-line-height-4,20px)}.text-size-5{font-size:var(--bcm-ui-font-size-5,16px);line-height:var(--bcm-ui-line-height-5,24px)}.text-size-6{font-size:var(--bcm-ui-font-size-6,18px);line-height:var(--bcm-ui-line-height-6,24px)}.font-medium{font-weight:500}.uppercase{text-transform:uppercase}.text-\\[--bcm-avatar-text\\]{color:var(--bcm-avatar-text)}.shadow{--tw-shadow:var(--bcm-ui-box-shadow-default);--tw-shadow-colored:var(--bcm-ui-box-shadow-default);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.absolute{position:absolute}.-bottom-1{bottom:-.25rem}.-left-1{left:-.25rem}.-right-1{right:-.25rem}.-top-1{top:-.25rem}.z-10{z-index:10}.size-1{height:.25rem;width:.25rem}.size-1\\.5{height:.375rem;width:.375rem}.size-2{height:.5rem;width:.5rem}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.gap-0{gap:0}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.rounded-\\[--bcm-badge-radius\\]{border-radius:var(--bcm-badge-radius)}.bg-\\[--bcm-badge-bg\\]{background-color:var(--bcm-badge-bg)}.p-0{padding:0}.px-1{padding-left:.25rem;padding-right:.25rem}.px-1\\.5{padding-left:.375rem;padding-right:.375rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-0\\.5{padding-bottom:.125rem;padding-top:.125rem}.py-1{padding-bottom:.25rem;padding-top:.25rem}.text-\\[0px\\]{font-size:0}.text-size-3{font-size:var(--bcm-ui-font-size-3,12px);line-height:var(--bcm-ui-line-height-3,16px)}.leading-none{line-height:1}.text-\\[--bcm-badge-text\\]{color:var(--bcm-badge-text)}.after\\:absolute:after{content:var(--tw-content);position:absolute}.after\\:h-full:after{content:var(--tw-content);height:100%}.after\\:w-full:after{content:var(--tw-content);width:100%}@keyframes ping{75%,to{content:var(--tw-content);opacity:0;transform:scale(2)}}.after\\:animate-blink:after{animation:ping 2s infinite;content:var(--tw-content)}.after\\:rounded-full:after{border-radius:var(--bcm-ui-border-radius-full,9999px);content:var(--tw-content)}.after\\:bg-\\[--bcm-badge-bg\\]:after{background-color:var(--bcm-badge-bg);content:var(--tw-content)}.after\\:content-\\[\\\"\\\"\\]:after{--tw-content:\"\";content:var(--tw-content)}";
+
+const Badge = /*@__PURE__*/ proxyCustomElement(class Badge extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+    }
+    /**
+     * Determines the size of the badge.
+     * @type {'small' | 'medium' | 'large'}
+     * @default 'medium'
+     */
+    size = 'medium';
+    /**
+     * Sets the visual variant of the badge.
+     * 'dot': Appears as a small dot indicator
+     * 'text': Displays content as text
+     * @type {'dot' | 'text'}
+     * @default 'text'
+     */
+    variant = 'text';
+    /**
+     * Defines the color of the badge.
+     * Uses system color variables (e.g., 'primary', 'success', 'warning', etc.)
+     * @type {string}
+     * @optional
+     */
+    color;
+    /**
+     * Enables soft color mode for the badge.
+     * When true, uses lighter tones and pastel colors.
+     * @type {boolean}
+     * @default false
+     */
+    soft = false;
+    /**
+     * Enables blinking animation for the badge.
+     * Useful for drawing attention or indicating active status.
+     * @type {boolean}
+     * @default false
+     */
+    blink = false;
+    /**
+     * Status message for accessibility purposes.
+     * Will be read by screen readers.
+     * @type {string}
+     * @optional
+     */
+    status;
+    /**
+     * Sets the position of the badge relative to its container.
+     * @type {'top-right' | 'top-left' | 'bottom-right' | 'bottom-left'}
+     * @default 'top-right'
+     */
+    position = 'top-right';
+    /**
+     * Fine-tune the badge position with custom offset.
+     * Format: "x,y" in pixels (e.g., "10,-5")
+     * @type {string}
+     * @optional
+     */
+    offset;
+    /**
+     * Text to be displayed inside the badge.
+     * Used when variant is set to 'text'.
+     * Can be overridden using the "badge" slot.
+     * @type {string}
+     * @optional
+     */
+    text;
+    classes = tv({
+        base: 'badge bcm-ui-element absolute font-medium inline-flex items-center justify-center bg-[--bcm-badge-bg] text-[--bcm-badge-text] rounded-[--bcm-badge-radius] z-10',
+        variants: {
+            size: {
+                small: 'gap-1 px-1 text-size-3',
+                medium: 'gap-1 py-0.5 px-1.5 text-size-4',
+                large: 'gap-2 py-1 px-2 text-size-5',
+            },
+            variant: {
+                dot: 'gap-0 p-0 text-[0px] leading-none',
+                text: '',
+            },
+            position: {
+                'top-right': '-top-1 -right-1',
+                'top-left': '-top-1 -left-1',
+                'bottom-right': '-bottom-1 -right-1',
+                'bottom-left': '-bottom-1 -left-1',
+            },
+            blink: {
+                true: 'after:content-[""] after:absolute  after:rounded-full after:bg-[--bcm-badge-bg] after:animate-blink after:w-full after:h-full',
+            },
+        },
+        compoundVariants: [
+            {
+                variant: 'dot',
+                size: 'small',
+                class: 'size-1',
+            },
+            {
+                variant: 'dot',
+                size: 'medium',
+                class: 'size-1.5',
+            },
+            {
+                variant: 'dot',
+                size: 'large',
+                class: 'size-2',
+            },
+        ],
+        defaultVariants: {
+            variant: 'text',
+            size: 'medium',
+            position: 'top-right',
+            blink: false,
+        },
+    });
+    get offsetStyle() {
+        if (!this.offset)
+            return {};
+        const [x = 0, y = 0] = this.offset.split(',').map(val => val.trim());
+        return { transform: `translate(${x}px, ${y}px)` };
+    }
+    get badgeStyle() {
+        if (!this.color)
+            return {};
+        const variantType = this.soft ? 'soft' : 'vivid';
+        return {
+            '--bcm-badge-bg': `var(--bcm-ui-color-background-${variantType}-${this.color}-default)`,
+            '--bcm-badge-text': this.soft ? `var(--bcm-ui-color-text-palette-${this.color})` : 'var(--bcm-ui-color-text-base)',
+        };
+    }
+    render() {
+        return (h("div", { key: '18c634f88fdae46495b121abecb75047fedbcb3c', class: "relative inline-flex" }, h("slot", { key: 'fe3f798b2d3b8cfa8770f109be31fddc40c03a03' }), h("div", { key: '67d1effdcb853b550a30350521e19900cf1c716e', role: "status", "aria-live": "polite", "aria-label": this.status ? `Status: ${this.status}` : undefined, class: this.classes({
+                size: this.size,
+                variant: this.variant,
+                position: this.position,
+                blink: this.blink,
+            }), style: {
+                ...this.badgeStyle,
+                ...this.offsetStyle,
+            } }, this.variant == 'text' && h("slot", { key: 'ec18851053e0b744112c63a65e9a0b91d886884d', name: "badge" }, this.text))));
+    }
+    static get style() { return badgeCss; }
+}, [257, "bcm-badge", {
+        "size": [1],
+        "variant": [1],
+        "color": [1],
+        "soft": [4],
+        "blink": [4],
+        "status": [1],
+        "position": [1],
+        "offset": [1],
+        "text": [1]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["bcm-badge"];
+    components.forEach(tagName => { switch (tagName) {
+        case "bcm-badge":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, Badge);
+            }
+            break;
+    } });
+}
+defineCustomElement();
+
+export { Badge as B, defineCustomElement as d };
+//# sourceMappingURL=p-RlBWOSgL.js.map
+
+//# sourceMappingURL=p-RlBWOSgL.js.map

package/dist/components/p-RlBWOSgL.js.map

@@ -0,0 +1 @@
+{"file":"p-RlBWOSgL.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/badge/badge.css?tag=bcm-badge&encapsulation=shadow","src/components/badge/badge.component.tsx"],"sourcesContent":[":host {\n  display: inline-block;\n  position: relative;\n  --bcm-badge-bg: var(--bcm-ui-color-background-default-default);\n  --bcm-badge-text: var(--bcm-ui-color-text-default);\n  --bcm-badge-radius: 9999px;\n}\n\n::slotted([slot='badge']) {\n  color: var(--bcm-badge-text);\n  font-weight: 500;\n}\n","import { Component, ComponentInterface, Prop, h } from '@stencil/core';\nimport { tv } from '@utils/tv';\n\n/**\n * @component BcmBadge\n * @description A versatile badge component that can be positioned around its container.\n * Supports different sizes, variants (dot/text), colors, and positioning options.\n * Can display status indicators with optional blinking animation.\n *\n * @example Basic usage\n * <bcm-badge color=\"primary\" position=\"top-right\">\n *   <div>Container Content</div>\n *   <span slot=\"badge\">New</span>\n * </bcm-badge>\n *\n * @example Status indicator with blink\n * <bcm-badge variant=\"dot\" color=\"success\" blink={true} status=\"Online\">\n *   <div>User Profile</div>\n * </bcm-badge>\n */\n@Component({\n  tag: 'bcm-badge',\n  styleUrl: 'badge.css',\n  shadow: true,\n})\nexport class Badge implements ComponentInterface {\n  /**\n   * Determines the size of the badge.\n   * @type {'small' | 'medium' | 'large'}\n   * @default 'medium'\n   */\n  @Prop()\n  size: 'small' | 'medium' | 'large' = 'medium';\n\n  /**\n   * Sets the visual variant of the badge.\n   * 'dot': Appears as a small dot indicator\n   * 'text': Displays content as text\n   * @type {'dot' | 'text'}\n   * @default 'text'\n   */\n  @Prop()\n  variant: 'dot' | 'text' = 'text';\n\n  /**\n   * Defines the color of the badge.\n   * Uses system color variables (e.g., 'primary', 'success', 'warning', etc.)\n   * @type {string}\n   * @optional\n   */\n  @Prop()\n  color?: string;\n\n  /**\n   * Enables soft color mode for the badge.\n   * When true, uses lighter tones and pastel colors.\n   * @type {boolean}\n   * @default false\n   */\n  @Prop()\n  soft: boolean = false;\n\n  /**\n   * Enables blinking animation for the badge.\n   * Useful for drawing attention or indicating active status.\n   * @type {boolean}\n   * @default false\n   */\n  @Prop()\n  blink: boolean = false;\n\n  /**\n   * Status message for accessibility purposes.\n   * Will be read by screen readers.\n   * @type {string}\n   * @optional\n   */\n  @Prop()\n  status?: string;\n\n  /**\n   * Sets the position of the badge relative to its container.\n   * @type {'top-right' | 'top-left' | 'bottom-right' | 'bottom-left'}\n   * @default 'top-right'\n   */\n  @Prop()\n  position: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left' = 'top-right';\n\n  /**\n   * Fine-tune the badge position with custom offset.\n   * Format: \"x,y\" in pixels (e.g., \"10,-5\")\n   * @type {string}\n   * @optional\n   */\n  @Prop()\n  offset: string;\n\n  /**\n   * Text to be displayed inside the badge.\n   * Used when variant is set to 'text'.\n   * Can be overridden using the \"badge\" slot.\n   * @type {string}\n   * @optional\n   */\n  @Prop()\n  text?: string;\n\n  private classes = tv({\n    base: 'badge bcm-ui-element absolute font-medium inline-flex items-center justify-center bg-[--bcm-badge-bg] text-[--bcm-badge-text] rounded-[--bcm-badge-radius] z-10',\n    variants: {\n      size: {\n        small: 'gap-1 px-1 text-size-3',\n        medium: 'gap-1 py-0.5 px-1.5 text-size-4',\n        large: 'gap-2 py-1 px-2 text-size-5',\n      },\n      variant: {\n        dot: 'gap-0 p-0 text-[0px] leading-none',\n        text: '',\n      },\n      position: {\n        'top-right': '-top-1 -right-1',\n        'top-left': '-top-1 -left-1',\n        'bottom-right': '-bottom-1 -right-1',\n        'bottom-left': '-bottom-1 -left-1',\n      },\n      blink: {\n        true: 'after:content-[\"\"] after:absolute  after:rounded-full after:bg-[--bcm-badge-bg] after:animate-blink after:w-full after:h-full',\n      },\n    },\n    compoundVariants: [\n      {\n        variant: 'dot',\n        size: 'small',\n        class: 'size-1',\n      },\n      {\n        variant: 'dot',\n        size: 'medium',\n        class: 'size-1.5',\n      },\n      {\n        variant: 'dot',\n        size: 'large',\n        class: 'size-2',\n      },\n    ],\n    defaultVariants: {\n      variant: 'text',\n      size: 'medium',\n      position: 'top-right',\n      blink: false,\n    },\n  });\n\n  private get offsetStyle() {\n    if (!this.offset) return {};\n    const [x = 0, y = 0] = this.offset.split(',').map(val => val.trim());\n    return { transform: `translate(${x}px, ${y}px)` };\n  }\n\n  private get badgeStyle() {\n    if (!this.color) return {};\n    const variantType = this.soft ? 'soft' : 'vivid';\n\n    return {\n      '--bcm-badge-bg': `var(--bcm-ui-color-background-${variantType}-${this.color}-default)`,\n      '--bcm-badge-text': this.soft ? `var(--bcm-ui-color-text-palette-${this.color})` : 'var(--bcm-ui-color-text-base)',\n    };\n  }\n\n  render() {\n    return (\n      <div class=\"relative inline-flex\">\n        <slot></slot>\n        <div\n          role=\"status\"\n          aria-live=\"polite\"\n          aria-label={this.status ? `Status: ${this.status}` : undefined}\n          class={this.classes({\n            size: this.size,\n            variant: this.variant,\n            position: this.position,\n            blink: this.blink,\n          })}\n          style={{\n            ...this.badgeStyle,\n            ...this.offsetStyle,\n          }}\n        >\n          {this.variant == 'text' && <slot name=\"badge\">{this.text}</slot>}\n        </div>\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/components/p-SERXqWcS.js

@@ -0,0 +1,51 @@
+import { H } from './index.js';
+
+const BaseFormControl = class extends H {
+    constructor() {
+        super(false);
+    }
+    validationMode = 'native';
+    /** Form field name */
+    name;
+    /** Required state */
+    required = false;
+    /** Disabled state */
+    disabled = false;
+    /** Optional readonly support */
+    readonly = false;
+};
+
+const BaseChoiceControl = class extends BaseFormControl {
+    constructor() {
+        super();
+    }
+    /** Checked state */
+    checked = false;
+    /** Value submitted when checked */
+    value = 'on';
+    // --------------------------------------------------
+    // Shared behavior
+    // --------------------------------------------------
+    toggleChecked() {
+        if (this.disabled)
+            return;
+        this.checked = !this.checked;
+    }
+    // --------------------------------------------------
+    // Watchers
+    // --------------------------------------------------
+    onStateChange() {
+        this.updateFormValueAndValidity();
+    }
+    // --------------------------------------------------
+    // Form lifecycle
+    // --------------------------------------------------
+    formResetCallback() {
+        this.checked = false;
+    }
+};
+
+export { BaseChoiceControl as B };
+//# sourceMappingURL=p-SERXqWcS.js.map
+
+//# sourceMappingURL=p-SERXqWcS.js.map

package/dist/components/p-SERXqWcS.js.map

@@ -0,0 +1 @@
+{"file":"p-SERXqWcS.js","mappings":";;MAEsB,eAAe,GAAA,cAAAA,CAAA,CAAA;;;;IAEzB,cAAc,GAAiC,QAAQ;;AAGvD,IAAA,IAAI;;IAGJ,QAAQ,GAAG,KAAK;;IAGhB,QAAQ,GAAG,KAAK;;IAGhB,QAAQ,GAAG,KAAK;;;MCZN,iBAAkB,GAAA,cAAQ,eAAe,CAAA;;;;;IAElC,OAAO,GAAG,KAAK;;IAGhC,KAAK,GAAW,IAAI;;;;IAYlB,aAAa,GAAA;QACnB,IAAI,IAAI,CAAC,QAAQ;YAAE;AACnB,QAAA,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO;;;;;IAWtB,aAAa,GAAA;QACnB,IAAI,CAAC,0BAA0B,EAAE;;;;;IAOrC,iBAAiB,GAAA;AACb,QAAA,IAAI,CAAC,OAAO,GAAG,KAAK;;;;;;","names":["HTMLElement"],"sources":["src/components/_shared/form/base-form-control.ts","src/components/_shared/form/base-choice-control.ts"],"sourcesContent":["import { Prop } from '@stencil/core';\n\nexport abstract class BaseFormControl {\n\n    @Prop() validationMode: 'native' | 'silent' | 'none' = 'native';\n\n    /** Form field name */\n    @Prop() name?: string;\n\n    /** Required state */\n    @Prop() required = false;\n\n    /** Disabled state */\n    @Prop() disabled = false;\n\n    /** Optional readonly support */\n    @Prop() readonly = false;\n}\n","// src/components/_shared/form/base-choice-control.ts\nimport { Prop, Watch } from '@stencil/core';\nimport { BaseFormControl } from './base-form-control';\n\nexport abstract class BaseChoiceControl extends BaseFormControl {\n    /** Checked state */\n    @Prop({ mutable: true }) checked = false;\n\n    /** Value submitted when checked */\n    @Prop() value: string = 'on';\n\n    /**\n     * Must be implemented by component\n     * (because ElementInternals live in the component)\n     */\n    protected abstract updateFormValueAndValidity(): void;\n\n    // --------------------------------------------------\n    // Shared behavior\n    // --------------------------------------------------\n\n    protected toggleChecked() {\n        if (this.disabled) return;\n        this.checked = !this.checked;\n    }\n\n    // --------------------------------------------------\n    // Watchers\n    // --------------------------------------------------\n\n    @Watch('checked')\n    @Watch('required')\n    @Watch('disabled')\n    @Watch('value')\n    protected onStateChange() {\n        this.updateFormValueAndValidity();\n    }\n\n    // --------------------------------------------------\n    // Form lifecycle\n    // --------------------------------------------------\n\n    formResetCallback() {\n        this.checked = false;\n    }\n}\n"],"version":3}

package/dist/components/{p-CUvT12BL.js → p-nf_HKsGq.js}

@@ -1,4 +1,6 @@
 class I18n {
+    static messages = {};
+    static currentLocale = 'en';
     static setMessages(locale, messages) {
         this.messages[locale] = messages;
         this.currentLocale = locale; // Mesajları set ederken locale'i de güncelle
@@ -15,8 +17,7 @@ class I18n {
         }
     }
     static t(key, data) {
-        var _a;
-        const message = ((_a = this.messages[this.currentLocale]) === null || _a === void 0 ? void 0 : _a[key]) || key;
+        const message = this.messages[this.currentLocale]?.[key] || key;
         if (!data)
             return message;
         return Object.entries(data).reduce((msg, [key, value]) => {
@@ -24,8 +25,6 @@ class I18n {
         }, message);
     }
 }
-I18n.messages = {};
-I18n.currentLocale = 'en';
 
 const defaultValidationMessages = {
     email: 'Please enter a valid email address',
@@ -37,13 +36,13 @@ const defaultValidationMessages = {
     pattern: 'Please enter a valid format',
 };
 const setValidationMessages = (locale, messages) => {
-    I18n.setMessages(locale, Object.assign(Object.assign({}, defaultValidationMessages), messages));
+    I18n.setMessages(locale, { ...defaultValidationMessages, ...messages });
 };
 const getValidationMessage = (type, data) => {
     return I18n.t(type, data);
 };
 
 export { defaultValidationMessages as d, getValidationMessage as g, setValidationMessages as s };
-//# sourceMappingURL=p-CUvT12BL.js.map
+//# sourceMappingURL=p-nf_HKsGq.js.map
 
-//# sourceMappingURL=p-CUvT12BL.js.map
+//# sourceMappingURL=p-nf_HKsGq.js.map

package/dist/components/p-nf_HKsGq.js.map

@@ -0,0 +1 @@
+{"file":"p-nf_HKsGq.js","mappings":"MAEa,IAAI,CAAA;AACP,IAAA,OAAO,QAAQ,GAA2C,EAAE;AAC5D,IAAA,OAAO,aAAa,GAAG,IAAI;AAEnC,IAAA,OAAO,WAAW,CAAC,MAAc,EAAE,QAAgC,EAAA;AACjE,QAAA,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,GAAG,QAAQ;AAChC,QAAA,IAAI,CAAC,aAAa,GAAG,MAAM,CAAC;;;IAI9B,OAAO,SAAS,CAAC,MAAc,EAAA;AAC7B,QAAA,IAAI,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE;AACzB,YAAA,IAAI,CAAC,aAAa,GAAG,MAAM;;AAE3B,YAAA,OAAO,CAAC,GAAG,CAAC,2BAA2B,MAAM,CAAA,CAAE,CAAC;;aAC3C;AACL,YAAA,OAAO,CAAC,IAAI,CAAC,WAAW,MAAM,CAAA,uBAAA,CAAyB,CAAC;;;AAI5D,IAAA,OAAO,CAAC,CAAC,GAAW,EAAE,IAA0B,EAAA;AAC9C,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,aAAa,CAAC,GAAG,GAAG,CAAC,IAAI,GAAG;AAC/D,QAAA,IAAI,CAAC,IAAI;AAAE,YAAA,OAAO,OAAO;AAEzB,QAAA,OAAO,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,CAAC,GAAG,EAAE,KAAK,CAAC,KAAI;AACvD,YAAA,OAAO,GAAG,CAAC,OAAO,CAAC,IAAI,MAAM,CAAC,CAAI,CAAA,EAAA,GAAG,GAAG,EAAE,GAAG,CAAC,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC;SAC/D,EAAE,OAAO,CAAC;;;;AC1BF,MAAA,yBAAyB,GAAG;AACvC,IAAA,KAAK,EAAE,oCAAoC;AAC3C,IAAA,QAAQ,EAAE,wBAAwB;AAClC,IAAA,SAAS,EAAE,wCAAwC;AACnD,IAAA,SAAS,EAAE,4CAA4C;AACvD,IAAA,GAAG,EAAE,8BAA8B;AACnC,IAAA,GAAG,EAAE,6BAA6B;AAClC,IAAA,OAAO,EAAE,6BAA6B;;MAG3B,qBAAqB,GAAG,CAAC,MAAc,EAAE,QAAmD,KAAI;AAC3G,IAAA,IAAI,CAAC,WAAW,CAAC,MAAM,EAAE,EAAE,GAAG,yBAAyB,EAAE,GAAG,QAAQ,EAAE,CAAC;AACzE;MAEa,oBAAoB,GAAG,CAAC,IAA4C,EAAE,IAAsC,KAAI;IAC3H,OAAO,IAAI,CAAC,CAAC,CAAC,IAAI,EAAE,IAAI,CAAC;AAC3B;;;;","names":[],"sources":["src/utils/i18n.ts","src/utils/validation-messages.ts"],"sourcesContent":["export type MessageTemplateData = Record<string, string | number>;\n\nexport class I18n {\n  private static messages: Record<string, Record<string, string>> = {};\n  private static currentLocale = 'en';\n\n  static setMessages(locale: string, messages: Record<string, string>) {\n    this.messages[locale] = messages;\n    this.currentLocale = locale; // Mesajları set ederken locale'i de güncelle\n    // console.log(`I18n messages set for locale: ${locale}`, messages);\n  }\n\n  static setLocale(locale: string) {\n    if (this.messages[locale]) {\n      this.currentLocale = locale;\n      // Locale değiştiğinde console'a bilgi ver (development için)\n      console.log(`I18n locale changed to: ${locale}`);\n    } else {\n      console.warn(`Locale '${locale}' not found in messages`);\n    }\n  }\n\n  static t(key: string, data?: MessageTemplateData): string {\n    const message = this.messages[this.currentLocale]?.[key] || key;\n    if (!data) return message;\n\n    return Object.entries(data).reduce((msg, [key, value]) => {\n      return msg.replace(new RegExp(`{${key}}`, 'g'), String(value));\n    }, message);\n  }\n}\n","import { I18n } from './i18n';\n\nexport const defaultValidationMessages = {\n  email: 'Please enter a valid email address',\n  required: 'This field is required',\n  minlength: 'Please enter at least {min} characters',\n  maxlength: 'Please enter no more than {max} characters',\n  min: 'Value must be at least {min}',\n  max: 'Value must be at most {max}',\n  pattern: 'Please enter a valid format',\n};\n\nexport const setValidationMessages = (locale: string, messages: Partial<typeof defaultValidationMessages>) => {\n  I18n.setMessages(locale, { ...defaultValidationMessages, ...messages });\n};\n\nexport const getValidationMessage = (type: keyof typeof defaultValidationMessages, data?: Record<string, string | number>) => {\n  return I18n.t(type, data);\n};\n"],"version":3}