@ajuarezso/sui-stencil 0.0.0-stage → 0.1.0

package/dist/cjs/sui-content-divider.cjs.entry.js

@@ -0,0 +1,111 @@
+'use strict';
+
+var index = require('./index-DtYKdVSu.js');
+
+const suiContentDividerCss = () => `@charset "UTF-8";.sc-sui-content-divider-h{display:flex;align-items:center;justify-content:center;width:100%;box-sizing:border-box;font-family:var(--sui-font-sans, "Inter", system-ui, sans-serif);font-feature-settings:"ss11" 1, "calt" 0, "liga" 0}.sui-content-divider__line.sc-sui-content-divider{flex:1 0 0;min-width:0;height:1px;background:var(--sui-stroke-soft-200)}[data-sui-type=line-spacing].sc-sui-content-divider-h{padding:1.5px 0}[data-sui-type=text-line].sc-sui-content-divider-h,[data-sui-type=icon-button].sc-sui-content-divider-h,[data-sui-type=icon-button-group].sc-sui-content-divider-h,[data-sui-type=text-button].sc-sui-content-divider-h,[data-sui-type=text-button-group].sc-sui-content-divider-h{gap:10px}[data-sui-type=text].sc-sui-content-divider-h{padding:4px 8px}[data-sui-type=solid-text].sc-sui-content-divider-h{padding:6px 20px;background:var(--sui-bg-weak-50)}.sui-content-divider__text--xs.sc-sui-content-divider{font-size:var(--sui-type-subheading-2xs-size);font-weight:var(--sui-type-subheading-2xs-weight);line-height:var(--sui-type-subheading-2xs-line);letter-spacing:var(--sui-type-subheading-2xs-spacing);color:var(--sui-text-soft-400);text-transform:uppercase;flex-shrink:0;white-space:nowrap;word-break:break-word}.sui-content-divider__text--block.sc-sui-content-divider{flex:1 0 0;min-width:0;font-size:var(--sui-type-subheading-xs-size);font-weight:var(--sui-type-subheading-xs-weight);line-height:var(--sui-type-subheading-xs-line);letter-spacing:var(--sui-type-subheading-xs-spacing);color:var(--sui-text-soft-400);text-transform:uppercase;word-break:break-word}.sui-content-divider__btn.sc-sui-content-divider{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;height:32px;width:32px;padding:6px;background:var(--sui-bg-white-0);border:1px solid var(--sui-stroke-soft-200);border-radius:8px;box-shadow:0 1px 2px 0 rgba(10, 13, 20, 0.03);color:var(--sui-text-sub-600);cursor:pointer;font-family:inherit;-webkit-tap-highlight-color:transparent;transition:background-color 0.15s ease, transform 0.12s ease}.sui-content-divider__btn.sc-sui-content-divider:hover:not(:disabled){background:var(--sui-bg-weak-50)}.sui-content-divider__btn.sc-sui-content-divider:active:not(:disabled){transform:scale(0.97)}.sui-content-divider__btn.sc-sui-content-divider:focus-visible{outline:2px solid var(--sui-primary-base);outline-offset:2px}.sui-content-divider__btn.sc-sui-content-divider:disabled{opacity:0.4;cursor:not-allowed}.sui-content-divider__btn--text.sc-sui-content-divider{gap:2px;width:auto}.sui-content-divider__btn--text.sc-sui-content-divider .sui-content-divider__btn-label.sc-sui-content-divider{padding:0 4px}.sui-content-divider__btn-label.sc-sui-content-divider{font-size:var(--sui-type-label-sm-size);font-weight:var(--sui-type-label-sm-weight);line-height:var(--sui-type-label-sm-line);letter-spacing:var(--sui-type-label-sm-spacing);color:var(--sui-text-sub-600);white-space:nowrap}.sui-content-divider__group.sc-sui-content-divider{flex-shrink:0;position:relative;display:inline-flex;align-items:stretch;background:var(--sui-bg-white-0);border-radius:8px;overflow:hidden}.sui-content-divider__group.sc-sui-content-divider::after{content:"";position:absolute;inset:0;border:1px solid var(--sui-stroke-soft-200);border-radius:inherit;pointer-events:none}.sui-content-divider__group-item.sc-sui-content-divider{display:inline-flex;align-items:center;justify-content:center;padding:6px;box-sizing:border-box;width:32px;background:var(--sui-bg-white-0);border:0;border-right:1px solid var(--sui-stroke-soft-200);color:var(--sui-text-sub-600);cursor:pointer;font-family:inherit;-webkit-tap-highlight-color:transparent;transition:background-color 0.15s ease, transform 0.12s ease}.sui-content-divider__group-item.sc-sui-content-divider:last-child{border-right:0}.sui-content-divider__group-item.sc-sui-content-divider:hover:not(:disabled){background:var(--sui-bg-weak-50)}.sui-content-divider__group-item.sc-sui-content-divider:active:not(:disabled){transform:scale(0.97)}.sui-content-divider__group-item.sc-sui-content-divider:focus-visible{outline:2px solid var(--sui-primary-base);outline-offset:-2px;z-index:1}.sui-content-divider__group-item.sc-sui-content-divider:disabled{opacity:0.4;cursor:not-allowed}.sui-content-divider__group-item--text.sc-sui-content-divider{padding:6px 14px;width:auto}`;
+
+const SuiContentDivider = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.buttonClick = index.createEvent(this, "buttonClick");
+        this.itemClick = index.createEvent(this, "itemClick");
+        /** Patrón del divider. Default `line`. */
+        this.type = 'line';
+        /** Texto para los variants text-line / text / solid-text / text-button. */
+        this.text = '';
+        /** RemixIcon name (sin 'ri-') para variant icon-button. */
+        this.icon = null;
+        /** ARIA label para el botón single (icon-button / text-button). */
+        this.ariaLabel = null;
+        /** Disabled state del button (icon-button / text-button). */
+        this.disabled = false;
+        /** Items para los variants -group. Mínimo 2, recomendado 3. */
+        this.items = [];
+        this.onButton = (event) => {
+            if (this.disabled) {
+                event.preventDefault();
+                event.stopPropagation();
+                return;
+            }
+            this.buttonClick.emit(event);
+        };
+        this.onItem = (item, index, event) => {
+            if (item.disabled) {
+                event.preventDefault();
+                event.stopPropagation();
+                return;
+            }
+            this.itemClick.emit({ item, index, event });
+        };
+    }
+    /**
+     * iOS :active de los botones internos (SuiToque del Angular): la presencia del
+     * touchstart engancha el pipeline táctil y el touchend suelta el foco. En el
+     * host y pasivos, para no frenar el scroll.
+     */
+    onTouchStart() { }
+    onTouchEnd(event) {
+        var _a, _b;
+        (_b = (_a = event.target) === null || _a === void 0 ? void 0 : _a.closest('button')) === null || _b === void 0 ? void 0 : _b.blur();
+    }
+    renderLine() {
+        return index.h("span", { class: "sui-content-divider__line" });
+    }
+    renderContent() {
+        var _a, _b, _c;
+        const items = (_a = this.items) !== null && _a !== void 0 ? _a : [];
+        switch (this.type) {
+            case 'line':
+            case 'line-spacing':
+                return this.renderLine();
+            case 'text-line':
+                return [
+                    this.renderLine(),
+                    index.h("span", { class: "sui-content-divider__text sui-content-divider__text--xs" }, this.text),
+                    this.renderLine(),
+                ];
+            case 'text':
+            case 'solid-text':
+                return (index.h("span", { class: "sui-content-divider__text sui-content-divider__text--block" }, this.text));
+            case 'icon-button':
+                return [
+                    this.renderLine(),
+                    index.h("button", { type: "button", class: "sui-content-divider__btn", "aria-label": (_b = this.ariaLabel) !== null && _b !== void 0 ? _b : 'Acción', disabled: this.disabled || undefined, onClick: this.onButton }, this.icon && index.h("sui-icon", { name: this.icon, size: 20 })),
+                    this.renderLine(),
+                ];
+            case 'text-button':
+                return [
+                    this.renderLine(),
+                    index.h("button", { type: "button", class: "sui-content-divider__btn sui-content-divider__btn--text", "aria-label": (_c = this.ariaLabel) !== null && _c !== void 0 ? _c : this.text, disabled: this.disabled || undefined, onClick: this.onButton }, index.h("span", { class: "sui-content-divider__btn-label" }, this.text)),
+                    this.renderLine(),
+                ];
+            case 'icon-button-group':
+                return [
+                    this.renderLine(),
+                    index.h("div", { class: "sui-content-divider__group", role: "group" }, items.map((item, index$1) => {
+                        var _a, _b;
+                        return (index.h("button", { type: "button", class: "sui-content-divider__group-item", "aria-label": (_a = item.ariaLabel) !== null && _a !== void 0 ? _a : `Acción ${(_b = item.value) !== null && _b !== void 0 ? _b : index$1}`, disabled: item.disabled || undefined, onClick: (event) => this.onItem(item, index$1, event) }, item.icon && index.h("sui-icon", { name: item.icon, size: 20 })));
+                    })),
+                    this.renderLine(),
+                ];
+            case 'text-button-group':
+                return [
+                    this.renderLine(),
+                    index.h("div", { class: "sui-content-divider__group", role: "group" }, items.map((item, index$1) => {
+                        var _a, _b;
+                        return (index.h("button", { type: "button", class: "sui-content-divider__group-item sui-content-divider__group-item--text", "aria-label": (_b = (_a = item.ariaLabel) !== null && _a !== void 0 ? _a : item.text) !== null && _b !== void 0 ? _b : `Acción ${index$1}`, disabled: item.disabled || undefined, onClick: (event) => this.onItem(item, index$1, event) }, index.h("span", { class: "sui-content-divider__btn-label" }, item.text)));
+                    })),
+                    this.renderLine(),
+                ];
+            default:
+                return this.renderLine();
+        }
+    }
+    render() {
+        return (index.h(index.Host, { key: 'e9ac1f64dd06fcb6074c1b2903492d5ff29cbc2d', role: "separator", "aria-orientation": "horizontal", "data-sui-type": this.type }, this.renderContent()));
+    }
+    get el() { return index.getElement(this); }
+};
+SuiContentDivider.style = suiContentDividerCss();
+
+exports.sui_content_divider = SuiContentDivider;

