npm - @dropi/ui - Versions diffs - 0.1.51 → 0.1.52 - Mend

@dropi/ui 0.1.51 → 0.1.52

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (289) hide show

package/dist/dropi-ui/dropi-country-selector.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"dropi-country-selector.entry.js","mappings":"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","names":[],"sources":["src/components/dropi-country-selector/dropi-country-selector.css?tag=dropi-country-selector&encapsulation=shadow","src/components/dropi-country-selector/dropi-country-selector.tsx"],"sourcesContent":[":host {\n display: block;\n width: 100%;\n text-align: left;\n}\n\n, ::before, ::after { box-sizing: border-box; }\n\n.custom-select {\n position: relative;\n width: 100%;\n}\n\n/ ── Label ───────────────────────────────────────────────────────── /\nlabel {\n display: block;\n font-size: var(--font-size-xs, 11px);\n font-weight: var(--font-weight-regular, 400);\n color: var(--Gray-Gray-600, #475066);\n margin-bottom: 6px;\n}\n\n.required {\n color: var(--Error-Error-500, #ef4444);\n margin-left: 2px;\n}\n\n/ ── Trigger button ──────────────────────────────────────────────── /\n.select-button {\n width: 100%;\n height: 44px;\n padding: 0 12px;\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: var(--Border-2, 8px);\n background: var(--Neutral-White, #ffffff);\n color: var(--Gray-Gray-500, #69738c);\n font-size: var(--font-size-s, 14px);\n font-family: inherit;\n display: flex;\n justify-content: space-between;\n align-items: center;\n text-align: left;\n cursor: pointer;\n transition: border-color 0.15s ease;\n}\n\n.select-button:focus {\n outline: none;\n border-color: var(--Info-Info-500, #3b82f6);\n}\n\n.select-button:disabled {\n border-color: var(--Gray-Gray-200, #c3c9d9);\n color: var(--Gray-Gray-400, #858ea6);\n background: var(--Gray-Gray-50, #f7f8fa);\n cursor: not-allowed;\n}\n\n.select-button.select-completed {\n color: var(--Gray-Gray-700, #32394d);\n}\n\n.select-button.select-invalid {\n border-color: var(--Error-Error-500, #ef4444);\n}\n\n.selected-content {\n display: flex;\n align-items: center;\n gap: 8px;\n overflow: hidden;\n flex: 1;\n}\n\n.selected-option {\n display: flex;\n align-items: center;\n gap: 8px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--Gray-Gray-700, #32394d);\n font-size: var(--font-size-s, 14px);\n}\n\n.placeholder-text {\n color: var(--Gray-Gray-400, #858ea6);\n font-size: var(--font-size-s, 14px);\n}\n\n/ ── Flag ────────────────────────────────────────────────────────── /\n.flag-img {\n border-radius: var(--Border-1, 4px);\n width: 24px;\n height: 24px;\n object-fit: cover;\n flex-shrink: 0;\n}\n\n/ ── Dropdown ────────────────────────────────────────────────────── /\n.select-dropdown {\n position: absolute;\n top: calc(100% + 4px);\n left: 0;\n right: 0;\n background: var(--Neutral-White, #ffffff);\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: var(--Border-2, 8px);\n z-index: var(--dropi-z-index-overlay, 11000);\n list-style: none;\n padding: 0;\n margin: 0;\n box-shadow: 0 8px 24px rgba(0, 0, 0, 0.10);\n overflow: hidden;\n transition: max-height 0.2s ease, opacity 0.2s ease;\n}\n\n.select-dropdown.expanded {\n max-height: 300px;\n opacity: 1;\n overflow-y: auto;\n}\n\n.select-dropdown.collapsed {\n max-height: 0;\n opacity: 0;\n pointer-events: none;\n border-color: transparent;\n box-shadow: none;\n}\n\n/ Scrollbar — siempre claro, nunca negro /\n.select-dropdown::-webkit-scrollbar { width: 6px; }\n.select-dropdown::-webkit-scrollbar-track { background: transparent; }\n.select-dropdown::-webkit-scrollbar-thumb {\n background: var(--Gray-Gray-200, #c3c9d9);\n border-radius: 4px;\n}\n.select-dropdown::-webkit-scrollbar-thumb:hover {\n background: var(--Gray-Gray-300, #a3abbf);\n}\n\n/ ── Search ──────────────────────────────────────────────────────── /\n.search-li {\n padding: 10px 12px;\n position: sticky;\n top: 0;\n background: var(--Neutral-White, #ffffff);\n z-index: 1;\n border-bottom: 1px solid var(--Gray-Gray-100, #e6eaf2);\n}\n\n.search-field {\n position: relative;\n display: flex;\n align-items: center;\n}\n\n.country-search {\n width: 100%;\n height: 36px;\n padding: 0 36px 0 12px;\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: var(--Border-2, 8px);\n outline: none;\n font-size: var(--font-size-s, 14px);\n font-family: inherit;\n color: var(--Gray-Gray-700, #32394d);\n background: var(--Gray-Gray-50, #f7f8fa);\n transition: border-color 0.15s, background 0.15s;\n}\n\n.country-search:focus {\n border-color: var(--Info-Info-500, #50a5f1);\n background: var(--Neutral-White, #ffffff);\n}\n\n.country-search::placeholder {\n color: var(--Gray-Gray-400, #858ea6);\n}\n\n.search-icon {\n position: absolute;\n right: 10px;\n display: flex;\n align-items: center;\n pointer-events: none;\n}\n\n/ ── Options ─────────────────────────────────────────────────────── /\n.option {\n width: 100%;\n min-height: 44px;\n padding: 10px 16px;\n border: none;\n background: transparent;\n text-align: left;\n color: var(--Gray-Gray-700, #32394d);\n font-size: var(--font-size-s, 14px);\n font-family: inherit;\n cursor: pointer;\n display: flex;\n align-items: center;\n gap: 10px;\n transition: background 0.1s ease;\n white-space: nowrap;\n}\n\n.option:hover {\n background: var(--Gray-Gray-50, #f7f8fa);\n}\n","import { Component, Prop, Event, EventEmitter, State, Watch, h, Element, Listen, AttachInternals } from '@stencil/core';\n\nconst PORTAL_CSS = `\n.select-dropdown {\n background: #ffffff;\n border: 1px solid #c3c9d9;\n border-radius: 8px;\n list-style: none;\n padding: 0;\n margin: 0;\n box-shadow: 0 8px 24px rgba(0,0,0,.10);\n overflow: hidden;\n transition: max-height .2s ease, opacity .2s ease;\n font-family: inherit;\n font-size: 14px;\n}\n.select-dropdown.expanded { max-height: 300px; opacity: 1; overflow-y: auto; }\n.select-dropdown.collapsed { max-height: 0; opacity: 0; pointer-events: none; border-color: transparent; box-shadow: none; }\n.select-dropdown::-webkit-scrollbar { width: 6px; }\n.select-dropdown::-webkit-scrollbar-track { background: transparent; }\n.select-dropdown::-webkit-scrollbar-thumb { background: #c3c9d9; border-radius: 4px; }\n.search-li { padding: 10px 12px; position: sticky; top: 0; background: #ffffff; z-index: 1; border-bottom: 1px solid #e6eaf2; }\n.search-field { position: relative; display: flex; align-items: center; }\n.country-search { width: 100%; height: 36px; padding: 0 36px 0 12px; border: 1px solid #c3c9d9; border-radius: 8px; outline: none; font-size: 14px; font-family: inherit; color: #32394d; background: #f7f8fa; }\n.country-search:focus { border-color: #50a5f1; background: #ffffff; }\n.country-search::placeholder { color: #858ea6; }\n.search-icon { position: absolute; right: 10px; display: flex; align-items: center; pointer-events: none; }\n.option { width: 100%; min-height: 44px; padding: 10px 16px; border: none; background: transparent; text-align: left; color: #32394d; font-size: 14px; font-family: inherit; cursor: pointer; display: flex; align-items: center; gap: 10px; transition: background .1s ease; white-space: nowrap; }\n.option:hover { background: #f7f8fa; }\n.flag-img { border-radius: 4px; width: 24px; height: 24px; object-fit: cover; flex-shrink: 0; }\n`;\n\nexport interface CountryItem {\n name: string;\n code: string;\n codePhone: string;\n}\n\nconst COUNTRIES: CountryItem[] = [\n { name: 'Afghanistan', code: 'AF', codePhone: '93' },\n { name: 'Albania', code: 'AL', codePhone: '355' },\n { name: 'Algeria', code: 'DZ', codePhone: '213' },\n { name: 'Argentina', code: 'AR', codePhone: '54' },\n { name: 'Australia', code: 'AU', codePhone: '61' },\n { name: 'Austria', code: 'AT', codePhone: '43' },\n { name: 'Azerbaijan', code: 'AZ', codePhone: '994' },\n { name: 'Bahamas', code: 'BS', codePhone: '1242' },\n { name: 'Bahrain', code: 'BH', codePhone: '973' },\n { name: 'Bangladesh', code: 'BD', codePhone: '880' },\n { name: 'Belgium', code: 'BE', codePhone: '32' },\n { name: 'Bolivia', code: 'BO', codePhone: '591' },\n { name: 'Brazil', code: 'BR', codePhone: '55' },\n { name: 'Cambodia', code: 'KH', codePhone: '855' },\n { name: 'Canada', code: 'CA', codePhone: '1' },\n { name: 'Chile', code: 'CL', codePhone: '56' },\n { name: 'China', code: 'CN', codePhone: '86' },\n { name: 'Colombia', code: 'CO', codePhone: '57' },\n { name: 'Costa Rica', code: 'CR', codePhone: '506' },\n { name: 'Cuba', code: 'CU', codePhone: '53' },\n { name: 'Czech Republic', code: 'CZ', codePhone: '420' },\n { name: 'Denmark', code: 'DK', codePhone: '45' },\n { name: 'Dominican Republic', code: 'DO', codePhone: '1' },\n { name: 'Ecuador', code: 'EC', codePhone: '593' },\n { name: 'Egypt', code: 'EG', codePhone: '20' },\n { name: 'El Salvador', code: 'SV', codePhone: '503' },\n { name: 'Estonia', code: 'EE', codePhone: '372' },\n { name: 'Ethiopia', code: 'ET', codePhone: '251' },\n { name: 'Finland', code: 'FI', codePhone: '358' },\n { name: 'France', code: 'FR', codePhone: '33' },\n { name: 'Germany', code: 'DE', codePhone: '49' },\n { name: 'Ghana', code: 'GH', codePhone: '233' },\n { name: 'Greece', code: 'GR', codePhone: '30' },\n { name: 'Guatemala', code: 'GT', codePhone: '502' },\n { name: 'Honduras', code: 'HN', codePhone: '504' },\n { name: 'Hong Kong', code: 'HK', codePhone: '852' },\n { name: 'Hungary', code: 'HU', codePhone: '36' },\n { name: 'India', code: 'IN', codePhone: '91' },\n { name: 'Indonesia', code: 'ID', codePhone: '62' },\n { name: 'Iran, Islamic Republic Of', code: 'IR', codePhone: '98' },\n { name: 'Iraq', code: 'IQ', codePhone: '964' },\n { name: 'Ireland', code: 'IE', codePhone: '353' },\n { name: 'Israel', code: 'IL', codePhone: '972' },\n { name: 'Italy', code: 'IT', codePhone: '39' },\n { name: 'Jamaica', code: 'JM', codePhone: '1876' },\n { name: 'Japan', code: 'JP', codePhone: '81' },\n { name: 'Jordan', code: 'JO', codePhone: '962' },\n { name: 'Kazakhstan', code: 'KZ', codePhone: '7' },\n { name: 'Kenya', code: 'KE', codePhone: '254' },\n { name: 'Kuwait', code: 'KW', codePhone: '965' },\n { name: 'Lebanon', code: 'LB', codePhone: '961' },\n { name: 'Malaysia', code: 'MY', codePhone: '60' },\n { name: 'Mexico', code: 'MX', codePhone: '52' },\n { name: 'Morocco', code: 'MA', codePhone: '212' },\n { name: 'Netherlands', code: 'NL', codePhone: '31' },\n { name: 'New Zealand', code: 'NZ', codePhone: '64' },\n { name: 'Nicaragua', code: 'NI', codePhone: '505' },\n { name: 'Nigeria', code: 'NG', codePhone: '234' },\n { name: 'Norway', code: 'NO', codePhone: '47' },\n { name: 'Pakistan', code: 'PK', codePhone: '92' },\n { name: 'Panama', code: 'PA', codePhone: '507' },\n { name: 'Paraguay', code: 'PY', codePhone: '595' },\n { name: 'Peru', code: 'PE', codePhone: '51' },\n { name: 'Philippines', code: 'PH', codePhone: '63' },\n { name: 'Poland', code: 'PL', codePhone: '48' },\n { name: 'Portugal', code: 'PT', codePhone: '351' },\n { name: 'Qatar', code: 'QA', codePhone: '974' },\n { name: 'Romania', code: 'RO', codePhone: '40' },\n { name: 'Russian Federation', code: 'RU', codePhone: '7' },\n { name: 'Saudi Arabia', code: 'SA', codePhone: '966' },\n { name: 'Singapore', code: 'SG', codePhone: '65' },\n { name: 'South Africa', code: 'ZA', codePhone: '27' },\n { name: 'Spain', code: 'ES', codePhone: '34' },\n { name: 'Sri Lanka', code: 'LK', codePhone: '94' },\n { name: 'Sweden', code: 'SE', codePhone: '46' },\n { name: 'Switzerland', code: 'CH', codePhone: '41' },\n { name: 'Taiwan, Province of China', code: 'TW', codePhone: '886' },\n { name: 'Thailand', code: 'TH', codePhone: '66' },\n { name: 'Tunisia', code: 'TN', codePhone: '216' },\n { name: 'Turkey', code: 'TR', codePhone: '90' },\n { name: 'Uganda', code: 'UG', codePhone: '256' },\n { name: 'Ukraine', code: 'UA', codePhone: '380' },\n { name: 'United Arab Emirates', code: 'AE', codePhone: '971' },\n { name: 'United Kingdom', code: 'GB', codePhone: '44' },\n { name: 'United States', code: 'US', codePhone: '1' },\n { name: 'Uruguay', code: 'UY', codePhone: '598' },\n { name: 'Venezuela', code: 'VE', codePhone: '58' },\n { name: 'Viet Nam', code: 'VN', codePhone: '84' },\n { name: 'Zimbabwe', code: 'ZW', codePhone: '263' },\n];\n\n/\n @component dropi-country-selector\n * Searchable country dropdown with flag images. Mirrors Angular dropi-country-selector.\n \n @example\n * <dropi-country-selector label=\"País\" placeholder=\"Selecciona un país\"></dropi-country-selector>\n /\n@Component({\n tag: 'dropi-country-selector',\n styleUrl: 'dropi-country-selector.css',\n shadow: true,\n formAssociated: true,\n})\nexport class DropiCountrySelector {\n @AttachInternals() internals: ElementInternals;\n\n /* Name for native form submission /\n @Prop({ reflect: true }) name: string = '';\n\n /* Label above the select /\n @Prop() label: string = '';\n /* Placeholder when nothing is selected /\n @Prop() placeholder: string = 'Selecciona un país';\n /* Pre-selected country code (ISO 3166-1 alpha-2) /\n @Prop({ mutable: true }) currentSelection: string = '';\n /* Whether the selector is disabled /\n @Prop() disabled: boolean = false;\n /* Show asterisk for required field /\n @Prop() showObligatory: boolean = false;\n /* Show error border /\n @Prop() hasError: boolean = false;\n /* Helper text below the select /\n @Prop() textHelper: string = '';\n /* Search term for filtering (matches Angular `searchTerm`) /\n @Prop({ mutable: true }) searchTerm: string = '';\n /\n Convenience object prop — matches Angular `selectProperties: SelectProperties`.\n * When provided, its non-null fields override individual props.\n /\n @Prop() selectProperties: any = null;\n /* When set to \"body\", the dropdown renders with fixed positioning to escape parent overflow clipping /\n @Prop() appendTo: string = '';\n\n /* Emitted when a country is selected. Detail is the CountryItem. /\n @Event() dropiChange: EventEmitter<CountryItem>;\n\n @State() private isOpen: boolean = false;\n @State() private selected: CountryItem \| null = null;\n\n @Element() el!: HTMLElement;\n private buttonRef?: HTMLButtonElement;\n private portalContainer: HTMLDivElement \| null = null;\n private portalFocusedSelector: string \| null = null;\n\n @Listen('click', { target: 'document' })\n handleDocClick(e: MouseEvent) {\n if (!this.isOpen) return;\n const path = e.composedPath();\n if (path.includes(this.el)) return;\n if (this.portalContainer && path.includes(this.portalContainer)) return;\n this.isOpen = false;\n }\n\n private searchInputRef?: HTMLInputElement;\n\n @Watch('currentSelection')\n currentSelectionChanged(val: string) {\n this.selected = COUNTRIES.find(c => c.code === val) \|\| null;\n this.internals.setFormValue(val);\n }\n\n\n @Watch('selectProperties')\n selectPropertiesChanged(val: any) {\n if (!val) return;\n if (val.label !== undefined) this.label = val.label;\n if (val.placeholder !== undefined) this.placeholder = val.placeholder;\n if (val.showObligatory !== undefined) this.showObligatory = val.showObligatory;\n if (val.textHelper !== undefined) this.textHelper = val.textHelper;\n if (val.hasError !== undefined) this.hasError = val.hasError;\n }\n\n componentWillLoad() {\n if (this.selectProperties) this.selectPropertiesChanged(this.selectProperties);\n if (this.currentSelection) this.currentSelectionChanged(this.currentSelection);\n this.internals.setFormValue(this.currentSelection ?? '');\n }\n\n\n componentDidLoad() {\n if (this.appendTo !== 'body') return;\n this.portalContainer = document.createElement('div');\n const style = document.createElement('style');\n style.textContent = PORTAL_CSS;\n this.portalContainer.appendChild(style);\n document.body.appendChild(this.portalContainer);\n }\n\n disconnectedCallback() {\n this.returnUlToShadow();\n this.portalContainer?.remove();\n this.portalContainer = null;\n }\n\n componentWillRender() {\n if (!this.portalContainer) return;\n const active = document.activeElement;\n if (active && this.portalContainer.contains(active)) {\n this.portalFocusedSelector = '.' + Array.from((active as HTMLElement).classList).join('.');\n }\n this.returnUlToShadow();\n }\n\n componentDidRender() {\n if (!this.portalContainer \|\| !this.buttonRef) return;\n const ul = this.el.shadowRoot?.querySelector('ul.select-dropdown') as HTMLUListElement;\n if (!ul) return;\n const rect = this.buttonRef.getBoundingClientRect();\n ul.style.cssText = `position:fixed;top:${rect.bottom + 4}px;left:${rect.left}px;width:${rect.width}px;z-index:11000;`;\n this.portalContainer.appendChild(ul);\n if (this.portalFocusedSelector) {\n const el = this.portalContainer.querySelector(this.portalFocusedSelector) as HTMLElement;\n if (el) {\n const len = (el as HTMLInputElement).value?.length ?? 0;\n el.focus();\n (el as HTMLInputElement).setSelectionRange?.(len, len);\n }\n this.portalFocusedSelector = null;\n }\n }\n\n private returnUlToShadow() {\n if (!this.portalContainer) return;\n const ul = this.portalContainer.querySelector('ul.select-dropdown');\n if (ul) this.el.shadowRoot?.querySelector('.custom-select')?.appendChild(ul);\n }\n\n private get filtered(): CountryItem[] {\n if (!this.searchTerm) return COUNTRIES;\n const t = this.searchTerm.toLowerCase();\n return COUNTRIES.filter(c => c.name.toLowerCase().includes(t));\n }\n\n private open() {\n if (this.disabled) return;\n this.isOpen = !this.isOpen;\n if (this.isOpen) {\n setTimeout(() => this.searchInputRef?.focus(), 50);\n }\n }\n\n private select(country: CountryItem) {\n this.selected = country;\n this.isOpen = false;\n this.searchTerm = '';\n this.currentSelection = country.code;\n this.dropiChange.emit(country);\n }\n\n render() {\n return (\n <div class=\"custom-select\">\n {this.label && (\n <label>\n {this.label}\n {this.showObligatory && <span class=\"required\"></span>}\n </label>\n )}\n\n <button\n type=\"button\"\n ref={(el) => { this.buttonRef = el as HTMLButtonElement; }}\n class={{\n 'select-button': true,\n 'select-completed': !!this.selected,\n 'select-invalid': this.hasError,\n }}\n disabled={this.disabled}\n onClick={() => this.open()}\n >\n <div class=\"selected-content\">\n {this.selected ? (\n <span class=\"selected-option\">\n <img\n class=\"flag-img\"\n src={`https://flagsapi.com/${this.selected.code}/shiny/24.png`}\n alt={this.selected.name}\n />\n {this.selected.name}\n </span>\n ) : (\n <span class=\"placeholder-text\">{this.placeholder}</span>\n )}\n </div>\n <dropi-icon\n name={this.isOpen ? 'Arrow-Up-2' : 'Arrow-Down-2'}\n iconWidth=\"20px\"\n iconHeight=\"20px\"\n color=\"Gray-Gray-500\"\n />\n </button>\n\n <ul class={`select-dropdown${this.isOpen ? ' expanded' : ' collapsed'}`}>\n <li class=\"search-li\">\n <div class=\"search-field\">\n <input\n ref={(el) => { this.searchInputRef = el; }}\n type=\"text\"\n class=\"country-search\"\n placeholder=\"Buscar país...\"\n value={this.searchTerm}\n onInput={(e) => { this.searchTerm = (e.target as HTMLInputElement).value; }}\n />\n <span class=\"search-icon\">\n <dropi-icon name=\"Search\" iconWidth=\"16px\" iconHeight=\"16px\" color=\"Gray-Gray-400\" />\n </span>\n </div>\n </li>\n {this.filtered.map(country => (\n <li key={country.code}>\n <button class=\"option\" type=\"button\" onClick={() => this.select(country)}>\n <img\n class=\"flag-img\"\n src={`https://flagsapi.com/${country.code}/shiny/24.png`}\n alt={country.name}\n />\n {country.name}\n </button>\n </li>\n ))}\n </ul>\n {this.textHelper && (\n <div class={{ 'select-helper': true, 'select-helper-error': this.hasError }}>\n {this.hasError && <dropi-icon name=\"Warning-circle\" iconWidth=\"12px\" iconHeight=\"12px\" color=\"Error-Error-500\" />}\n <span>{this.textHelper}</span>\n </div>\n )}\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"dropi-country-selector.entry.js","mappings":"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","names":[],"sources":["src/components/dropi-country-selector/dropi-country-selector.css?tag=dropi-country-selector&encapsulation=shadow","src/components/dropi-country-selector/dropi-country-selector.tsx"],"sourcesContent":[":host {\n display: block;\n width: 100%;\n text-align: left;\n}\n\n, ::before, ::after { box-sizing: border-box; }\n\n.custom-select {\n position: relative;\n width: 100%;\n}\n\n/ ── Label ───────────────────────────────────────────────────────── /\nlabel {\n display: block;\n font-size: var(--font-size-xs, 11px);\n font-weight: var(--font-weight-regular, 400);\n color: var(--Gray-Gray-600, #475066);\n margin-bottom: 6px;\n}\n\n.required {\n color: var(--Error-Error-500, #ef4444);\n margin-left: 2px;\n}\n\n/ ── Trigger button ──────────────────────────────────────────────── /\n.select-button {\n width: 100%;\n height: 44px;\n padding: 0 12px;\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: var(--Border-2, 8px);\n background: var(--Neutral-White, #ffffff);\n color: var(--Gray-Gray-500, #69738c);\n font-size: var(--font-size-s, 14px);\n font-family: inherit;\n display: flex;\n justify-content: space-between;\n align-items: center;\n text-align: left;\n cursor: pointer;\n transition: border-color 0.15s ease;\n}\n\n.select-button:focus {\n outline: none;\n border-color: var(--Info-Info-500, #3b82f6);\n}\n\n.select-button:disabled {\n border-color: var(--Gray-Gray-200, #c3c9d9);\n color: var(--Gray-Gray-400, #858ea6);\n background: var(--Gray-Gray-50, #f7f8fa);\n cursor: not-allowed;\n}\n\n.select-button.select-completed {\n color: var(--Gray-Gray-700, #32394d);\n}\n\n.select-button.select-invalid {\n border-color: var(--Error-Error-500, #ef4444);\n}\n\n.selected-content {\n display: flex;\n align-items: center;\n gap: 8px;\n overflow: hidden;\n flex: 1;\n}\n\n.selected-option {\n display: flex;\n align-items: center;\n gap: 8px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--Gray-Gray-700, #32394d);\n font-size: var(--font-size-s, 14px);\n}\n\n.placeholder-text {\n color: var(--Gray-Gray-400, #858ea6);\n font-size: var(--font-size-s, 14px);\n}\n\n/ ── Flag ────────────────────────────────────────────────────────── /\n.flag-img {\n border-radius: var(--Border-1, 4px);\n width: 24px;\n height: 24px;\n object-fit: cover;\n flex-shrink: 0;\n}\n\n/ ── Dropdown ────────────────────────────────────────────────────── /\n.select-dropdown {\n position: absolute;\n top: calc(100% + 4px);\n left: 0;\n right: 0;\n background: var(--Neutral-White, #ffffff);\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: var(--Border-2, 8px);\n z-index: var(--dropi-z-index-overlay, 11000);\n list-style: none;\n padding: 0;\n margin: 0;\n box-shadow: 0 8px 24px rgba(0, 0, 0, 0.10);\n overflow: hidden;\n transition: max-height 0.2s ease, opacity 0.2s ease;\n}\n\n.select-dropdown.expanded {\n max-height: 300px;\n opacity: 1;\n overflow-y: auto;\n}\n\n.select-dropdown.collapsed {\n max-height: 0;\n opacity: 0;\n pointer-events: none;\n border-color: transparent;\n box-shadow: none;\n}\n\n/ Scrollbar — siempre claro, nunca negro /\n.select-dropdown::-webkit-scrollbar { width: 6px; }\n.select-dropdown::-webkit-scrollbar-track { background: transparent; }\n.select-dropdown::-webkit-scrollbar-thumb {\n background: var(--Gray-Gray-200, #c3c9d9);\n border-radius: 4px;\n}\n.select-dropdown::-webkit-scrollbar-thumb:hover {\n background: var(--Gray-Gray-300, #a3abbf);\n}\n\n/ ── Search ──────────────────────────────────────────────────────── /\n.search-li {\n padding: 10px 12px;\n position: sticky;\n top: 0;\n background: var(--Neutral-White, #ffffff);\n z-index: 1;\n border-bottom: 1px solid var(--Gray-Gray-100, #e6eaf2);\n}\n\n.search-field {\n position: relative;\n display: flex;\n align-items: center;\n}\n\n.country-search {\n width: 100%;\n height: 36px;\n padding: 0 36px 0 12px;\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: var(--Border-2, 8px);\n outline: none;\n font-size: var(--font-size-s, 14px);\n font-family: inherit;\n color: var(--Gray-Gray-700, #32394d);\n background: var(--Gray-Gray-50, #f7f8fa);\n transition: border-color 0.15s, background 0.15s;\n}\n\n.country-search:focus {\n border-color: var(--Info-Info-500, #50a5f1);\n background: var(--Neutral-White, #ffffff);\n}\n\n.country-search::placeholder {\n color: var(--Gray-Gray-400, #858ea6);\n}\n\n.search-icon {\n position: absolute;\n right: 10px;\n display: flex;\n align-items: center;\n pointer-events: none;\n}\n\n/ ── Options ─────────────────────────────────────────────────────── /\n.option {\n width: 100%;\n min-height: 44px;\n padding: 10px 16px;\n border: none;\n background: transparent;\n text-align: left;\n color: var(--Gray-Gray-700, #32394d);\n font-size: var(--font-size-s, 14px);\n font-family: inherit;\n cursor: pointer;\n display: flex;\n align-items: center;\n gap: 10px;\n transition: background 0.1s ease;\n white-space: nowrap;\n}\n\n.option:hover {\n background: var(--Gray-Gray-50, #f7f8fa);\n}\n","import { Component, Prop, Event, EventEmitter, State, Watch, h, Element, Listen, AttachInternals } from '@stencil/core';\n\nconst PORTAL_CSS = `\n.select-dropdown {\n background: #ffffff;\n border: 1px solid #c3c9d9;\n border-radius: 8px;\n list-style: none;\n padding: 0;\n margin: 0;\n box-shadow: 0 8px 24px rgba(0,0,0,.10);\n overflow: hidden;\n transition: max-height .2s ease, opacity .2s ease;\n font-family: inherit;\n font-size: 14px;\n}\n.select-dropdown.expanded { max-height: 300px; opacity: 1; overflow-y: auto; }\n.select-dropdown.collapsed { max-height: 0; opacity: 0; pointer-events: none; border-color: transparent; box-shadow: none; }\n.select-dropdown::-webkit-scrollbar { width: 6px; }\n.select-dropdown::-webkit-scrollbar-track { background: transparent; }\n.select-dropdown::-webkit-scrollbar-thumb { background: #c3c9d9; border-radius: 4px; }\n.search-li { padding: 10px 12px; position: sticky; top: 0; background: #ffffff; z-index: 1; border-bottom: 1px solid #e6eaf2; }\n.search-field { position: relative; display: flex; align-items: center; }\n.country-search { width: 100%; height: 36px; padding: 0 36px 0 12px; border: 1px solid #c3c9d9; border-radius: 8px; outline: none; font-size: 14px; font-family: inherit; color: #32394d; background: #f7f8fa; }\n.country-search:focus { border-color: #50a5f1; background: #ffffff; }\n.country-search::placeholder { color: #858ea6; }\n.search-icon { position: absolute; right: 10px; display: flex; align-items: center; pointer-events: none; }\n.option { width: 100%; min-height: 44px; padding: 10px 16px; border: none; background: transparent; text-align: left; color: #32394d; font-size: 14px; font-family: inherit; cursor: pointer; display: flex; align-items: center; gap: 10px; transition: background .1s ease; white-space: nowrap; }\n.option:hover { background: #f7f8fa; }\n.flag-img { border-radius: 4px; width: 24px; height: 24px; object-fit: cover; flex-shrink: 0; }\n`;\n\nexport interface CountryItem {\n name: string;\n code: string;\n codePhone: string;\n}\n\nconst COUNTRIES: CountryItem[] = [\n { name: 'Afghanistan', code: 'AF', codePhone: '93' },\n { name: 'Albania', code: 'AL', codePhone: '355' },\n { name: 'Algeria', code: 'DZ', codePhone: '213' },\n { name: 'Argentina', code: 'AR', codePhone: '54' },\n { name: 'Australia', code: 'AU', codePhone: '61' },\n { name: 'Austria', code: 'AT', codePhone: '43' },\n { name: 'Azerbaijan', code: 'AZ', codePhone: '994' },\n { name: 'Bahamas', code: 'BS', codePhone: '1242' },\n { name: 'Bahrain', code: 'BH', codePhone: '973' },\n { name: 'Bangladesh', code: 'BD', codePhone: '880' },\n { name: 'Belgium', code: 'BE', codePhone: '32' },\n { name: 'Bolivia', code: 'BO', codePhone: '591' },\n { name: 'Brazil', code: 'BR', codePhone: '55' },\n { name: 'Cambodia', code: 'KH', codePhone: '855' },\n { name: 'Canada', code: 'CA', codePhone: '1' },\n { name: 'Chile', code: 'CL', codePhone: '56' },\n { name: 'China', code: 'CN', codePhone: '86' },\n { name: 'Colombia', code: 'CO', codePhone: '57' },\n { name: 'Costa Rica', code: 'CR', codePhone: '506' },\n { name: 'Cuba', code: 'CU', codePhone: '53' },\n { name: 'Czech Republic', code: 'CZ', codePhone: '420' },\n { name: 'Denmark', code: 'DK', codePhone: '45' },\n { name: 'Dominican Republic', code: 'DO', codePhone: '1' },\n { name: 'Ecuador', code: 'EC', codePhone: '593' },\n { name: 'Egypt', code: 'EG', codePhone: '20' },\n { name: 'El Salvador', code: 'SV', codePhone: '503' },\n { name: 'Estonia', code: 'EE', codePhone: '372' },\n { name: 'Ethiopia', code: 'ET', codePhone: '251' },\n { name: 'Finland', code: 'FI', codePhone: '358' },\n { name: 'France', code: 'FR', codePhone: '33' },\n { name: 'Germany', code: 'DE', codePhone: '49' },\n { name: 'Ghana', code: 'GH', codePhone: '233' },\n { name: 'Greece', code: 'GR', codePhone: '30' },\n { name: 'Guatemala', code: 'GT', codePhone: '502' },\n { name: 'Honduras', code: 'HN', codePhone: '504' },\n { name: 'Hong Kong', code: 'HK', codePhone: '852' },\n { name: 'Hungary', code: 'HU', codePhone: '36' },\n { name: 'India', code: 'IN', codePhone: '91' },\n { name: 'Indonesia', code: 'ID', codePhone: '62' },\n { name: 'Iran, Islamic Republic Of', code: 'IR', codePhone: '98' },\n { name: 'Iraq', code: 'IQ', codePhone: '964' },\n { name: 'Ireland', code: 'IE', codePhone: '353' },\n { name: 'Israel', code: 'IL', codePhone: '972' },\n { name: 'Italy', code: 'IT', codePhone: '39' },\n { name: 'Jamaica', code: 'JM', codePhone: '1876' },\n { name: 'Japan', code: 'JP', codePhone: '81' },\n { name: 'Jordan', code: 'JO', codePhone: '962' },\n { name: 'Kazakhstan', code: 'KZ', codePhone: '7' },\n { name: 'Kenya', code: 'KE', codePhone: '254' },\n { name: 'Kuwait', code: 'KW', codePhone: '965' },\n { name: 'Lebanon', code: 'LB', codePhone: '961' },\n { name: 'Malaysia', code: 'MY', codePhone: '60' },\n { name: 'Mexico', code: 'MX', codePhone: '52' },\n { name: 'Morocco', code: 'MA', codePhone: '212' },\n { name: 'Netherlands', code: 'NL', codePhone: '31' },\n { name: 'New Zealand', code: 'NZ', codePhone: '64' },\n { name: 'Nicaragua', code: 'NI', codePhone: '505' },\n { name: 'Nigeria', code: 'NG', codePhone: '234' },\n { name: 'Norway', code: 'NO', codePhone: '47' },\n { name: 'Pakistan', code: 'PK', codePhone: '92' },\n { name: 'Panama', code: 'PA', codePhone: '507' },\n { name: 'Paraguay', code: 'PY', codePhone: '595' },\n { name: 'Peru', code: 'PE', codePhone: '51' },\n { name: 'Philippines', code: 'PH', codePhone: '63' },\n { name: 'Poland', code: 'PL', codePhone: '48' },\n { name: 'Portugal', code: 'PT', codePhone: '351' },\n { name: 'Qatar', code: 'QA', codePhone: '974' },\n { name: 'Romania', code: 'RO', codePhone: '40' },\n { name: 'Russian Federation', code: 'RU', codePhone: '7' },\n { name: 'Saudi Arabia', code: 'SA', codePhone: '966' },\n { name: 'Singapore', code: 'SG', codePhone: '65' },\n { name: 'South Africa', code: 'ZA', codePhone: '27' },\n { name: 'Spain', code: 'ES', codePhone: '34' },\n { name: 'Sri Lanka', code: 'LK', codePhone: '94' },\n { name: 'Sweden', code: 'SE', codePhone: '46' },\n { name: 'Switzerland', code: 'CH', codePhone: '41' },\n { name: 'Taiwan, Province of China', code: 'TW', codePhone: '886' },\n { name: 'Thailand', code: 'TH', codePhone: '66' },\n { name: 'Tunisia', code: 'TN', codePhone: '216' },\n { name: 'Turkey', code: 'TR', codePhone: '90' },\n { name: 'Uganda', code: 'UG', codePhone: '256' },\n { name: 'Ukraine', code: 'UA', codePhone: '380' },\n { name: 'United Arab Emirates', code: 'AE', codePhone: '971' },\n { name: 'United Kingdom', code: 'GB', codePhone: '44' },\n { name: 'United States', code: 'US', codePhone: '1' },\n { name: 'Uruguay', code: 'UY', codePhone: '598' },\n { name: 'Venezuela', code: 'VE', codePhone: '58' },\n { name: 'Viet Nam', code: 'VN', codePhone: '84' },\n { name: 'Zimbabwe', code: 'ZW', codePhone: '263' },\n];\n\n/\n @component dropi-country-selector\n * Searchable country dropdown with flag images. Mirrors Angular dropi-country-selector.\n \n @example\n * <dropi-country-selector label=\"País\" placeholder=\"Selecciona un país\"></dropi-country-selector>\n /\n@Component({\n tag: 'dropi-country-selector',\n styleUrl: 'dropi-country-selector.css',\n shadow: true,\n formAssociated: true,\n})\nexport class DropiCountrySelector {\n @AttachInternals() internals: ElementInternals;\n\n /* Name for native form submission /\n @Prop({ reflect: true }) name!: string;\n\n /* Label above the select /\n @Prop() label: string = '';\n /* Placeholder when nothing is selected /\n @Prop() placeholder: string = 'Selecciona un país';\n /* Pre-selected country code (ISO 3166-1 alpha-2) /\n @Prop({ mutable: true }) currentSelection: string = '';\n /* Whether the selector is disabled /\n @Prop() disabled: boolean = false;\n /* Show asterisk for required field /\n @Prop() showObligatory: boolean = false;\n /* Show error border /\n @Prop() hasError: boolean = false;\n /* Helper text below the select /\n @Prop() textHelper: string = '';\n /* Search term for filtering (matches Angular `searchTerm`) /\n @Prop({ mutable: true }) searchTerm: string = '';\n /\n Convenience object prop — matches Angular `selectProperties: SelectProperties`.\n * When provided, its non-null fields override individual props.\n /\n @Prop() selectProperties: any = null;\n /* When set to \"body\", the dropdown renders with fixed positioning to escape parent overflow clipping /\n @Prop() appendTo: string = '';\n\n /* Emitted when a country is selected. Detail is the CountryItem. /\n @Event() dropiChange: EventEmitter<CountryItem>;\n\n @State() private isOpen: boolean = false;\n @State() private selected: CountryItem \| null = null;\n\n @Element() el!: HTMLElement;\n private buttonRef?: HTMLButtonElement;\n private portalContainer: HTMLDivElement \| null = null;\n private portalFocusedSelector: string \| null = null;\n\n @Listen('click', { target: 'document' })\n handleDocClick(e: MouseEvent) {\n if (!this.isOpen) return;\n const path = e.composedPath();\n if (path.includes(this.el)) return;\n if (this.portalContainer && path.includes(this.portalContainer)) return;\n this.isOpen = false;\n }\n\n private searchInputRef?: HTMLInputElement;\n\n @Watch('currentSelection')\n currentSelectionChanged(val: string) {\n this.selected = COUNTRIES.find(c => c.code === val) \|\| null;\n this.internals.setFormValue(val);\n }\n\n\n @Watch('selectProperties')\n selectPropertiesChanged(val: any) {\n if (!val) return;\n if (val.label !== undefined) this.label = val.label;\n if (val.placeholder !== undefined) this.placeholder = val.placeholder;\n if (val.showObligatory !== undefined) this.showObligatory = val.showObligatory;\n if (val.textHelper !== undefined) this.textHelper = val.textHelper;\n if (val.hasError !== undefined) this.hasError = val.hasError;\n }\n\n componentWillLoad() {\n if (this.selectProperties) this.selectPropertiesChanged(this.selectProperties);\n if (this.currentSelection) this.currentSelectionChanged(this.currentSelection);\n this.internals.setFormValue(this.currentSelection ?? '');\n }\n\n\n componentDidLoad() {\n if (this.appendTo !== 'body') return;\n this.portalContainer = document.createElement('div');\n const style = document.createElement('style');\n style.textContent = PORTAL_CSS;\n this.portalContainer.appendChild(style);\n document.body.appendChild(this.portalContainer);\n }\n\n disconnectedCallback() {\n this.returnUlToShadow();\n this.portalContainer?.remove();\n this.portalContainer = null;\n }\n\n componentWillRender() {\n if (!this.portalContainer) return;\n const active = document.activeElement;\n if (active && this.portalContainer.contains(active)) {\n this.portalFocusedSelector = '.' + Array.from((active as HTMLElement).classList).join('.');\n }\n this.returnUlToShadow();\n }\n\n componentDidRender() {\n if (!this.portalContainer \|\| !this.buttonRef) return;\n const ul = this.el.shadowRoot?.querySelector('ul.select-dropdown') as HTMLUListElement;\n if (!ul) return;\n const rect = this.buttonRef.getBoundingClientRect();\n ul.style.cssText = `position:fixed;top:${rect.bottom + 4}px;left:${rect.left}px;width:${rect.width}px;z-index:11000;`;\n this.portalContainer.appendChild(ul);\n if (this.portalFocusedSelector) {\n const el = this.portalContainer.querySelector(this.portalFocusedSelector) as HTMLElement;\n if (el) {\n const len = (el as HTMLInputElement).value?.length ?? 0;\n el.focus();\n (el as HTMLInputElement).setSelectionRange?.(len, len);\n }\n this.portalFocusedSelector = null;\n }\n }\n\n private returnUlToShadow() {\n if (!this.portalContainer) return;\n const ul = this.portalContainer.querySelector('ul.select-dropdown');\n if (ul) this.el.shadowRoot?.querySelector('.custom-select')?.appendChild(ul);\n }\n\n private get filtered(): CountryItem[] {\n if (!this.searchTerm) return COUNTRIES;\n const t = this.searchTerm.toLowerCase();\n return COUNTRIES.filter(c => c.name.toLowerCase().includes(t));\n }\n\n private open() {\n if (this.disabled) return;\n this.isOpen = !this.isOpen;\n if (this.isOpen) {\n setTimeout(() => this.searchInputRef?.focus(), 50);\n }\n }\n\n private select(country: CountryItem) {\n this.selected = country;\n this.isOpen = false;\n this.searchTerm = '';\n this.currentSelection = country.code;\n this.dropiChange.emit(country);\n }\n\n render() {\n return (\n <div class=\"custom-select\">\n {this.label && (\n <label>\n {this.label}\n {this.showObligatory && <span class=\"required\"></span>}\n </label>\n )}\n\n <button\n type=\"button\"\n ref={(el) => { this.buttonRef = el as HTMLButtonElement; }}\n class={{\n 'select-button': true,\n 'select-completed': !!this.selected,\n 'select-invalid': this.hasError,\n }}\n disabled={this.disabled}\n onClick={() => this.open()}\n >\n <div class=\"selected-content\">\n {this.selected ? (\n <span class=\"selected-option\">\n <img\n class=\"flag-img\"\n src={`https://flagsapi.com/${this.selected.code}/shiny/24.png`}\n alt={this.selected.name}\n />\n {this.selected.name}\n </span>\n ) : (\n <span class=\"placeholder-text\">{this.placeholder}</span>\n )}\n </div>\n <dropi-icon\n name={this.isOpen ? 'Arrow-Up-2' : 'Arrow-Down-2'}\n iconWidth=\"20px\"\n iconHeight=\"20px\"\n color=\"Gray-Gray-500\"\n />\n </button>\n\n <ul class={`select-dropdown${this.isOpen ? ' expanded' : ' collapsed'}`}>\n <li class=\"search-li\">\n <div class=\"search-field\">\n <input\n ref={(el) => { this.searchInputRef = el; }}\n type=\"text\"\n class=\"country-search\"\n placeholder=\"Buscar país...\"\n value={this.searchTerm}\n onInput={(e) => { this.searchTerm = (e.target as HTMLInputElement).value; }}\n />\n <span class=\"search-icon\">\n <dropi-icon name=\"Search\" iconWidth=\"16px\" iconHeight=\"16px\" color=\"Gray-Gray-400\" />\n </span>\n </div>\n </li>\n {this.filtered.map(country => (\n <li key={country.code}>\n <button class=\"option\" type=\"button\" onClick={() => this.select(country)}>\n <img\n class=\"flag-img\"\n src={`https://flagsapi.com/${country.code}/shiny/24.png`}\n alt={country.name}\n />\n {country.name}\n </button>\n </li>\n ))}\n </ul>\n {this.textHelper && (\n <div class={{ 'select-helper': true, 'select-helper-error': this.hasError }}>\n {this.hasError && <dropi-icon name=\"Warning-circle\" iconWidth=\"12px\" iconHeight=\"12px\" color=\"Error-Error-500\" />}\n <span>{this.textHelper}</span>\n </div>\n )}\n </div>\n );\n }\n}\n"],"version":3}

package/dist/dropi-ui/dropi-date-picker-range.entry.js CHANGED Viewed

@@ -1,7 +1,13 @@
-import { r as registerInstance, d as createEvent, h } from './index-D0Z06C2b.js';
+import { r as registerInstance, d as createEvent, a as getElement, h } from './index-CPacpXAJ.js';
-const dropiDatePickerRangeCss = () => `:host{display:block;width:100%;max-width:380px}*,*::before,*::after{box-sizing:border-box}.date-picker-range{width:100%;font-family:inherit}.label{font-size:11px;font-weight:var(--font-weight-medium);color:#7b8190;margin-bottom:8px}.inputs-row{display:flex;align-items:flex-end;gap:8px}.input-group{flex:1;display:flex;flex-direction:column;gap:4px}.input-label{font-size:var(--font-size-xs, 11px);color:var(--Gray-Gray-500, #69738c);font-weight:var(--font-weight-medium, 500)}.date-input{width:100%;height:40px;padding:0 10px;border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);color:var(--Gray-Gray-600, #475066);font-size:13px;font-family:inherit;outline:none;cursor:pointer;transition:border-color 0.15s ease}.date-input:focus{border-color:var(--Primary-Primary-500, #f49a3d)}.separator{padding-bottom:8px;color:var(--Gray-Gray-400, #858ea6);font-size:var(--font-size-m)}.shortcuts{display:flex;flex-direction:column;gap:2px;margin-top:10px;border-left:1px solid var(--Gray-Gray-100, #e6eaf2);padding-left:10px}.shortcut-btn{background:transparent;border:none;padding:4px 6px;font-size:13px;font-family:inherit;color:var(--Gray-Gray-700, #32394d);cursor:pointer;text-align:left;border-radius:5px;transition:background 0.1s ease;font-weight:var(--font-weight-regular)}.shortcut-btn:hover{background:var(--Gray-Gray-50, #f5f6f8)}.shortcut-btn.active{background:var(--Gray-Gray-50, #f5f6f8);font-weight:var(--font-weight-semibold)}.warning-box{margin-top:8px;padding:4px 8px;border:1px solid var(--Warning-Warning-400);border-radius:4px;background:var(--Warning-Warning-50)}.warning-message{color:#495057;font-size:var(--font-size-xxs);line-height:16px}@keyframes shimmer{0%{background-position:-468px 0}100%{background-position:468px 0}}.skeleton{height:40px;width:100%;min-width:180px;border-radius:6px;animation:shimmer 1s linear infinite;background:linear-gradient(to right, #f5f6f8 8%, #e3e7ef 28%, #f5f6f8 77%);background-size:800px 104px}@media screen and (max-width: 480px){.inputs-row{flex-direction:column}.separator{display:none}.shortcuts{flex-direction:row;flex-wrap:wrap;border-left:none;padding-left:0;border-top:1px solid var(--Gray-Gray-100, #e6eaf2);padding-top:8px}}`;
+const dropiDatePickerRangeCss = () => `:host{display:block;width:100%;position:relative}*,*::before,*::after{box-sizing:border-box}.dpr-label{display:block;font-size:var(--font-size-xs, 10px);font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-600, #475066);margin-bottom:8px}.dpr-trigger{width:100%;height:40px;display:flex;align-items:center;gap:var(--Size-2, 8px);padding:0 var(--Size-3, 12px);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-2, 8px);background:var(--Neutral-White, #ffffff);cursor:pointer;font-family:inherit;transition:border-color 0.2s}.dpr-trigger:hover:not(:disabled){border-color:var(--Info-Info-500, #50a5f1)}.dpr-trigger--disabled{background:var(--Gray-Gray-50, #f7f8fa);cursor:not-allowed;opacity:0.6}.dpr-trigger__value{flex:1;text-align:left;font-size:var(--font-size-xs, 12px);color:var(--Gray-Gray-700, #32394d);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dpr-trigger__placeholder{color:var(--Gray-Gray-400, #858ea6)}.dpr-popup{position:absolute;top:calc(100% + 8px);left:0;display:flex;flex-direction:row;background:var(--Neutral-White, #ffffff);border:1px solid var(--Gray-Gray-200, #c3c9d9);border-radius:var(--Border-3, 12px);box-shadow:0 4px 16px rgba(0,0,0,0.08);z-index:300;overflow:hidden}.dpr-calendar{padding:var(--Size-4, 16px);width:300px;flex-shrink:0}.dpr-divider{width:1px;background:var(--Gray-Gray-100, #e6eaf2);flex-shrink:0}.dpr-shortcuts{padding:var(--Size-4, 16px) var(--Size-3, 12px);display:flex;flex-direction:column;gap:2px;min-width:140px}.shortcut-btn{background:transparent;border:1px solid transparent;padding:6px 10px;font-size:13px;font-family:inherit;color:var(--Gray-Gray-700, #32394d);cursor:pointer;text-align:left;border-radius:6px;transition:background 0.1s ease;font-weight:var(--font-weight-regular);white-space:nowrap}.shortcut-btn:hover{background:var(--Gray-Gray-50, #f5f6f8)}.shortcut-btn--active{border-color:var(--Gray-Gray-200, #c3c9d9);font-weight:var(--font-weight-semibold);background:var(--Gray-Gray-50, #f5f6f8)}.warning-box{margin-top:8px;padding:4px 8px;border:1px solid var(--Warning-Warning-400);border-radius:4px;background:var(--Warning-Warning-50)}.warning-message{color:#495057;font-size:var(--font-size-xxs);line-height:16px}.dp-month-grid{display:grid;grid-template-columns:repeat(3, 1fr);gap:8px}.dp-month-cell{padding:10px 4px;font-size:var(--font-size-s, 14px);font-family:inherit;font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-700, #32394d);background:transparent;border:1px solid transparent;border-radius:var(--Border-2, 8px);cursor:pointer;text-align:center;transition:background 0.15s, border-color 0.15s}.dp-month-cell:hover{background:var(--Gray-Gray-50, #f7f8fa)}.dp-month-cell--selected{border-color:var(--Info-Info-500, #50a5f1);font-weight:var(--font-weight-semibold, 600)}.dp-month-cell--current{background:var(--Gray-Gray-100, #e6eaf2)}.dp-year-grid{display:grid;grid-template-columns:repeat(2, 1fr);gap:8px}.dp-year-cell{padding:10px 4px;font-size:var(--font-size-s, 14px);font-family:inherit;font-weight:var(--font-weight-regular, 400);color:var(--Gray-Gray-700, #32394d);background:transparent;border:1px solid transparent;border-radius:var(--Border-2, 8px);cursor:pointer;text-align:center;transition:background 0.15s, border-color 0.15s}.dp-year-cell:hover{background:var(--Gray-Gray-50, #f7f8fa)}.dp-year-cell--selected{border-color:var(--Info-Info-500, #50a5f1);font-weight:var(--font-weight-semibold, 600)}.dp-year-cell--current{background:var(--Gray-Gray-100, #e6eaf2)}.dp-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--Size-4, 16px);padding-bottom:var(--Size-3, 12px);border-bottom:1px solid var(--Gray-Gray-100, #e6eaf2)}.dp-nav__btn{background:none;border:none;padding:0;cursor:pointer;border-radius:50%;display:flex;align-items:center;justify-content:center;width:32px;height:32px;transition:background 0.15s}.dp-nav__btn:hover{background:var(--Gray-Gray-50, #f7f8fa)}.dp-nav__title{background:none;border:none;font-size:var(--font-size-s, 14px);font-weight:var(--font-weight-bold, 700);color:var(--Gray-Gray-700, #32394d);display:flex;gap:8px;cursor:pointer;padding:4px 8px;border-radius:var(--Border-1, 4px);font-family:inherit;transition:background 0.15s}.dp-nav__title:hover{background:var(--Gray-Gray-50, #f7f8fa)}.dp-grid{display:grid;grid-template-columns:repeat(7, 1fr);row-gap:6px;column-gap:2px}.dp-day-header{font-size:var(--font-size-s, 14px);color:var(--Gray-Gray-700, #32394d);text-align:center;padding:6px 0;font-weight:var(--font-weight-bold, 700)}.dp-cell{aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-xs, 12px);font-family:inherit;border:none;cursor:pointer;background:transparent;color:var(--Gray-Gray-600, #475066);width:100%;position:relative;z-index:1;padding:0}.dp-cell::after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:50%;transition:background 0.15s;z-index:-1;background:transparent}.dp-cell::before{content:"";position:absolute;top:0;bottom:0;z-index:-2;background:transparent}.dp-cell:hover:not(:disabled)::after{background:var(--Gray-Gray-100, #e6eaf2)}.dp-cell--other-month{color:var(--Gray-Gray-300, #a0a9c0)}.dp-cell--today{font-weight:var(--font-weight-bold, 700)}.dp-cell--today::after{background:var(--Gray-Gray-100, #e6eaf2)}.dp-cell--selected{color:var(--Neutral-White, #ffffff);font-weight:var(--font-weight-bold, 700)}.dp-cell--selected::after{background:var(--Orange-orange-500, #f49a3d) !important}.dp-cell--range-start,.dp-cell--range-end{color:var(--Neutral-White, #ffffff);font-weight:var(--font-weight-bold, 700)}.dp-cell--range-start::after,.dp-cell--range-end::after{background:var(--Orange-orange-500, #f49a3d) !important}.dp-cell--in-range{color:var(--Orange-orange-500, #f49a3d);font-weight:var(--font-weight-bold, 700)}.dp-cell--in-range::before{left:-1px;right:-1px;background:var(--Orange-orange-50, #fef5ec)}.dp-cell--range-start::before{left:50%;right:-1px;background:var(--Orange-orange-50, #fef5ec)}.dp-cell--range-end::before{left:-1px;right:50%;background:var(--Orange-orange-50, #fef5ec)}.dp-cell--range-start.dp-cell--range-end::before{background:transparent}.dp-cell--disabled{opacity:0.35;cursor:not-allowed}@keyframes shimmer{0%{background-position:-468px 0}100%{background-position:468px 0}}.skeleton{height:40px;width:100%;border-radius:8px;animation:shimmer 1s linear infinite;background:linear-gradient(to right, #f5f6f8 8%, #e3e7ef 28%, #f5f6f8 77%);background-size:800px 104px}`;
+const MONTHS_ES = [
+    'Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio',
+    'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre',
+];
+const MONTHS_SHORT = ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun', 'Jul', 'Ago', 'Sep', 'Oct', 'Nov', 'Dic'];
+const DAYS_ES = ['Do', 'Lu', 'Ma', 'Mi', 'Ju', 'Vi', 'Sa'];
 const DropiDatePickerRange = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
@@ -16,25 +22,35 @@ const DropiDatePickerRange = class {
     /** Show "Rango de fechas" label */
     showLabel = true;
     /** Input placeholder */
-    placeholder = '';
+    placeholder = 'DD/MM/YYYY – DD/MM/YYYY';
     /** Show loading skeleton */
     loading = false;
     /** Max allowed range in days (0 = unlimited) */
     maxDaysRange = 0;
     /** Hide "Hoy" shortcut */
     hideTodayRangeShortcut = false;
-    /** Emitted when start date changes */
+    /** Disabled state */
+    disabled = false;
     startDateChange;
-    /** Emitted when end date changes */
     endDateChange;
-    /** Emitted with full range when both dates are set */
     dropiRangeChange;
     start = '';
     end = '';
     activeRange = -1;
     showWarning = false;
+    open = false;
+    viewYear = new Date().getFullYear();
+    viewMonth = new Date().getMonth();
+    hoverDate = '';
+    viewMode = 'day';
+    get el() { return getElement(this); }
     onStartPropChange(val) { this.start = val; }
     onEndPropChange(val) { this.end = val; }
+    handleDocClick(e) {
+        if (this.open && !e.composedPath().includes(this.el)) {
+            this.open = false;
+        }
+    }
     componentWillLoad() {
         this.start = this.startDate;
         this.end = this.endDate;
@@ -57,47 +73,210 @@ const DropiDatePickerRange = class {
         ];
         return this.hideTodayRangeShortcut ? all.slice(1) : all;
     }
-    selectShortcut(idx) {
-        const s = this.shortcuts[idx];
-        this.start = s.start;
-        this.end = s.end;
-        this.activeRange = idx;
-        this.showWarning = false;
-        this.emit();
-    }
-    onStartChange(e) {
-        this.start = e.target.value;
-        this.activeRange = -1;
-        this.checkRange();
+    get displayValue() {
+        const fmt = (s) => s.split('-').reverse().join('/');
         if (this.start && this.end)
-            this.emit();
+            return `${fmt(this.start)} – ${fmt(this.end)}`;
+        if (this.start)
+            return fmt(this.start);
+        return '';
     }
-    onEndChange(e) {
-        this.end = e.target.value;
-        this.activeRange = -1;
-        this.checkRange();
-        if (this.start && this.end)
-            this.emit();
+    toggleOpen() {
+        if (this.disabled)
+            return;
+        if (!this.open && this.start) {
+            const d = new Date(this.start);
+            this.viewYear = d.getFullYear();
+            this.viewMonth = d.getMonth();
+        }
+        this.viewMode = 'day';
+        this.open = !this.open;
+    }
+    get decadeStart() {
+        return Math.floor(this.viewYear / 10) * 10;
+    }
+    get navTitle() {
+        if (this.viewMode === 'day')
+            return `${MONTHS_ES[this.viewMonth]}  ${this.viewYear}`;
+        if (this.viewMode === 'month')
+            return `${this.viewYear}`;
+        return `${this.decadeStart}-${this.decadeStart + 9}`;
+    }
+    cycleView() {
+        if (this.viewMode === 'day')
+            this.viewMode = 'month';
+        else if (this.viewMode === 'month')
+            this.viewMode = 'year';
+    }
+    prevNav() {
+        if (this.viewMode === 'day') {
+            if (this.viewMonth === 0) {
+                this.viewMonth = 11;
+                this.viewYear--;
+            }
+            else
+                this.viewMonth--;
+        }
+        else if (this.viewMode === 'month') {
+            this.viewYear--;
+        }
+        else {
+            this.viewYear = this.decadeStart - 10;
+        }
     }
-    checkRange() {
-        if (this.start && this.end && this.maxDaysRange > 0) {
-            const diff = (new Date(this.end).getTime() - new Date(this.start).getTime()) / 86400000;
-            this.showWarning = diff > this.maxDaysRange;
+    nextNav() {
+        if (this.viewMode === 'day') {
+            if (this.viewMonth === 11) {
+                this.viewMonth = 0;
+                this.viewYear++;
+            }
+            else
+                this.viewMonth++;
+        }
+        else if (this.viewMode === 'month') {
+            this.viewYear++;
         }
         else {
+            this.viewYear = this.decadeStart + 10;
+        }
+    }
+    selectMonth(month) {
+        this.viewMonth = month;
+        this.viewMode = 'day';
+    }
+    selectYear(year) {
+        this.viewYear = year;
+        this.viewMode = 'month';
+    }
+    toISO(year, month, day) {
+        return `${year}-${String(month + 1).padStart(2, '0')}-${String(day).padStart(2, '0')}`;
+    }
+    isInRange(iso) {
+        const end = this.end || this.hoverDate;
+        if (!this.start || !end)
+            return false;
+        const [s, e] = this.start <= end ? [this.start, end] : [end, this.start];
+        return iso > s && iso < e;
+    }
+    selectDate(iso) {
+        if (!this.start || (this.start && this.end)) {
+            this.start = iso;
+            this.end = '';
+            this.activeRange = -1;
             this.showWarning = false;
         }
+        else {
+            if (iso < this.start) {
+                this.end = this.start;
+                this.start = iso;
+            }
+            else {
+                this.end = iso;
+            }
+            this.activeRange = -1;
+            if (this.maxDaysRange > 0) {
+                const diff = (new Date(this.end).getTime() - new Date(this.start).getTime()) / 86400000;
+                this.showWarning = diff > this.maxDaysRange;
+                if (this.showWarning)
+                    return;
+            }
+            this.open = false;
+            this.emit();
+        }
+    }
+    selectShortcut(idx) {
+        const s = this.shortcuts[idx];
+        this.start = s.start;
+        this.end = s.end;
+        this.activeRange = idx;
+        this.showWarning = false;
+        this.open = false;
+        this.emit();
     }
     emit() {
         this.startDateChange.emit(this.start);
         this.endDateChange.emit(this.end);
         this.dropiRangeChange.emit({ start: this.start, end: this.end });
     }
+    buildDays() {
+        const year = this.viewYear;
+        const month = this.viewMonth;
+        const firstDay = new Date(year, month, 1).getDay();
+        const daysInMonth = new Date(year, month + 1, 0).getDate();
+        const daysInPrevMonth = new Date(year, month, 0).getDate();
+        const cells = [];
+        for (let i = firstDay - 1; i >= 0; i--) {
+            const d = daysInPrevMonth - i;
+            const m = month === 0 ? 11 : month - 1;
+            const y = month === 0 ? year - 1 : year;
+            cells.push({ iso: this.toISO(y, m, d), day: d, currentMonth: false });
+        }
+        for (let d = 1; d <= daysInMonth; d++) {
+            cells.push({ iso: this.toISO(year, month, d), day: d, currentMonth: true });
+        }
+        const remaining = 42 - cells.length;
+        for (let d = 1; d <= remaining; d++) {
+            const m = month === 11 ? 0 : month + 1;
+            const y = month === 11 ? year + 1 : year;
+            cells.push({ iso: this.toISO(y, m, d), day: d, currentMonth: false });
+        }
+        return cells;
+    }
+    renderDayView(today) {
+        const days = this.buildDays();
+        return (h("div", { class: "dp-grid" }, DAYS_ES.map(d => h("div", { class: "dp-day-header" }, d)), days.map(({ iso, day, currentMonth }) => {
+            const isStart = iso === this.start;
+            const isEnd = iso === this.end;
+            const inRange = this.isInRange(iso);
+            const isToday = iso === today;
+            return (h("button", { class: {
+                    'dp-cell': true,
+                    'dp-cell--other-month': !currentMonth,
+                    'dp-cell--today': isToday && !isStart && !isEnd,
+                    'dp-cell--selected': isStart || isEnd,
+                    'dp-cell--range-start': isStart,
+                    'dp-cell--range-end': isEnd,
+                    'dp-cell--in-range': inRange,
+                }, type: "button", onClick: () => this.selectDate(iso), onMouseEnter: () => {
+                    if (this.start && !this.end)
+                        this.hoverDate = iso;
+                }, onMouseLeave: () => this.hoverDate = '' }, day));
+        })));
+    }
+    renderMonthView() {
+        const todayMonth = new Date().getMonth();
+        const todayYear = new Date().getFullYear();
+        return (h("div", { class: "dp-month-grid" }, MONTHS_SHORT.map((name, idx) => {
+            const isSelected = idx === this.viewMonth;
+            const isCurrent = idx === todayMonth && this.viewYear === todayYear;
+            return (h("button", { class: {
+                    'dp-month-cell': true,
+                    'dp-month-cell--selected': isSelected,
+                    'dp-month-cell--current': isCurrent && !isSelected,
+                }, type: "button", onClick: () => this.selectMonth(idx) }, name));
+        })));
+    }
+    renderYearView() {
+        const currentYear = new Date().getFullYear();
+        const start = this.decadeStart;
+        const years = Array.from({ length: 10 }, (_, i) => start + i);
+        return (h("div", { class: "dp-year-grid" }, years.map(year => {
+            const isSelected = year === this.viewYear;
+            const isCurrent = year === currentYear;
+            return (h("button", { class: {
+                    'dp-year-cell': true,
+                    'dp-year-cell--selected': isSelected,
+                    'dp-year-cell--current': isCurrent && !isSelected,
+                }, type: "button", onClick: () => this.selectYear(year) }, year));
+        })));
+    }
     render() {
-        if (this.loading) {
+        if (this.loading)
             return h("div", { class: "skeleton" });
-        }
-        return (h("div", { class: "date-picker-range" }, this.showLabel && h("div", { class: "label" }, "Rango de fechas"), h("div", { class: "inputs-row" }, h("div", { class: "input-group" }, h("label", { class: "input-label" }, "Desde"), h("input", { type: "date", class: "date-input", value: this.start, max: this.end || this.today, onChange: (e) => this.onStartChange(e) })), h("span", { class: "separator" }, "\u2014"), h("div", { class: "input-group" }, h("label", { class: "input-label" }, "Hasta"), h("input", { type: "date", class: "date-input", value: this.end, min: this.start, max: this.today, onChange: (e) => this.onEndChange(e) }))), h("div", { class: "shortcuts" }, this.shortcuts.map((s, i) => (h("button", { key: i, class: `shortcut-btn${this.activeRange === i ? ' active' : ''}`, onClick: () => this.selectShortcut(i) }, s.label)))), this.showWarning && (h("div", { class: "warning-box" }, h("span", { class: "warning-message" }, "Solo puedes filtrar en un rango m\u00E1ximo de ", this.maxDaysRange, " d\u00EDas.")))));
+        const today = this.today;
+        return (h("div", { class: "dpr-wrap" }, this.showLabel && h("label", { class: "dpr-label" }, "Rango de fechas"), h("button", { class: { 'dpr-trigger': true, 'dpr-trigger--disabled': this.disabled }, onClick: () => this.toggleOpen(), disabled: this.disabled, type: "button" }, h("dropi-icon", { name: "Calendar", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-400" }), h("span", { class: { 'dpr-trigger__value': true, 'dpr-trigger__placeholder': !this.displayValue } }, this.displayValue || this.placeholder)), this.open && (h("div", { class: "dpr-popup" }, h("div", { class: "dpr-calendar" }, h("div", { class: "dp-nav" }, h("button", { class: "dp-nav__btn", onClick: () => this.prevNav(), type: "button" }, h("dropi-icon", { name: "dropdown-left", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" })), h("button", { class: "dp-nav__title", onClick: () => this.cycleView(), type: "button" }, this.viewMode === 'day'
+            ? [h("span", null, MONTHS_ES[this.viewMonth]), h("span", null, this.viewYear)]
+            : h("span", null, this.navTitle)), h("button", { class: "dp-nav__btn", onClick: () => this.nextNav(), type: "button" }, h("dropi-icon", { name: "dropdown-right", iconWidth: "16px", iconHeight: "16px", color: "Gray-Gray-600" }))), this.viewMode === 'day' && this.renderDayView(today), this.viewMode === 'month' && this.renderMonthView(), this.viewMode === 'year' && this.renderYearView(), this.showWarning && (h("div", { class: "warning-box" }, h("span", { class: "warning-message" }, "Solo puedes filtrar en un rango m\u00E1ximo de ", this.maxDaysRange, " d\u00EDas.")))), h("div", { class: "dpr-divider" }), h("div", { class: "dpr-shortcuts" }, this.shortcuts.map((s, i) => (h("button", { key: i, class: { 'shortcut-btn': true, 'shortcut-btn--active': this.activeRange === i }, onClick: () => this.selectShortcut(i), type: "button" }, s.label))))))));
     }
     static get watchers() { return {
         "startDate": [{

package/dist/dropi-ui/dropi-date-picker-range.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"dropi-date-picker-range.entry.js","mappings":"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","names":[],"sources":["src/components/dropi-date-picker-range/dropi-date-picker-range.css?tag=dropi-date-picker-range&encapsulation=shadow","src/components/dropi-date-picker-range/dropi-date-picker-range.tsx"],"sourcesContent":[":host {\n display: block;\n width: 100%;\n max-width: 380px;\n}\n\n, ::before, ::after { box-sizing: border-box; }\n\n.date-picker-range {\n width: 100%;\n font-family: inherit;\n}\n\n.label {\n font-size: 11px;\n font-weight: var(--font-weight-medium);\n color: #7b8190;\n margin-bottom: 8px;\n}\n\n.inputs-row {\n display: flex;\n align-items: flex-end;\n gap: 8px;\n}\n\n.input-group {\n flex: 1;\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.input-label {\n font-size: var(--font-size-xs, 11px);\n color: var(--Gray-Gray-500, #69738c);\n font-weight: var(--font-weight-medium, 500);\n}\n\n.date-input {\n width: 100%;\n height: 40px;\n padding: 0 10px;\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: var(--Border-2, 8px);\n background: var(--Neutral-White, #ffffff);\n color: var(--Gray-Gray-600, #475066);\n font-size: 13px;\n font-family: inherit;\n outline: none;\n cursor: pointer;\n transition: border-color 0.15s ease;\n}\n\n.date-input:focus {\n border-color: var(--Primary-Primary-500, #f49a3d);\n}\n\n.separator {\n padding-bottom: 8px;\n color: var(--Gray-Gray-400, #858ea6);\n font-size: var(--font-size-m);\n}\n\n.shortcuts {\n display: flex;\n flex-direction: column;\n gap: 2px;\n margin-top: 10px;\n border-left: 1px solid var(--Gray-Gray-100, #e6eaf2);\n padding-left: 10px;\n}\n\n.shortcut-btn {\n background: transparent;\n border: none;\n padding: 4px 6px;\n font-size: 13px;\n font-family: inherit;\n color: var(--Gray-Gray-700, #32394d);\n cursor: pointer;\n text-align: left;\n border-radius: 5px;\n transition: background 0.1s ease;\n font-weight: var(--font-weight-regular);\n}\n\n.shortcut-btn:hover {\n background: var(--Gray-Gray-50, #f5f6f8);\n}\n\n.shortcut-btn.active {\n background: var(--Gray-Gray-50, #f5f6f8);\n font-weight: var(--font-weight-semibold);\n}\n\n.warning-box {\n margin-top: 8px;\n padding: 4px 8px;\n border: 1px solid var(--Warning-Warning-400);\n border-radius: 4px;\n background: var(--Warning-Warning-50);\n}\n\n.warning-message {\n color: #495057;\n font-size: var(--font-size-xxs);\n line-height: 16px;\n}\n\n@keyframes shimmer {\n 0% { background-position: -468px 0; }\n 100% { background-position: 468px 0; }\n}\n\n.skeleton {\n height: 40px;\n width: 100%;\n min-width: 180px;\n border-radius: 6px;\n animation: shimmer 1s linear infinite;\n background: linear-gradient(to right, #f5f6f8 8%, #e3e7ef 28%, #f5f6f8 77%);\n background-size: 800px 104px;\n}\n\n@media screen and (max-width: 480px) {\n .inputs-row {\n flex-direction: column;\n }\n\n .separator {\n display: none;\n }\n\n .shortcuts {\n flex-direction: row;\n flex-wrap: wrap;\n border-left: none;\n padding-left: 0;\n border-top: 1px solid var(--Gray-Gray-100, #e6eaf2);\n padding-top: 8px;\n }\n}\n","import { Component, Prop, Event, EventEmitter, State, Watch, h } from '@stencil/core';\n\nexport interface DateRange {\n start: string;\n end: string;\n}\n\n/\n @component dropi-date-picker-range\n * Date range picker with shortcut buttons (Today, Last 7/15/30/90 days).\n \n @example\n * <dropi-date-picker-range show-label></dropi-date-picker-range>\n /\n@Component({\n tag: 'dropi-date-picker-range',\n styleUrl: 'dropi-date-picker-range.css',\n shadow: true,\n})\nexport class DropiDatePickerRange {\n /* Start date (YYYY-MM-DD) /\n @Prop({ mutable: true }) startDate: string = '';\n /* End date (YYYY-MM-DD) /\n @Prop({ mutable: true }) endDate: string = '';\n /* Show \"Rango de fechas\" label /\n @Prop() showLabel: boolean = true;\n /* Input placeholder /\n @Prop() placeholder: string = '';\n /* Show loading skeleton /\n @Prop() loading: boolean = false;\n /* Max allowed range in days (0 = unlimited) /\n @Prop() maxDaysRange: number = 0;\n /* Hide \"Hoy\" shortcut /\n @Prop() hideTodayRangeShortcut: boolean = false;\n\n /* Emitted when start date changes /\n @Event() startDateChange: EventEmitter<string>;\n /* Emitted when end date changes /\n @Event() endDateChange: EventEmitter<string>;\n /* Emitted with full range when both dates are set */\n @Event() dropiRangeChange: EventEmitter<DateRange>;\n\n @State() private start: string = '';\n @State() private end: string = '';\n @State() private activeRange: number = -1;\n @State() private showWarning: boolean = false;\n\n @Watch('startDate')\n onStartPropChange(val: string) { this.start = val; }\n @Watch('endDate')\n onEndPropChange(val: string) { this.end = val; }\n\n componentWillLoad() {\n this.start = this.startDate;\n this.end = this.endDate;\n }\n\n private get today(): string {\n return new Date().toISOString().split('T')[0];\n }\n\n private daysAgo(n: number): string {\n const d = new Date();\n d.setDate(d.getDate() - n);\n return d.toISOString().split('T')[0];\n }\n\n private get shortcuts() {\n const all = [\n { label: 'Hoy', start: this.today, end: this.today },\n { label: 'Últimos 7 días', start: this.daysAgo(6), end: this.today },\n { label: 'Últimos 15 días',start: this.daysAgo(14),end: this.today },\n { label: 'Últimos 30 días',start: this.daysAgo(29),end: this.today },\n { label: 'Últimos 90 días',start: this.daysAgo(89),end: this.today },\n ];\n return this.hideTodayRangeShortcut ? all.slice(1) : all;\n }\n\n private selectShortcut(idx: number) {\n const s = this.shortcuts[idx];\n this.start = s.start;\n this.end = s.end;\n this.activeRange = idx;\n this.showWarning = false;\n this.emit();\n }\n\n private onStartChange(e: Event) {\n this.start = (e.target as HTMLInputElement).value;\n this.activeRange = -1;\n this.checkRange();\n if (this.start && this.end) this.emit();\n }\n\n private onEndChange(e: Event) {\n this.end = (e.target as HTMLInputElement).value;\n this.activeRange = -1;\n this.checkRange();\n if (this.start && this.end) this.emit();\n }\n\n private checkRange() {\n if (this.start && this.end && this.maxDaysRange > 0) {\n const diff = (new Date(this.end).getTime() - new Date(this.start).getTime()) / 86400000;\n this.showWarning = diff > this.maxDaysRange;\n } else {\n this.showWarning = false;\n }\n }\n\n private emit() {\n this.startDateChange.emit(this.start);\n this.endDateChange.emit(this.end);\n this.dropiRangeChange.emit({ start: this.start, end: this.end });\n }\n\n render() {\n if (this.loading) {\n return <div class=\"skeleton\" />;\n }\n\n return (\n <div class=\"date-picker-range\">\n {this.showLabel && <div class=\"label\">Rango de fechas</div>}\n\n <div class=\"inputs-row\">\n <div class=\"input-group\">\n <label class=\"input-label\">Desde</label>\n <input\n type=\"date\"\n class=\"date-input\"\n value={this.start}\n max={this.end \|\| this.today}\n onChange={(e) => this.onStartChange(e)}\n />\n </div>\n <span class=\"separator\">—</span>\n <div class=\"input-group\">\n <label class=\"input-label\">Hasta</label>\n <input\n type=\"date\"\n class=\"date-input\"\n value={this.end}\n min={this.start}\n max={this.today}\n onChange={(e) => this.onEndChange(e)}\n />\n </div>\n </div>\n\n <div class=\"shortcuts\">\n {this.shortcuts.map((s, i) => (\n <button\n key={i}\n class={`shortcut-btn${this.activeRange === i ? ' active' : ''}`}\n onClick={() => this.selectShortcut(i)}\n >\n {s.label}\n </button>\n ))}\n </div>\n\n {this.showWarning && (\n <div class=\"warning-box\">\n <span class=\"warning-message\">\n Solo puedes filtrar en un rango máximo de {this.maxDaysRange} días.\n </span>\n </div>\n )}\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"dropi-date-picker-range.entry.js","mappings":"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","names":[],"sources":["src/components/dropi-date-picker-range/dropi-date-picker-range.css?tag=dropi-date-picker-range&encapsulation=shadow","src/components/dropi-date-picker-range/dropi-date-picker-range.tsx"],"sourcesContent":[":host { display: block; width: 100%; position: relative; }\n, ::before, ::after { box-sizing: border-box; }\n\n/ Label /\n.dpr-label {\n display: block;\n font-size: var(--font-size-xs, 10px);\n font-weight: var(--font-weight-regular, 400);\n color: var(--Gray-Gray-600, #475066);\n margin-bottom: 8px;\n}\n\n/ Trigger /\n.dpr-trigger {\n width: 100%;\n height: 40px;\n display: flex;\n align-items: center;\n gap: var(--Size-2, 8px);\n padding: 0 var(--Size-3, 12px);\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: var(--Border-2, 8px);\n background: var(--Neutral-White, #ffffff);\n cursor: pointer;\n font-family: inherit;\n transition: border-color 0.2s;\n}\n.dpr-trigger:hover:not(:disabled) { border-color: var(--Info-Info-500, #50a5f1); }\n.dpr-trigger--disabled { background: var(--Gray-Gray-50, #f7f8fa); cursor: not-allowed; opacity: 0.6; }\n\n.dpr-trigger__value {\n flex: 1;\n text-align: left;\n font-size: var(--font-size-xs, 12px);\n color: var(--Gray-Gray-700, #32394d);\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n.dpr-trigger__placeholder { color: var(--Gray-Gray-400, #858ea6); }\n\n/ Popup /\n.dpr-popup {\n position: absolute;\n top: calc(100% + 8px);\n left: 0;\n display: flex;\n flex-direction: row;\n background: var(--Neutral-White, #ffffff);\n border: 1px solid var(--Gray-Gray-200, #c3c9d9);\n border-radius: var(--Border-3, 12px);\n box-shadow: 0 4px 16px rgba(0,0,0,0.08);\n z-index: 300;\n overflow: hidden;\n}\n\n/ Calendar section /\n.dpr-calendar {\n padding: var(--Size-4, 16px);\n width: 300px;\n flex-shrink: 0;\n}\n\n/ Vertical divider /\n.dpr-divider {\n width: 1px;\n background: var(--Gray-Gray-100, #e6eaf2);\n flex-shrink: 0;\n}\n\n/ Shortcuts section /\n.dpr-shortcuts {\n padding: var(--Size-4, 16px) var(--Size-3, 12px);\n display: flex;\n flex-direction: column;\n gap: 2px;\n min-width: 140px;\n}\n\n.shortcut-btn {\n background: transparent;\n border: 1px solid transparent;\n padding: 6px 10px;\n font-size: 13px;\n font-family: inherit;\n color: var(--Gray-Gray-700, #32394d);\n cursor: pointer;\n text-align: left;\n border-radius: 6px;\n transition: background 0.1s ease;\n font-weight: var(--font-weight-regular);\n white-space: nowrap;\n}\n.shortcut-btn:hover {\n background: var(--Gray-Gray-50, #f5f6f8);\n}\n.shortcut-btn--active {\n border-color: var(--Gray-Gray-200, #c3c9d9);\n font-weight: var(--font-weight-semibold);\n background: var(--Gray-Gray-50, #f5f6f8);\n}\n\n/ Warning /\n.warning-box {\n margin-top: 8px;\n padding: 4px 8px;\n border: 1px solid var(--Warning-Warning-400);\n border-radius: 4px;\n background: var(--Warning-Warning-50);\n}\n.warning-message {\n color: #495057;\n font-size: var(--font-size-xxs);\n line-height: 16px;\n}\n\n/ ── Calendar styles (copied from dropi-date-picker) ── /\n\n/ Month grid /\n.dp-month-grid {\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 8px;\n}\n.dp-month-cell {\n padding: 10px 4px;\n font-size: var(--font-size-s, 14px);\n font-family: inherit;\n font-weight: var(--font-weight-regular, 400);\n color: var(--Gray-Gray-700, #32394d);\n background: transparent;\n border: 1px solid transparent;\n border-radius: var(--Border-2, 8px);\n cursor: pointer;\n text-align: center;\n transition: background 0.15s, border-color 0.15s;\n}\n.dp-month-cell:hover { background: var(--Gray-Gray-50, #f7f8fa); }\n.dp-month-cell--selected { border-color: var(--Info-Info-500, #50a5f1); font-weight: var(--font-weight-semibold, 600); }\n.dp-month-cell--current { background: var(--Gray-Gray-100, #e6eaf2); }\n\n/ Year grid /\n.dp-year-grid {\n display: grid;\n grid-template-columns: repeat(2, 1fr);\n gap: 8px;\n}\n.dp-year-cell {\n padding: 10px 4px;\n font-size: var(--font-size-s, 14px);\n font-family: inherit;\n font-weight: var(--font-weight-regular, 400);\n color: var(--Gray-Gray-700, #32394d);\n background: transparent;\n border: 1px solid transparent;\n border-radius: var(--Border-2, 8px);\n cursor: pointer;\n text-align: center;\n transition: background 0.15s, border-color 0.15s;\n}\n.dp-year-cell:hover { background: var(--Gray-Gray-50, #f7f8fa); }\n.dp-year-cell--selected { border-color: var(--Info-Info-500, #50a5f1); font-weight: var(--font-weight-semibold, 600); }\n.dp-year-cell--current { background: var(--Gray-Gray-100, #e6eaf2); }\n\n.dp-nav {\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: var(--Size-4, 16px);\n padding-bottom: var(--Size-3, 12px);\n border-bottom: 1px solid var(--Gray-Gray-100, #e6eaf2);\n}\n.dp-nav__btn {\n background: none;\n border: none;\n padding: 0;\n cursor: pointer;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 32px;\n height: 32px;\n transition: background 0.15s;\n}\n.dp-nav__btn:hover { background: var(--Gray-Gray-50, #f7f8fa); }\n.dp-nav__title {\n background: none;\n border: none;\n font-size: var(--font-size-s, 14px);\n font-weight: var(--font-weight-bold, 700);\n color: var(--Gray-Gray-700, #32394d);\n display: flex;\n gap: 8px;\n cursor: pointer;\n padding: 4px 8px;\n border-radius: var(--Border-1, 4px);\n font-family: inherit;\n transition: background 0.15s;\n}\n.dp-nav__title:hover { background: var(--Gray-Gray-50, #f7f8fa); }\n\n.dp-grid {\n display: grid;\n grid-template-columns: repeat(7, 1fr);\n row-gap: 6px;\n column-gap: 2px;\n}\n.dp-day-header {\n font-size: var(--font-size-s, 14px);\n color: var(--Gray-Gray-700, #32394d);\n text-align: center;\n padding: 6px 0;\n font-weight: var(--font-weight-bold, 700);\n}\n\n.dp-cell {\n aspect-ratio: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: var(--font-size-xs, 12px);\n font-family: inherit;\n border: none;\n cursor: pointer;\n background: transparent;\n color: var(--Gray-Gray-600, #475066);\n width: 100%;\n position: relative;\n z-index: 1;\n padding: 0;\n}\n.dp-cell::after {\n content: \"\";\n position: absolute;\n top: 0; left: 0; right: 0; bottom: 0;\n border-radius: 50%;\n transition: background 0.15s;\n z-index: -1;\n background: transparent;\n}\n.dp-cell::before {\n content: \"\";\n position: absolute;\n top: 0; bottom: 0;\n z-index: -2;\n background: transparent;\n}\n\n.dp-cell:hover:not(:disabled)::after { background: var(--Gray-Gray-100, #e6eaf2); }\n.dp-cell--other-month { color: var(--Gray-Gray-300, #a0a9c0); }\n.dp-cell--today { font-weight: var(--font-weight-bold, 700); }\n.dp-cell--today::after { background: var(--Gray-Gray-100, #e6eaf2); }\n\n.dp-cell--selected { color: var(--Neutral-White, #ffffff); font-weight: var(--font-weight-bold, 700); }\n.dp-cell--selected::after { background: var(--Orange-orange-500, #f49a3d) !important; }\n\n.dp-cell--range-start, .dp-cell--range-end {\n color: var(--Neutral-White, #ffffff);\n font-weight: var(--font-weight-bold, 700);\n}\n.dp-cell--range-start::after, .dp-cell--range-end::after {\n background: var(--Orange-orange-500, #f49a3d) !important;\n}\n\n.dp-cell--in-range { color: var(--Orange-orange-500, #f49a3d); font-weight: var(--font-weight-bold, 700); }\n.dp-cell--in-range::before { left: -1px; right: -1px; background: var(--Orange-orange-50, #fef5ec); }\n.dp-cell--range-start::before { left: 50%; right: -1px; background: var(--Orange-orange-50, #fef5ec); }\n.dp-cell--range-end::before { left: -1px; right: 50%; background: var(--Orange-orange-50, #fef5ec); }\n.dp-cell--range-start.dp-cell--range-end::before { background: transparent; }\n.dp-cell--disabled { opacity: 0.35; cursor: not-allowed; }\n\n/ Skeleton /\n@keyframes shimmer {\n 0% { background-position: -468px 0; }\n 100% { background-position: 468px 0; }\n}\n.skeleton {\n height: 40px;\n width: 100%;\n border-radius: 8px;\n animation: shimmer 1s linear infinite;\n background: linear-gradient(to right, #f5f6f8 8%, #e3e7ef 28%, #f5f6f8 77%);\n background-size: 800px 104px;\n}\n","import { Component, Prop, Event, EventEmitter, State, Watch, h, Element, Listen } from '@stencil/core';\n\nexport interface DateRange {\n start: string;\n end: string;\n}\n\nconst MONTHS_ES = [\n 'Enero','Febrero','Marzo','Abril','Mayo','Junio',\n 'Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre',\n];\nconst MONTHS_SHORT = ['Ene','Feb','Mar','Abr','May','Jun','Jul','Ago','Sep','Oct','Nov','Dic'];\nconst DAYS_ES = ['Do','Lu','Ma','Mi','Ju','Vi','Sa'];\n\n/\n @component dropi-date-picker-range\n * Date range picker with calendar popup and shortcut panel.\n \n @example\n * <dropi-date-picker-range></dropi-date-picker-range>\n /\n@Component({\n tag: 'dropi-date-picker-range',\n styleUrl: 'dropi-date-picker-range.css',\n shadow: true,\n})\nexport class DropiDatePickerRange {\n /* Start date (YYYY-MM-DD) /\n @Prop({ mutable: true }) startDate: string = '';\n /* End date (YYYY-MM-DD) /\n @Prop({ mutable: true }) endDate: string = '';\n /* Show \"Rango de fechas\" label /\n @Prop() showLabel: boolean = true;\n /* Input placeholder /\n @Prop() placeholder: string = 'DD/MM/YYYY – DD/MM/YYYY';\n /* Show loading skeleton /\n @Prop() loading: boolean = false;\n /* Max allowed range in days (0 = unlimited) /\n @Prop() maxDaysRange: number = 0;\n /* Hide \"Hoy\" shortcut /\n @Prop() hideTodayRangeShortcut: boolean = false;\n /* Disabled state /\n @Prop() disabled: boolean = false;\n\n @Event() startDateChange: EventEmitter<string>;\n @Event() endDateChange: EventEmitter<string>;\n @Event() dropiRangeChange: EventEmitter<DateRange>;\n\n @State() private start: string = '';\n @State() private end: string = '';\n @State() private activeRange: number = -1;\n @State() private showWarning: boolean = false;\n @State() private open: boolean = false;\n @State() private viewYear: number = new Date().getFullYear();\n @State() private viewMonth: number = new Date().getMonth();\n @State() private hoverDate: string = '';\n @State() private viewMode: 'day' \| 'month' \| 'year' = 'day';\n\n @Element() el!: HTMLElement;\n\n @Watch('startDate')\n onStartPropChange(val: string) { this.start = val; }\n\n @Watch('endDate')\n onEndPropChange(val: string) { this.end = val; }\n\n @Listen('click', { target: 'document' })\n handleDocClick(e: MouseEvent) {\n if (this.open && !e.composedPath().includes(this.el)) {\n this.open = false;\n }\n }\n\n componentWillLoad() {\n this.start = this.startDate;\n this.end = this.endDate;\n }\n\n private get today(): string {\n return new Date().toISOString().split('T')[0];\n }\n\n private daysAgo(n: number): string {\n const d = new Date();\n d.setDate(d.getDate() - n);\n return d.toISOString().split('T')[0];\n }\n\n private get shortcuts() {\n const all = [\n { label: 'Hoy', start: this.today, end: this.today },\n { label: 'Últimos 7 días', start: this.daysAgo(6), end: this.today },\n { label: 'Últimos 15 días', start: this.daysAgo(14), end: this.today },\n { label: 'Últimos 30 días', start: this.daysAgo(29), end: this.today },\n { label: 'Últimos 90 días', start: this.daysAgo(89), end: this.today },\n ];\n return this.hideTodayRangeShortcut ? all.slice(1) : all;\n }\n\n private get displayValue(): string {\n const fmt = (s: string) => s.split('-').reverse().join('/');\n if (this.start && this.end) return `${fmt(this.start)} – ${fmt(this.end)}`;\n if (this.start) return fmt(this.start);\n return '';\n }\n\n private toggleOpen() {\n if (this.disabled) return;\n if (!this.open && this.start) {\n const d = new Date(this.start);\n this.viewYear = d.getFullYear();\n this.viewMonth = d.getMonth();\n }\n this.viewMode = 'day';\n this.open = !this.open;\n }\n\n private get decadeStart(): number {\n return Math.floor(this.viewYear / 10) 10;\n }\n\n private get navTitle(): string {\n if (this.viewMode === 'day') return `${MONTHS_ES[this.viewMonth]} ${this.viewYear}`;\n if (this.viewMode === 'month') return `${this.viewYear}`;\n return `${this.decadeStart}-${this.decadeStart + 9}`;\n }\n\n private cycleView() {\n if (this.viewMode === 'day') this.viewMode = 'month';\n else if (this.viewMode === 'month') this.viewMode = 'year';\n }\n\n private prevNav() {\n if (this.viewMode === 'day') {\n if (this.viewMonth === 0) { this.viewMonth = 11; this.viewYear--; }\n else this.viewMonth--;\n } else if (this.viewMode === 'month') {\n this.viewYear--;\n } else {\n this.viewYear = this.decadeStart - 10;\n }\n }\n\n private nextNav() {\n if (this.viewMode === 'day') {\n if (this.viewMonth === 11) { this.viewMonth = 0; this.viewYear++; }\n else this.viewMonth++;\n } else if (this.viewMode === 'month') {\n this.viewYear++;\n } else {\n this.viewYear = this.decadeStart + 10;\n }\n }\n\n private selectMonth(month: number) {\n this.viewMonth = month;\n this.viewMode = 'day';\n }\n\n private selectYear(year: number) {\n this.viewYear = year;\n this.viewMode = 'month';\n }\n\n private toISO(year: number, month: number, day: number): string {\n return `${year}-${String(month + 1).padStart(2, '0')}-${String(day).padStart(2, '0')}`;\n }\n\n private isInRange(iso: string): boolean {\n const end = this.end \|\| this.hoverDate;\n if (!this.start \|\| !end) return false;\n const [s, e] = this.start <= end ? [this.start, end] : [end, this.start];\n return iso > s && iso < e;\n }\n\n private selectDate(iso: string) {\n if (!this.start \|\| (this.start && this.end)) {\n this.start = iso;\n this.end = '';\n this.activeRange = -1;\n this.showWarning = false;\n } else {\n if (iso < this.start) {\n this.end = this.start;\n this.start = iso;\n } else {\n this.end = iso;\n }\n this.activeRange = -1;\n if (this.maxDaysRange > 0) {\n const diff = (new Date(this.end).getTime() - new Date(this.start).getTime()) / 86400000;\n this.showWarning = diff > this.maxDaysRange;\n if (this.showWarning) return;\n }\n this.open = false;\n this.emit();\n }\n }\n\n private selectShortcut(idx: number) {\n const s = this.shortcuts[idx];\n this.start = s.start;\n this.end = s.end;\n this.activeRange = idx;\n this.showWarning = false;\n this.open = false;\n this.emit();\n }\n\n private emit() {\n this.startDateChange.emit(this.start);\n this.endDateChange.emit(this.end);\n this.dropiRangeChange.emit({ start: this.start, end: this.end });\n }\n\n private buildDays(): Array<{ iso: string; day: number; currentMonth: boolean }> {\n const year = this.viewYear;\n const month = this.viewMonth;\n const firstDay = new Date(year, month, 1).getDay();\n const daysInMonth = new Date(year, month + 1, 0).getDate();\n const daysInPrevMonth = new Date(year, month, 0).getDate();\n const cells: Array<{ iso: string; day: number; currentMonth: boolean }> = [];\n\n for (let i = firstDay - 1; i >= 0; i--) {\n const d = daysInPrevMonth - i;\n const m = month === 0 ? 11 : month - 1;\n const y = month === 0 ? year - 1 : year;\n cells.push({ iso: this.toISO(y, m, d), day: d, currentMonth: false });\n }\n for (let d = 1; d <= daysInMonth; d++) {\n cells.push({ iso: this.toISO(year, month, d), day: d, currentMonth: true });\n }\n const remaining = 42 - cells.length;\n for (let d = 1; d <= remaining; d++) {\n const m = month === 11 ? 0 : month + 1;\n const y = month === 11 ? year + 1 : year;\n cells.push({ iso: this.toISO(y, m, d), day: d, currentMonth: false });\n }\n return cells;\n }\n\n private renderDayView(today: string) {\n const days = this.buildDays();\n return (\n <div class=\"dp-grid\">\n {DAYS_ES.map(d => <div class=\"dp-day-header\">{d}</div>)}\n {days.map(({ iso, day, currentMonth }) => {\n const isStart = iso === this.start;\n const isEnd = iso === this.end;\n const inRange = this.isInRange(iso);\n const isToday = iso === today;\n return (\n <button\n class={{\n 'dp-cell': true,\n 'dp-cell--other-month': !currentMonth,\n 'dp-cell--today': isToday && !isStart && !isEnd,\n 'dp-cell--selected': isStart \|\| isEnd,\n 'dp-cell--range-start': isStart,\n 'dp-cell--range-end': isEnd,\n 'dp-cell--in-range': inRange,\n }}\n type=\"button\"\n onClick={() => this.selectDate(iso)}\n onMouseEnter={() => { if (this.start && !this.end) this.hoverDate = iso; }}\n onMouseLeave={() => this.hoverDate = ''}\n >\n {day}\n </button>\n );\n })}\n </div>\n );\n }\n\n private renderMonthView() {\n const todayMonth = new Date().getMonth();\n const todayYear = new Date().getFullYear();\n return (\n <div class=\"dp-month-grid\">\n {MONTHS_SHORT.map((name, idx) => {\n const isSelected = idx === this.viewMonth;\n const isCurrent = idx === todayMonth && this.viewYear === todayYear;\n return (\n <button\n class={{\n 'dp-month-cell': true,\n 'dp-month-cell--selected': isSelected,\n 'dp-month-cell--current': isCurrent && !isSelected,\n }}\n type=\"button\"\n onClick={() => this.selectMonth(idx)}\n >\n {name}\n </button>\n );\n })}\n </div>\n );\n }\n\n private renderYearView() {\n const currentYear = new Date().getFullYear();\n const start = this.decadeStart;\n const years = Array.from({ length: 10 }, (_, i) => start + i);\n return (\n <div class=\"dp-year-grid\">\n {years.map(year => {\n const isSelected = year === this.viewYear;\n const isCurrent = year === currentYear;\n return (\n <button\n class={{\n 'dp-year-cell': true,\n 'dp-year-cell--selected': isSelected,\n 'dp-year-cell--current': isCurrent && !isSelected,\n }}\n type=\"button\"\n onClick={() => this.selectYear(year)}\n >\n {year}\n </button>\n );\n })}\n </div>\n );\n }\n\n render() {\n if (this.loading) return <div class=\"skeleton\" />;\n\n const today = this.today;\n\n return (\n <div class=\"dpr-wrap\">\n {this.showLabel && <label class=\"dpr-label\">Rango de fechas</label>}\n\n <button\n class={{ 'dpr-trigger': true, 'dpr-trigger--disabled': this.disabled }}\n onClick={() => this.toggleOpen()}\n disabled={this.disabled}\n type=\"button\"\n >\n <dropi-icon name=\"Calendar\" iconWidth=\"16px\" iconHeight=\"16px\" color=\"Gray-Gray-400\" />\n <span class={{ 'dpr-trigger__value': true, 'dpr-trigger__placeholder': !this.displayValue }}>\n {this.displayValue \|\| this.placeholder}\n </span>\n </button>\n\n {this.open && (\n <div class=\"dpr-popup\">\n\n {/* LEFT — Calendar /}\n <div class=\"dpr-calendar\">\n <div class=\"dp-nav\">\n <button class=\"dp-nav__btn\" onClick={() => this.prevNav()} type=\"button\">\n <dropi-icon name=\"dropdown-left\" iconWidth=\"16px\" iconHeight=\"16px\" color=\"Gray-Gray-600\" />\n </button>\n <button class=\"dp-nav__title\" onClick={() => this.cycleView()} type=\"button\">\n {this.viewMode === 'day'\n ? [<span>{MONTHS_ES[this.viewMonth]}</span>, <span>{this.viewYear}</span>]\n : <span>{this.navTitle}</span>\n }\n </button>\n <button class=\"dp-nav__btn\" onClick={() => this.nextNav()} type=\"button\">\n <dropi-icon name=\"dropdown-right\" iconWidth=\"16px\" iconHeight=\"16px\" color=\"Gray-Gray-600\" />\n </button>\n </div>\n\n {this.viewMode === 'day' && this.renderDayView(today)}\n {this.viewMode === 'month' && this.renderMonthView()}\n {this.viewMode === 'year' && this.renderYearView()}\n\n {this.showWarning && (\n <div class=\"warning-box\">\n <span class=\"warning-message\">\n Solo puedes filtrar en un rango máximo de {this.maxDaysRange} días.\n </span>\n </div>\n )}\n </div>\n\n {/ Divider /}\n <div class=\"dpr-divider\" />\n\n {/ RIGHT — Shortcuts */}\n <div class=\"dpr-shortcuts\">\n {this.shortcuts.map((s, i) => (\n <button\n key={i}\n class={{ 'shortcut-btn': true, 'shortcut-btn--active': this.activeRange === i }}\n onClick={() => this.selectShortcut(i)}\n type=\"button\"\n >\n {s.label}\n </button>\n ))}\n </div>\n\n </div>\n )}\n </div>\n );\n }\n}\n"],"version":3}