@designbasekorea/ui-wc 0.8.9 → 0.8.11

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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,24 @@
1
1
  # 변경 이력
2
2
 
3
+ ## 0.8.11 - 2026-09-16
4
+
5
+ ### 개선
6
+
7
+ - `db-time-picker` 드롭다운을 body 포털 기반으로 개선해 좁은 컬럼과 `overflow: hidden` 컨테이너에서도 잘리지 않도록 수정
8
+ - `dropdown-position`에 `auto`, `top-start`, `top-end` 추가 및 뷰포트 경계 자동 배치 지원
9
+ - TimePicker S/M/L 패널 폭과 휠 항목 크기 조정, 중앙 선택선 정렬 보정
10
+ - `db-toggle` Neutral 선택 상태를 다크 그레이 트랙으로 변경
11
+
12
+ ## 0.8.10 - 2026-09-15
13
+
14
+ ### 추가
15
+
16
+ - `db-ai-glow` (React `AiGlow`) — AI가 생각·작업·청취 중일 때 화면 테두리 안쪽으로 여러 색 그라데이션이 번지는 글로우 (iOS Siri·브라우저 에이전트 스타일)
17
+ - 기본은 뷰포트 전체 오버레이, `contained` 로 카드·섹션 안에만 표시
18
+ - `state`: `thinking`(기본) · `working` · `listening`, `variant`: `aurora` · `brand`, `size`: `s` · `m` · `l`
19
+ - `listening` 은 `audioStream`(마이크) 또는 `voice-level` 에 맞춰 두께·밝기가 출렁임
20
+ - `label` 로 켜질 때 스크린 리더 안내, `prefers-reduced-motion` 시 정지
21
+
3
22
  ## 0.8.9 - 2026-09-06
4
23
 
5
24
  ### 수정