package/dist/cjs/sui-content-label.cjs.entry.js

@@ -0,0 +1,90 @@
+'use strict';
+
+var index = require('./index-DtYKdVSu.js');
+
+const suiContentLabelCss = () => `@charset "UTF-8";.sc-sui-content-label-h{display:flex;align-items:center;gap:14px;box-sizing:border-box;width:100%;font-family:var(--sui-font-sans, "Inter", system-ui, sans-serif);font-feature-settings:"ss11" 1, "calt" 0, "liga" 0}.sui-content-label__leading.sc-sui-content-label{flex-shrink:0;display:flex;align-items:center;justify-content:center}.sui-content-label__text.sc-sui-content-label{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:4px}.sui-content-label__title-row.sc-sui-content-label{display:flex;align-items:center;gap:4px;min-width:0}.sui-content-label__label.sc-sui-content-label{min-width:0;font-size:var(--sui-type-label-sm-size);font-weight:var(--sui-type-label-sm-weight);line-height:var(--sui-type-label-sm-line);letter-spacing:var(--sui-type-label-sm-spacing);color:var(--sui-text-strong-950);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sui-content-label__sublabel.sc-sui-content-label{flex-shrink:0;font-size:var(--sui-type-paragraph-xs-size);font-weight:var(--sui-type-paragraph-xs-weight);line-height:var(--sui-type-paragraph-xs-line);letter-spacing:var(--sui-type-paragraph-xs-spacing);color:var(--sui-text-sub-600);white-space:nowrap}.sui-content-label__description.sc-sui-content-label{font-size:var(--sui-type-paragraph-xs-size);font-weight:var(--sui-type-paragraph-xs-weight);line-height:var(--sui-type-paragraph-xs-line);letter-spacing:var(--sui-type-paragraph-xs-spacing);color:var(--sui-text-sub-600);overflow-wrap:break-word}[data-sui-size=large].sc-sui-content-label-h .sui-content-label__label.sc-sui-content-label{font-size:var(--sui-type-label-md-size);line-height:var(--sui-type-label-md-line);letter-spacing:var(--sui-type-label-md-spacing)}[data-sui-size=large].sc-sui-content-label-h .sui-content-label__description.sc-sui-content-label{font-size:var(--sui-type-paragraph-sm-size);line-height:var(--sui-type-paragraph-sm-line);letter-spacing:var(--sui-type-paragraph-sm-spacing)}.sui-content-label__badge.sc-sui-content-label{flex-shrink:0}.sui-content-label__toggle.sc-sui-content-label{flex-shrink:0}[data-sui-disabled].sc-sui-content-label-h .sui-content-label__label.sc-sui-content-label{color:var(--sui-text-disabled-300)}[data-sui-disabled].sc-sui-content-label-h .sui-content-label__sublabel.sc-sui-content-label,[data-sui-disabled].sc-sui-content-label-h .sui-content-label__description.sc-sui-content-label{color:var(--sui-text-disabled-300)}[data-sui-disabled].sc-sui-content-label-h .sui-content-label__leading.sc-sui-content-label{opacity:0.5}`;
+
+const SuiContentLabel = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.toggleCheckedChange = index.createEvent(this, "toggleCheckedChange");
+        /** El toggle toma su nombre del label (aria-labelledby) y su descripción de la descripción. */
+        this.labelId = `sui-content-label-${++SuiContentLabel._nextId}`;
+        this.descriptionId = `${this.labelId}-desc`;
+        /** Tipo de leading visual. Default `basic`. */
+        this.type = 'basic';
+        /** Size del set: `medium` (leading 40, Label/Small) | `large` (leading 48, Label/Medium). */
+        this.size = 'medium';
+        /** Label principal. */
+        this.label = '';
+        /** Sublabel inline al lado del label. Vacío = no se renderiza. */
+        this.sublabel = '';
+        /** Descripción bajo el title row. Vacío = no se renderiza. */
+        this.description = '';
+        /** RemixIcon name (sin 'ri-') para type=left-icon — va al sui-key-icon. */
+        this.icon = null;
+        /** Avatar del leading (type=avatar / company): string (src) o `SuiAvatarConfig`. */
+        this.avatar = null;
+        /** Logo de empresa para type=company (mini-avatar bottom-right del sui-avatar). */
+        this.companyLogoSrc = null;
+        /** Marca para type=brand (logo raw, sin caja). */
+        this.brand = null;
+        /**
+         * Badge: string (label) o `SuiBadgeConfig`. Fallbacks: color `orange`, variant
+         * `lighter`, size `medium`. null / '' = sin badge.
+         */
+        this.badge = null;
+        /** Dónde renderiza el badge: `trailing` (canon Figma) | `title` (composición Content Card). */
+        this.badgePlacement = 'trailing';
+        /** Muestra el switch trailing (eje Toggle del set). */
+        this.toggle = false;
+        /** Estado del switch (controlled). */
+        this.toggleChecked = false;
+        /** Atenúa texto/leading a tokens disabled-300 y bloquea el switch. */
+        this.disabled = false;
+        this.onToggleChange = (event) => {
+            event.stopPropagation(); // el consumer escucha toggleCheckedChange, no el checkedChange interno
+            this.toggleCheckedChange.emit(event.detail);
+        };
+    }
+    get avatarCfg() {
+        const a = this.avatar;
+        return a ? (typeof a === 'string' ? { src: a } : a) : null;
+    }
+    get badgeCfg() {
+        const b = this.badge;
+        return b ? (typeof b === 'string' ? { label: b } : b) : null;
+    }
+    renderLeading() {
+        var _a, _b, _c;
+        const large = this.size === 'large';
+        const avatarSize = large ? 'xl' : 'lg';
+        const brandSize = large ? '2xl' : 'xl';
+        const av = this.avatarCfg;
+        switch (this.type) {
+            case 'left-icon':
+                return this.icon ? index.h("sui-key-icon", { name: this.icon, size: large ? 48 : 40, styleVariant: "stroke", color: "gray" }) : null;
+            case 'avatar':
+            case 'company': {
+                const company = this.type === 'company';
+                return (index.h("sui-avatar", { size: avatarSize, src: (_a = av === null || av === void 0 ? void 0 : av.src) !== null && _a !== void 0 ? _a : null, initials: (_b = av === null || av === void 0 ? void 0 : av.initials) !== null && _b !== void 0 ? _b : '', color: (_c = av === null || av === void 0 ? void 0 : av.color) !== null && _c !== void 0 ? _c : 'slate', alt: this.label, companyLogoSrc: company ? this.companyLogoSrc : null, status: company && this.companyLogoSrc ? 'company' : null }));
+            }
+            case 'brand':
+                return this.brand ? index.h("sui-brand-logo", { company: this.brand, size: brandSize }) : null;
+            default:
+                return null;
+        }
+    }
+    renderBadge(cfg, trailing) {
+        var _a, _b, _c;
+        return (index.h("sui-badge", { class: { 'sui-content-label__badge': true, 'sui-content-label__badge--trailing': trailing }, color: (_a = cfg.color) !== null && _a !== void 0 ? _a : 'orange', variant: (_b = cfg.variant) !== null && _b !== void 0 ? _b : 'lighter', size: (_c = cfg.size) !== null && _c !== void 0 ? _c : 'medium', disabled: this.disabled }, cfg.label));
+    }
+    render() {
+        const badge = this.badgeCfg;
+        return (index.h(index.Host, { key: 'a048e8d2017180acb3ad08dfe1c873bbe26aff86', role: "group", "aria-label": this.label || null, "aria-disabled": this.disabled ? 'true' : null, "data-sui-type": this.type, "data-sui-size": this.size, "data-sui-disabled": this.disabled ? '' : null }, this.type !== 'basic' && index.h("div", { key: '6530449540b722f058691fefd0d180f68895a57e', class: "sui-content-label__leading" }, this.renderLeading()), index.h("div", { key: 'b8615f2f6f2dd5fd946aa46cb4689d7642a58e38', class: "sui-content-label__text" }, index.h("div", { key: 'e124c252ad590f56444f380b56ad937e18f85216', class: "sui-content-label__title-row" }, index.h("span", { key: 'b3420fa1ac1d6d5659dcfb830e66ae1f26562ac7', class: "sui-content-label__label", id: this.labelId }, this.label), this.sublabel && index.h("span", { key: '505dddc46035b27a0b6481b0fa55b7bd3de962c2', class: "sui-content-label__sublabel" }, this.sublabel), this.badgePlacement === 'title' && badge && this.renderBadge(badge, false)), this.description && (index.h("span", { key: '0d52588e3d547eff2f1ae56ed88ff72fc0a8c077', class: "sui-content-label__description", id: this.descriptionId }, this.description))), this.badgePlacement === 'trailing' && badge && this.renderBadge(badge, true), this.toggle && (index.h("sui-switch", { key: '743781fd291c814456a9254b892e67e17b4d5238', class: "sui-content-label__toggle", size: "medium", checked: this.toggleChecked, disabled: this.disabled, "aria-labelledby": this.labelId, "aria-describedby": this.description ? this.descriptionId : null, onCheckedChange: this.onToggleChange }))));
+    }
+};
+SuiContentLabel._nextId = 0;
+SuiContentLabel.style = suiContentLabelCss();
+
+exports.sui_content_label = SuiContentLabel;

package/dist/cjs/sui-counter-input.cjs.entry.js

@@ -0,0 +1,120 @@
+'use strict';
+
+var index = require('./index-DtYKdVSu.js');
+
+const suiCounterInputCss = () => `@charset "UTF-8";.sc-sui-counter-input-h{display:block;font-family:var(--sui-font-sans)}.sui-counter-input__label-host.sc-sui-counter-input{display:block;margin-bottom:6px}.sui-counter-input__hint-host.sc-sui-counter-input{display:block;margin-top:6px}.sui-counter-input__field.sc-sui-counter-input{display:flex;align-items:center;justify-content:space-between;width:100%;box-sizing:border-box;overflow:hidden;background:var(--sui-bg-white-0);border:1px solid var(--sui-stroke-soft-200);box-shadow:var(--sui-regular-shadow-x-small);transition:background var(--sui-motion-duration-x-fast) var(--sui-motion-ease-out), border-color var(--sui-motion-duration-x-fast) var(--sui-motion-ease-out), box-shadow var(--sui-motion-duration-x-fast) var(--sui-motion-ease-out)}[data-sui-size=medium].sc-sui-counter-input-h .sui-counter-input__field.sc-sui-counter-input,.sc-sui-counter-input-h:not([data-sui-size]) .sui-counter-input__field.sc-sui-counter-input{gap:8px;padding:7px 8px;border-radius:var(--sui-radius-full, 999px);min-height:40px}[data-sui-size=small].sc-sui-counter-input-h .sui-counter-input__field.sc-sui-counter-input{gap:6px;padding:5px 6px;border-radius:var(--sui-radius-full, 999px);min-height:36px}[data-sui-size=large].sc-sui-counter-input-h .sui-counter-input__field.sc-sui-counter-input{gap:8px;padding:3px;border-radius:var(--sui-radius-full, 999px);min-height:48px}[data-sui-size=xsmall].sc-sui-counter-input-h .sui-counter-input__field.sc-sui-counter-input{gap:4px;padding:3px 4px;border-radius:var(--sui-radius-full, 999px);min-height:32px}[data-sui-size="2xsmall"].sc-sui-counter-input-h .sui-counter-input__field.sc-sui-counter-input{gap:4px;padding:1px 2px;border-radius:var(--sui-radius-full, 999px);min-height:28px}[data-sui-size=xlarge].sc-sui-counter-input-h .sui-counter-input__field.sc-sui-counter-input{gap:8px;padding:3px;border-radius:var(--sui-radius-full, 999px);min-height:52px}.sui-counter-input__field.sc-sui-counter-input:not(.sui-counter-input__field--disabled):not(.sui-counter-input__field--error):hover{background:var(--sui-bg-weak-50);border-color:transparent}.sui-counter-input__field.sc-sui-counter-input:not(.sui-counter-input__field--disabled):not(.sui-counter-input__field--error):focus-within{background:var(--sui-bg-white-0);border-color:var(--sui-stroke-strong-950);box-shadow:0 0 0 2px var(--sui-bg-white-0), 0 0 0 4px var(--sui-slate-alpha-16)}.sui-counter-input__field--error.sc-sui-counter-input{border-color:var(--sui-state-error-base);box-shadow:var(--sui-regular-shadow-x-small)}.sui-counter-input__field--error.sc-sui-counter-input:focus-within{border-color:var(--sui-state-error-base);box-shadow:0 0 0 3px var(--sui-red-alpha-10, rgba(251, 55, 72, 0.1019607843))}.sui-counter-input__field--disabled.sc-sui-counter-input{background:var(--sui-bg-weak-50);border-color:transparent;box-shadow:none;cursor:not-allowed;pointer-events:none}.sui-counter-input__stepper.sc-sui-counter-input{appearance:none;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;box-sizing:border-box;width:24px;height:24px;min-width:0;min-height:0;margin:0;padding:2px;border:0;border-radius:var(--sui-radius-full, 999px);background:transparent;color:var(--sui-icon-sub-600);line-height:0;cursor:pointer;transition:background 120ms, color 120ms, transform var(--dur-instant, 80ms) var(--ease-ek, cubic-bezier(0.22, 1, 0.36, 1))}.sui-counter-input__stepper.sc-sui-counter-input:hover:not(:disabled){background:var(--sui-bg-weak-50);color:var(--sui-icon-strong-950)}.sui-counter-input__stepper.sc-sui-counter-input:active:not(:disabled){background:var(--sui-bg-surface-800);color:var(--sui-icon-white-0);transform:scale(0.92)}.sui-counter-input__stepper.sc-sui-counter-input:focus-visible{outline:none;box-shadow:0 0 0 2px var(--sui-bg-white-0), 0 0 0 4px var(--sui-primary-alpha-10)}.sui-counter-input__stepper.sc-sui-counter-input:disabled{color:var(--sui-icon-disabled-300);cursor:not-allowed;pointer-events:none;opacity:0.5}[data-sui-size=large].sc-sui-counter-input-h .sui-counter-input__stepper.sc-sui-counter-input{width:40px;height:40px;padding:10px}[data-sui-size=xlarge].sc-sui-counter-input-h .sui-counter-input__stepper.sc-sui-counter-input{width:44px;height:44px;padding:10px}.sui-counter-input__field.sc-sui-counter-input:hover .sui-counter-input__stepper.sc-sui-counter-input:hover:not(:disabled){background:var(--sui-bg-white-0)}[data-sui-disabled].sc-sui-counter-input-h .sui-counter-input__stepper.sc-sui-counter-input{color:var(--sui-icon-disabled-300);opacity:1}.sui-counter-input__value.sc-sui-counter-input{flex:1 1 auto;min-width:0;text-align:center;font-family:var(--sui-font-sans);font-size:var(--sui-type-paragraph-sm-size, 14px);font-weight:var(--sui-type-paragraph-sm-weight, 400);line-height:var(--sui-type-paragraph-sm-line, 20px);letter-spacing:var(--sui-type-paragraph-sm-spacing, -0.006em);font-feature-settings:"ss11" 1, "calt" 0, "liga" 0;user-select:none;color:var(--sui-text-strong-950)}.sui-counter-input__value.sc-sui-counter-input:focus{outline:none}[data-sui-size=large].sc-sui-counter-input-h .sui-counter-input__value.sc-sui-counter-input,[data-sui-size=xlarge].sc-sui-counter-input-h .sui-counter-input__value.sc-sui-counter-input{font-size:var(--sui-type-paragraph-md-size, 16px);font-weight:var(--sui-type-paragraph-md-weight, 400);line-height:var(--sui-type-paragraph-md-line, 24px);letter-spacing:var(--sui-type-paragraph-md-spacing, -0.011em)}.sui-counter-input__field--disabled.sc-sui-counter-input .sui-counter-input__value.sc-sui-counter-input{color:var(--sui-text-disabled-300)}`;
+
+const SuiCounterInput = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.valueChange = index.createEvent(this, "valueChange");
+        this.uid = ++SuiCounterInput._nextId;
+        this.labelId = `sui-counter-input-label-${this.uid}`;
+        this.hintId = `sui-counter-input-hint-${this.uid}`;
+        /** Tamaño. Default `medium` (40). `large` 48 / `xlarge` 52 para mobile. */
+        this.size = 'medium';
+        /** Label arriba del campo (sui-form-label). */
+        this.label = null;
+        this.sublabel = null;
+        this.required = false;
+        this.tooltip = null;
+        /** Hint debajo del campo (sui-form-hint). */
+        this.hint = null;
+        /** Estado de error: borde error y, si hay `errorMessage`, reemplaza al hint. */
+        this.error = false;
+        this.errorMessage = null;
+        /** Valor actual (controlled). Default `0`. */
+        this.value = 0;
+        this.min = Number.NEGATIVE_INFINITY;
+        this.max = Number.POSITIVE_INFINITY;
+        this.step = 1;
+        this.disabled = false;
+        /** Nombre accesible del spinbutton; si se pasa, reemplaza al label visible. */
+        this.ariaLabel = null;
+        /** aria-label del botón −. Default «Disminuir». */
+        this.decrementLabel = null;
+        /** aria-label del botón +. Default «Aumentar». */
+        this.incrementLabel = null;
+        this.decrement = () => {
+            if (this.canDecrement)
+                this.commit(this.value - this.step);
+        };
+        this.increment = () => {
+            if (this.canIncrement)
+                this.commit(this.value + this.step);
+        };
+        this.onSpinKeydown = (event) => {
+            if (this.disabled)
+                return;
+            switch (event.key) {
+                case 'ArrowUp':
+                    this.increment();
+                    break;
+                case 'ArrowDown':
+                    this.decrement();
+                    break;
+                case 'Home':
+                    if (!Number.isFinite(this.min))
+                        return;
+                    this.commit(this.min);
+                    break;
+                case 'End':
+                    if (!Number.isFinite(this.max))
+                        return;
+                    this.commit(this.max);
+                    break;
+                default:
+                    return;
+            }
+            event.preventDefault();
+        };
+        /** iOS WKWebView: touchstart engancha el pipeline de :active; touchend.blur() lo suelta. */
+        this.onTouchStart = () => {
+            /* no-op a propósito: la presencia del listener es el fix. */
+        };
+        this.onTouchEnd = (event) => {
+            var _a;
+            (_a = event.currentTarget) === null || _a === void 0 ? void 0 : _a.blur();
+        };
+    }
+    /** El form-label no tiene 'large' — se capea a medium (el label no escala). */
+    get labelSize() {
+        const s = this.size;
+        if (s === 'large' || s === 'xlarge')
+            return 'medium';
+        if (s === '2xsmall')
+            return 'xsmall';
+        return s;
+    }
+    get canDecrement() {
+        return !this.disabled && this.value > this.min;
+    }
+    get canIncrement() {
+        return !this.disabled && this.value < this.max;
+    }
+    commit(next) {
+        const clamped = Math.min(this.max, Math.max(this.min, next));
+        if (clamped === this.value)
+            return;
+        this.valueChange.emit(clamped);
+    }
+    componentWillLoad() {
+        /* Sin title nativo en el host (tooltip gris del navegador): Host title={undefined} no lo borra. */
+        this.el.removeAttribute('title');
+    }
+    render() {
+        var _a, _b;
+        const hintMessage = this.error ? this.errorMessage : this.hint;
+        const iconSize = this.size === 'xlarge' ? 24 : 20;
+        return (index.h(index.Host, { key: '2814706330c5bb15f25bf3495b7d18d63889e12f', "data-sui-size": this.size, "data-sui-disabled": this.disabled ? '' : null, "data-sui-error": this.error ? '' : null }, this.label && (index.h("sui-form-label", { key: '39576d33aac6d3a53d6958722e57a95a40ca54ae', id: this.labelId, class: "sui-counter-input__label-host", label: this.label, sublabel: this.sublabel, required: this.required, tooltip: this.tooltip, size: this.labelSize })), index.h("div", { key: '5cbc58152a1ca9ea00cf017425ceea61741470e2', class: {
+                'sui-counter-input__field': true,
+                'sui-counter-input__field--error': this.error,
+                'sui-counter-input__field--disabled': this.disabled,
+            } }, index.h("button", { key: 'd802bd7053b52b13d02db62e9039e73a57c19d97', type: "button", class: "sui-counter-input__stepper", "aria-label": (_a = this.decrementLabel) !== null && _a !== void 0 ? _a : 'Disminuir', disabled: !this.canDecrement, onClick: this.decrement, onTouchStart: this.onTouchStart, onTouchEnd: this.onTouchEnd }, index.h("sui-icon", { key: '03f91f8725444a513edc6263eb4c6d42f4e528ff', name: "subtract-line", size: iconSize })), index.h("span", { key: 'bc8f36620c87a78f8e467552d0bc03c84be3fc23', class: "sui-counter-input__value", role: "spinbutton", tabindex: this.disabled ? undefined : '0', "aria-labelledby": !this.ariaLabel && this.label ? this.labelId : null, "aria-describedby": hintMessage ? this.hintId : null, "aria-valuenow": String(this.value), "aria-valuemin": Number.isFinite(this.min) ? String(this.min) : null, "aria-valuemax": Number.isFinite(this.max) ? String(this.max) : null, "aria-label": this.ariaLabel, "aria-disabled": this.disabled ? 'true' : null, "aria-invalid": this.error ? 'true' : null, onKeyDown: this.onSpinKeydown }, this.value), index.h("button", { key: '40715a2f72e2866a4c463f62162d96e4c6cda032', type: "button", class: "sui-counter-input__stepper", "aria-label": (_b = this.incrementLabel) !== null && _b !== void 0 ? _b : 'Aumentar', disabled: !this.canIncrement, onClick: this.increment, onTouchStart: this.onTouchStart, onTouchEnd: this.onTouchEnd }, index.h("sui-icon", { key: 'f4ff9f6cc3d07a615ee9de66a0291afe254cb8b0', name: "add-line", size: iconSize }))), hintMessage && (index.h("sui-form-hint", { key: '4ff0748368d7041ffc8ef289e5341a5f7700bb04', id: this.hintId, class: "sui-counter-input__hint-host", message: hintMessage, variant: this.error ? 'error' : 'neutral' }))));
+    }
+    get el() { return index.getElement(this); }
+};
+SuiCounterInput._nextId = 0;
+SuiCounterInput.style = suiCounterInputCss();
+
+exports.sui_counter_input = SuiCounterInput;