@@ -0,0 +1,80 @@
1
+ import { AI_GLOW_STATES, AI_GLOW_VARIANTS, AI_GLOW_SIZES } from '@designbasekorea/ui-contracts';
2
+ import { DbElement } from '../core/base-element.js';
3
+
4
+ type GlowSize = (typeof AI_GLOW_SIZES)[number];
5
+ type GlowState = (typeof AI_GLOW_STATES)[number];
6
+ type GlowVariant = (typeof AI_GLOW_VARIANTS)[number];
7
+ /**
8
+ * AI 가 생각·작업·청취 중임을 알리는 테두리 글로우.
9
+ * iOS Siri·브라우저 에이전트처럼 가장자리 안쪽으로 여러 색 그라데이션이 번지며 흐른다.
10
+ * 콘텐츠 위에 떠 있지만 `pointer-events: none` 이라 조작을 막지 않는다.
11
+ *
12
+ * 기본은 뷰포트 전체(`position: fixed`). `contained` 를 주면 가장 가까운 positioned 조상 안에만
13
+ * 깔리고 모서리 둥글기도 부모를 따른다 — 부모에 `position: relative` 가 필요하다.
14
+ *
15
+ * `state="listening"` 은 음성 반응 모드다. `audioStream`(마이크 MediaStream) 또는
16
+ * `voice-level`(0–1) 을 넣으면 소리 크기에 맞춰 빛의 두께·밝기가 출렁인다.
17
+ * 둘 다 없으면 청취 중임을 알 수 있도록 말하는 듯한 잔잔한 움직임으로 대신한다.
18
+ *
19
+ * @example
20
+ * <db-ai-glow active></db-ai-glow>
21
+ *
22
+ * @example
23
+ * const glow = document.querySelector('db-ai-glow');
24
+ * glow.state = 'listening';
25
+ * glow.audioStream = await navigator.mediaDevices.getUserMedia({ audio: true });
26
+ * glow.active = true;
27
+ */
28
+ declare class DbAiGlow extends DbElement {
29
+ static get observedAttributes(): string[];
30
+ private status;
31
+ private readonly meter;
32
+ private inputStream;
33
+ private rafId;
34
+ private lastFrame;
35
+ private startedAt;
36
+ private level;
37
+ get active(): boolean;
38
+ set active(value: boolean);
39
+ get state(): GlowState;
40
+ set state(value: GlowState);
41
+ get variant(): GlowVariant;
42
+ set variant(value: GlowVariant);
43
+ get size(): GlowSize;
44
+ set size(value: GlowSize);
45
+ get contained(): boolean;
46
+ set contained(value: boolean);
47
+ /** 외부 분석기가 전달하는 정규화 음성 레벨(0–1). `listening` 상태에서만 쓰인다. */
48
+ get voiceLevel(): number;
49
+ set voiceLevel(value: number);
50
+ /** 켜질 때 스크린 리더에 알릴 문구(예: "AI가 화면을 제어하는 중"). 없으면 순수 장식이다. */
51
+ get label(): string;
52
+ set label(value: string);
53
+ /**
54
+ * 실제 마이크/통화 MediaStream. 음량만 분석하며 트랙을 stop() 하지 않는다.
55
+ * null 을 넣으면 분석만 해제한다.
56
+ */
57
+ get audioStream(): MediaStream | null;
58
+ set audioStream(stream: MediaStream | null);
59
+ connectedCallback(): void;
60
+ disconnectedCallback(): void;
61
+ attributeChangedCallback(name: string): void;
62
+ private onMotionChange;
63
+ /** 구조는 한 번만 만든다 (PERF-RECONCILE) */
64
+ private ensureStructure;
65
+ /** 소비자가 붙인 className 은 건드리지 않고 수식어만 교체한다 */
66
+ private syncClasses;
67
+ private syncStatus;
68
+ /** 음성 반응 루프는 청취 중 + 켜짐 + 모션 허용일 때만 돈다. 나머지 애니메이션은 전부 CSS 다. */
69
+ private syncLoop;
70
+ private stopLoop;
71
+ private frame;
72
+ private sampleLevel;
73
+ }
74
+ declare global {
75
+ interface HTMLElementTagNameMap {
76
+ 'db-ai-glow': DbAiGlow;
77
+ }
78
+ }
79
+
80
+ export { DbAiGlow };
@@ -0,0 +1 @@
1
+ import{DbElement as t}from"../core/base-element.js";import{VoiceMeter as e}from"../core/voice-meter.js";import{coerceToContract as s}from"../node_modules/@designbasekorea/ui-contracts/dist/primitives.js";import{AI_GLOW_STATES as i,AI_GLOW_VARIANTS as a,AI_GLOW_SIZES as n}from"../node_modules/@designbasekorea/ui-contracts/dist/components.js";const r="designbase-wc-ai-glow",o=["haze","glow","edge"];function clamp(t,e,s){return Math.min(s,Math.max(e,t))}class DbAiGlow extends t{constructor(){super(...arguments),this.status=null,this.meter=new e,this.inputStream=null,this.rafId=0,this.lastFrame=0,this.startedAt=0,this.level=0,this.onMotionChange=()=>this.syncLoop(),this.frame=t=>{this.rafId=requestAnimationFrame(this.frame);const e=this.lastFrame?Math.min(.1,(t-this.lastFrame)/1e3):1/60;this.lastFrame=t;const s=Math.pow(this.sampleLevel((t-this.startedAt)/1e3),1.6),i=s>this.level?18:6,a=this.level+(s-this.level)*(1-Math.exp(-i*e));Math.abs(a-this.level)<.001||(this.level=a,this.style.setProperty("--db-ai-glow-level",a.toFixed(3)))}}static get observedAttributes(){return["active","state","variant","size","contained","voice-level","label"]}get active(){return this.hasAttribute("active")&&"false"!==this.getAttribute("active")}set active(t){this.toggleAttribute("active",Boolean(t))}get state(){return s(this.getAttribute("state"),i,"thinking")}set state(t){this.setAttribute("state",t)}get variant(){return s(this.getAttribute("variant"),a,"aurora")}set variant(t){this.setAttribute("variant",t)}get size(){return s(this.getAttribute("size"),n,"m")}set size(t){this.setAttribute("size",t)}get contained(){return this.hasAttribute("contained")&&"false"!==this.getAttribute("contained")}set contained(t){this.toggleAttribute("contained",Boolean(t))}get voiceLevel(){const t=this.getAttribute("voice-level");if(null===t||""===t.trim())return 0;const e=Number(t);return Number.isFinite(e)?clamp(e,0,1):0}set voiceLevel(t){const e=Number(t);this.setAttribute("voice-level",String(clamp(Number.isFinite(e)?e:0,0,1)))}get label(){return this.getAttribute("label")??""}set label(t){t?this.setAttribute("label",t):this.removeAttribute("label")}get audioStream(){return this.inputStream}set audioStream(t){const e=t&&"function"==typeof t.getAudioTracks?t:null;e!==this.inputStream&&(this.inputStream=e,this.meter.disconnect(),this.syncLoop())}connectedCallback(){this.upgradeProperties(["active","state","variant","size","contained","voiceLevel","label","audioStream"]),this.ensureStructure(),this.syncClasses(),this.syncStatus(),"undefined"!=typeof window&&"function"==typeof window.matchMedia&&this.cleanups.listen(window.matchMedia("(prefers-reduced-motion: reduce)"),"change",this.onMotionChange),this.syncLoop()}disconnectedCallback(){this.stopLoop(),super.disconnectedCallback()}attributeChangedCallback(t){this.status&&(this.syncClasses(),"active"!==t&&"label"!==t||this.syncStatus(),"active"!==t&&"state"!==t||this.syncLoop())}ensureStructure(){if(this.status)return;for(const t of Array.from(this.children))(t.classList.contains(`${r}__layer`)||t.classList.contains(`${r}__status`))&&t.remove();const t=document.createDocumentFragment();for(const e of o){const s=document.createElement("span");s.className=`${r}__layer ${r}__layer--${e}`,s.setAttribute("aria-hidden","true");const i=document.createElement("span");i.className=`${r}__ring`,s.append(i),t.append(s)}const e=document.createElement("span");e.className=`${r}__status`,e.setAttribute("role","status"),t.append(e),this.status=e,this.append(t)}syncClasses(){const t=[`${r}--${this.state}`,`${r}--${this.variant}`,`${r}--${this.size}`,this.active?`${r}--active`:"",this.contained?`${r}--contained`:""].filter(Boolean);for(const e of Array.from(this.classList))e.startsWith(`${r}--`)&&!t.includes(e)&&this.classList.remove(e);this.classList.add(r,...t)}syncStatus(){this.status&&(this.status.textContent=this.active?this.label:"")}syncLoop(){this.isConnected&&this.active&&"listening"===this.state&&!function prefersReducedMotion(){return"undefined"!=typeof window&&"function"==typeof window.matchMedia&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}()?(this.inputStream&&!this.meter.connected&&this.meter.connect(this.inputStream),this.rafId||(this.startedAt=performance.now(),this.lastFrame=0,this.rafId=requestAnimationFrame(this.frame))):this.stopLoop()}stopLoop(){this.rafId&&cancelAnimationFrame(this.rafId),this.rafId=0,this.meter.disconnect(),this.level=0,this.style.removeProperty("--db-ai-glow-level")}sampleLevel(t){if(this.meter.connected)return this.meter.read();if(this.hasAttribute("voice-level"))return this.voiceLevel;const e=Math.pow(Math.max(0,Math.sin(4.6*t)),2.8),s=Math.pow(Math.max(0,Math.sin(.9*t+.7)),2);return clamp(.05+.06*(Math.sin(1.7*t+.6)+1)+e*s*.7,0,1)}}customElements.get("db-ai-glow")||customElements.define("db-ai-glow",DbAiGlow);export{DbAiGlow};
@@ -20,6 +20,8 @@ declare class DbTimePicker extends HTMLElement {
20
20
  private tempSeconds;
21
21
  private tempPeriod;
22
22
  private boundDocumentMouseDown;
23
+ private boundViewportChange;
24
+ private viewportChangeFrame;
23
25
  connectedCallback(): void;
24
26
  disconnectedCallback(): void;
25
27
  /** 열린 드롭다운은 Escape 로 닫히고 포커스는 트리거로 돌아간다 (A11Y-ESCAPE) */
@@ -34,6 +36,10 @@ declare class DbTimePicker extends HTMLElement {
34
36
  private get is12h();
35
37
  private get showSeconds();
36
38
  private get minuteStep();
39
+ private get normalizedSize();
40
+ private get dropdownPosition();
41
+ /** CSS wheel item 높이와 스크롤 계산을 같은 값으로 유지한다. */
42
+ private get itemHeight();
37
43
  get disabled(): boolean;
38
44
  set disabled(value: boolean);
39
45
  get readonly(): boolean;
@@ -52,6 +58,9 @@ declare class DbTimePicker extends HTMLElement {
52
58
  private closePicker;
53
59
  private toggleOpen;
54
60
  private handleDocumentMouseDown;
61
+ private handleViewportChange;
62
+ /** 드롭다운을 body에 고정해 overflow-hidden 컬럼에서도 잘리지 않게 한다. */
63
+ private positionDropdown;
55
64
  private createWheel;
56
65
  private renderSelector;
57
66
  private render;
@@ -1 +1 @@
1
- import{createDbIcon as t,getDbComponentIconSize as e}from"./db-icons.js";import"./db-button.js";import{TIME_PICKER_FORMATS as i,TIME_PICKER_SIZES as s}from"../node_modules/@designbasekorea/ui-contracts/dist/components.js";const n="designbase-wc-time-picker";class DbTimePicker extends HTMLElement{constructor(){super(...arguments),this.built=!1,this.isOpen=!1,this.hours=12,this.minutes=0,this.seconds=0,this.period="PM",this.inputText="",this.tempHours=12,this.tempMinutes=0,this.tempSeconds=0,this.tempPeriod="PM",this.boundDocumentMouseDown=t=>this.handleDocumentMouseDown(t),this.handleDocumentKeyDown=t=>{"Escape"===t.key&&this.isOpen&&(t.preventDefault(),this.closePicker(),this.inputEl?.focus())},this.boundDocumentKeyDown=t=>this.handleDocumentKeyDown(t)}static get observedAttributes(){return["value","default-value","type","format","minute-step","size","disabled","readonly","label","full-width","error","dropdown-position","open"]}connectedCallback(){this.built||this.build(),this.parseTimeString(this.getAttribute("value")??this.getAttribute("default-value")??"12:00"),this.syncInputText(),this.render(),document.addEventListener("mousedown",this.boundDocumentMouseDown),document.addEventListener("keydown",this.boundDocumentKeyDown)}disconnectedCallback(){document.removeEventListener("mousedown",this.boundDocumentMouseDown),document.removeEventListener("keydown",this.boundDocumentKeyDown)}attributeChangedCallback(t){if(this.built){if("value"===t){const t=this.getAttribute("value");t&&(this.parseTimeString(t),this.syncInputText())}if("open"===t)return this.isOpen=this.hasAttribute("open"),void this.render();this.render()}}get value(){return this.getAttribute("value")||""}set value(t){t?this.setAttribute("value",t):this.removeAttribute("value")}get format(){const t=this.getAttribute("format")||"24h";return i.includes(t)?t:"24h"}set format(t){this.setAttribute("format",t)}get type(){return"modal"===this.getAttribute("type")?"modal":"dropdown"}get is12h(){return"12h"===this.format||"12h-with-seconds"===this.format}get showSeconds(){return"12h-with-seconds"===this.format||"24h-with-seconds"===this.format}get minuteStep(){const t=Number(this.getAttribute("minute-step")||"1");return Number.isFinite(t)&&t>0?t:1}get disabled(){return this.hasAttribute("disabled")}set disabled(t){this.toggleAttribute("disabled",Boolean(t))}get readonly(){return this.hasAttribute("readonly")}set readonly(t){this.toggleAttribute("readonly",Boolean(t))}build(){this.built=!0,this.labelEl=document.createElement("label"),this.labelEl.className=`${n}__label`,this.triggerEl=document.createElement("div"),this.triggerEl.className=`${n}__trigger`;const t=document.createElement("button");t.type="button",t.className=`${n}__icon-display`,t.setAttribute("aria-label","시간 선택 열기"),t.addEventListener("click",()=>this.toggleOpen()),this.inputEl=document.createElement("input"),this.inputEl.type="text",this.inputEl.className=`${n}__input`,this.inputEl.setAttribute("aria-label","시간 입력"),this.inputEl.addEventListener("click",()=>this.openPicker()),this.inputEl.addEventListener("blur",()=>this.handleInputBlur()),this.inputEl.addEventListener("input",()=>{this.inputText=this.inputEl?.value||""});const e=document.createElement("button");e.type="button",e.className=`${n}__toggle`,e.setAttribute("aria-label","시간 선택 열기"),e.addEventListener("click",()=>this.toggleOpen()),this.triggerEl.append(t,this.inputEl,e),this.dropdownEl=document.createElement("div"),this.dropdownEl.className=`${n}__dropdown`,this.dropdownEl.setAttribute("role","dialog"),this.dropdownEl.setAttribute("aria-modal","false")}pad2(t){return String(t).padStart(2,"0")}to24Hour(t,e){return"AM"===e?12===t?0:t:12===t?12:t+12}formatTimeString(t,e,i,s){const n="AM"===(s||this.period)?"오전":"오후";return this.is12h?`${n} ${this.pad2(t)}:${this.pad2(e)}${this.showSeconds?`:${this.pad2(i)}`:""}`:`${this.pad2(t)}:${this.pad2(e)}${this.showSeconds?`:${this.pad2(i)}`:""}`}toValue24(t,e,i,s){const n=this.is12h?this.to24Hour(t,s||this.period):t;return`${this.pad2(n)}:${this.pad2(e)}${this.showSeconds?`:${this.pad2(i)}`:""}`}parseTimeString(t){const e=t.trim();if(this.is12h){const t=this.showSeconds?/^(오전|오후|AM|PM)?\s*(0?[1-9]|1[0-2]):([0-5]\d):([0-5]\d)\s*(AM|PM|오전|오후)?$/i:/^(오전|오후|AM|PM)?\s*(0?[1-9]|1[0-2]):([0-5]\d)\s*(AM|PM|오전|오후)?$/i,i=e.match(t);if(i){const t=i[1],e=this.showSeconds?i[5]:i[4],s=(t||e||"AM").toUpperCase();return this.hours=parseInt(i[2],10),this.minutes=parseInt(i[3],10),this.seconds=this.showSeconds?parseInt(i[4],10):0,void(this.period="오후"===s||"PM"===s?"PM":"AM")}}else{const t=this.showSeconds?/^([01]?\d|2[0-3]):([0-5]\d):([0-5]\d)$/:/^([01]?\d|2[0-3]):([0-5]\d)$/,i=e.match(t);i&&(this.hours=parseInt(i[1],10),this.minutes=parseInt(i[2],10),this.seconds=this.showSeconds?parseInt(i[3],10):0)}}syncInputText(){this.inputText=this.formatTimeString(this.hours,this.minutes,this.seconds),this.inputEl&&(this.inputEl.value=this.inputText)}emitChange(t){this.setAttribute("value",t),this.dispatchEvent(new CustomEvent("db-change",{detail:{value:t},bubbles:!0,composed:!0}))}handleTimeChange(t,e,i=this.seconds,s){this.hours=t,this.minutes=e,this.seconds=i,s&&(this.period=s);const n=this.formatTimeString(t,e,i,s);this.inputText=n,this.inputEl&&(this.inputEl.value=n),this.emitChange(this.toValue24(t,e,i,s))}handleInputBlur(){if(!this.inputEl)return;const t=this.inputText;this.parseTimeString(this.inputEl.value);this.formatTimeString(this.hours,this.minutes,this.seconds)!==t||this.inputEl.value.trim()?this.handleTimeChange(this.hours,this.minutes,this.seconds,this.period):this.syncInputText()}openPicker(){this.disabled||this.readonly||(this.isOpen=!0,"modal"===this.type&&(this.tempHours=this.hours,this.tempMinutes=this.minutes,this.tempSeconds=this.seconds,this.tempPeriod=this.period),this.render())}closePicker(){this.isOpen=!1,this.render()}toggleOpen(){this.isOpen?this.closePicker():this.openPicker()}handleDocumentMouseDown(t){this.isOpen&&(this.contains(t.target)||this.closePicker())}createWheel(t){const{label:e,items:i,value:s,onChange:o,formatter:r}=t,h=document.createElement("div");h.className=`${n}__wheel-container`;const d=document.createElement("div");d.className=`${n}__wheel-label`,d.textContent=e,h.appendChild(d);const a=document.createElement("div");a.className=`${n}__wheel-viewport`;const l=document.createElement("div");l.className=`${n}__wheel`,l.setAttribute("role","listbox"),l.setAttribute("aria-label",e);let u=null,c=!1,p=!1,m=0,b=0;const indexOfValue=t=>i.findIndex(e=>e===t),scrollToIndex=(t,e=!0)=>{const i=40*t;c=!0,l.scrollTo({top:i,behavior:e?"smooth":"auto"}),window.setTimeout(()=>{c=!1},150)},fmt=t=>r?r(t):"number"==typeof t?this.pad2(t):String(t);i.forEach(t=>{const e=document.createElement("div");e.className=[`${n}__wheel-item`,t===s&&`${n}__wheel-item--selected`].filter(Boolean).join(" "),e.setAttribute("role","option"),e.setAttribute("aria-selected",String(t===s)),e.textContent=fmt(t),e.addEventListener("click",()=>{const e=indexOfValue(t);scrollToIndex(e,!0),t!==s&&o(t)}),l.appendChild(e)});const handleScroll=()=>{c||(u&&window.clearTimeout(u),u=window.setTimeout(()=>{const t=l.scrollTop,e=Math.round(t/40),n=Math.max(0,Math.min(i.length-1,e)),r=i[n];scrollToIndex(n,!0),r!==s&&o(r)},120))};l.addEventListener("scroll",handleScroll,{passive:!0}),l.addEventListener("pointerdown",t=>{p=!0,m=t.clientY,b=l.scrollTop,l.setPointerCapture(t.pointerId),l.style.cursor="grabbing"}),l.addEventListener("pointermove",t=>{p&&(l.scrollTop=b-(t.clientY-m))});const endDrag=t=>{p&&(p=!1,l.releasePointerCapture(t.pointerId),l.style.cursor="grab",handleScroll())};l.addEventListener("pointerup",endDrag),l.addEventListener("pointercancel",endDrag);const E=indexOfValue(s);E>=0&&requestAnimationFrame(()=>scrollToIndex(E,!1));const g=document.createElement("div");g.className=`${n}__wheel-center-indicator`,g.setAttribute("aria-hidden","true");const v=document.createElement("div");v.className=`${n}__wheel-fade wheel-fade--top`,v.setAttribute("aria-hidden","true");const w=document.createElement("div");return w.className=`${n}__wheel-fade wheel-fade--bottom`,w.setAttribute("aria-hidden","true"),a.append(l,g,v,w),h.appendChild(a),h}renderSelector(e=!1){const i=document.createElement("div");i.className=`${n}__selector`;const s=document.createElement("div");s.className=`${n}__picker-wheels`;const o=this.is12h?Array.from({length:12},(t,e)=>e+1):Array.from({length:24},(t,e)=>e),r=Array.from({length:Math.floor(60/this.minuteStep)},(t,e)=>e*this.minuteStep),h=Array.from({length:60},(t,e)=>e),d=e?this.tempHours:this.hours,a=e?this.tempMinutes:this.minutes,l=e?this.tempSeconds:this.seconds,u=e?this.tempPeriod:this.period,onChange=(t,i,s,n)=>{if(e)return this.tempHours=t,this.tempMinutes=i,this.tempSeconds=s,void(this.tempPeriod=n);this.handleTimeChange(t,i,s,n)};if(s.appendChild(this.createWheel({label:"시간",items:o,value:d,onChange:t=>onChange(t,a,l,u)})),s.appendChild(this.createWheel({label:"분",items:r,value:r.includes(a)?a:r[0],onChange:t=>onChange(d,t,l,u)})),this.showSeconds&&s.appendChild(this.createWheel({label:"초",items:h,value:l,onChange:t=>onChange(d,a,t,u)})),this.is12h&&s.appendChild(this.createWheel({label:"오전/오후",items:["AM","PM"],value:u,onChange:t=>onChange(d,a,l,t),formatter:t=>"AM"===t?"오전":"오후"})),i.appendChild(s),e)return i;const c=document.createElement("div");c.className=`${n}__dropdown-actions`;const p=document.createElement("div");p.className=`${n}__preview`,p.setAttribute("aria-live","polite"),p.appendChild(t("clock",16));const m=document.createElement("div");m.className=`${n}__preview-time`,m.textContent=this.formatTimeString(d,a,l,u),p.appendChild(m);const b=document.createElement("db-button");return b.setAttribute("variant","primary"),b.setAttribute("size","m"),b.textContent="선택",b.addEventListener("click",()=>{this.handleTimeChange(d,a,l,u),this.closePicker()}),c.append(p,b),i.appendChild(c),i}render(){const i=s.includes(this.getAttribute("size")||"m")&&this.getAttribute("size")||"m",o=this.getAttribute("dropdown-position")||"bottom-start",r=e(i);if(this.className=[n,`${n}--${i}`,this.hasAttribute("full-width")&&`${n}--full-width`,this.disabled&&`${n}--disabled`,this.readonly&&`${n}--readonly`,this.isOpen&&`${n}--open`,this.hasAttribute("error")&&`${n}--error`].filter(Boolean).join(" "),this.inputEl?.setAttribute("aria-invalid",String(this.hasAttribute("error"))),this.replaceChildren(),!(this.labelEl&&this.triggerEl&&this.inputEl&&this.dropdownEl))return;const h=this.getAttribute("label")||"";this.labelEl.textContent=h,this.labelEl.hidden=!h,this.inputEl.value=this.inputText,this.inputEl.placeholder=this.is12h?this.showSeconds?"12:00:00 PM":"12:00 PM":this.showSeconds?"12:00:00":"12:00",this.inputEl.disabled=this.disabled,this.inputEl.readOnly=this.readonly;const d=this.triggerEl.querySelector(`.${n}__icon-display`);d&&(d.innerHTML="",d.appendChild(t("clock",r)),d.disabled=this.disabled);const a=this.triggerEl.querySelector(`.${n}__toggle`);if(a&&(a.innerHTML="",a.appendChild(t("chevron-down",r)),a.disabled=this.disabled),this.dropdownEl.className=[`${n}__dropdown`,`${n}__dropdown--${o}`].filter(Boolean).join(" "),this.dropdownEl.hidden=!this.isOpen,this.isOpen&&"dropdown"===this.type&&this.dropdownEl.replaceChildren(this.renderSelector(!1)),this.append(this.labelEl,this.triggerEl),this.isOpen&&"dropdown"===this.type&&this.appendChild(this.dropdownEl),this.isOpen&&"modal"===this.type){const t=document.createElement("db-modal");t.setAttribute("open","true"),t.setAttribute("title","시간 선택"),t.setAttribute("size","s"),t.addEventListener("db-close",()=>this.closePicker());const e=this.renderSelector(!0),i=document.createElement("div");i.className=`${n}__modal-footer`;const s=document.createElement("db-button");s.setAttribute("variant","secondary"),s.setAttribute("size","m"),s.textContent="취소",s.addEventListener("click",()=>this.closePicker());const o=document.createElement("db-button");o.setAttribute("variant","primary"),o.setAttribute("size","m"),o.textContent="적용",o.addEventListener("click",()=>{this.handleTimeChange(this.tempHours,this.tempMinutes,this.tempSeconds,this.tempPeriod),this.closePicker()}),i.append(s,o),t.append(e,i),this.appendChild(t)}}}customElements.get("db-time-picker")||customElements.define("db-time-picker",DbTimePicker);export{DbTimePicker};
1
+ import{createDbIcon as t,getDbComponentIconSize as e}from"./db-icons.js";import"./db-button.js";import{TIME_PICKER_FORMATS as i,TIME_PICKER_SIZES as s,TIME_PICKER_DROPDOWN_POSITIONS as n}from"../node_modules/@designbasekorea/ui-contracts/dist/components.js";import{coerceToContract as o}from"../node_modules/@designbasekorea/ui-contracts/dist/primitives.js";const r="designbase-wc-time-picker";class DbTimePicker extends HTMLElement{constructor(){super(...arguments),this.built=!1,this.isOpen=!1,this.hours=12,this.minutes=0,this.seconds=0,this.period="PM",this.inputText="",this.tempHours=12,this.tempMinutes=0,this.tempSeconds=0,this.tempPeriod="PM",this.boundDocumentMouseDown=t=>this.handleDocumentMouseDown(t),this.boundViewportChange=()=>this.handleViewportChange(),this.viewportChangeFrame=null,this.handleDocumentKeyDown=t=>{"Escape"===t.key&&this.isOpen&&(t.preventDefault(),this.closePicker(),this.inputEl?.focus())},this.boundDocumentKeyDown=t=>this.handleDocumentKeyDown(t)}static get observedAttributes(){return["value","default-value","type","format","minute-step","size","disabled","readonly","label","full-width","error","dropdown-position","open"]}connectedCallback(){this.built||this.build(),this.parseTimeString(this.getAttribute("value")??this.getAttribute("default-value")??"12:00"),this.syncInputText(),this.render(),document.addEventListener("mousedown",this.boundDocumentMouseDown),document.addEventListener("keydown",this.boundDocumentKeyDown),window.addEventListener("resize",this.boundViewportChange),window.addEventListener("scroll",this.boundViewportChange,{capture:!0,passive:!0})}disconnectedCallback(){document.removeEventListener("mousedown",this.boundDocumentMouseDown),document.removeEventListener("keydown",this.boundDocumentKeyDown),window.removeEventListener("resize",this.boundViewportChange),window.removeEventListener("scroll",this.boundViewportChange,{capture:!0}),null!==this.viewportChangeFrame&&cancelAnimationFrame(this.viewportChangeFrame),this.viewportChangeFrame=null,this.dropdownEl?.remove()}attributeChangedCallback(t){if(this.built){if("value"===t){const t=this.getAttribute("value");t&&(this.parseTimeString(t),this.syncInputText())}if("open"===t)return this.isOpen=this.hasAttribute("open"),void this.render();this.render()}}get value(){return this.getAttribute("value")||""}set value(t){t?this.setAttribute("value",t):this.removeAttribute("value")}get format(){const t=this.getAttribute("format")||"24h";return i.includes(t)?t:"24h"}set format(t){this.setAttribute("format",t)}get type(){return"modal"===this.getAttribute("type")?"modal":"dropdown"}get is12h(){return"12h"===this.format||"12h-with-seconds"===this.format}get showSeconds(){return"12h-with-seconds"===this.format||"24h-with-seconds"===this.format}get minuteStep(){const t=Number(this.getAttribute("minute-step")||"1");return Number.isFinite(t)&&t>0?t:1}get normalizedSize(){return o(this.getAttribute("size"),s,"m")}get dropdownPosition(){return o(this.getAttribute("dropdown-position"),n,"auto")}get itemHeight(){return"s"===this.normalizedSize?32:"l"===this.normalizedSize?40:28}get disabled(){return this.hasAttribute("disabled")}set disabled(t){this.toggleAttribute("disabled",Boolean(t))}get readonly(){return this.hasAttribute("readonly")}set readonly(t){this.toggleAttribute("readonly",Boolean(t))}build(){this.built=!0,this.labelEl=document.createElement("label"),this.labelEl.className=`${r}__label`,this.triggerEl=document.createElement("div"),this.triggerEl.className=`${r}__trigger`;const t=document.createElement("button");t.type="button",t.className=`${r}__icon-display`,t.setAttribute("aria-label","시간 선택 열기"),t.addEventListener("click",()=>this.toggleOpen()),this.inputEl=document.createElement("input"),this.inputEl.type="text",this.inputEl.className=`${r}__input`,this.inputEl.setAttribute("aria-label","시간 입력"),this.inputEl.addEventListener("click",()=>this.openPicker()),this.inputEl.addEventListener("blur",()=>this.handleInputBlur()),this.inputEl.addEventListener("input",()=>{this.inputText=this.inputEl?.value||""});const e=document.createElement("button");e.type="button",e.className=`${r}__toggle`,e.setAttribute("aria-label","시간 선택 열기"),e.addEventListener("click",()=>this.toggleOpen()),this.triggerEl.append(t,this.inputEl,e),this.dropdownEl=document.createElement("div"),this.dropdownEl.className=`${r}__dropdown`,this.dropdownEl.setAttribute("role","dialog"),this.dropdownEl.setAttribute("aria-modal","false")}pad2(t){return String(t).padStart(2,"0")}to24Hour(t,e){return"AM"===e?12===t?0:t:12===t?12:t+12}formatTimeString(t,e,i,s){const n="AM"===(s||this.period)?"오전":"오후";return this.is12h?`${n} ${this.pad2(t)}:${this.pad2(e)}${this.showSeconds?`:${this.pad2(i)}`:""}`:`${this.pad2(t)}:${this.pad2(e)}${this.showSeconds?`:${this.pad2(i)}`:""}`}toValue24(t,e,i,s){const n=this.is12h?this.to24Hour(t,s||this.period):t;return`${this.pad2(n)}:${this.pad2(e)}${this.showSeconds?`:${this.pad2(i)}`:""}`}parseTimeString(t){const e=t.trim();if(this.is12h){const t=this.showSeconds?/^(오전|오후|AM|PM)?\s*(0?[1-9]|1[0-2]):([0-5]\d):([0-5]\d)\s*(AM|PM|오전|오후)?$/i:/^(오전|오후|AM|PM)?\s*(0?[1-9]|1[0-2]):([0-5]\d)\s*(AM|PM|오전|오후)?$/i,i=e.match(t);if(i){const t=i[1],e=this.showSeconds?i[5]:i[4],s=(t||e||"AM").toUpperCase();return this.hours=parseInt(i[2],10),this.minutes=parseInt(i[3],10),this.seconds=this.showSeconds?parseInt(i[4],10):0,void(this.period="오후"===s||"PM"===s?"PM":"AM")}}else{const t=this.showSeconds?/^([01]?\d|2[0-3]):([0-5]\d):([0-5]\d)$/:/^([01]?\d|2[0-3]):([0-5]\d)$/,i=e.match(t);i&&(this.hours=parseInt(i[1],10),this.minutes=parseInt(i[2],10),this.seconds=this.showSeconds?parseInt(i[3],10):0)}}syncInputText(){this.inputText=this.formatTimeString(this.hours,this.minutes,this.seconds),this.inputEl&&(this.inputEl.value=this.inputText)}emitChange(t){this.setAttribute("value",t),this.dispatchEvent(new CustomEvent("db-change",{detail:{value:t},bubbles:!0,composed:!0}))}handleTimeChange(t,e,i=this.seconds,s){this.hours=t,this.minutes=e,this.seconds=i,s&&(this.period=s);const n=this.formatTimeString(t,e,i,s);this.inputText=n,this.inputEl&&(this.inputEl.value=n),this.emitChange(this.toValue24(t,e,i,s))}handleInputBlur(){if(!this.inputEl)return;const t=this.inputText;this.parseTimeString(this.inputEl.value);this.formatTimeString(this.hours,this.minutes,this.seconds)!==t||this.inputEl.value.trim()?this.handleTimeChange(this.hours,this.minutes,this.seconds,this.period):this.syncInputText()}openPicker(){this.disabled||this.readonly||(this.isOpen=!0,"modal"===this.type&&(this.tempHours=this.hours,this.tempMinutes=this.minutes,this.tempSeconds=this.seconds,this.tempPeriod=this.period),this.render())}closePicker(){this.isOpen=!1,this.render()}toggleOpen(){this.isOpen?this.closePicker():this.openPicker()}handleDocumentMouseDown(t){if(!this.isOpen)return;const e=t.target;this.contains(e)||this.dropdownEl?.contains(e)||this.closePicker()}handleViewportChange(){this.isOpen&&"dropdown"===this.type&&null===this.viewportChangeFrame&&(this.viewportChangeFrame=requestAnimationFrame(()=>{this.viewportChangeFrame=null,this.isOpen&&"dropdown"===this.type&&this.positionDropdown()}))}positionDropdown(){if(!this.isOpen||"dropdown"!==this.type||!this.triggerEl||!this.dropdownEl||this.dropdownEl.hidden)return;const t=this.dropdownEl,e=this.triggerEl.getBoundingClientRect();t.style.width="";const i=t.getBoundingClientRect(),s=Math.max(0,window.innerWidth-16),n=Math.min(i.width,s);t.style.width=`${Math.round(n)}px`;const o=this.dropdownPosition,r=e.bottom+4+i.height<=window.innerHeight-8,h=e.top-4-i.height>=8,d="auto"===o?r||!h?"bottom":"top":o.startsWith("top")?"top":"bottom",a="auto"===o?e.left+n>window.innerWidth-8?"end":"start":o.endsWith("end")?"end":"start",l="end"===a?e.right-n:e.left,u=Math.max(8,Math.min(l,window.innerWidth-n-8)),p="top"===d?e.top-i.height-4:e.bottom+4,c=Math.max(8,Math.min(p,window.innerHeight-i.height-8));t.style.left=`${Math.round(u)}px`,t.style.top=`${Math.round(c)}px`,t.dataset.placement=`${d}-${a}`}createWheel(t){const{label:e,items:i,value:s,onChange:n,formatter:o}=t,h=document.createElement("div");h.className=`${r}__wheel-container`;const d=document.createElement("div");d.className=`${r}__wheel-label`,d.textContent=e,h.appendChild(d);const a=document.createElement("div");a.className=`${r}__wheel-viewport`;const l=document.createElement("div");l.className=`${r}__wheel`,l.setAttribute("role","listbox"),l.setAttribute("aria-label",e);let u=null,p=!1,c=!1,m=0,b=0;const indexOfValue=t=>i.findIndex(e=>e===t),scrollToIndex=(t,e=!0)=>{const i=t*this.itemHeight;p=!0,l.scrollTo({top:i,behavior:e?"smooth":"auto"}),window.setTimeout(()=>{p=!1},150)},fmt=t=>o?o(t):"number"==typeof t?this.pad2(t):String(t);i.forEach(t=>{const e=document.createElement("div");e.className=[`${r}__wheel-item`,t===s&&`${r}__wheel-item--selected`].filter(Boolean).join(" "),e.setAttribute("role","option"),e.setAttribute("aria-selected",String(t===s)),e.textContent=fmt(t),e.addEventListener("click",()=>{const e=indexOfValue(t);scrollToIndex(e,!0),t!==s&&n(t)}),l.appendChild(e)});const handleScroll=()=>{p||(u&&window.clearTimeout(u),u=window.setTimeout(()=>{const t=l.scrollTop,e=Math.round(t/this.itemHeight),o=Math.max(0,Math.min(i.length-1,e)),r=i[o];scrollToIndex(o,!0),r!==s&&n(r)},120))};l.addEventListener("scroll",handleScroll,{passive:!0}),l.addEventListener("pointerdown",t=>{c=!0,m=t.clientY,b=l.scrollTop,l.setPointerCapture(t.pointerId),l.style.cursor="grabbing"}),l.addEventListener("pointermove",t=>{c&&(l.scrollTop=b-(t.clientY-m))});const endDrag=t=>{c&&(c=!1,l.releasePointerCapture(t.pointerId),l.style.cursor="grab",handleScroll())};l.addEventListener("pointerup",endDrag),l.addEventListener("pointercancel",endDrag);const w=indexOfValue(s);w>=0&&requestAnimationFrame(()=>scrollToIndex(w,!1));const g=document.createElement("div");g.className=`${r}__wheel-center-indicator`,g.setAttribute("aria-hidden","true");const E=document.createElement("div");E.className=`${r}__wheel-fade wheel-fade--top`,E.setAttribute("aria-hidden","true");const v=document.createElement("div");return v.className=`${r}__wheel-fade wheel-fade--bottom`,v.setAttribute("aria-hidden","true"),a.append(l,g,E,v),h.appendChild(a),h}renderSelector(e=!1){const i=document.createElement("div");i.className=`${r}__selector`;const s=document.createElement("div");s.className=`${r}__picker-wheels`;const n=this.is12h?Array.from({length:12},(t,e)=>e+1):Array.from({length:24},(t,e)=>e),o=Array.from({length:Math.floor(60/this.minuteStep)},(t,e)=>e*this.minuteStep),h=Array.from({length:60},(t,e)=>e),d=e?this.tempHours:this.hours,a=e?this.tempMinutes:this.minutes,l=e?this.tempSeconds:this.seconds,u=e?this.tempPeriod:this.period,onChange=(t,i,s,n)=>{if(e)return this.tempHours=t,this.tempMinutes=i,this.tempSeconds=s,void(this.tempPeriod=n);this.handleTimeChange(t,i,s,n)};if(s.appendChild(this.createWheel({label:"시간",items:n,value:d,onChange:t=>onChange(t,a,l,u)})),s.appendChild(this.createWheel({label:"분",items:o,value:o.includes(a)?a:o[0],onChange:t=>onChange(d,t,l,u)})),this.showSeconds&&s.appendChild(this.createWheel({label:"초",items:h,value:l,onChange:t=>onChange(d,a,t,u)})),this.is12h&&s.appendChild(this.createWheel({label:"오전/오후",items:["AM","PM"],value:u,onChange:t=>onChange(d,a,l,t),formatter:t=>"AM"===t?"오전":"오후"})),i.appendChild(s),e)return i;const p=document.createElement("div");p.className=`${r}__dropdown-actions`;const c=document.createElement("div");c.className=`${r}__preview`,c.setAttribute("aria-live","polite"),c.appendChild(t("clock",16));const m=document.createElement("div");m.className=`${r}__preview-time`,m.textContent=this.formatTimeString(d,a,l,u),c.appendChild(m);const b=document.createElement("db-button");return b.setAttribute("variant","primary"),b.setAttribute("size","m"),b.textContent="선택",b.addEventListener("click",()=>{this.handleTimeChange(d,a,l,u),this.closePicker()}),p.append(c,b),i.appendChild(p),i}render(){const i=this.normalizedSize,s=this.dropdownPosition,n=e(i);if(this.className=[r,`${r}--${i}`,this.hasAttribute("full-width")&&`${r}--full-width`,this.disabled&&`${r}--disabled`,this.readonly&&`${r}--readonly`,this.isOpen&&`${r}--open`,this.hasAttribute("error")&&`${r}--error`].filter(Boolean).join(" "),this.inputEl?.setAttribute("aria-invalid",String(this.hasAttribute("error"))),this.dropdownEl?.parentElement===document.body&&this.dropdownEl.remove(),this.replaceChildren(),!(this.labelEl&&this.triggerEl&&this.inputEl&&this.dropdownEl))return;const o=this.getAttribute("label")||"";this.labelEl.textContent=o,this.labelEl.hidden=!o,this.inputEl.value=this.inputText,this.inputEl.placeholder=this.is12h?this.showSeconds?"12:00:00 PM":"12:00 PM":this.showSeconds?"12:00:00":"12:00",this.inputEl.disabled=this.disabled,this.inputEl.readOnly=this.readonly;const h=this.triggerEl.querySelector(`.${r}__icon-display`);h&&(h.innerHTML="",h.appendChild(t("clock",n)),h.disabled=this.disabled);const d=this.triggerEl.querySelector(`.${r}__toggle`);if(d&&(d.innerHTML="",d.appendChild(t("chevron-down",n)),d.disabled=this.disabled),this.dropdownEl.className=[`${r}__dropdown`,`${r}__dropdown--${i}`,`${r}__dropdown--${s}`].filter(Boolean).join(" "),this.dropdownEl.setAttribute("aria-label","시간 선택"),this.dropdownEl.hidden=!this.isOpen,this.isOpen&&"dropdown"===this.type&&(this.dropdownEl.replaceChildren(this.renderSelector(!1)),document.body.appendChild(this.dropdownEl),this.dropdownEl.hidden=!1,this.positionDropdown(),requestAnimationFrame(()=>this.positionDropdown())),this.append(this.labelEl,this.triggerEl),this.isOpen&&"modal"===this.type){const t=document.createElement("db-modal");t.setAttribute("open","true"),t.setAttribute("title","시간 선택"),t.setAttribute("size","s"),t.addEventListener("db-close",()=>this.closePicker());const e=this.renderSelector(!0),i=document.createElement("div");i.className=`${r}__modal-footer`;const s=document.createElement("db-button");s.setAttribute("variant","secondary"),s.setAttribute("size","m"),s.textContent="취소",s.addEventListener("click",()=>this.closePicker());const n=document.createElement("db-button");n.setAttribute("variant","primary"),n.setAttribute("size","m"),n.textContent="적용",n.addEventListener("click",()=>{this.handleTimeChange(this.tempHours,this.tempMinutes,this.tempSeconds,this.tempPeriod),this.closePicker()}),i.append(s,n),t.append(e,i),this.appendChild(t)}}}customElements.get("db-time-picker")||customElements.define("db-time-picker",DbTimePicker);export{DbTimePicker};
@@ -17,6 +17,8 @@ declare class DbToggle extends HTMLElement {
17
17
  set readOnly(value: boolean);
18
18
  get size(): string;
19
19
  set size(value: string);
20
+ get variant(): string;
21
+ set variant(value: string);
20
22
  connectedCallback(): void;
21
23
  attributeChangedCallback(): void;
22
24
  formResetCallback(): void;
@@ -1 +1 @@
1
- import{TOGGLE_SIZES as t}from"../node_modules/@designbasekorea/ui-contracts/dist/components.js";class DbToggle extends HTMLElement{constructor(){super(...arguments),this.internals=this.attachInternals(),this.built=!1,this.userInteracted=!1,this.handleClick=()=>{if(this.disabled||this.readOnly)return;const t=!this.checked;this.userInteracted=!0,this.toggleAttribute("checked",t),this.syncFormValue(),this.syncState(),this.dispatchEvent(new Event("change",{bubbles:!0})),this.dispatchEvent(new CustomEvent("db-change",{detail:{checked:t,selected:t},bubbles:!0,composed:!0}))}}static get observedAttributes(){return["checked","selected","default-checked","default-selected","size","disabled","readonly","has-label","name","value"]}get checked(){return!(!this.hasAttribute("checked")&&!this.hasAttribute("selected"))||!this.userInteracted&&(this.hasAttribute("default-checked")||this.hasAttribute("default-selected"))}set checked(t){this.toggleAttribute("checked",t),this.syncFormValue(),this.syncClasses()}get name(){return this.getAttribute("name")??""}set name(t){this.setAttribute("name",t)}get disabled(){return this.hasAttribute("disabled")}set disabled(t){this.toggleAttribute("disabled",t),this.root&&(this.root.disabled=t),this.syncClasses()}get readOnly(){return this.hasAttribute("readonly")}set readOnly(t){this.toggleAttribute("readonly",t),this.syncClasses()}get size(){return this.getAttribute("size")||"m"}set size(t){this.setAttribute("size",t)}connectedCallback(){this.style.display="contents",this.built||this.build(),this.syncState()}attributeChangedCallback(){this.built&&this.syncState()}formResetCallback(){this.userInteracted=!1;const t=this.hasAttribute("default-checked")||this.hasAttribute("default-selected");this.toggleAttribute("checked",t),this.syncFormValue(),this.syncState()}formDisabledCallback(t){this.toggleAttribute("disabled",t),this.root&&(this.root.disabled=t),this.syncClasses()}get hasLabel(){return!this.hasAttribute("has-label")||"false"!==this.getAttribute("has-label")}syncFormValue(){const t=this.hasAttribute("checked")||this.hasAttribute("selected");this.internals.setFormValue(t?this.getAttribute("value")||"on":null)}build(){this.root=document.createElement("button"),this.root.type="button",this.root.className="designbase-wc-toggle";const t=document.createElement("span");t.className="designbase-wc-toggle__track",t.setAttribute("aria-hidden","true");const e=document.createElement("span");for(e.className="designbase-wc-toggle__thumb",t.appendChild(e),this.labelEl=document.createElement("span"),this.labelEl.className="designbase-wc-toggle__label";this.firstChild;)this.labelEl.appendChild(this.firstChild);this.root.append(t,this.labelEl),this.appendChild(this.root),this.root.addEventListener("click",this.handleClick),this.built=!0}syncState(){this.root&&(this.root.disabled=this.disabled,this.root.setAttribute("role","switch"),this.root.setAttribute("aria-checked",String(this.checked)),this.readOnly?this.root.setAttribute("aria-readonly","true"):this.root.removeAttribute("aria-readonly"),this.syncFormValue(),this.hasLabel?this.labelEl?.removeAttribute("hidden"):this.labelEl?.setAttribute("hidden",""),this.syncClasses())}syncClasses(){if(!this.root)return;const e=t.includes(this.size)?this.size:"m",s=this.hasLabel&&Boolean(this.labelEl?.textContent?.trim()),i=this.checked;this.root.className=["designbase-wc-toggle",`designbase-wc-toggle--${e}`,i&&"designbase-wc-toggle--selected",this.disabled&&"designbase-wc-toggle--disabled",this.readOnly&&"designbase-wc-toggle--readonly",!s&&"designbase-wc-toggle--no-label"].filter(Boolean).join(" "),this.root.setAttribute("aria-pressed",String(i))}}DbToggle.formAssociated=!0,customElements.get("db-toggle")||customElements.define("db-toggle",DbToggle);export{DbToggle};
1
+ import{coerceToContract as t}from"../node_modules/@designbasekorea/ui-contracts/dist/primitives.js";import{TOGGLE_VARIANTS as e,TOGGLE_SIZES as s}from"../node_modules/@designbasekorea/ui-contracts/dist/components.js";class DbToggle extends HTMLElement{constructor(){super(...arguments),this.internals=this.attachInternals(),this.built=!1,this.userInteracted=!1,this.handleClick=()=>{if(this.disabled||this.readOnly)return;const t=!this.checked;this.userInteracted=!0,this.toggleAttribute("checked",t),this.syncFormValue(),this.syncState(),this.dispatchEvent(new Event("change",{bubbles:!0})),this.dispatchEvent(new CustomEvent("db-change",{detail:{checked:t,selected:t},bubbles:!0,composed:!0}))}}static get observedAttributes(){return["checked","selected","default-checked","default-selected","size","variant","disabled","readonly","has-label","name","value"]}get checked(){return!(!this.hasAttribute("checked")&&!this.hasAttribute("selected"))||!this.userInteracted&&(this.hasAttribute("default-checked")||this.hasAttribute("default-selected"))}set checked(t){this.toggleAttribute("checked",t),this.syncFormValue(),this.syncClasses()}get name(){return this.getAttribute("name")??""}set name(t){this.setAttribute("name",t)}get disabled(){return this.hasAttribute("disabled")}set disabled(t){this.toggleAttribute("disabled",t),this.root&&(this.root.disabled=t),this.syncClasses()}get readOnly(){return this.hasAttribute("readonly")}set readOnly(t){this.toggleAttribute("readonly",t),this.syncClasses()}get size(){return this.getAttribute("size")||"m"}set size(t){this.setAttribute("size",t)}get variant(){return t(this.getAttribute("variant"),e,"default")}set variant(t){this.setAttribute("variant",t)}connectedCallback(){this.style.display="contents",this.built||this.build(),this.syncState()}attributeChangedCallback(){this.built&&this.syncState()}formResetCallback(){this.userInteracted=!1;const t=this.hasAttribute("default-checked")||this.hasAttribute("default-selected");this.toggleAttribute("checked",t),this.syncFormValue(),this.syncState()}formDisabledCallback(t){this.toggleAttribute("disabled",t),this.root&&(this.root.disabled=t),this.syncClasses()}get hasLabel(){return!this.hasAttribute("has-label")||"false"!==this.getAttribute("has-label")}syncFormValue(){const t=this.hasAttribute("checked")||this.hasAttribute("selected");this.internals.setFormValue(t?this.getAttribute("value")||"on":null)}build(){this.root=document.createElement("button"),this.root.type="button",this.root.className="designbase-wc-toggle";const t=document.createElement("span");t.className="designbase-wc-toggle__track",t.setAttribute("aria-hidden","true");const e=document.createElement("span");for(e.className="designbase-wc-toggle__thumb",t.appendChild(e),this.labelEl=document.createElement("span"),this.labelEl.className="designbase-wc-toggle__label";this.firstChild;)this.labelEl.appendChild(this.firstChild);this.root.append(t,this.labelEl),this.appendChild(this.root),this.root.addEventListener("click",this.handleClick),this.built=!0}syncState(){this.root&&(this.root.disabled=this.disabled,this.root.setAttribute("role","switch"),this.root.setAttribute("aria-checked",String(this.checked)),this.readOnly?this.root.setAttribute("aria-readonly","true"):this.root.removeAttribute("aria-readonly"),this.syncFormValue(),this.hasLabel?this.labelEl?.removeAttribute("hidden"):this.labelEl?.setAttribute("hidden",""),this.syncClasses())}syncClasses(){if(!this.root)return;const t=s.includes(this.size)?this.size:"m",e=this.hasLabel&&Boolean(this.labelEl?.textContent?.trim()),i=this.checked;this.root.className=["designbase-wc-toggle",`designbase-wc-toggle--${t}`,`designbase-wc-toggle--${this.variant}`,i&&"designbase-wc-toggle--selected",this.disabled&&"designbase-wc-toggle--disabled",this.readOnly&&"designbase-wc-toggle--readonly",!e&&"designbase-wc-toggle--no-label"].filter(Boolean).join(" "),this.root.setAttribute("aria-pressed",String(i))}}DbToggle.formAssociated=!0,customElements.get("db-toggle")||customElements.define("db-toggle",DbToggle);export{DbToggle};
@@ -0,0 +1 @@
1
+ class VoiceMeter{constructor(){this.context=null,this.source=null,this.analyser=null,this.data=null}get connected(){return null!==this.analyser}connect(t){if(this.disconnect(),"undefined"==typeof window)return;const e=window.AudioContext??window.webkitAudioContext;if(e)try{const n=new e,s=n.createAnalyser();s.fftSize=512,s.smoothingTimeConstant=.58;const a=n.createMediaStreamSource(t);a.connect(s),this.context=n,this.source=a,this.analyser=s,this.data=new Float32Array(s.fftSize),"suspended"===n.state&&n.resume().catch(()=>{})}catch{this.disconnect()}}read(){if(!this.analyser||!this.data)return 0;this.analyser.getFloatTimeDomainData(this.data);let t=0;for(const e of this.data)t+=e*e;const e=Math.sqrt(t/this.data.length);return Math.min(1,Math.max(0,(e-.01)/.11))}disconnect(){try{this.source?.disconnect(),this.analyser?.disconnect()}catch{}this.context&&this.context.close().catch(()=>{}),this.context=null,this.source=null,this.analyser=null,this.data=null}}export{VoiceMeter};
@@ -124,6 +124,7 @@ export { DbOtpInput } from './components/db-otp-input.js';
124
124
  export { DbPhoneVerify } from './components/db-phone-verify.js';
125
125
  export { DbEmailVerify } from './components/db-email-verify.js';
126
126
  export { DbTwoFactor } from './components/db-two-factor.js';
127
+ export { DbAiGlow } from './components/db-ai-glow.js';
127
128
  export { DbChatOrb } from './components/db-chat-orb.js';
128
129
  export { DbChatWelcome } from './components/db-chat-welcome.js';
129
130
  export { DbChatAttachOption, DbChatComposer, DbChatTool } from './components/db-chat-composer.js';
package/dist/esm/index.js CHANGED
@@ -1 +1 @@
1
- export{dbUid,ensureId}from"./core/uid.js";export{CleanupBag,rafThrottle}from"./core/dom.js";export{createFocusTrap,getTabbables}from"./core/focus-trap.js";export{lockScroll,scrollLockDepth,unlockScroll}from"./core/scroll-lock.js";export{activateOnKey,announce,createSrOnly,politenessForTone,setAccessibleName}from"./core/a11y.js";export{dbResetLocale,dbSetLocale,labelFrom,t}from"./core/i18n.js";export{sanitizeHref}from"./core/safe-url.js";export{sanitizeHtmlFragment}from"./core/safe-html.js";export{DbElement}from"./core/base-element.js";export{DbButton}from"./components/db-button.js";export{DbInput}from"./components/db-input.js";export{DbCheckbox}from"./components/db-checkbox.js";export{DbToggle}from"./components/db-toggle.js";export{DbBadge}from"./components/db-badge.js";export{DbBanner}from"./components/db-banner.js";export{DbSpinner}from"./components/db-spinner.js";export{DbCard}from"./components/db-card.js";export{DbTabs}from"./components/db-tabs.js";export{DbModal}from"./components/db-modal.js";export{DbDropdown}from"./components/db-dropdown.js";export{DbTooltip}from"./components/db-tooltip.js";export{DbAccordion}from"./components/db-accordion.js";export{DbAvatar}from"./components/db-avatar.js";export{DbDivider}from"./components/db-divider.js";export{DbProgress}from"./components/db-progress.js";export{DbSelect}from"./components/db-select.js";export{DbTextarea}from"./components/db-textarea.js";export{DbRadio}from"./components/db-radio.js";export{DbPagination}from"./components/db-pagination.js";export{DbBreadcrumbs}from"./components/db-breadcrumbs.js";export{DbTable}from"./components/db-table.js";export{DbAlert}from"./components/db-alert.js";export{DbChip}from"./components/db-chip.js";export{DbSkeleton}from"./components/db-skeleton.js";export{DbLabel}from"./components/db-label.js";export{DbLogo}from"./components/db-logo.js";export{DbEmptyState}from"./components/db-empty-state.js";export{DbBackdrop}from"./components/db-backdrop.js";export{DbPopover}from"./components/db-popover.js";export{DbDrawer}from"./components/db-drawer.js";export{DbToast}from"./components/db-toast.js";export{DbConfirm}from"./components/db-confirm.js";export{DbIndicator}from"./components/db-indicator.js";export{DbList}from"./components/db-list.js";export{DbMenuItem}from"./components/db-menu-item.js";export{DbSearchBar}from"./components/db-search-bar.js";export{DbShare}from"./components/db-share.js";export{DbTopBanner}from"./components/db-top-banner.js";export{DbCookieBanner}from"./components/db-cookie-banner.js";export{DbStat}from"./components/db-stat.js";export{DbActivityHeatmap}from"./components/db-activity-heatmap.js";export{DbImage}from"./components/db-image.js";export{DbImagePlaceholder}from"./components/db-image-placeholder.js";export{DbImageList}from"./components/db-image-list.js";export{DbLightbox}from"./components/db-lightbox.js";export{DbBottomNavigation}from"./components/db-bottom-navigation.js";export{DbNavbar}from"./components/db-navbar.js";export{DbFooter}from"./components/db-footer.js";export{DbSidebar}from"./components/db-sidebar.js";export{DbContextMenu}from"./components/db-context-menu.js";export{DbProgressbar}from"./components/db-progressbar.js";export{DbProgressStep}from"./components/db-progress-step.js";export{DbRangeSlider}from"./components/db-range-slider.js";export{DbSegmentControl}from"./components/db-segment-control.js";export{DbStepper}from"./components/db-stepper.js";export{DbContainer}from"./components/db-container.js";export{DbStack}from"./components/db-stack.js";export{DbGrid,DbGridItem}from"./components/db-grid.js";export{DbToolbar}from"./components/db-toolbar.js";export{DbForm}from"./components/db-form.js";export{DbPageHeader}from"./components/db-page-header.js";export{DbSection}from"./components/db-section.js";export{DbFloatingActionButton}from"./components/db-floating-action-button.js";export{DbBottomSheet}from"./components/db-bottom-sheet.js";export{DbScrollArea}from"./components/db-scroll-area.js";export{DbDropzone}from"./components/db-dropzone.js";export{DbOnboardingModal}from"./components/db-onboarding-modal.js";export{DbSplitView}from"./components/db-split-view.js";export{DbFileUploader}from"./components/db-file-uploader.js";export{DbDatePicker}from"./components/db-date-picker.js";export{DbTimePicker}from"./components/db-time-picker.js";export{DbCalendar}from"./components/db-calendar.js";export{DbRating}from"./components/db-rating.js";export{DbSignature}from"./components/db-signature.js";export{DbCountdown}from"./components/db-countdown.js";export{DbMasonry}from"./components/db-masonry.js";export{DbCarousel}from"./components/db-carousel.js";export{DbColorPicker}from"./components/db-color-picker.js";export{DbColorSwatch}from"./components/db-color-swatch.js";export{DbReorder}from"./components/db-reorder.js";export{DbKanban}from"./components/db-kanban.js";export{DbGantt}from"./components/db-gantt.js";export{DbResizablePanels}from"./components/db-resizable-panels.js";export{DbVideoPlayer}from"./components/db-video-player.js";export{DbYouTubePlayer}from"./components/db-youtube-player.js";export{DbAudioPlayer}from"./components/db-audio-player.js";export{DbCodeBlock}from"./components/db-code-block.js";export{DbMarkdownEditor}from"./components/db-markdown-editor.js";export{DbTestimonial}from"./components/db-testimonial.js";export{DbSectionHero}from"./components/db-section-hero.js";export{DbSectionFeature}from"./components/db-section-feature.js";export{DbAppBadge}from"./components/db-app-badge.js";export{DbSectionContact}from"./components/db-section-contact.js";export{DbSectionAppDownload}from"./components/db-section-app-download.js";export{DbSectionCta}from"./components/db-section-cta.js";export{DbSectionTestimonials}from"./components/db-section-testimonials.js";export{DbSectionFeatureGrid}from"./components/db-section-feature-grid.js";export{DbSectionLogoCloud}from"./components/db-section-logo-cloud.js";export{DbSectionStats}from"./components/db-section-stats.js";export{DbSectionFaq}from"./components/db-section-faq.js";export{DbSectionPricing}from"./components/db-section-pricing.js";export{DbMarquee}from"./components/db-marquee.js";export{DbGradient}from"./components/db-gradient.js";export{DbRandomGradient}from"./components/db-random-gradient.js";export{DbAdBanner}from"./components/db-ad-banner.js";export{DbTimeline}from"./components/db-timeline.js";export{DbAnimationText}from"./components/db-animation-text.js";export{DbTutorial}from"./components/db-tutorial.js";export{DbAnimationBackground}from"./components/db-animation-background.js";export{DbGridBackground}from"./components/db-grid-background.js";export{DbCursorFollower}from"./components/db-cursor-follower.js";export{DbDownloadProgress}from"./components/db-download-progress.js";export{DbOtpInput}from"./components/db-otp-input.js";export{DbPhoneVerify}from"./components/db-phone-verify.js";export{DbEmailVerify}from"./components/db-email-verify.js";export{DbTwoFactor}from"./components/db-two-factor.js";export{DbChatOrb}from"./components/db-chat-orb.js";export{DbChatWelcome}from"./components/db-chat-welcome.js";export{DbChatComposer}from"./components/db-chat-composer.js";export{DbChatSuggestions}from"./components/db-chat-suggestions.js";export{DbChatMessage}from"./components/db-chat-message.js";export{DbChatTyping}from"./components/db-chat-typing.js";export{DbChatWidget}from"./components/db-chat-widget.js";export{DbAiChat}from"./components/db-ai-chat.js";export{DbAiChatList}from"./components/db-ai-chat-list.js";export{DbChatList}from"./components/db-chat-list.js";export{DbChatRoom}from"./components/db-chat-room.js";export{toast as dbToast,showToast,toast}from"./helpers/toast.js";export{confirm,confirm as dbConfirm}from"./helpers/confirm.js";
1
+ export{dbUid,ensureId}from"./core/uid.js";export{CleanupBag,rafThrottle}from"./core/dom.js";export{createFocusTrap,getTabbables}from"./core/focus-trap.js";export{lockScroll,scrollLockDepth,unlockScroll}from"./core/scroll-lock.js";export{activateOnKey,announce,createSrOnly,politenessForTone,setAccessibleName}from"./core/a11y.js";export{dbResetLocale,dbSetLocale,labelFrom,t}from"./core/i18n.js";export{sanitizeHref}from"./core/safe-url.js";export{sanitizeHtmlFragment}from"./core/safe-html.js";export{DbElement}from"./core/base-element.js";export{DbButton}from"./components/db-button.js";export{DbInput}from"./components/db-input.js";export{DbCheckbox}from"./components/db-checkbox.js";export{DbToggle}from"./components/db-toggle.js";export{DbBadge}from"./components/db-badge.js";export{DbBanner}from"./components/db-banner.js";export{DbSpinner}from"./components/db-spinner.js";export{DbCard}from"./components/db-card.js";export{DbTabs}from"./components/db-tabs.js";export{DbModal}from"./components/db-modal.js";export{DbDropdown}from"./components/db-dropdown.js";export{DbTooltip}from"./components/db-tooltip.js";export{DbAccordion}from"./components/db-accordion.js";export{DbAvatar}from"./components/db-avatar.js";export{DbDivider}from"./components/db-divider.js";export{DbProgress}from"./components/db-progress.js";export{DbSelect}from"./components/db-select.js";export{DbTextarea}from"./components/db-textarea.js";export{DbRadio}from"./components/db-radio.js";export{DbPagination}from"./components/db-pagination.js";export{DbBreadcrumbs}from"./components/db-breadcrumbs.js";export{DbTable}from"./components/db-table.js";export{DbAlert}from"./components/db-alert.js";export{DbChip}from"./components/db-chip.js";export{DbSkeleton}from"./components/db-skeleton.js";export{DbLabel}from"./components/db-label.js";export{DbLogo}from"./components/db-logo.js";export{DbEmptyState}from"./components/db-empty-state.js";export{DbBackdrop}from"./components/db-backdrop.js";export{DbPopover}from"./components/db-popover.js";export{DbDrawer}from"./components/db-drawer.js";export{DbToast}from"./components/db-toast.js";export{DbConfirm}from"./components/db-confirm.js";export{DbIndicator}from"./components/db-indicator.js";export{DbList}from"./components/db-list.js";export{DbMenuItem}from"./components/db-menu-item.js";export{DbSearchBar}from"./components/db-search-bar.js";export{DbShare}from"./components/db-share.js";export{DbTopBanner}from"./components/db-top-banner.js";export{DbCookieBanner}from"./components/db-cookie-banner.js";export{DbStat}from"./components/db-stat.js";export{DbActivityHeatmap}from"./components/db-activity-heatmap.js";export{DbImage}from"./components/db-image.js";export{DbImagePlaceholder}from"./components/db-image-placeholder.js";export{DbImageList}from"./components/db-image-list.js";export{DbLightbox}from"./components/db-lightbox.js";export{DbBottomNavigation}from"./components/db-bottom-navigation.js";export{DbNavbar}from"./components/db-navbar.js";export{DbFooter}from"./components/db-footer.js";export{DbSidebar}from"./components/db-sidebar.js";export{DbContextMenu}from"./components/db-context-menu.js";export{DbProgressbar}from"./components/db-progressbar.js";export{DbProgressStep}from"./components/db-progress-step.js";export{DbRangeSlider}from"./components/db-range-slider.js";export{DbSegmentControl}from"./components/db-segment-control.js";export{DbStepper}from"./components/db-stepper.js";export{DbContainer}from"./components/db-container.js";export{DbStack}from"./components/db-stack.js";export{DbGrid,DbGridItem}from"./components/db-grid.js";export{DbToolbar}from"./components/db-toolbar.js";export{DbForm}from"./components/db-form.js";export{DbPageHeader}from"./components/db-page-header.js";export{DbSection}from"./components/db-section.js";export{DbFloatingActionButton}from"./components/db-floating-action-button.js";export{DbBottomSheet}from"./components/db-bottom-sheet.js";export{DbScrollArea}from"./components/db-scroll-area.js";export{DbDropzone}from"./components/db-dropzone.js";export{DbOnboardingModal}from"./components/db-onboarding-modal.js";export{DbSplitView}from"./components/db-split-view.js";export{DbFileUploader}from"./components/db-file-uploader.js";export{DbDatePicker}from"./components/db-date-picker.js";export{DbTimePicker}from"./components/db-time-picker.js";export{DbCalendar}from"./components/db-calendar.js";export{DbRating}from"./components/db-rating.js";export{DbSignature}from"./components/db-signature.js";export{DbCountdown}from"./components/db-countdown.js";export{DbMasonry}from"./components/db-masonry.js";export{DbCarousel}from"./components/db-carousel.js";export{DbColorPicker}from"./components/db-color-picker.js";export{DbColorSwatch}from"./components/db-color-swatch.js";export{DbReorder}from"./components/db-reorder.js";export{DbKanban}from"./components/db-kanban.js";export{DbGantt}from"./components/db-gantt.js";export{DbResizablePanels}from"./components/db-resizable-panels.js";export{DbVideoPlayer}from"./components/db-video-player.js";export{DbYouTubePlayer}from"./components/db-youtube-player.js";export{DbAudioPlayer}from"./components/db-audio-player.js";export{DbCodeBlock}from"./components/db-code-block.js";export{DbMarkdownEditor}from"./components/db-markdown-editor.js";export{DbTestimonial}from"./components/db-testimonial.js";export{DbSectionHero}from"./components/db-section-hero.js";export{DbSectionFeature}from"./components/db-section-feature.js";export{DbAppBadge}from"./components/db-app-badge.js";export{DbSectionContact}from"./components/db-section-contact.js";export{DbSectionAppDownload}from"./components/db-section-app-download.js";export{DbSectionCta}from"./components/db-section-cta.js";export{DbSectionTestimonials}from"./components/db-section-testimonials.js";export{DbSectionFeatureGrid}from"./components/db-section-feature-grid.js";export{DbSectionLogoCloud}from"./components/db-section-logo-cloud.js";export{DbSectionStats}from"./components/db-section-stats.js";export{DbSectionFaq}from"./components/db-section-faq.js";export{DbSectionPricing}from"./components/db-section-pricing.js";export{DbMarquee}from"./components/db-marquee.js";export{DbGradient}from"./components/db-gradient.js";export{DbRandomGradient}from"./components/db-random-gradient.js";export{DbAdBanner}from"./components/db-ad-banner.js";export{DbTimeline}from"./components/db-timeline.js";export{DbAnimationText}from"./components/db-animation-text.js";export{DbTutorial}from"./components/db-tutorial.js";export{DbAnimationBackground}from"./components/db-animation-background.js";export{DbGridBackground}from"./components/db-grid-background.js";export{DbCursorFollower}from"./components/db-cursor-follower.js";export{DbDownloadProgress}from"./components/db-download-progress.js";export{DbOtpInput}from"./components/db-otp-input.js";export{DbPhoneVerify}from"./components/db-phone-verify.js";export{DbEmailVerify}from"./components/db-email-verify.js";export{DbTwoFactor}from"./components/db-two-factor.js";export{DbAiGlow}from"./components/db-ai-glow.js";export{DbChatOrb}from"./components/db-chat-orb.js";export{DbChatWelcome}from"./components/db-chat-welcome.js";export{DbChatComposer}from"./components/db-chat-composer.js";export{DbChatSuggestions}from"./components/db-chat-suggestions.js";export{DbChatMessage}from"./components/db-chat-message.js";export{DbChatTyping}from"./components/db-chat-typing.js";export{DbChatWidget}from"./components/db-chat-widget.js";export{DbAiChat}from"./components/db-ai-chat.js";export{DbAiChatList}from"./components/db-ai-chat-list.js";export{DbChatList}from"./components/db-chat-list.js";export{DbChatRoom}from"./components/db-chat-room.js";export{toast as dbToast,showToast,toast}from"./helpers/toast.js";export{confirm,confirm as dbConfirm}from"./helpers/confirm.js";
@@ -1 +1 @@
1
- import{RADIUS_SCALE as t,SIZE_SML as e,SIZE_XS_XL as a,SIZE_XS_2XL as l,FEEDBACK_TONES as r}from"./primitives.js";const i=["primary","secondary","tertiary","destructive","ghost","accent"],o={danger:"destructive"},n=e,d=t,s=["solid","gradient","backlight","outline","prism"],m=e,u=["text","email","password","url","search","tel","number"],f=["default","flat"],c=e,g=["primary","secondary","info","success","warning","danger"],p=e,h=["dot","number","text","outlined"],y=l,b=["default","primary","success","warning","danger","info"],x=["online","offline","away","busy"],w=["default","primary","success","warning","danger","info","neutral"],v=e,k=["primary","secondary","success","warning","danger","muted"],z=a,j=["circular","dots","bars","pulse","ripple"],q=e,B=e,A=e,C=["default",...r],D=e,E=["default",...r],F=["s","m","l","xl","full"],G=["default","persistent","temporary","fullscreen"],H=["slide","fade","scale","none"],I=["default","pills"],J=e,K=["horizontal","vertical"],L=e,M=["bottom","top"],N=["default","transparent"],O=e,P=["fixed","sticky","static"],Q=e,R=["default","glass","transparent"],S=e,T=["vertical","horizontal"],U=["text","circular","rectangular","rounded"],V=a,W=["default","primary",...r],X=e,Y=["solid","striped","animated"],Z=["default","bordered","separated","contained"],$=e,_=["primary","secondary","tertiary","outline","image"],tt=e,et=["default","contained","underlined"],at=e,lt=["no-data","no-results","no-access","error","onboarding"],rt=e,it=["default","original","primary","secondary","light","dark","white"],ot=["xs","s","m","l","xl"],nt=["default","primary","success","warning","danger","info"],dt=e,st=["default","outlined","minimal"],mt=e,ut=e,ft=e,ct=["green","primary"],gt=["user","assistant","system"],pt=a,ht=["aurora","ocean","emerald","violet","mono"],yt=["idle","thinking","listening"],bt=["auto","light","dark"],xt=["center","left"],wt=["home","messages","conversation","help","article"],vt=["bottom-right","bottom-left"],kt=["s","m","l","xl","full"],zt=["none","s","m","l","xl"],jt=e,qt=["default","outlined","filled"],Bt=["downloading","paused","error","complete"],At=["bottom-right","bottom-left","bottom-center","top-right","top-left","top-center"],Ct=["left","right","top","bottom"],Dt=["s","m","l","xl","full"],Et=e,Ft=["bottom-left","bottom-right","top-left","top-right"],Gt=["primary","secondary","tertiary","danger","ghost"],Ht=e,It=["default","outlined","filled"],Jt=e,Kt=e,Lt=["default","outlined","filled"],Mt=e,Nt=["primary","secondary","tertiary"],Ot=["default","compact","minimal"],Pt=e,Qt=["dots","numbers","line","dot-line","slide","fill","combined"],Rt=e,St=["horizontal","vertical"],Tt=["s","m","l","xl"],Ut=e,Vt=["default","minimal"],Wt=["center","left"],Xt=e,Yt=["top","bottom","left","right","top-start","top-end","bottom-start","bottom-end","left-start","left-end","right-start","right-end"],Zt=["click","hover","focus","manual"],$t=e,_t=["default","success","warning","danger"],te=["default","minimal"],ee=e,ae=e,le=["default","dark","light"],re=["default","wrapper"],ie=["left","right"],oe=["auto","adjacent","replace"],ne=["nav-top","nav","nav-bottom"],de=e,se=["default","minimal","card","colored","iconBox"],me=["horizontal","vertical","reverse"],ue=["primary","secondary","success","warning","error","info","custom"],fe=e,ce=["default","striped","hoverable"],ge=["list","card","logo","image","text"],pe=e,he=e,ye=["12h","24h","12h-with-seconds","24h-with-seconds"],be=["top","bottom","left","right","top-start","top-end","bottom-start","bottom-end","left-start","left-end","right-start","right-end"],xe=e,we=["default","primary","success","warning","danger","info"],ve=["primary","white","dark"],ke=e,ze=["primary","secondary","success","warning","error"],je=e,qe=["xs","s","m","l","xl","2xl","3xl"],Be=["left","center","right","justify"],Ae=e,Ce=["default","minimal","compact","full"],De=["s","m","l","xl"],Ee=["default","cards","gallery","hero","testimonial"],Fe=["s","m","l","xl"],Ge=e,He=["bottom-start","bottom-end","top-start","top-end"],Ie=e,Je=["default","info","success","warning","danger"],Ke=e,Le=["default","compact","minimal"],Me=e,Ne=["default","animated","mesh"],Oe=["s","m","l","xl","full"],Pe=e,Qe=["default","minimal","bordered","card","navigation"],Re=e,Se=["default","filled","outlined"],Te=e,Ue=["default","filled","outlined"],Ve=e,We=e,Xe=["light","vivid","dark"],Ye=["default","minimal","card","inline","large"],Ze=e,$e=["default","bordered","filled","minimal"],_e=e,ta=["left","center","right"],ea=e,aa=e,la=["default","dark","light","gradient","tinted"],ra=e,ia=e,oa=e,na=e,da=["default","showcase","split","overlay","centered"],sa=["grid","inline","minimal","marquee"],ma=e,ua=e,fa=e,ca=["grid","list","carousel","cards"],ga=e,pa=["button","dropdown","modal","inline"],ha=e,ya=["top","bottom","left","right"],ba=["dashed","outlined"],xa=["default","alternate","left","right"],wa=e,va=["default","filled","outlined","ghost"],ka=e,za=["top","bottom","left","right","floating"],ja=["default","minimal","theater"],qa=["s","m","l","xl"],Ba=["default","minimal","theater","full"],Aa=["s","m","l","xl"];export{$ as ACCORDION_SIZES,Z as ACCORDION_VARIANTS,ct as ACTIVITY_HEATMAP_COLOR_SCHEMES,ft as ACTIVITY_HEATMAP_SIZES,je as AD_BANNER_SIZES,ze as AD_BANNER_VARIANTS,D as ALERT_SIZES,C as ALERT_VARIANTS,Be as ANIMATION_TEXT_ALIGNS,qe as ANIMATION_TEXT_SIZES,Ae as APP_BADGE_SIZES,De as AUDIO_PLAYER_SIZES,Ce as AUDIO_PLAYER_VARIANTS,y as AVATAR_SIZES,x as AVATAR_STATUSES,b as AVATAR_VARIANTS,p as BADGE_SIZES,h as BADGE_TYPES,g as BADGE_VARIANTS,tt as BANNER_SIZES,_ as BANNER_VARIANTS,R as BOTTOM_NAV_BACKGROUNDS,Q as BOTTOM_NAV_SIZES,H as BOTTOM_SHEET_ANIMATIONS,G as BOTTOM_SHEET_VARIANTS,at as BREADCRUMBS_SIZES,et as BREADCRUMBS_VARIANTS,s as BUTTON_ACCENT_STYLES,d as BUTTON_RADII,n as BUTTON_SIZES,i as BUTTON_VARIANTS,o as BUTTON_VARIANT_ALIASES,c as CARD_SIZES,f as CARD_VARIANTS,Fe as CAROUSEL_SIZES,Ee as CAROUSEL_VARIANTS,gt as CHAT_MESSAGE_ROLES,pt as CHAT_ORB_SIZES,yt as CHAT_ORB_STATES,bt as CHAT_ORB_THEMES,ht as CHAT_ORB_VARIANTS,xt as CHAT_WELCOME_ALIGNS,vt as CHAT_WIDGET_POSITIONS,wt as CHAT_WIDGET_VIEWS,B as CHECKBOX_SIZES,v as CHIP_SIZES,w as CHIP_VARIANTS,He as COLOR_PICKER_POSITIONS,Ge as COLOR_PICKER_SIZES,Ie as COLOR_SWATCH_SIZES,Ke as CONFIRM_SIZES,Je as CONFIRM_VARIANTS,zt as CONTAINER_PADDINGS,kt as CONTAINER_SIZES,Me as COUNTDOWN_SIZES,Le as COUNTDOWN_VARIANTS,jt as DATE_PICKER_SIZES,qt as DATE_PICKER_VARIANTS,k as DIVIDER_COLORS,At as DOWNLOAD_PROGRESS_POSITIONS,Bt as DOWNLOAD_PROGRESS_STATUSES,Ct as DRAWER_POSITIONS,Dt as DRAWER_SIZES,Ft as DROPDOWN_PLACEMENTS,Et as DROPDOWN_SIZES,Gt as DROPDOWN_TRIGGER_VARIANTS,Ht as DROPZONE_SIZES,It as DROPZONE_VARIANTS,Jt as EMAIL_VERIFY_SIZES,rt as EMPTY_STATE_SIZES,lt as EMPTY_STATE_VARIANTS,Kt as FILE_UPLOADER_SIZES,Lt as FILE_UPLOADER_VARIANTS,Mt as FLOATING_ACTION_BUTTON_SIZES,Nt as FLOATING_ACTION_BUTTON_VARIANTS,Pt as FOOTER_SIZES,Ot as FOOTER_VARIANTS,Oe as GRADIENT_SIZES,Ne as GRADIENT_VARIANTS,St as INDICATOR_DIRECTIONS,Rt as INDICATOR_SIZES,Qt as INDICATOR_TYPES,m as INPUT_SIZES,u as INPUT_TYPES,ut as KANBAN_SIZES,Pe as LABEL_SIZES,Tt as LIGHTBOX_SIZES,Re as LIST_SIZES,Qe as LIST_VARIANTS,ot as LOGO_SIZES,it as LOGO_VARIANTS,Te as MARKDOWN_EDITOR_SIZES,Se as MARKDOWN_EDITOR_VARIANTS,Ve as MARQUEE_SIZES,Ue as MARQUEE_VARIANTS,dt as MENU_ITEM_SIZES,nt as MENU_ITEM_VARIANTS,F as MODAL_SIZES,P as NAVBAR_POSITIONS,O as NAVBAR_SIZES,N as NAVBAR_VARIANTS,Ut as OTP_INPUT_SIZES,Wt as PAGE_HEADER_ALIGNS,Vt as PAGE_HEADER_VARIANTS,mt as PAGINATION_SIZES,st as PAGINATION_VARIANTS,Xt as PHONE_VERIFY_SIZES,Yt as POPOVER_PLACEMENTS,Zt as POPOVER_TRIGGERS,X as PROGRESS_BAR_SIZES,Y as PROGRESS_BAR_STYLES,W as PROGRESS_BAR_VARIANTS,te as PROGRESS_CIRCULAR_STYLES,$t as PROGRESS_SIZES,We as PROGRESS_STEP_SIZES,_t as PROGRESS_VARIANTS,A as RADIO_SIZES,Xe as RANDOM_GRADIENT_TONES,Ze as RATING_SIZES,Ye as RATING_VARIANTS,_e as REORDER_SIZES,$e as REORDER_VARIANTS,T as SEARCH_BAR_RECENT_LAYOUTS,S as SEARCH_BAR_SIZES,ta as SECTION_ALIGNS,ea as SECTION_APP_DOWNLOAD_SIZES,aa as SECTION_CONTACT_SIZES,ra as SECTION_CTA_SIZES,la as SECTION_CTA_VARIANTS,ia as SECTION_FAQ_SIZES,na as SECTION_FEATURE_GRID_SIZES,oa as SECTION_FEATURE_SIZES,da as SECTION_HERO_VARIANTS,ma as SECTION_LOGO_CLOUD_SIZES,sa as SECTION_LOGO_CLOUD_VARIANTS,ua as SECTION_PRICING_SIZES,ee as SECTION_SIZES,fa as SECTION_STATS_SIZES,ga as SECTION_TESTIMONIALS_SIZES,ca as SECTION_TESTIMONIALS_VARIANTS,M as SELECT_POSITIONS,L as SELECT_SIZES,ya as SHARE_POSITIONS,ha as SHARE_SIZES,pa as SHARE_VARIANTS,ne as SIDEBAR_CUSTOM_NAV_SLOTS,oe as SIDEBAR_PANEL_MODES,ie as SIDEBAR_POSITIONS,ae as SIDEBAR_SIZES,le as SIDEBAR_THEMES,re as SIDEBAR_VARIANTS,ba as SIGNATURE_VARIANTS,V as SKELETON_SIZES,U as SKELETON_VARIANTS,z as SPINNER_SIZES,j as SPINNER_TYPES,ue as STAT_COLORS,me as STAT_LAYOUTS,de as STAT_SIZES,se as STAT_VARIANTS,fe as TABLE_SIZES,ce as TABLE_VARIANTS,K as TABS_ORIENTATIONS,J as TABS_SIZES,I as TABS_VARIANTS,ge as TESTIMONIAL_VARIANTS,pe as TEXTAREA_SIZES,wa as TIMELINE_SIZES,xa as TIMELINE_VARIANTS,ye as TIME_PICKER_FORMATS,he as TIME_PICKER_SIZES,E as TOAST_VARIANTS,q as TOGGLE_SIZES,za as TOOLBAR_POSITIONS,ka as TOOLBAR_SIZES,va as TOOLBAR_VARIANTS,be as TOOLTIP_POSITIONS,xe as TOOLTIP_SIZES,we as TOOLTIP_VARIANTS,ve as TOP_BANNER_VARIANTS,ke as TWO_FACTOR_SIZES,qa as VIDEO_PLAYER_SIZES,ja as VIDEO_PLAYER_VARIANTS,Aa as YOUTUBE_PLAYER_SIZES,Ba as YOUTUBE_PLAYER_VARIANTS};
1
+ import{RADIUS_SCALE as t,SIZE_SML as e,SIZE_XS_XL as a,SIZE_XS_2XL as r,FEEDBACK_TONES as l}from"./primitives.js";const i=["primary","secondary","tertiary","destructive","ghost","accent"],o={danger:"destructive"},n=e,d=t,s=["solid","gradient","backlight","outline","prism"],m=e,u=["text","email","password","url","search","tel","number"],f=["default","flat"],c=e,g=["primary","secondary","info","success","warning","danger"],p=e,h=["dot","number","text","outlined"],y=r,b=["default","primary","success","warning","danger","info"],x=["online","offline","away","busy"],w=["default","primary","success","warning","danger","info","neutral"],v=e,k=["primary","secondary","success","warning","danger","muted"],z=a,j=["circular","dots","bars","pulse","ripple"],q=e,B=["default","neutral"],A=e,C=e,D=["default",...l],E=e,F=["default",...l],G=["s","m","l","xl","full"],H=["default","persistent","temporary","fullscreen"],I=["slide","fade","scale","none"],J=["default","pills"],K=e,L=["horizontal","vertical"],M=e,N=["bottom","top"],O=["default","transparent"],P=e,Q=["fixed","sticky","static"],R=e,S=["default","glass","transparent"],T=e,U=["vertical","horizontal"],V=["text","circular","rectangular","rounded"],W=a,X=["default","primary",...l],Y=e,Z=["solid","striped","animated"],$=["default","bordered","separated","contained"],_=e,tt=["primary","secondary","tertiary","outline","image"],et=e,at=["default","contained","underlined"],rt=e,lt=["no-data","no-results","no-access","error","onboarding"],it=e,ot=["default","original","primary","secondary","light","dark","white"],nt=["xs","s","m","l","xl"],dt=["default","primary","success","warning","danger","info"],st=e,mt=["default","outlined","minimal"],ut=e,ft=e,ct=e,gt=["green","primary"],pt=["user","assistant","system"],ht=["aurora","brand"],yt=["thinking","working","listening"],bt=e,xt=a,wt=["aurora","ocean","emerald","violet","mono"],vt=["idle","thinking","listening"],kt=["auto","light","dark"],zt=["center","left"],jt=["home","messages","conversation","help","article"],qt=["bottom-right","bottom-left"],Bt=["s","m","l","xl","full"],At=["none","s","m","l","xl"],Ct=e,Dt=["default","outlined","filled"],Et=["downloading","paused","error","complete"],Ft=["bottom-right","bottom-left","bottom-center","top-right","top-left","top-center"],Gt=["left","right","top","bottom"],Ht=["s","m","l","xl","full"],It=e,Jt=["bottom-left","bottom-right","top-left","top-right"],Kt=["primary","secondary","tertiary","danger","ghost"],Lt=e,Mt=["default","outlined","filled"],Nt=e,Ot=e,Pt=["default","outlined","filled"],Qt=e,Rt=["primary","secondary","tertiary"],St=["default","compact","minimal"],Tt=e,Ut=["dots","numbers","line","dot-line","slide","fill","combined"],Vt=e,Wt=["horizontal","vertical"],Xt=["s","m","l","xl"],Yt=e,Zt=["default","minimal"],$t=["center","left"],_t=e,te=["top","bottom","left","right","top-start","top-end","bottom-start","bottom-end","left-start","left-end","right-start","right-end"],ee=["click","hover","focus","manual"],ae=e,re=["default","success","warning","danger"],le=["default","minimal"],ie=e,oe=e,ne=["default","dark","light"],de=["default","wrapper"],se=["left","right"],me=["auto","adjacent","replace"],ue=["nav-top","nav","nav-bottom"],fe=e,ce=["default","minimal","card","colored","iconBox"],ge=["horizontal","vertical","reverse"],pe=["primary","secondary","success","warning","error","info","custom"],he=e,ye=["default","striped","hoverable"],be=["list","card","logo","image","text"],xe=e,we=e,ve=["12h","24h","12h-with-seconds","24h-with-seconds"],ke=["auto","bottom-start","bottom-end","top-start","top-end"],ze=["top","bottom","left","right","top-start","top-end","bottom-start","bottom-end","left-start","left-end","right-start","right-end"],je=e,qe=["default","primary","success","warning","danger","info"],Be=["primary","white","dark"],Ae=e,Ce=["primary","secondary","success","warning","error"],De=e,Ee=["xs","s","m","l","xl","2xl","3xl"],Fe=["left","center","right","justify"],Ge=e,He=["default","minimal","compact","full"],Ie=["s","m","l","xl"],Je=["default","cards","gallery","hero","testimonial"],Ke=["s","m","l","xl"],Le=e,Me=["bottom-start","bottom-end","top-start","top-end"],Ne=e,Oe=["default","info","success","warning","danger"],Pe=e,Qe=["default","compact","minimal"],Re=e,Se=["default","animated","mesh"],Te=["s","m","l","xl","full"],Ue=e,Ve=["default","minimal","bordered","card","navigation"],We=e,Xe=["default","filled","outlined"],Ye=e,Ze=["default","filled","outlined"],$e=e,_e=e,ta=["light","vivid","dark"],ea=["default","minimal","card","inline","large"],aa=e,ra=["default","bordered","filled","minimal"],la=e,ia=["left","center","right"],oa=e,na=e,da=["default","dark","light","gradient","tinted"],sa=e,ma=e,ua=e,fa=e,ca=["default","showcase","split","overlay","centered"],ga=["grid","inline","minimal","marquee"],pa=e,ha=e,ya=e,ba=["grid","list","carousel","cards"],xa=e,wa=["button","dropdown","modal","inline"],va=e,ka=["top","bottom","left","right"],za=["dashed","outlined"],ja=["default","alternate","left","right"],qa=e,Ba=["default","filled","outlined","ghost"],Aa=e,Ca=["top","bottom","left","right","floating"],Da=["default","minimal","theater"],Ea=["s","m","l","xl"],Fa=["default","minimal","theater","full"],Ga=["s","m","l","xl"];export{_ as ACCORDION_SIZES,$ as ACCORDION_VARIANTS,gt as ACTIVITY_HEATMAP_COLOR_SCHEMES,ct as ACTIVITY_HEATMAP_SIZES,De as AD_BANNER_SIZES,Ce as AD_BANNER_VARIANTS,bt as AI_GLOW_SIZES,yt as AI_GLOW_STATES,ht as AI_GLOW_VARIANTS,E as ALERT_SIZES,D as ALERT_VARIANTS,Fe as ANIMATION_TEXT_ALIGNS,Ee as ANIMATION_TEXT_SIZES,Ge as APP_BADGE_SIZES,Ie as AUDIO_PLAYER_SIZES,He as AUDIO_PLAYER_VARIANTS,y as AVATAR_SIZES,x as AVATAR_STATUSES,b as AVATAR_VARIANTS,p as BADGE_SIZES,h as BADGE_TYPES,g as BADGE_VARIANTS,et as BANNER_SIZES,tt as BANNER_VARIANTS,S as BOTTOM_NAV_BACKGROUNDS,R as BOTTOM_NAV_SIZES,I as BOTTOM_SHEET_ANIMATIONS,H as BOTTOM_SHEET_VARIANTS,rt as BREADCRUMBS_SIZES,at as BREADCRUMBS_VARIANTS,s as BUTTON_ACCENT_STYLES,d as BUTTON_RADII,n as BUTTON_SIZES,i as BUTTON_VARIANTS,o as BUTTON_VARIANT_ALIASES,c as CARD_SIZES,f as CARD_VARIANTS,Ke as CAROUSEL_SIZES,Je as CAROUSEL_VARIANTS,pt as CHAT_MESSAGE_ROLES,xt as CHAT_ORB_SIZES,vt as CHAT_ORB_STATES,kt as CHAT_ORB_THEMES,wt as CHAT_ORB_VARIANTS,zt as CHAT_WELCOME_ALIGNS,qt as CHAT_WIDGET_POSITIONS,jt as CHAT_WIDGET_VIEWS,A as CHECKBOX_SIZES,v as CHIP_SIZES,w as CHIP_VARIANTS,Me as COLOR_PICKER_POSITIONS,Le as COLOR_PICKER_SIZES,Ne as COLOR_SWATCH_SIZES,Pe as CONFIRM_SIZES,Oe as CONFIRM_VARIANTS,At as CONTAINER_PADDINGS,Bt as CONTAINER_SIZES,Re as COUNTDOWN_SIZES,Qe as COUNTDOWN_VARIANTS,Ct as DATE_PICKER_SIZES,Dt as DATE_PICKER_VARIANTS,k as DIVIDER_COLORS,Ft as DOWNLOAD_PROGRESS_POSITIONS,Et as DOWNLOAD_PROGRESS_STATUSES,Gt as DRAWER_POSITIONS,Ht as DRAWER_SIZES,Jt as DROPDOWN_PLACEMENTS,It as DROPDOWN_SIZES,Kt as DROPDOWN_TRIGGER_VARIANTS,Lt as DROPZONE_SIZES,Mt as DROPZONE_VARIANTS,Nt as EMAIL_VERIFY_SIZES,it as EMPTY_STATE_SIZES,lt as EMPTY_STATE_VARIANTS,Ot as FILE_UPLOADER_SIZES,Pt as FILE_UPLOADER_VARIANTS,Qt as FLOATING_ACTION_BUTTON_SIZES,Rt as FLOATING_ACTION_BUTTON_VARIANTS,Tt as FOOTER_SIZES,St as FOOTER_VARIANTS,Te as GRADIENT_SIZES,Se as GRADIENT_VARIANTS,Wt as INDICATOR_DIRECTIONS,Vt as INDICATOR_SIZES,Ut as INDICATOR_TYPES,m as INPUT_SIZES,u as INPUT_TYPES,ft as KANBAN_SIZES,Ue as LABEL_SIZES,Xt as LIGHTBOX_SIZES,We as LIST_SIZES,Ve as LIST_VARIANTS,nt as LOGO_SIZES,ot as LOGO_VARIANTS,Ye as MARKDOWN_EDITOR_SIZES,Xe as MARKDOWN_EDITOR_VARIANTS,$e as MARQUEE_SIZES,Ze as MARQUEE_VARIANTS,st as MENU_ITEM_SIZES,dt as MENU_ITEM_VARIANTS,G as MODAL_SIZES,Q as NAVBAR_POSITIONS,P as NAVBAR_SIZES,O as NAVBAR_VARIANTS,Yt as OTP_INPUT_SIZES,$t as PAGE_HEADER_ALIGNS,Zt as PAGE_HEADER_VARIANTS,ut as PAGINATION_SIZES,mt as PAGINATION_VARIANTS,_t as PHONE_VERIFY_SIZES,te as POPOVER_PLACEMENTS,ee as POPOVER_TRIGGERS,Y as PROGRESS_BAR_SIZES,Z as PROGRESS_BAR_STYLES,X as PROGRESS_BAR_VARIANTS,le as PROGRESS_CIRCULAR_STYLES,ae as PROGRESS_SIZES,_e as PROGRESS_STEP_SIZES,re as PROGRESS_VARIANTS,C as RADIO_SIZES,ta as RANDOM_GRADIENT_TONES,aa as RATING_SIZES,ea as RATING_VARIANTS,la as REORDER_SIZES,ra as REORDER_VARIANTS,U as SEARCH_BAR_RECENT_LAYOUTS,T as SEARCH_BAR_SIZES,ia as SECTION_ALIGNS,oa as SECTION_APP_DOWNLOAD_SIZES,na as SECTION_CONTACT_SIZES,sa as SECTION_CTA_SIZES,da as SECTION_CTA_VARIANTS,ma as SECTION_FAQ_SIZES,fa as SECTION_FEATURE_GRID_SIZES,ua as SECTION_FEATURE_SIZES,ca as SECTION_HERO_VARIANTS,pa as SECTION_LOGO_CLOUD_SIZES,ga as SECTION_LOGO_CLOUD_VARIANTS,ha as SECTION_PRICING_SIZES,ie as SECTION_SIZES,ya as SECTION_STATS_SIZES,xa as SECTION_TESTIMONIALS_SIZES,ba as SECTION_TESTIMONIALS_VARIANTS,N as SELECT_POSITIONS,M as SELECT_SIZES,ka as SHARE_POSITIONS,va as SHARE_SIZES,wa as SHARE_VARIANTS,ue as SIDEBAR_CUSTOM_NAV_SLOTS,me as SIDEBAR_PANEL_MODES,se as SIDEBAR_POSITIONS,oe as SIDEBAR_SIZES,ne as SIDEBAR_THEMES,de as SIDEBAR_VARIANTS,za as SIGNATURE_VARIANTS,W as SKELETON_SIZES,V as SKELETON_VARIANTS,z as SPINNER_SIZES,j as SPINNER_TYPES,pe as STAT_COLORS,ge as STAT_LAYOUTS,fe as STAT_SIZES,ce as STAT_VARIANTS,he as TABLE_SIZES,ye as TABLE_VARIANTS,L as TABS_ORIENTATIONS,K as TABS_SIZES,J as TABS_VARIANTS,be as TESTIMONIAL_VARIANTS,xe as TEXTAREA_SIZES,qa as TIMELINE_SIZES,ja as TIMELINE_VARIANTS,ke as TIME_PICKER_DROPDOWN_POSITIONS,ve as TIME_PICKER_FORMATS,we as TIME_PICKER_SIZES,F as TOAST_VARIANTS,q as TOGGLE_SIZES,B as TOGGLE_VARIANTS,Ca as TOOLBAR_POSITIONS,Aa as TOOLBAR_SIZES,Ba as TOOLBAR_VARIANTS,ze as TOOLTIP_POSITIONS,je as TOOLTIP_SIZES,qe as TOOLTIP_VARIANTS,Be as TOP_BANNER_VARIANTS,Ae as TWO_FACTOR_SIZES,Ea as VIDEO_PLAYER_SIZES,Da as VIDEO_PLAYER_VARIANTS,Ga as YOUTUBE_PLAYER_SIZES,Fa as YOUTUBE_PLAYER_VARIANTS};