package/dist/cjs/sui-date-selector_4.cjs.entry.js

@@ -0,0 +1,154 @@
+'use strict';
+
+var index = require('./index-DtYKdVSu.js');
+var suiToque = require('./sui-toque-TviBCJ0g.js');
+
+const suiDateSelectorCss = () => `@charset "UTF-8";.sc-sui-date-selector-h{display:flex;align-items:center;justify-content:center;gap:6px;width:288px;max-width:288px;height:36px;padding:6px;background:var(--sui-bg-weak-50);border-radius:var(--sui-radius-8, 8px);box-sizing:border-box;overflow:hidden}.sui-date-selector__label.sc-sui-date-selector{flex:1 0 0;min-width:0;text-align:center;font-family:var(--sui-font-sans);font-size:var(--sui-type-label-sm-size, 14px);line-height:var(--sui-type-label-sm-line, 20px);letter-spacing:var(--sui-type-label-sm-spacing, -0.006em);font-weight:var(--sui-type-label-sm-weight, 500);font-feature-settings:"ss11" 1, "calt" 0, "liga" 0;color:var(--sui-text-sub-600);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sui-date-selector__placeholder.sc-sui-date-selector{display:inline-block;width:24px;height:24px;flex-shrink:0}[data-sui-size=large].sc-sui-date-selector-h{height:52px;padding:4px;gap:4px}[data-sui-size=large].sc-sui-date-selector-h .sui-date-selector__placeholder.sc-sui-date-selector{width:44px;height:44px}[data-sui-size=large].sc-sui-date-selector-h .sui-date-selector__label.sc-sui-date-selector{font-size:var(--sui-type-label-md-size, 16px);line-height:var(--sui-type-label-md-line, 24px);letter-spacing:var(--sui-type-label-md-spacing, -0.011em)}`;
+
+const SuiDateSelector = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.prev = index.createEvent(this, "prev");
+        this.next = index.createEvent(this, "next");
+        /** Mostrar arrow izquierdo (prev). Default `true`. */
+        this.leftIcon = true;
+        /** Mostrar arrow derecho (next). Default `true`. */
+        this.rightIcon = true;
+        /** Disabled global — deshabilita ambos arrows. Default `false`. */
+        this.disabled = false;
+        /** medium 36 con flechas de 24 (default) · large 52 con flechas de 44 y el mes en 16/24. */
+        this.size = 'medium';
+        this.onPrev = () => {
+            if (this.disabled)
+                return;
+            this.prev.emit();
+        };
+        this.onNext = () => {
+            if (this.disabled)
+                return;
+            this.next.emit();
+        };
+    }
+    render() {
+        // large: flechas de 44 = compact-button 5xlarge (en Angular, ::ng-deep a 44 con el
+        // ícono en 20; acá el ícono va en 24, el de 5xlarge).
+        const arrowSize = this.size === 'large' ? '5xlarge' : 'large';
+        return (index.h(index.Host, { key: '5237ec999f7662c1b9c6c36b57afd87fb3897645', "data-sui-left-icon": this.leftIcon ? '' : undefined, "data-sui-size": this.size, "data-sui-right-icon": this.rightIcon ? '' : undefined, "data-sui-disabled": this.disabled ? '' : undefined }, this.leftIcon ? (index.h("sui-compact-button", { class: "sui-date-selector__arrow", icon: "arrow-left-s-line", variantStyle: "white", size: arrowSize, ariaLabel: "Mes anterior", disabled: this.disabled, onClicked: this.onPrev })) : (index.h("span", { class: "sui-date-selector__placeholder", "aria-hidden": "true" })), index.h("span", { key: '386b4f8c18426011eb1d6762aec97a3db12f4fcf', class: "sui-date-selector__label" }, this.label), this.rightIcon ? (index.h("sui-compact-button", { class: "sui-date-selector__arrow", icon: "arrow-right-s-line", variantStyle: "white", size: arrowSize, ariaLabel: "Mes siguiente", disabled: this.disabled, onClicked: this.onNext })) : (index.h("span", { class: "sui-date-selector__placeholder", "aria-hidden": "true" }))));
+    }
+};
+SuiDateSelector.style = suiDateSelectorCss();
+
+const suiDayCellCss = () => `@charset "UTF-8";.sc-sui-day-cell-h{display:inline-block;width:40px;max-width:40px;vertical-align:middle}.sui-day-cell__btn.sc-sui-day-cell{position:relative;display:flex;align-items:center;justify-content:center;width:40px;height:40px;margin:0;padding:0;background:var(--sui-bg-white-0);border:none;border-radius:var(--sui-radius-8, 8px);font-family:var(--sui-font-sans);font-size:var(--sui-type-label-sm-size, 14px);line-height:var(--sui-type-label-sm-line, 20px);letter-spacing:var(--sui-type-label-sm-spacing, -0.006em);font-weight:var(--sui-type-label-sm-weight, 500);font-feature-settings:"ss11" 1, "calt" 0, "liga" 0;color:var(--sui-text-sub-600);cursor:pointer;outline:none;box-sizing:border-box;transition:background-color 100ms ease-out, color 100ms ease-out}.sui-day-cell__btn.sc-sui-day-cell:hover:not(:disabled){background:var(--sui-bg-weak-50);color:var(--sui-text-strong-950)}.sui-day-cell__btn.sc-sui-day-cell:focus-visible:not(:disabled){box-shadow:inset 0 0 0 1px var(--sui-primary-base), 0 0 0 2px color-mix(in oklab, var(--sui-primary-base) 16%, transparent)}.sui-day-cell__btn.sc-sui-day-cell:disabled{cursor:not-allowed}.sui-day-cell__num.sc-sui-day-cell{display:inline-block;width:40px;text-align:center}[data-sui-size=large].sc-sui-day-cell-h{width:44px;max-width:44px}[data-sui-size=large].sc-sui-day-cell-h .sui-day-cell__btn.sc-sui-day-cell{width:44px;height:44px;font-size:var(--sui-type-label-md-size, 16px);line-height:var(--sui-type-label-md-line, 24px);letter-spacing:var(--sui-type-label-md-spacing, -0.011em)}[data-sui-size=large].sc-sui-day-cell-h .sui-day-cell__num.sc-sui-day-cell{width:44px}.sui-day-cell__marker.sc-sui-day-cell{position:absolute;bottom:6px;left:50%;transform:translateX(-50%);width:3px;height:3px;border-radius:50%;background:var(--sui-primary-base);pointer-events:none}.sui-day-cell__today-dot.sc-sui-day-cell{position:absolute;left:50%;bottom:6px;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:var(--sui-primary-base);pointer-events:none}[data-sui-out-of-month].sc-sui-day-cell-h .sui-day-cell__btn.sc-sui-day-cell{color:var(--sui-text-disabled-300)}[data-sui-selected].sc-sui-day-cell-h .sui-day-cell__btn.sc-sui-day-cell{background:var(--sui-primary-base);color:var(--sui-static-white, #fff)}[data-sui-selected].sc-sui-day-cell-h .sui-day-cell__btn.sc-sui-day-cell:hover{background:var(--sui-primary-base)}[data-sui-selected].sc-sui-day-cell-h .sui-day-cell__marker.sc-sui-day-cell,[data-sui-selected].sc-sui-day-cell-h .sui-day-cell__today-dot.sc-sui-day-cell{background:var(--sui-static-white, #fff)}[data-sui-range-position=in].sc-sui-day-cell-h .sui-day-cell__btn.sc-sui-day-cell{background:transparent;color:var(--sui-primary-base);border-radius:0}[data-sui-range-position=in].sc-sui-day-cell-h .sui-day-cell__btn.sc-sui-day-cell:hover{background:var(--sui-primary-alpha-16, rgba(250, 115, 25, 0.1607843137));color:var(--sui-text-strong-950);border-radius:var(--sui-radius-8, 8px)}[data-sui-range-position=start].sc-sui-day-cell-h .sui-day-cell__btn.sc-sui-day-cell{background:var(--sui-primary-base);color:var(--sui-static-white, #fff);border-top-right-radius:0;border-bottom-right-radius:0}[data-sui-range-position=start].sc-sui-day-cell-h .sui-day-cell__btn.sc-sui-day-cell:hover{background:var(--sui-primary-base)}[data-sui-range-position=end].sc-sui-day-cell-h .sui-day-cell__btn.sc-sui-day-cell{background:var(--sui-primary-base);color:var(--sui-static-white, #fff);border-top-left-radius:0;border-bottom-left-radius:0}[data-sui-range-position=end].sc-sui-day-cell-h .sui-day-cell__btn.sc-sui-day-cell:hover{background:var(--sui-primary-base)}[data-sui-range-position=start].sc-sui-day-cell-h .sui-day-cell__marker.sc-sui-day-cell,[data-sui-range-position=end].sc-sui-day-cell-h .sui-day-cell__marker.sc-sui-day-cell,[data-sui-range-position=start].sc-sui-day-cell-h .sui-day-cell__today-dot.sc-sui-day-cell,[data-sui-range-position=end].sc-sui-day-cell-h .sui-day-cell__today-dot.sc-sui-day-cell{background:var(--sui-static-white, #fff)}[data-sui-range-position=in].sc-sui-day-cell-h .sui-day-cell__marker.sc-sui-day-cell,[data-sui-range-position=in].sc-sui-day-cell-h .sui-day-cell__today-dot.sc-sui-day-cell{background:var(--sui-primary-base)}[data-sui-disabled].sc-sui-day-cell-h .sui-day-cell__btn.sc-sui-day-cell,.sui-day-cell__btn.sc-sui-day-cell:disabled{color:var(--sui-text-disabled-300);cursor:not-allowed}[data-sui-disabled].sc-sui-day-cell-h .sui-day-cell__btn.sc-sui-day-cell:hover,.sui-day-cell__btn.sc-sui-day-cell:disabled:hover{background:var(--sui-bg-white-0)}[data-sui-disabled].sc-sui-day-cell-h .sui-day-cell__marker.sc-sui-day-cell{background:var(--sui-text-disabled-300)}`;
+
+const SuiDayCell = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.clicked = index.createEvent(this, "clicked");
+        /** Type=Basic (default) o Range (entre extremos / extremo del range). */
+        this.type = 'basic';
+        /** medium 40 × 40 (default) · large 44 × 44 con el número en 16/24 (piso táctil). */
+        this.size = 'medium';
+        /** Position dentro del range — solo aplica si `type="range"`. */
+        this.rangePosition = null;
+        /** Selected (mode date) o range extremo single-day (bg primary). */
+        this.selected = false;
+        /** Marker dot (evento / pedido / disponibilidad). */
+        this.marked = false;
+        /** Today indicator (dot grande debajo del numero). */
+        this.today = false;
+        /** Disabled — fuera de min/max o no clickeable. */
+        this.disabled = false;
+        /** Out of current month — dias del mes anterior/siguiente para llenar grid. */
+        this.outOfMonth = false;
+        /** aria-label personalizado para el button (default «Día {N}»). */
+        this.ariaLabel = null;
+        this.onClick = (event) => {
+            if (this.disabled) {
+                event.stopPropagation();
+                event.preventDefault();
+                return;
+            }
+            this.clicked.emit(event);
+        };
+    }
+    get resolvedAriaLabel() {
+        var _a;
+        return (_a = this.ariaLabel) !== null && _a !== void 0 ? _a : `Día ${this.day}`;
+    }
+    /** Seleccionado = `selected` o un extremo del rango (a11y 04-10-2026: antes los
+     *  extremos no se anunciaban). El tramo del medio no. */
+    get ariaSelected() {
+        return this.selected || (this.type === 'range' && (this.rangePosition === 'start' || this.rangePosition === 'end'));
+    }
+    /** iOS :active (SuiToque del Angular): listeners pasivos en el host. */
+    onTouchStart() { }
+    onTouchEnd(event) {
+        var _a, _b;
+        (_b = (_a = event.target) === null || _a === void 0 ? void 0 : _a.closest('button')) === null || _b === void 0 ? void 0 : _b.blur();
+    }
+    render() {
+        const showMarker = this.marked && !this.today;
+        return (index.h(index.Host, { key: '22d87824cb31029a7705c968091353c4b9ff8e52', "data-sui-type": this.type, "data-sui-size": this.size, "data-sui-selected": this.selected ? '' : null, "data-sui-marked": this.marked ? '' : null, "data-sui-today": this.today ? '' : null, "data-sui-disabled": this.disabled ? '' : null, "data-sui-out-of-month": this.outOfMonth ? '' : null, "data-sui-range-position": this.rangePosition || null }, index.h("button", { key: '8f0f4bef8ef688d219540a49f26d53a0ad8403d8', type: "button", class: "sui-day-cell__btn", disabled: this.disabled || undefined, "aria-selected": this.ariaSelected ? 'true' : undefined, "aria-current": this.today ? 'date' : undefined, "aria-label": this.resolvedAriaLabel, role: "gridcell", onClick: this.onClick }, index.h("span", { key: '7c19cad2fe76f262e4de817ab5a55d31bf967f01', class: "sui-day-cell__num" }, this.day), showMarker && index.h("span", { key: '2afb7918239804c99b27d3c9bb05fdc92a2cda66', class: "sui-day-cell__marker", "aria-hidden": "true" }), this.today && index.h("span", { key: 'ad5ca4041f914c4ad1609c02bb9c12f972c1549b', class: "sui-day-cell__today-dot", "aria-hidden": "true" }))));
+    }
+};
+SuiDayCell.style = suiDayCellCss();
+
+const suiDayLabelCss = () => `@charset "UTF-8";.sc-sui-day-label-h{display:inline-flex;align-items:center;justify-content:center;width:40px;max-width:40px;height:40px;padding:10px 0;background:var(--sui-bg-white-0);border-radius:var(--sui-radius-10, 10px);box-sizing:border-box}.sc-sui-day-label-h .sui-day-label__text.sc-sui-day-label{display:inline-block;width:40px;text-align:center;font-family:var(--sui-font-sans);font-size:var(--sui-type-label-sm-size, 14px);line-height:var(--sui-type-label-sm-line, 20px);letter-spacing:var(--sui-type-label-sm-spacing, -0.006em);font-weight:var(--sui-type-label-sm-weight, 500);font-feature-settings:"ss11" 1, "calt" 0, "liga" 0;color:var(--sui-text-soft-400);word-break:break-word}`;
+
+const SuiDayLabel = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        /**
+         * Texto del label — inicial(es) del día de la semana (LU / MA / MI / ...).
+         * Requerido en la API Angular (`input.required`); acá no hay `required` en
+         * @Prop de Stencil, así que default `''` y el render queda vacío si no se pasa.
+         */
+        this.label = '';
+    }
+    render() {
+        return (index.h(index.Host, { key: '509692aa01d913c34c89543c7e0c5038e684e5b9', role: "columnheader" }, index.h("span", { key: 'a2648dcef56eb28d3502caac010faffc690b61b8', class: "sui-day-label__text" }, this.label)));
+    }
+};
+SuiDayLabel.style = suiDayLabelCss();
+
+const suiPeriodRangeCss = () => `@charset "UTF-8";.sc-sui-period-range-h{display:block;width:168px;max-width:168px}.sui-period-range__btn.sc-sui-period-range{appearance:none;display:flex;align-items:center;justify-content:center;margin:0;padding:8px 8px 8px 12px;width:100%;height:36px;border:none;border-radius:var(--sui-radius-8, 8px);background:transparent;color:var(--sui-text-sub-600);font-family:var(--sui-font-sans);cursor:pointer;box-sizing:border-box;transition:background 100ms ease-out, color 100ms ease-out}.sui-period-range__btn.sc-sui-period-range:hover:not(:disabled){background:var(--sui-bg-weak-50)}.sui-period-range__btn.sc-sui-period-range:active:not(:disabled),.sui-period-range__btn.sc-sui-period-range:focus-visible{outline:none;box-shadow:0 0 0 2px var(--sui-bg-white-0), 0 0 0 4px var(--sui-primary-alpha-10)}.sui-period-range__btn.sc-sui-period-range:disabled{cursor:not-allowed;opacity:0.5}.sui-period-range__label.sc-sui-period-range{flex:1 0 0;min-width:0;text-align:left;font-size:var(--sui-type-label-sm-size, 14px);line-height:var(--sui-type-label-sm-line, 20px);letter-spacing:var(--sui-type-label-sm-spacing, -0.006em);font-weight:var(--sui-type-label-sm-weight, 500);font-feature-settings:"ss11" 1, "calt" 0, "liga" 0;word-break:break-word;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}[data-sui-active].sc-sui-period-range-h .sui-period-range__btn.sc-sui-period-range{background:var(--sui-bg-weak-50);color:var(--sui-text-strong-950)}[data-sui-size=large].sc-sui-period-range-h .sui-period-range__btn.sc-sui-period-range{height:44px;padding:10px 8px 10px 12px}[data-sui-size=large].sc-sui-period-range-h .sui-period-range__label.sc-sui-period-range{font-size:var(--sui-type-label-md-size, 16px);line-height:var(--sui-type-label-md-line, 24px);letter-spacing:var(--sui-type-label-md-spacing, -0.011em)}`;
+
+const SuiPeriodRange = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.clicked = index.createEvent(this, "clicked");
+        /**
+         * Label visible del preset (ej. "Hoy", "Último mes").
+         * Requerido en la API Angular (`input.required`); aca default `''` y el render
+         * queda vacio si no se pasa.
+         */
+        this.label = '';
+        /** Estado active — bg weak-50 visible + text strong-950, indica preset seleccionado. */
+        this.active = false;
+        /** Disabled — no clickeable (opacity 0.5, cursor not-allowed). */
+        this.disabled = false;
+        /** medium 36 (default) · large 44 (piso táctil, dueño 04-10-2026). */
+        this.size = 'medium';
+        this.onClick = () => {
+            if (this.disabled)
+                return;
+            this.clicked.emit();
+        };
+    }
+    alTocar() {
+        /* presencia del listener = engage del touch pipeline iOS. no-op a propósito. */
+    }
+    alSoltar(event) {
+        suiToque.soltarToque(event, '.sui-period-range__btn');
+    }
+    render() {
+        var _a;
+        return (index.h(index.Host, { key: '90a7b0f011c270210b40da30277650087790df51', "data-sui-active": this.active ? '' : null, "data-sui-size": this.size, "data-sui-disabled": this.disabled ? '' : null }, index.h("button", { key: 'b1071ebbce2e36d43d168778d25a05e8e1d0e4f6', type: "button", class: "sui-period-range__btn", disabled: (_a = this.disabled) !== null && _a !== void 0 ? _a : undefined, "aria-pressed": this.active ? 'true' : 'false', onClick: this.onClick }, index.h("span", { key: '6a58058684a70695554efa273f0578b795bab9d8', class: "sui-period-range__label" }, this.label))));
+    }
+};
+SuiPeriodRange.style = suiPeriodRangeCss();
+
+exports.sui_date_selector = SuiDateSelector;
+exports.sui_day_cell = SuiDayCell;
+exports.sui_day_label = SuiDayLabel;
+exports.sui_period_range = SuiPeriodRange;