npm - @dev-dga/css - Versions diffs - 0.8.0 → 0.8.1 - Mend

@dev-dga/css 0.8.0 → 0.8.1

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 (42) hide show

package/CHANGELOG.md +6 -0
package/dist/components/aspect-ratio.css +2 -0
package/dist/components/aspect-ratio.css.map +1 -0
package/dist/components/avatar.css +1 -1
package/dist/components/avatar.css.map +1 -1
package/dist/components/badge.css +1 -1
package/dist/components/badge.css.map +1 -1
package/dist/components/button.css +1 -1
package/dist/components/button.css.map +1 -1
package/dist/components/calendar.css +2 -0
package/dist/components/calendar.css.map +1 -0
package/dist/components/card.css +1 -1
package/dist/components/card.css.map +1 -1
package/dist/components/combobox.css +1 -1
package/dist/components/combobox.css.map +1 -1
package/dist/components/date-picker.css +1 -1
package/dist/components/date-picker.css.map +1 -1
package/dist/components/date-range-picker.css +2 -0
package/dist/components/date-range-picker.css.map +1 -0
package/dist/components/description-list.css +1 -1
package/dist/components/description-list.css.map +1 -1
package/dist/components/dropdown-menu.css +1 -1
package/dist/components/dropdown-menu.css.map +1 -1
package/dist/components/file-upload.css +1 -1
package/dist/components/file-upload.css.map +1 -1
package/dist/components/menubar.css +1 -1
package/dist/components/menubar.css.map +1 -1
package/dist/components/progress.css +1 -1
package/dist/components/progress.css.map +1 -1
package/dist/components/select.css +1 -1
package/dist/components/select.css.map +1 -1
package/dist/components/skeleton.css +1 -1
package/dist/components/skeleton.css.map +1 -1
package/dist/components/slider.css +1 -1
package/dist/components/slider.css.map +1 -1
package/dist/components/stat.css +1 -1
package/dist/components/stat.css.map +1 -1
package/dist/components/switch.css +1 -1
package/dist/components/switch.css.map +1 -1
package/dist/index.css +1 -1
package/dist/index.css.map +1 -1
package/package.json +2 -2

package/dist/components/file-upload.css CHANGED Viewed

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-file-upload{color:var(--ddga-text-primary)}.ddga-file-upload__label{color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-medium);font-size:var(--ddga-font-size-sm);line-height:1.4}.ddga-file-upload__required{color:var(--ddga-color-error);margin-inline-start:.125rem}.ddga-file-upload__dropzone{justify-content:center;align-items:center;gap:var(--ddga-space-2);padding:var(--ddga-space-6) var(--ddga-space-4);border:1px dashed var(--ddga-color-input);border-radius:var(--ddga-radius-md);background-color:var(--ddga-color-background);text-align:center;cursor:pointer;flex-direction:column;transition:border-color .15s,background-color .15s,box-shadow .15s;display:flex}.ddga-file-upload__dropzone:hover{border-color:var(--ddga-color-ring);background-color:var(--ddga-color-muted)}.ddga-file-upload__dropzone:focus-within{border-color:var(--ddga-color-ring);box-shadow:0 0 0 1px var(--ddga-color-ring)}.ddga-file-upload__dropzone[data-dragging]{border-color:var(--ddga-color-primary);background-color:var(--ddga-color-muted);box-shadow:0 0 0 1px var(--ddga-color-primary);border-style:solid}.ddga-file-upload__dropzone--error{border-color:var(--ddga-color-error)}.ddga-file-upload__dropzone--error:focus-within{border-color:var(--ddga-color-error);box-shadow:0 0 0 1px var(--ddga-color-error)}.ddga-file-upload__dropzone[data-disabled]{cursor:not-allowed;opacity:.6;background-color:var(--ddga-color-muted)}.ddga-file-upload__dropzone[data-disabled]:hover{border-color:var(--ddga-color-input);border-style:dashed}.ddga-file-upload__icon{color:var(--ddga-color-muted-foreground);font-size:1.5rem}.ddga-file-upload__hint{font-size:var(--ddga-font-size-sm);color:var(--ddga-text-secondary)}.ddga-file-upload__input{clip:rect(0 0 0 0);white-space:nowrap;border:0;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.ddga-file-upload__list{gap:var(--ddga-space-2);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.ddga-file-upload__item{align-items:center;gap:var(--ddga-space-3);padding:var(--ddga-space-2) var(--ddga-space-3);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-background);display:flex}.ddga-file-upload__item-icon{color:var(--ddga-color-muted-foreground);flex:none;font-size:1.125rem;display:inline-flex}.ddga-file-upload__item[data-status=success] .ddga-file-upload__item-icon{color:var(--ddga-color-success)}.ddga-file-upload__item[data-status=error] .ddga-file-upload__item-icon{color:var(--ddga-color-error)}.ddga-file-upload__item-main{gap:var(--ddga-space-1);flex-direction:column;flex:auto;min-inline-size:0;display:flex}.ddga-file-upload__item-head{justify-content:space-between;align-items:baseline;gap:var(--ddga-space-3);display:flex}.ddga-file-upload__item-name{text-overflow:ellipsis;white-space:nowrap;font-size:var(--ddga-font-size-sm);color:var(--ddga-text-primary);overflow:hidden}.ddga-file-upload__item-meta{font-size:var(--ddga-font-size-xs);color:var(--ddga-text-secondary);font-variant-numeric:tabular-nums;flex:none}.ddga-file-upload__item-error{font-size:var(--ddga-font-size-xs);color:var(--ddga-color-error)}.ddga-file-upload__item-remove{flex:none}}
+@layer ddga-components{.ddga-file-upload{color:var(--ddga-text-primary)}.ddga-file-upload__label{color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-medium);font-size:var(--ddga-font-size-sm);line-height:1.4}.ddga-file-upload__required{color:var(--ddga-color-error);margin-inline-start:.125rem}.ddga-file-upload__dropzone{justify-content:center;align-items:center;gap:var(--ddga-space-2);padding:var(--ddga-space-6) var(--ddga-space-4);border:1px dashed var(--ddga-color-input);border-radius:var(--ddga-radius-md);background-color:var(--ddga-color-background);text-align:center;cursor:pointer;flex-direction:column;transition:border-color .15s,background-color .15s,box-shadow .15s;display:flex}.ddga-file-upload__dropzone:hover{border-color:var(--ddga-color-ring);background-color:var(--ddga-color-muted)}.ddga-file-upload__dropzone:focus-within{border-color:var(--ddga-color-ring);box-shadow:0 0 0 1px var(--ddga-color-ring)}.ddga-file-upload__dropzone[data-dragging]{border-color:var(--ddga-color-primary);background-color:var(--ddga-color-muted);box-shadow:0 0 0 1px var(--ddga-color-primary);border-style:solid}.ddga-file-upload__dropzone--error{border-color:var(--ddga-color-error)}.ddga-file-upload__dropzone--error:focus-within{border-color:var(--ddga-color-error);box-shadow:0 0 0 1px var(--ddga-color-error)}.ddga-file-upload__dropzone[data-disabled]{cursor:not-allowed;opacity:.6;background-color:var(--ddga-color-muted)}.ddga-file-upload__dropzone[data-disabled]:hover{border-color:var(--ddga-color-input);border-style:dashed}.ddga-file-upload__icon{color:var(--ddga-color-muted-foreground);font-size:1.5rem}.ddga-file-upload__hint{font-size:var(--ddga-font-size-sm);color:var(--ddga-text-secondary)}.ddga-file-upload__input{clip:rect(0 0 0 0);white-space:nowrap;border:0;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.ddga-file-upload__list{gap:var(--ddga-space-2);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.ddga-file-upload__item{align-items:center;gap:var(--ddga-space-3);padding:var(--ddga-space-2) var(--ddga-space-3);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-background);display:flex}.ddga-file-upload__item-icon{color:var(--ddga-color-muted-foreground);flex:none;font-size:1.125rem;display:inline-flex}.ddga-file-upload__item[data-status=success] .ddga-file-upload__item-icon{color:var(--ddga-color-success)}.ddga-file-upload__item[data-status=error] .ddga-file-upload__item-icon{color:var(--ddga-color-error)}.ddga-file-upload__item-main{gap:var(--ddga-space-1);flex-direction:column;flex:auto;min-inline-size:0;display:flex}.ddga-file-upload__item-head{justify-content:space-between;align-items:baseline;gap:var(--ddga-space-3);display:flex}.ddga-file-upload__item-name{text-overflow:ellipsis;white-space:nowrap;font-size:var(--ddga-font-size-sm);color:var(--ddga-text-primary);overflow:hidden}.ddga-file-upload__item-meta{font-size:var(--ddga-font-size-xs);color:var(--ddga-text-secondary);font-variant-numeric:tabular-nums;flex:none}.ddga-file-upload__item-error{font-size:var(--ddga-font-size-xs);color:var(--ddga-color-error)}.ddga-file-upload__item-remove{flex:none}@media (forced-colors:active){.ddga-file-upload__dropzone:focus-within,.ddga-file-upload__dropzone[data-dragging]{outline-offset:2px;outline:2px solid highlight}}}
 /*# sourceMappingURL=file-upload.css.map */

package/dist/components/file-upload.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"mappings":"AAAA,uBAIE,iDAMA,sJAOA,sFAOA,iZAkBA,+GAMA,yHAMA,6LAOA,wEAIA,kIAKA,kHAMA,0GAKA,kFAKA,4FAOA,+JAcA,sHASA,4PAUA,uHAOA,0GAIA,sGAIA,oHAQA,qHAOA,yJAQA,6IAOA,+FAKA","sources":["src/components/file-upload.css"],"sourcesContent":["@layer ddga-components {\n /* Wrapper (.ddga-field) + helper/error (.ddga-field__message) are shared\n , see field.css. Only FileUpload-specific styles live here. /\n\n .ddga-file-upload {\n color: var(--ddga-text-primary);\n }\n\n / ─── Label ─── /\n\n .ddga-file-upload__label {\n color: var(--ddga-text-primary);\n font-weight: var(--ddga-font-weight-medium);\n font-size: var(--ddga-font-size-sm);\n line-height: 1.4;\n }\n\n .ddga-file-upload__required {\n color: var(--ddga-color-error);\n margin-inline-start: 0.125rem;\n }\n\n / ─── Drop zone ─── /\n\n .ddga-file-upload__dropzone {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: var(--ddga-space-2);\n padding: var(--ddga-space-6) var(--ddga-space-4);\n border: 1px dashed var(--ddga-color-input);\n border-radius: var(--ddga-radius-md);\n background-color: var(--ddga-color-background);\n text-align: center;\n cursor: pointer;\n transition:\n border-color 150ms ease,\n background-color 150ms ease,\n box-shadow 150ms ease;\n }\n\n .ddga-file-upload__dropzone:hover {\n border-color: var(--ddga-color-ring);\n background-color: var(--ddga-color-muted);\n }\n\n / Focus ring driven by the (visually hidden) input inside the zone. /\n .ddga-file-upload__dropzone:focus-within {\n border-color: var(--ddga-color-ring);\n box-shadow: 0 0 0 1px var(--ddga-color-ring);\n }\n\n / Active drag-over state. /\n .ddga-file-upload__dropzone[data-dragging] {\n border-color: var(--ddga-color-primary);\n border-style: solid;\n background-color: var(--ddga-color-muted);\n box-shadow: 0 0 0 1px var(--ddga-color-primary);\n }\n\n .ddga-file-upload__dropzone--error {\n border-color: var(--ddga-color-error);\n }\n\n .ddga-file-upload__dropzone--error:focus-within {\n border-color: var(--ddga-color-error);\n box-shadow: 0 0 0 1px var(--ddga-color-error);\n }\n\n .ddga-file-upload__dropzone[data-disabled] {\n cursor: not-allowed;\n opacity: 0.6;\n background-color: var(--ddga-color-muted);\n }\n\n .ddga-file-upload__dropzone[data-disabled]:hover {\n border-color: var(--ddga-color-input);\n border-style: dashed;\n }\n\n .ddga-file-upload__icon {\n font-size: 1.5rem;\n color: var(--ddga-color-muted-foreground);\n }\n\n .ddga-file-upload__hint {\n font-size: var(--ddga-font-size-sm);\n color: var(--ddga-text-secondary);\n }\n\n / Visually hidden, but kept focusable so keyboard users can tab to it and\n press Space/Enter to open the picker. (Not display:none / tabindex=-1.) /\n .ddga-file-upload__input {\n position: absolute;\n inline-size: 1px;\n block-size: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0 0 0 0);\n white-space: nowrap;\n border: 0;\n }\n\n / ─── File list ─── */\n\n .ddga-file-upload__list {\n display: flex;\n flex-direction: column;\n gap: var(--ddga-space-2);\n margin: 0;\n padding: 0;\n list-style: none;\n }\n\n .ddga-file-upload__item {\n display: flex;\n align-items: center;\n gap: var(--ddga-space-3);\n padding: var(--ddga-space-2) var(--ddga-space-3);\n border: 1px solid var(--ddga-color-border);\n border-radius: var(--ddga-radius-sm);\n background-color: var(--ddga-color-background);\n }\n\n .ddga-file-upload__item-icon {\n display: inline-flex;\n flex: none;\n font-size: 1.125rem;\n color: var(--ddga-color-muted-foreground);\n }\n\n .ddga-file-upload__item[data-status='success'] .ddga-file-upload__item-icon {\n color: var(--ddga-color-success);\n }\n\n .ddga-file-upload__item[data-status='error'] .ddga-file-upload__item-icon {\n color: var(--ddga-color-error);\n }\n\n .ddga-file-upload__item-main {\n display: flex;\n flex-direction: column;\n gap: var(--ddga-space-1);\n flex: 1 1 auto;\n min-inline-size: 0;\n }\n\n .ddga-file-upload__item-head {\n display: flex;\n align-items: baseline;\n justify-content: space-between;\n gap: var(--ddga-space-3);\n }\n\n .ddga-file-upload__item-name {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n font-size: var(--ddga-font-size-sm);\n color: var(--ddga-text-primary);\n }\n\n .ddga-file-upload__item-meta {\n flex: none;\n font-size: var(--ddga-font-size-xs);\n color: var(--ddga-text-secondary);\n font-variant-numeric: tabular-nums;\n }\n\n .ddga-file-upload__item-error {\n font-size: var(--ddga-font-size-xs);\n color: var(--ddga-color-error);\n }\n\n .ddga-file-upload__item-remove {\n flex: none;\n }\n}\n"],"names":[]}
1	+ {"version":3,"mappings":"AAAA,uBAIE,iDAMA,sJAOA,sFAOA,iZAkBA,+GAMA,yHAMA,6LAOA,wEAIA,kIAKA,kHAMA,0GAKA,kFAKA,4FAOA,+JAcA,sHASA,4PAUA,uHAOA,0GAIA,sGAIA,oHAQA,qHAOA,yJAQA,6IAOA,+FAKA,yCASA,8BACE","sources":["src/components/file-upload.css"],"sourcesContent":["@layer ddga-components {\n /* Wrapper (.ddga-field) + helper/error (.ddga-field__message) are shared\n , see field.css. Only FileUpload-specific styles live here. /\n\n .ddga-file-upload {\n color: var(--ddga-text-primary);\n }\n\n / ─── Label ─── /\n\n .ddga-file-upload__label {\n color: var(--ddga-text-primary);\n font-weight: var(--ddga-font-weight-medium);\n font-size: var(--ddga-font-size-sm);\n line-height: 1.4;\n }\n\n .ddga-file-upload__required {\n color: var(--ddga-color-error);\n margin-inline-start: 0.125rem;\n }\n\n / ─── Drop zone ─── /\n\n .ddga-file-upload__dropzone {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: var(--ddga-space-2);\n padding: var(--ddga-space-6) var(--ddga-space-4);\n border: 1px dashed var(--ddga-color-input);\n border-radius: var(--ddga-radius-md);\n background-color: var(--ddga-color-background);\n text-align: center;\n cursor: pointer;\n transition:\n border-color 150ms ease,\n background-color 150ms ease,\n box-shadow 150ms ease;\n }\n\n .ddga-file-upload__dropzone:hover {\n border-color: var(--ddga-color-ring);\n background-color: var(--ddga-color-muted);\n }\n\n / Focus ring driven by the (visually hidden) input inside the zone. /\n .ddga-file-upload__dropzone:focus-within {\n border-color: var(--ddga-color-ring);\n box-shadow: 0 0 0 1px var(--ddga-color-ring);\n }\n\n / Active drag-over state. /\n .ddga-file-upload__dropzone[data-dragging] {\n border-color: var(--ddga-color-primary);\n border-style: solid;\n background-color: var(--ddga-color-muted);\n box-shadow: 0 0 0 1px var(--ddga-color-primary);\n }\n\n .ddga-file-upload__dropzone--error {\n border-color: var(--ddga-color-error);\n }\n\n .ddga-file-upload__dropzone--error:focus-within {\n border-color: var(--ddga-color-error);\n box-shadow: 0 0 0 1px var(--ddga-color-error);\n }\n\n .ddga-file-upload__dropzone[data-disabled] {\n cursor: not-allowed;\n opacity: 0.6;\n background-color: var(--ddga-color-muted);\n }\n\n .ddga-file-upload__dropzone[data-disabled]:hover {\n border-color: var(--ddga-color-input);\n border-style: dashed;\n }\n\n .ddga-file-upload__icon {\n font-size: 1.5rem;\n color: var(--ddga-color-muted-foreground);\n }\n\n .ddga-file-upload__hint {\n font-size: var(--ddga-font-size-sm);\n color: var(--ddga-text-secondary);\n }\n\n / Visually hidden, but kept focusable so keyboard users can tab to it and\n press Space/Enter to open the picker. (Not display:none / tabindex=-1.) /\n .ddga-file-upload__input {\n position: absolute;\n inline-size: 1px;\n block-size: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0 0 0 0);\n white-space: nowrap;\n border: 0;\n }\n\n / ─── File list ─── /\n\n .ddga-file-upload__list {\n display: flex;\n flex-direction: column;\n gap: var(--ddga-space-2);\n margin: 0;\n padding: 0;\n list-style: none;\n }\n\n .ddga-file-upload__item {\n display: flex;\n align-items: center;\n gap: var(--ddga-space-3);\n padding: var(--ddga-space-2) var(--ddga-space-3);\n border: 1px solid var(--ddga-color-border);\n border-radius: var(--ddga-radius-sm);\n background-color: var(--ddga-color-background);\n }\n\n .ddga-file-upload__item-icon {\n display: inline-flex;\n flex: none;\n font-size: 1.125rem;\n color: var(--ddga-color-muted-foreground);\n }\n\n .ddga-file-upload__item[data-status='success'] .ddga-file-upload__item-icon {\n color: var(--ddga-color-success);\n }\n\n .ddga-file-upload__item[data-status='error'] .ddga-file-upload__item-icon {\n color: var(--ddga-color-error);\n }\n\n .ddga-file-upload__item-main {\n display: flex;\n flex-direction: column;\n gap: var(--ddga-space-1);\n flex: 1 1 auto;\n min-inline-size: 0;\n }\n\n .ddga-file-upload__item-head {\n display: flex;\n align-items: baseline;\n justify-content: space-between;\n gap: var(--ddga-space-3);\n }\n\n .ddga-file-upload__item-name {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n font-size: var(--ddga-font-size-sm);\n color: var(--ddga-text-primary);\n }\n\n .ddga-file-upload__item-meta {\n flex: none;\n font-size: var(--ddga-font-size-xs);\n color: var(--ddga-text-secondary);\n font-variant-numeric: tabular-nums;\n }\n\n .ddga-file-upload__item-error {\n font-size: var(--ddga-font-size-xs);\n color: var(--ddga-color-error);\n }\n\n .ddga-file-upload__item-remove {\n flex: none;\n }\n\n / ─── Forced colors (Windows High Contrast) ─── /\n\n / The focus + drag-active indicators are box-shadow rings, which forced-colors\n neutralizes — restore them as a system-colored outline so keyboard focus and\n the active drop target stay visible. */\n @media (forced-colors: active) {\n .ddga-file-upload__dropzone:focus-within,\n .ddga-file-upload__dropzone[data-dragging] {\n outline: 2px solid Highlight;\n outline-offset: 2px;\n }\n }\n}\n"],"names":[]}

package/dist/components/menubar.css CHANGED Viewed

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-menubar{align-items:center;gap:var(--ddga-space-1);padding:var(--ddga-space-1);background-color:var(--ddga-color-background);color:var(--ddga-color-foreground);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-md);font-family:inherit;display:flex}.ddga-menubar__trigger{padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);font-size:var(--ddga-font-size-base);font-weight:var(--ddga-font-weight-medium);color:inherit;cursor:default;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;border:1px solid #0000;outline:none;align-items:center;transition:background-color .12s,border-color .12s,color .12s;display:inline-flex;position:relative}.ddga-menubar__trigger:focus-visible{box-shadow:0 0 0 2px var(--ddga-color-ring)}.ddga-menubar__trigger[data-disabled]{color:var(--ddga-text-tertiary);pointer-events:none}.ddga-menubar__trigger--default:after{content:"";inset-inline:var(--ddga-space-2);border-radius:var(--ddga-radius-full);background-color:#0000;block-size:2px;transition:background-color .12s;position:absolute;inset-block-end:2px}.ddga-menubar__trigger--default[data-highlighted]{background-color:var(--ddga-color-muted)}.ddga-menubar__trigger--default[data-state=open]{background-color:var(--ddga-color-muted);color:var(--ddga-color-primary)}.ddga-menubar__trigger--default[data-state=open]:after{background-color:var(--ddga-color-primary)}.ddga-menubar__trigger--outline{border-color:var(--ddga-color-border)}.ddga-menubar__trigger--outline[data-highlighted]{background-color:var(--ddga-color-muted)}.ddga-menubar__trigger--outline[data-state=open]{border-color:var(--ddga-color-primary);color:var(--ddga-color-primary)}.ddga-menubar-menu{min-inline-size:192px;max-inline-size:320px;padding:var(--ddga-space-1);background-color:var(--ddga-color-background);color:var(--ddga-color-foreground);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-md);box-shadow:var(--ddga-shadow-md);z-index:50;outline:none;font-family:inherit}.ddga-menubar-menu[data-state=open]{animation:.12s cubic-bezier(.16,1,.3,1) ddga-menubar-menu-in}.ddga-menubar-menu[data-state=closed]{animation:80ms ease-in ddga-menubar-menu-out}@keyframes ddga-menubar-menu-in{0%{opacity:0;transform:translateY(-2px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes ddga-menubar-menu-out{0%{opacity:1}to{opacity:0}}.ddga-menubar-menu--sm{font-size:var(--ddga-font-size-sm)}.ddga-menubar-menu--md{font-size:var(--ddga-font-size-base)}.ddga-menubar-menu__item{align-items:center;gap:var(--ddga-space-2);inline-size:100%;padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);color:inherit;cursor:default;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;outline:none;display:flex}.ddga-menubar-menu__item[data-highlighted]{background-color:var(--ddga-color-muted)}.ddga-menubar-menu__item[data-disabled]{color:var(--ddga-text-tertiary);pointer-events:none}.ddga-menubar-menu__item[data-destructive]{color:var(--ddga-color-destructive)}.ddga-menubar-menu__item[data-destructive][data-highlighted]{background-color:var(--ddga-error-50)}.ddga-menubar-menu__label{white-space:nowrap;text-overflow:ellipsis;flex:auto;min-inline-size:0;overflow:hidden}.ddga-menubar-menu__icon{block-size:1em;inline-size:1em;color:var(--ddga-text-secondary);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-menubar-menu__icon>svg{block-size:1em;inline-size:1em}.ddga-menubar-menu__shortcut{font-size:var(--ddga-font-size-xs);color:var(--ddga-text-tertiary);letter-spacing:.04em;margin-inline-start:auto}.ddga-menubar-menu__item--checkable{padding-inline-start:calc(var(--ddga-space-2) + 1.25em);position:relative}.ddga-menubar-menu__indicator{block-size:1em;inline-size:1em;color:var(--ddga-color-primary);justify-content:center;align-items:center;display:inline-flex;position:absolute;inset-block-start:50%;inset-inline-start:var(--ddga-space-2);transform:translateY(-50%)}.ddga-menubar-menu__indicator-icon{block-size:.875em;inline-size:.875em}.ddga-menubar-menu__radio-dot{border-radius:var(--ddga-radius-full);background-color:currentColor;block-size:.5em;inline-size:.5em;display:inline-block}.ddga-menubar-menu__item--sub[data-state=open]{background-color:var(--ddga-color-muted)}.ddga-menubar-menu__sub-chevron{block-size:1em;inline-size:1em;color:var(--ddga-text-tertiary);margin-inline-start:auto}[dir=rtl] .ddga-menubar-menu__sub-chevron{transform:scaleX(-1)}.ddga-menubar-menu__group-label{padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);font-size:var(--ddga-font-size-xs);font-weight:var(--ddga-font-weight-semibold);color:var(--ddga-text-tertiary);text-transform:uppercase;letter-spacing:.04em}.ddga-menubar-menu__separator{block-size:1px;margin-block:var(--ddga-space-1);margin-inline:calc(var(--ddga-space-1) * -1);background-color:var(--ddga-color-border)}@media (forced-colors:active){.ddga-menubar{border:1px solid canvastext}.ddga-menubar__trigger[data-highlighted],.ddga-menubar__trigger[data-state=open]{color:highlighttext;background-color:highlight}.ddga-menubar__trigger:focus-visible{outline-offset:2px;outline:2px solid highlight}.ddga-menubar-menu{border:1px solid canvastext}.ddga-menubar-menu__item[data-highlighted]{color:highlighttext;background-color:highlight}.ddga-menubar-menu__separator{background-color:canvastext}}@media (prefers-reduced-motion:reduce){.ddga-menubar__trigger,.ddga-menubar__trigger--default:after{transition:none}.ddga-menubar-menu[data-state=open],.ddga-menubar-menu[data-state=closed]{animation:none}}}
+@layer ddga-components{.ddga-menubar{align-items:center;gap:var(--ddga-space-1);padding:var(--ddga-space-1);background-color:var(--ddga-color-background);color:var(--ddga-color-foreground);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-md);font-family:inherit;display:flex}.ddga-menubar__trigger{padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);font-size:var(--ddga-font-size-base);font-weight:var(--ddga-font-weight-medium);color:inherit;cursor:default;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;border:1px solid #0000;outline:none;align-items:center;transition:background-color .12s,border-color .12s,color .12s;display:inline-flex;position:relative}.ddga-menubar__trigger:focus-visible{box-shadow:0 0 0 2px var(--ddga-color-ring)}.ddga-menubar__trigger[data-disabled]{color:var(--ddga-text-tertiary);pointer-events:none}.ddga-menubar__trigger--default:after{content:"";inset-inline:var(--ddga-space-2);border-radius:var(--ddga-radius-full);background-color:#0000;block-size:2px;transition:background-color .12s;position:absolute;inset-block-end:2px}.ddga-menubar__trigger--default[data-highlighted]{background-color:var(--ddga-color-muted)}.ddga-menubar__trigger--default[data-state=open]{background-color:var(--ddga-color-muted);color:var(--ddga-color-primary)}.ddga-menubar__trigger--default[data-state=open]:after{background-color:var(--ddga-color-primary)}.ddga-menubar__trigger--outline{border-color:var(--ddga-color-border)}.ddga-menubar__trigger--outline[data-highlighted]{background-color:var(--ddga-color-muted)}.ddga-menubar__trigger--outline[data-state=open]{border-color:var(--ddga-color-primary);color:var(--ddga-color-primary)}.ddga-menubar-menu{min-inline-size:192px;max-inline-size:320px;padding:var(--ddga-space-1);background-color:var(--ddga-color-background);color:var(--ddga-color-foreground);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-md);box-shadow:var(--ddga-shadow-md);z-index:50;outline:none;font-family:inherit}.ddga-menubar-menu[data-state=open]{animation:.12s cubic-bezier(.16,1,.3,1) ddga-menubar-menu-in}.ddga-menubar-menu[data-state=closed]{animation:80ms ease-in ddga-menubar-menu-out}@keyframes ddga-menubar-menu-in{0%{opacity:0;transform:translateY(-2px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes ddga-menubar-menu-out{0%{opacity:1}to{opacity:0}}.ddga-menubar-menu--sm{font-size:var(--ddga-font-size-sm)}.ddga-menubar-menu--md{font-size:var(--ddga-font-size-base)}.ddga-menubar-menu__item{align-items:center;gap:var(--ddga-space-2);inline-size:100%;padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);color:inherit;cursor:default;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;outline:none;display:flex}.ddga-menubar-menu__item[data-highlighted]{background-color:var(--ddga-color-muted)}.ddga-menubar-menu__item[data-disabled]{color:var(--ddga-text-tertiary);pointer-events:none}.ddga-menubar-menu__item[data-destructive]{color:var(--ddga-color-destructive)}.ddga-menubar-menu__item[data-destructive][data-highlighted]{background-color:var(--ddga-error-50)}.ddga-menubar-menu__label{white-space:nowrap;text-overflow:ellipsis;flex:auto;min-inline-size:0;overflow:hidden}.ddga-menubar-menu__icon{block-size:1em;inline-size:1em;color:var(--ddga-text-secondary);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.ddga-menubar-menu__icon>svg{block-size:1em;inline-size:1em}.ddga-menubar-menu__shortcut{font-size:var(--ddga-font-size-xs);color:var(--ddga-text-tertiary);letter-spacing:.04em;margin-inline-start:auto}.ddga-menubar-menu__item--checkable{padding-inline-start:calc(var(--ddga-space-2) + 1.25em);position:relative}.ddga-menubar-menu__indicator{block-size:1em;inline-size:1em;color:var(--ddga-color-primary);justify-content:center;align-items:center;display:inline-flex;position:absolute;inset-block-start:50%;inset-inline-start:var(--ddga-space-2);transform:translateY(-50%)}.ddga-menubar-menu__indicator-icon{block-size:.875em;inline-size:.875em}.ddga-menubar-menu__radio-dot{border-radius:var(--ddga-radius-full);background-color:currentColor;block-size:.5em;inline-size:.5em;display:inline-block}.ddga-menubar-menu__item--sub[data-state=open]{background-color:var(--ddga-color-muted)}.ddga-menubar-menu__sub-chevron{block-size:1em;inline-size:1em;color:var(--ddga-text-tertiary);margin-inline-start:auto}[dir=rtl] .ddga-menubar-menu__sub-chevron{transform:scaleX(-1)}.ddga-menubar-menu__group-label{padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);font-size:var(--ddga-font-size-xs);font-weight:var(--ddga-font-weight-semibold);color:var(--ddga-text-tertiary);text-transform:uppercase;letter-spacing:.04em}[dir=rtl] .ddga-menubar-menu__group-label{letter-spacing:normal;text-transform:none}[dir=rtl] .ddga-menubar-menu__shortcut{letter-spacing:normal}.ddga-menubar-menu__separator{block-size:1px;margin-block:var(--ddga-space-1);margin-inline:calc(var(--ddga-space-1) * -1);background-color:var(--ddga-color-border)}[data-theme=dark] .ddga-menubar-menu__item[data-destructive][data-highlighted]{color:var(--ddga-error-200,#fecdca);background-color:#d92d203d}@media (forced-colors:active){.ddga-menubar{border:1px solid canvastext}.ddga-menubar__trigger[data-highlighted],.ddga-menubar__trigger[data-state=open]{color:highlighttext;background-color:highlight}.ddga-menubar__trigger:focus-visible{outline-offset:2px;outline:2px solid highlight}.ddga-menubar-menu{border:1px solid canvastext}.ddga-menubar-menu__item[data-highlighted]{color:highlighttext;background-color:highlight}.ddga-menubar-menu__separator{background-color:canvastext}}@media (prefers-reduced-motion:reduce){.ddga-menubar__trigger,.ddga-menubar__trigger--default:after{transition:none}.ddga-menubar-menu[data-state=open],.ddga-menubar-menu[data-state=closed]{animation:none}}}
 /*# sourceMappingURL=menubar.css.map */

package/dist/components/menubar.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"mappings":"AAAA,uBAGE,qRAiBA,0dAqBA,iFAIA,0FAUA,qOAYA,2FAMA,0HAIA,kGAMA,sEAKA,2FAMA,wHAOA,uUAgBA,iGAGA,mFAIA,gIAUA,4DAWA,0DAGA,4DAMA,uUAiBA,oFAIA,4FAOA,+EAGA,mGAKA,gHAQA,qKASA,4DAKA,8IASA,8GAMA,qQAYA,wEAIA,wJAYA,wFAIA,wHAQA,+DAMA,mQAUA,qKASA,8BACE,0CAGA,gIAKA,oFAIA,+CAGA,0FAIA,2DAOF,uCACE,6EAIA","sources":["src/components/menubar.css"],"sourcesContent":["@layer ddga-components {\n /* ─── Bar (Menubar.Root) ─── /\n\n .ddga-menubar {\n display: flex;\n align-items: center;\n gap: var(--ddga-space-1);\n padding: var(--ddga-space-1);\n background-color: var(--ddga-color-background);\n color: var(--ddga-color-foreground);\n border: 1px solid var(--ddga-color-border);\n border-radius: var(--ddga-radius-md);\n font-family: inherit;\n }\n\n / ─── Bar trigger (File / Edit / View…) ─── /\n\n / Shared base across variants. A transparent 1px border is reserved so the\n `outline` variant only flips border-color (no layout shift), and `default`\n stays visually borderless. /\n .ddga-menubar__trigger {\n position: relative;\n display: inline-flex;\n align-items: center;\n padding-block: var(--ddga-space-1);\n padding-inline: var(--ddga-space-2);\n border: 1px solid transparent;\n border-radius: var(--ddga-radius-sm);\n font-size: var(--ddga-font-size-base);\n font-weight: var(--ddga-font-weight-medium);\n color: inherit;\n cursor: default;\n user-select: none;\n outline: none;\n -webkit-tap-highlight-color: transparent;\n transition:\n background-color 120ms ease,\n border-color 120ms ease,\n color 120ms ease;\n }\n\n .ddga-menubar__trigger:focus-visible {\n box-shadow: 0 0 0 2px var(--ddga-color-ring);\n }\n\n .ddga-menubar__trigger[data-disabled] {\n color: var(--ddga-text-tertiary);\n pointer-events: none;\n }\n\n / ── Variant: default (flat menu-bar idiom) ── /\n\n / SA-green underline indicator for the open menu — reserved (transparent) at\n rest so nothing shifts, animated in on open. Mirrors the Tabs active-tab\n treatment (same --ddga-color-primary accent). /\n .ddga-menubar__trigger--default::after {\n content: '';\n position: absolute;\n inset-inline: var(--ddga-space-2);\n inset-block-end: 2px;\n block-size: 2px;\n border-radius: var(--ddga-radius-full);\n background-color: transparent;\n transition: background-color 120ms ease;\n }\n\n / Radix sets data-highlighted on hover / keyboard focus → soft surface. /\n .ddga-menubar__trigger--default[data-highlighted] {\n background-color: var(--ddga-color-muted);\n }\n\n / data-state=open: this trigger's menu is showing → on-brand accent (green\n label + underline), kept on the muted surface so the row reads active. /\n .ddga-menubar__trigger--default[data-state='open'] {\n background-color: var(--ddga-color-muted);\n color: var(--ddga-color-primary);\n }\n .ddga-menubar__trigger--default[data-state='open']::after {\n background-color: var(--ddga-color-primary);\n }\n\n / ── Variant: outline (bordered button-style chip) ── /\n\n .ddga-menubar__trigger--outline {\n border-color: var(--ddga-color-border);\n }\n\n / Hover / keyboard focus → soft surface fill (border stays neutral). /\n .ddga-menubar__trigger--outline[data-highlighted] {\n background-color: var(--ddga-color-muted);\n }\n\n / Open menu → SA-green border + green label (the border is the accent here,\n so no underline for this variant). /\n .ddga-menubar__trigger--outline[data-state='open'] {\n border-color: var(--ddga-color-primary);\n color: var(--ddga-color-primary);\n }\n\n / ─── Panel (Content / SubContent) ─── /\n\n .ddga-menubar-menu {\n min-inline-size: 192px;\n max-inline-size: 320px;\n padding: var(--ddga-space-1);\n background-color: var(--ddga-color-background);\n color: var(--ddga-color-foreground);\n border: 1px solid var(--ddga-color-border);\n border-radius: var(--ddga-radius-md);\n box-shadow: var(--ddga-shadow-md);\n font-family: inherit;\n z-index: 50;\n outline: none;\n }\n\n / Enter/exit animations follow Radix data-state. Keep them subtle so menu\n surfaces feel instantaneous (this isn't a Modal). /\n .ddga-menubar-menu[data-state='open'] {\n animation: ddga-menubar-menu-in 120ms cubic-bezier(0.16, 1, 0.3, 1);\n }\n .ddga-menubar-menu[data-state='closed'] {\n animation: ddga-menubar-menu-out 80ms ease-in;\n }\n\n @keyframes ddga-menubar-menu-in {\n from {\n opacity: 0;\n transform: translateY(-2px) scale(0.98);\n }\n to {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n }\n @keyframes ddga-menubar-menu-out {\n from {\n opacity: 1;\n }\n to {\n opacity: 0;\n }\n }\n\n / ─── Sizes ─── /\n\n .ddga-menubar-menu--sm {\n font-size: var(--ddga-font-size-sm);\n }\n .ddga-menubar-menu--md {\n font-size: var(--ddga-font-size-base);\n }\n\n / ─── Item (and CheckboxItem/RadioItem/SubTrigger share the base) ─── /\n\n .ddga-menubar-menu__item {\n display: flex;\n align-items: center;\n gap: var(--ddga-space-2);\n inline-size: 100%;\n padding-block: var(--ddga-space-1);\n padding-inline: var(--ddga-space-2);\n border-radius: var(--ddga-radius-sm);\n color: inherit;\n cursor: default;\n user-select: none;\n outline: none;\n -webkit-tap-highlight-color: transparent;\n }\n\n / Radix sets data-highlighted on the actively focused/hovered item — that's\n our only \"focus ring\" since the menu manages focus internally. /\n .ddga-menubar-menu__item[data-highlighted] {\n background-color: var(--ddga-color-muted);\n }\n\n .ddga-menubar-menu__item[data-disabled] {\n color: var(--ddga-text-tertiary);\n pointer-events: none;\n }\n\n / Destructive: red text and a red-tinted hover. Tracks the destructive\n family the rest of the system uses. /\n .ddga-menubar-menu__item[data-destructive] {\n color: var(--ddga-color-destructive);\n }\n .ddga-menubar-menu__item[data-destructive][data-highlighted] {\n background-color: var(--ddga-error-50);\n }\n\n / Inline pieces inside the row. /\n .ddga-menubar-menu__label {\n flex: 1 1 auto;\n min-inline-size: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .ddga-menubar-menu__icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n inline-size: 1em;\n block-size: 1em;\n flex-shrink: 0;\n color: var(--ddga-text-secondary);\n }\n .ddga-menubar-menu__icon > svg {\n inline-size: 1em;\n block-size: 1em;\n }\n\n .ddga-menubar-menu__shortcut {\n margin-inline-start: auto;\n font-size: var(--ddga-font-size-xs);\n color: var(--ddga-text-tertiary);\n letter-spacing: 0.04em;\n }\n\n / ─── Indicator slot (Checkbox/Radio) ─── /\n\n .ddga-menubar-menu__item--checkable {\n / Reserve the indicator column even when unchecked so labels align. /\n padding-inline-start: calc(var(--ddga-space-2) + 1.25em);\n position: relative;\n }\n\n .ddga-menubar-menu__indicator {\n position: absolute;\n inset-inline-start: var(--ddga-space-2);\n inset-block-start: 50%;\n transform: translateY(-50%);\n display: inline-flex;\n align-items: center;\n justify-content: center;\n inline-size: 1em;\n block-size: 1em;\n color: var(--ddga-color-primary);\n }\n .ddga-menubar-menu__indicator-icon {\n inline-size: 0.875em;\n block-size: 0.875em;\n }\n .ddga-menubar-menu__radio-dot {\n / span is inline by default → inline-size/block-size are ignored. Force a\n sized inline-block so the filled circle actually renders. /\n display: inline-block;\n inline-size: 0.5em;\n block-size: 0.5em;\n border-radius: var(--ddga-radius-full);\n background-color: currentColor;\n }\n\n / ─── Submenu ─── /\n\n .ddga-menubar-menu__item--sub[data-state='open'] {\n background-color: var(--ddga-color-muted);\n }\n\n .ddga-menubar-menu__sub-chevron {\n margin-inline-start: auto;\n inline-size: 1em;\n block-size: 1em;\n color: var(--ddga-text-tertiary);\n }\n\n / Flip the sub-menu chevron in RTL — it should always point inline-end-ward. /\n [dir='rtl'] .ddga-menubar-menu__sub-chevron {\n transform: scaleX(-1);\n }\n\n / ─── Label + Separator ─── /\n\n .ddga-menubar-menu__group-label {\n padding-block: var(--ddga-space-1);\n padding-inline: var(--ddga-space-2);\n font-size: var(--ddga-font-size-xs);\n font-weight: var(--ddga-font-weight-semibold);\n color: var(--ddga-text-tertiary);\n text-transform: uppercase;\n letter-spacing: 0.04em;\n }\n\n .ddga-menubar-menu__separator {\n block-size: 1px;\n margin-block: var(--ddga-space-1);\n margin-inline: calc(var(--ddga-space-1) -1);\n background-color: var(--ddga-color-border);\n }\n\n /* ─── Forced colors ─── /\n\n @media (forced-colors: active) {\n .ddga-menubar {\n border: 1px solid CanvasText;\n }\n .ddga-menubar__trigger[data-highlighted],\n .ddga-menubar__trigger[data-state='open'] {\n background-color: Highlight;\n color: HighlightText;\n }\n .ddga-menubar__trigger:focus-visible {\n outline: 2px solid Highlight;\n outline-offset: 2px;\n }\n .ddga-menubar-menu {\n border: 1px solid CanvasText;\n }\n .ddga-menubar-menu__item[data-highlighted] {\n background-color: Highlight;\n color: HighlightText;\n }\n .ddga-menubar-menu__separator {\n background-color: CanvasText;\n }\n }\n\n / ─── Reduced motion ─── */\n\n @media (prefers-reduced-motion: reduce) {\n .ddga-menubar__trigger,\n .ddga-menubar__trigger--default::after {\n transition: none;\n }\n .ddga-menubar-menu[data-state='open'],\n .ddga-menubar-menu[data-state='closed'] {\n animation: none;\n }\n }\n}\n"],"names":[]}
1	+ {"version":3,"mappings":"AAAA,uBAGE,qRAiBA,0dAqBA,iFAIA,0FAUA,qOAYA,2FAMA,0HAIA,kGAMA,sEAKA,2FAMA,wHAOA,uUAgBA,iGAGA,mFAIA,gIAUA,4DAWA,0DAGA,4DAMA,uUAiBA,oFAIA,4FAOA,+EAGA,mGAKA,gHAQA,qKASA,4DAKA,8IASA,8GAMA,qQAYA,wEAIA,wJAYA,wFAIA,wHAQA,+DAMA,mQAYA,oFAIA,6DAIA,qKAYA,8IAOA,8BACE,0CAGA,gIAKA,oFAIA,+CAGA,0FAIA,2DAOF,uCACE,6EAIA","sources":["src/components/menubar.css"],"sourcesContent":["@layer ddga-components {\n /* ─── Bar (Menubar.Root) ─── /\n\n .ddga-menubar {\n display: flex;\n align-items: center;\n gap: var(--ddga-space-1);\n padding: var(--ddga-space-1);\n background-color: var(--ddga-color-background);\n color: var(--ddga-color-foreground);\n border: 1px solid var(--ddga-color-border);\n border-radius: var(--ddga-radius-md);\n font-family: inherit;\n }\n\n / ─── Bar trigger (File / Edit / View…) ─── /\n\n / Shared base across variants. A transparent 1px border is reserved so the\n `outline` variant only flips border-color (no layout shift), and `default`\n stays visually borderless. /\n .ddga-menubar__trigger {\n position: relative;\n display: inline-flex;\n align-items: center;\n padding-block: var(--ddga-space-1);\n padding-inline: var(--ddga-space-2);\n border: 1px solid transparent;\n border-radius: var(--ddga-radius-sm);\n font-size: var(--ddga-font-size-base);\n font-weight: var(--ddga-font-weight-medium);\n color: inherit;\n cursor: default;\n user-select: none;\n outline: none;\n -webkit-tap-highlight-color: transparent;\n transition:\n background-color 120ms ease,\n border-color 120ms ease,\n color 120ms ease;\n }\n\n .ddga-menubar__trigger:focus-visible {\n box-shadow: 0 0 0 2px var(--ddga-color-ring);\n }\n\n .ddga-menubar__trigger[data-disabled] {\n color: var(--ddga-text-tertiary);\n pointer-events: none;\n }\n\n / ── Variant: default (flat menu-bar idiom) ── /\n\n / SA-green underline indicator for the open menu — reserved (transparent) at\n rest so nothing shifts, animated in on open. Mirrors the Tabs active-tab\n treatment (same --ddga-color-primary accent). /\n .ddga-menubar__trigger--default::after {\n content: '';\n position: absolute;\n inset-inline: var(--ddga-space-2);\n inset-block-end: 2px;\n block-size: 2px;\n border-radius: var(--ddga-radius-full);\n background-color: transparent;\n transition: background-color 120ms ease;\n }\n\n / Radix sets data-highlighted on hover / keyboard focus → soft surface. /\n .ddga-menubar__trigger--default[data-highlighted] {\n background-color: var(--ddga-color-muted);\n }\n\n / data-state=open: this trigger's menu is showing → on-brand accent (green\n label + underline), kept on the muted surface so the row reads active. /\n .ddga-menubar__trigger--default[data-state='open'] {\n background-color: var(--ddga-color-muted);\n color: var(--ddga-color-primary);\n }\n .ddga-menubar__trigger--default[data-state='open']::after {\n background-color: var(--ddga-color-primary);\n }\n\n / ── Variant: outline (bordered button-style chip) ── /\n\n .ddga-menubar__trigger--outline {\n border-color: var(--ddga-color-border);\n }\n\n / Hover / keyboard focus → soft surface fill (border stays neutral). /\n .ddga-menubar__trigger--outline[data-highlighted] {\n background-color: var(--ddga-color-muted);\n }\n\n / Open menu → SA-green border + green label (the border is the accent here,\n so no underline for this variant). /\n .ddga-menubar__trigger--outline[data-state='open'] {\n border-color: var(--ddga-color-primary);\n color: var(--ddga-color-primary);\n }\n\n / ─── Panel (Content / SubContent) ─── /\n\n .ddga-menubar-menu {\n min-inline-size: 192px;\n max-inline-size: 320px;\n padding: var(--ddga-space-1);\n background-color: var(--ddga-color-background);\n color: var(--ddga-color-foreground);\n border: 1px solid var(--ddga-color-border);\n border-radius: var(--ddga-radius-md);\n box-shadow: var(--ddga-shadow-md);\n font-family: inherit;\n z-index: 50;\n outline: none;\n }\n\n / Enter/exit animations follow Radix data-state. Keep them subtle so menu\n surfaces feel instantaneous (this isn't a Modal). /\n .ddga-menubar-menu[data-state='open'] {\n animation: ddga-menubar-menu-in 120ms cubic-bezier(0.16, 1, 0.3, 1);\n }\n .ddga-menubar-menu[data-state='closed'] {\n animation: ddga-menubar-menu-out 80ms ease-in;\n }\n\n @keyframes ddga-menubar-menu-in {\n from {\n opacity: 0;\n transform: translateY(-2px) scale(0.98);\n }\n to {\n opacity: 1;\n transform: translateY(0) scale(1);\n }\n }\n @keyframes ddga-menubar-menu-out {\n from {\n opacity: 1;\n }\n to {\n opacity: 0;\n }\n }\n\n / ─── Sizes ─── /\n\n .ddga-menubar-menu--sm {\n font-size: var(--ddga-font-size-sm);\n }\n .ddga-menubar-menu--md {\n font-size: var(--ddga-font-size-base);\n }\n\n / ─── Item (and CheckboxItem/RadioItem/SubTrigger share the base) ─── /\n\n .ddga-menubar-menu__item {\n display: flex;\n align-items: center;\n gap: var(--ddga-space-2);\n inline-size: 100%;\n padding-block: var(--ddga-space-1);\n padding-inline: var(--ddga-space-2);\n border-radius: var(--ddga-radius-sm);\n color: inherit;\n cursor: default;\n user-select: none;\n outline: none;\n -webkit-tap-highlight-color: transparent;\n }\n\n / Radix sets data-highlighted on the actively focused/hovered item — that's\n our only \"focus ring\" since the menu manages focus internally. /\n .ddga-menubar-menu__item[data-highlighted] {\n background-color: var(--ddga-color-muted);\n }\n\n .ddga-menubar-menu__item[data-disabled] {\n color: var(--ddga-text-tertiary);\n pointer-events: none;\n }\n\n / Destructive: red text and a red-tinted hover. Tracks the destructive\n family the rest of the system uses. /\n .ddga-menubar-menu__item[data-destructive] {\n color: var(--ddga-color-destructive);\n }\n .ddga-menubar-menu__item[data-destructive][data-highlighted] {\n background-color: var(--ddga-error-50);\n }\n\n / Inline pieces inside the row. /\n .ddga-menubar-menu__label {\n flex: 1 1 auto;\n min-inline-size: 0;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n\n .ddga-menubar-menu__icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n inline-size: 1em;\n block-size: 1em;\n flex-shrink: 0;\n color: var(--ddga-text-secondary);\n }\n .ddga-menubar-menu__icon > svg {\n inline-size: 1em;\n block-size: 1em;\n }\n\n .ddga-menubar-menu__shortcut {\n margin-inline-start: auto;\n font-size: var(--ddga-font-size-xs);\n color: var(--ddga-text-tertiary);\n letter-spacing: 0.04em;\n }\n\n / ─── Indicator slot (Checkbox/Radio) ─── /\n\n .ddga-menubar-menu__item--checkable {\n / Reserve the indicator column even when unchecked so labels align. /\n padding-inline-start: calc(var(--ddga-space-2) + 1.25em);\n position: relative;\n }\n\n .ddga-menubar-menu__indicator {\n position: absolute;\n inset-inline-start: var(--ddga-space-2);\n inset-block-start: 50%;\n transform: translateY(-50%);\n display: inline-flex;\n align-items: center;\n justify-content: center;\n inline-size: 1em;\n block-size: 1em;\n color: var(--ddga-color-primary);\n }\n .ddga-menubar-menu__indicator-icon {\n inline-size: 0.875em;\n block-size: 0.875em;\n }\n .ddga-menubar-menu__radio-dot {\n / span is inline by default → inline-size/block-size are ignored. Force a\n sized inline-block so the filled circle actually renders. /\n display: inline-block;\n inline-size: 0.5em;\n block-size: 0.5em;\n border-radius: var(--ddga-radius-full);\n background-color: currentColor;\n }\n\n / ─── Submenu ─── /\n\n .ddga-menubar-menu__item--sub[data-state='open'] {\n background-color: var(--ddga-color-muted);\n }\n\n .ddga-menubar-menu__sub-chevron {\n margin-inline-start: auto;\n inline-size: 1em;\n block-size: 1em;\n color: var(--ddga-text-tertiary);\n }\n\n / Flip the sub-menu chevron in RTL — it should always point inline-end-ward. /\n [dir='rtl'] .ddga-menubar-menu__sub-chevron {\n transform: scaleX(-1);\n }\n\n / ─── Label + Separator ─── /\n\n .ddga-menubar-menu__group-label {\n padding-block: var(--ddga-space-1);\n padding-inline: var(--ddga-space-2);\n font-size: var(--ddga-font-size-xs);\n font-weight: var(--ddga-font-weight-semibold);\n color: var(--ddga-text-tertiary);\n text-transform: uppercase;\n letter-spacing: 0.04em;\n }\n / Protect Arabic cursive joining — drop the tracking + casing when RTL\n (mirrors dropdown-menu.css / command.css). The shortcut hint is usually\n Latin but reset it too for parity. /\n [dir='rtl'] .ddga-menubar-menu__group-label {\n letter-spacing: normal;\n text-transform: none;\n }\n [dir='rtl'] .ddga-menubar-menu__shortcut {\n letter-spacing: normal;\n }\n\n .ddga-menubar-menu__separator {\n block-size: 1px;\n margin-block: var(--ddga-space-1);\n margin-inline: calc(var(--ddga-space-1) -1);\n background-color: var(--ddga-color-border);\n }\n\n /* ─── Dark mode ─── /\n\n / The destructive-hover background uses the raw --ddga-error-50 tint\n (near-white), which doesn't adapt in dark mode. Override with a translucent\n red + a light-red foreground for contrast (mirrors dropdown-menu.css). /\n [data-theme='dark'] .ddga-menubar-menu__item[data-destructive][data-highlighted] {\n background-color: rgb(217 45 32 / 0.24);\n color: var(--ddga-error-200, #fecdca);\n }\n\n / ─── Forced colors ─── /\n\n @media (forced-colors: active) {\n .ddga-menubar {\n border: 1px solid CanvasText;\n }\n .ddga-menubar__trigger[data-highlighted],\n .ddga-menubar__trigger[data-state='open'] {\n background-color: Highlight;\n color: HighlightText;\n }\n .ddga-menubar__trigger:focus-visible {\n outline: 2px solid Highlight;\n outline-offset: 2px;\n }\n .ddga-menubar-menu {\n border: 1px solid CanvasText;\n }\n .ddga-menubar-menu__item[data-highlighted] {\n background-color: Highlight;\n color: HighlightText;\n }\n .ddga-menubar-menu__separator {\n background-color: CanvasText;\n }\n }\n\n / ─── Reduced motion ─── */\n\n @media (prefers-reduced-motion: reduce) {\n .ddga-menubar__trigger,\n .ddga-menubar__trigger--default::after {\n transition: none;\n }\n .ddga-menubar-menu[data-state='open'],\n .ddga-menubar-menu[data-state='closed'] {\n animation: none;\n }\n }\n}\n"],"names":[]}

package/dist/components/progress.css CHANGED Viewed

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-progress{background-color:var(--ddga-gray-200);border-radius:var(--ddga-radius-full);inline-size:100%;position:relative;overflow:hidden}.ddga-progress--sm{block-size:4px}.ddga-progress--md{block-size:8px}.ddga-progress--lg{block-size:12px}.ddga-progress--primary{--ddga-progress-color:var(--ddga-color-primary)}.ddga-progress--success{--ddga-progress-color:var(--ddga-color-success)}.ddga-progress--warning{--ddga-progress-color:var(--ddga-color-warning)}.ddga-progress--destructive{--ddga-progress-color:var(--ddga-color-destructive)}.ddga-progress__indicator{background-color:var(--ddga-progress-color,var(--ddga-color-primary));border-radius:inherit;block-size:100%;inline-size:100%;transition:transform .2s ease-out}.ddga-progress[data-state=indeterminate] .ddga-progress__indicator{inline-size:40%;transition:none;animation:1.4s cubic-bezier(.65,.05,.36,1) infinite ddga-progress-slide;transform:translate(-100%)}@keyframes ddga-progress-slide{0%{transform:translate(-100%)}to{transform:translate(350%)}}[dir=rtl] .ddga-progress[data-state=indeterminate] .ddga-progress__indicator{animation-name:ddga-progress-slide-rtl}@keyframes ddga-progress-slide-rtl{0%{transform:translate(100%)}to{transform:translate(-350%)}}.ddga-circular-progress{flex-shrink:0;justify-content:center;align-items:center;display:inline-flex;position:relative}.ddga-circular-progress--primary{--ddga-progress-color:var(--ddga-color-primary)}.ddga-circular-progress--success{--ddga-progress-color:var(--ddga-color-success)}.ddga-circular-progress--warning{--ddga-progress-color:var(--ddga-color-warning)}.ddga-circular-progress--destructive{--ddga-progress-color:var(--ddga-color-destructive)}.ddga-circular-progress__svg{display:block}.ddga-circular-progress__track{stroke:var(--ddga-gray-200)}.ddga-circular-progress__indicator{stroke:var(--ddga-progress-color,var(--ddga-color-primary));transition:stroke-dashoffset .2s ease-out}.ddga-circular-progress__segment{stroke:var(--ddga-gray-200);transition:stroke .2s}.ddga-circular-progress__segment--filled{stroke:var(--ddga-progress-color,var(--ddga-color-primary))}.ddga-circular-progress[data-state=indeterminate]:not([data-segmented]) .ddga-circular-progress__svg{transition:none;animation:1.4s linear infinite ddga-circular-progress-spin}@keyframes ddga-circular-progress-spin{to{transform:rotate(360deg)}}.ddga-circular-progress__label{font-size:var(--ddga-font-size-xs);font-weight:var(--ddga-font-weight-medium);color:var(--ddga-text-secondary);justify-content:center;align-items:center;line-height:1;display:flex;position:absolute;inset:0}.ddga-circular-progress--sm .ddga-circular-progress__label{font-size:.625rem}.ddga-circular-progress--lg .ddga-circular-progress__label{font-size:var(--ddga-font-size-sm)}@media (prefers-reduced-motion:reduce){.ddga-progress[data-state=indeterminate] .ddga-progress__indicator,.ddga-circular-progress[data-state=indeterminate] .ddga-circular-progress__svg{animation:none}.ddga-progress__indicator,.ddga-circular-progress__indicator,.ddga-circular-progress__segment{transition:none}}}
+@layer ddga-components{.ddga-progress{background-color:var(--ddga-gray-200);border-radius:var(--ddga-radius-full);inline-size:100%;position:relative;overflow:hidden}.ddga-progress--sm{block-size:4px}.ddga-progress--md{block-size:8px}.ddga-progress--lg{block-size:12px}.ddga-progress--primary{--ddga-progress-color:var(--ddga-color-primary)}.ddga-progress--success{--ddga-progress-color:var(--ddga-color-success)}.ddga-progress--warning{--ddga-progress-color:var(--ddga-color-warning)}.ddga-progress--destructive{--ddga-progress-color:var(--ddga-color-destructive)}.ddga-progress__indicator{background-color:var(--ddga-progress-color,var(--ddga-color-primary));border-radius:inherit;block-size:100%;inline-size:100%;transition:transform .2s ease-out}.ddga-progress[data-state=indeterminate] .ddga-progress__indicator{inline-size:40%;transition:none;animation:1.4s cubic-bezier(.65,.05,.36,1) infinite ddga-progress-slide;transform:translate(-100%)}@keyframes ddga-progress-slide{0%{transform:translate(-100%)}to{transform:translate(350%)}}[dir=rtl] .ddga-progress[data-state=indeterminate] .ddga-progress__indicator{animation-name:ddga-progress-slide-rtl}@keyframes ddga-progress-slide-rtl{0%{transform:translate(100%)}to{transform:translate(-350%)}}.ddga-circular-progress{flex-shrink:0;justify-content:center;align-items:center;display:inline-flex;position:relative}.ddga-circular-progress--primary{--ddga-progress-color:var(--ddga-color-primary)}.ddga-circular-progress--success{--ddga-progress-color:var(--ddga-color-success)}.ddga-circular-progress--warning{--ddga-progress-color:var(--ddga-color-warning)}.ddga-circular-progress--destructive{--ddga-progress-color:var(--ddga-color-destructive)}.ddga-circular-progress__svg{display:block}.ddga-circular-progress__track{stroke:var(--ddga-gray-200)}.ddga-circular-progress__indicator{stroke:var(--ddga-progress-color,var(--ddga-color-primary));transition:stroke-dashoffset .2s ease-out}.ddga-circular-progress__segment{stroke:var(--ddga-gray-200);transition:stroke .2s}.ddga-circular-progress__segment--filled{stroke:var(--ddga-progress-color,var(--ddga-color-primary))}.ddga-circular-progress[data-state=indeterminate]:not([data-segmented]) .ddga-circular-progress__svg{transition:none;animation:1.4s linear infinite ddga-circular-progress-spin}@keyframes ddga-circular-progress-spin{to{transform:rotate(360deg)}}.ddga-circular-progress__label{font-size:var(--ddga-font-size-xs);font-weight:var(--ddga-font-weight-medium);color:var(--ddga-text-secondary);justify-content:center;align-items:center;line-height:1;display:flex;position:absolute;inset:0}.ddga-circular-progress--sm .ddga-circular-progress__label{font-size:.625rem}.ddga-circular-progress--lg .ddga-circular-progress__label{font-size:var(--ddga-font-size-sm)}[data-theme=dark] .ddga-progress{background-color:var(--ddga-color-border)}[data-theme=dark] .ddga-circular-progress__track,[data-theme=dark] .ddga-circular-progress__segment{stroke:var(--ddga-color-border)}@media (prefers-reduced-motion:reduce){.ddga-progress[data-state=indeterminate] .ddga-progress__indicator,.ddga-circular-progress[data-state=indeterminate] .ddga-circular-progress__svg{animation:none}.ddga-progress__indicator,.ddga-circular-progress__indicator,.ddga-circular-progress__segment{transition:none}}@media (forced-colors:active){.ddga-progress{border:1px solid canvastext}.ddga-progress__indicator{background-color:highlight}.ddga-circular-progress__track,.ddga-circular-progress__segment{stroke:graytext}.ddga-circular-progress__indicator,.ddga-circular-progress__segment--filled{stroke:highlight}}}
 /*# sourceMappingURL=progress.css.map */

package/dist/components/progress.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"mappings":"AAAA,uBAGE,8IAQA,kCAGA,kCAGA,mCAIA,wEAGA,wEAGA,wEAGA,gFAIA,yLAUA,sMAOA,2FAUA,oHAIA,+FAWA,sHAQA,iFAGA,iFAGA,iFAGA,yFAIA,2CAIA,2DAIA,yIAMA,mFAIA,qGAMA,gLAMA,oEAMA,6OAYA,6EAGA,~~8FAKA~~,uCACE,iKAIA","sources":["src/components/progress.css"],"sourcesContent":["@layer ddga-components {\n /* ─── Linear (Radix Progress) ─── /\n\n .ddga-progress {\n position: relative;\n overflow: hidden;\n inline-size: 100%;\n background-color: var(--ddga-gray-200);\n border-radius: var(--ddga-radius-full);\n }\n\n .ddga-progress--sm {\n block-size: 4px;\n }\n .ddga-progress--md {\n block-size: 8px;\n }\n .ddga-progress--lg {\n block-size: 12px;\n }\n\n .ddga-progress--primary {\n --ddga-progress-color: var(--ddga-color-primary);\n }\n .ddga-progress--success {\n --ddga-progress-color: var(--ddga-color-success);\n }\n .ddga-progress--warning {\n --ddga-progress-color: var(--ddga-color-warning);\n }\n .ddga-progress--destructive {\n --ddga-progress-color: var(--ddga-color-destructive);\n }\n\n .ddga-progress__indicator {\n block-size: 100%;\n inline-size: 100%;\n background-color: var(--ddga-progress-color, var(--ddga-color-primary));\n transition: transform 200ms ease-out;\n border-radius: inherit;\n }\n\n / Indeterminate: slide a 40%-wide pill across the track. The track has\n overflow:hidden so the off-track portions get clipped. /\n .ddga-progress[data-state='indeterminate'] .ddga-progress__indicator {\n inline-size: 40%;\n transform: translateX(-100%);\n animation: ddga-progress-slide 1.4s cubic-bezier(0.65, 0.05, 0.36, 1) infinite;\n transition: none;\n }\n\n @keyframes ddga-progress-slide {\n 0% {\n transform: translateX(-100%);\n }\n 100% {\n transform: translateX(350%);\n }\n }\n\n / RTL: reverse the slide so motion still tracks reading direction. /\n [dir='rtl'] .ddga-progress[data-state='indeterminate'] .ddga-progress__indicator {\n animation-name: ddga-progress-slide-rtl;\n }\n\n @keyframes ddga-progress-slide-rtl {\n 0% {\n transform: translateX(100%);\n }\n 100% {\n transform: translateX(-350%);\n }\n }\n\n / ─── Circular (custom SVG) ─── /\n\n .ddga-circular-progress {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n }\n\n .ddga-circular-progress--primary {\n --ddga-progress-color: var(--ddga-color-primary);\n }\n .ddga-circular-progress--success {\n --ddga-progress-color: var(--ddga-color-success);\n }\n .ddga-circular-progress--warning {\n --ddga-progress-color: var(--ddga-color-warning);\n }\n .ddga-circular-progress--destructive {\n --ddga-progress-color: var(--ddga-color-destructive);\n }\n\n .ddga-circular-progress__svg {\n display: block;\n }\n\n .ddga-circular-progress__track {\n stroke: var(--ddga-gray-200);\n }\n\n .ddga-circular-progress__indicator {\n stroke: var(--ddga-progress-color, var(--ddga-color-primary));\n transition: stroke-dashoffset 200ms ease-out;\n }\n\n / Segmented (radial stepper): each arc is track-colored until filled. /\n .ddga-circular-progress__segment {\n stroke: var(--ddga-gray-200);\n transition: stroke 200ms ease;\n }\n .ddga-circular-progress__segment--filled {\n stroke: var(--ddga-progress-color, var(--ddga-color-primary));\n }\n\n / Only the continuous (non-segmented) ring spins when indeterminate — a\n segmented ring is determinate, so don't rotate its empty arcs. /\n .ddga-circular-progress[data-state='indeterminate']:not([data-segmented])\n .ddga-circular-progress__svg {\n animation: ddga-circular-progress-spin 1.4s linear infinite;\n transition: none;\n }\n\n @keyframes ddga-circular-progress-spin {\n 100% {\n transform: rotate(360deg);\n }\n }\n\n .ddga-circular-progress__label {\n position: absolute;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: var(--ddga-font-size-xs);\n font-weight: var(--ddga-font-weight-medium);\n color: var(--ddga-text-secondary);\n line-height: 1;\n }\n\n .ddga-circular-progress--sm .ddga-circular-progress__label {\n font-size: 0.625rem;\n }\n .ddga-circular-progress--lg .ddga-circular-progress__label {\n font-size: var(--ddga-font-size-sm);\n }\n\n / Reduced motion: drop indeterminate animations, keep static state visible. */\n @media (prefers-reduced-motion: reduce) {\n .ddga-progress[data-state='indeterminate'] .ddga-progress__indicator,\n .ddga-circular-progress[data-state='indeterminate'] .ddga-circular-progress__svg {\n animation: none;\n }\n .ddga-progress__indicator,\n .ddga-circular-progress__indicator,\n .ddga-circular-progress__segment {\n transition: none;\n }\n }\n}\n"],"names":[]}
1	+ {"version":3,"mappings":"AAAA,uBAGE,8IAQA,kCAGA,kCAGA,mCAIA,wEAGA,wEAGA,wEAGA,gFAIA,yLAUA,sMAOA,2FAUA,oHAIA,+FAWA,sHAQA,iFAGA,iFAGA,iFAGA,yFAIA,2CAIA,2DAIA,yIAMA,mFAIA,qGAMA,gLAMA,oEAMA,6OAYA,6EAGA,8FAUA,2EAGA,oIAMA,uCACE,iKAIA,+GAWF,8BACE,2CAGA,qDAGA,gFAIA","sources":["src/components/progress.css"],"sourcesContent":["@layer ddga-components {\n /* ─── Linear (Radix Progress) ─── /\n\n .ddga-progress {\n position: relative;\n overflow: hidden;\n inline-size: 100%;\n background-color: var(--ddga-gray-200);\n border-radius: var(--ddga-radius-full);\n }\n\n .ddga-progress--sm {\n block-size: 4px;\n }\n .ddga-progress--md {\n block-size: 8px;\n }\n .ddga-progress--lg {\n block-size: 12px;\n }\n\n .ddga-progress--primary {\n --ddga-progress-color: var(--ddga-color-primary);\n }\n .ddga-progress--success {\n --ddga-progress-color: var(--ddga-color-success);\n }\n .ddga-progress--warning {\n --ddga-progress-color: var(--ddga-color-warning);\n }\n .ddga-progress--destructive {\n --ddga-progress-color: var(--ddga-color-destructive);\n }\n\n .ddga-progress__indicator {\n block-size: 100%;\n inline-size: 100%;\n background-color: var(--ddga-progress-color, var(--ddga-color-primary));\n transition: transform 200ms ease-out;\n border-radius: inherit;\n }\n\n / Indeterminate: slide a 40%-wide pill across the track. The track has\n overflow:hidden so the off-track portions get clipped. /\n .ddga-progress[data-state='indeterminate'] .ddga-progress__indicator {\n inline-size: 40%;\n transform: translateX(-100%);\n animation: ddga-progress-slide 1.4s cubic-bezier(0.65, 0.05, 0.36, 1) infinite;\n transition: none;\n }\n\n @keyframes ddga-progress-slide {\n 0% {\n transform: translateX(-100%);\n }\n 100% {\n transform: translateX(350%);\n }\n }\n\n / RTL: reverse the slide so motion still tracks reading direction. /\n [dir='rtl'] .ddga-progress[data-state='indeterminate'] .ddga-progress__indicator {\n animation-name: ddga-progress-slide-rtl;\n }\n\n @keyframes ddga-progress-slide-rtl {\n 0% {\n transform: translateX(100%);\n }\n 100% {\n transform: translateX(-350%);\n }\n }\n\n / ─── Circular (custom SVG) ─── /\n\n .ddga-circular-progress {\n position: relative;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n }\n\n .ddga-circular-progress--primary {\n --ddga-progress-color: var(--ddga-color-primary);\n }\n .ddga-circular-progress--success {\n --ddga-progress-color: var(--ddga-color-success);\n }\n .ddga-circular-progress--warning {\n --ddga-progress-color: var(--ddga-color-warning);\n }\n .ddga-circular-progress--destructive {\n --ddga-progress-color: var(--ddga-color-destructive);\n }\n\n .ddga-circular-progress__svg {\n display: block;\n }\n\n .ddga-circular-progress__track {\n stroke: var(--ddga-gray-200);\n }\n\n .ddga-circular-progress__indicator {\n stroke: var(--ddga-progress-color, var(--ddga-color-primary));\n transition: stroke-dashoffset 200ms ease-out;\n }\n\n / Segmented (radial stepper): each arc is track-colored until filled. /\n .ddga-circular-progress__segment {\n stroke: var(--ddga-gray-200);\n transition: stroke 200ms ease;\n }\n .ddga-circular-progress__segment--filled {\n stroke: var(--ddga-progress-color, var(--ddga-color-primary));\n }\n\n / Only the continuous (non-segmented) ring spins when indeterminate — a\n segmented ring is determinate, so don't rotate its empty arcs. /\n .ddga-circular-progress[data-state='indeterminate']:not([data-segmented])\n .ddga-circular-progress__svg {\n animation: ddga-circular-progress-spin 1.4s linear infinite;\n transition: none;\n }\n\n @keyframes ddga-circular-progress-spin {\n 100% {\n transform: rotate(360deg);\n }\n }\n\n .ddga-circular-progress__label {\n position: absolute;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: var(--ddga-font-size-xs);\n font-weight: var(--ddga-font-weight-medium);\n color: var(--ddga-text-secondary);\n line-height: 1;\n }\n\n .ddga-circular-progress--sm .ddga-circular-progress__label {\n font-size: 0.625rem;\n }\n .ddga-circular-progress--lg .ddga-circular-progress__label {\n font-size: var(--ddga-font-size-sm);\n }\n\n / ─── Dark mode ─── /\n / The unfilled track is built from the raw `--ddga-gray-200` tint, which the\n dark theme does NOT remap (only semantic `--ddga-color-` tokens adapt).\n Left alone it renders as a bright light band on dark surfaces, so map the\n track to the semantic border gray. The indicator stays `--ddga-color-`\n (already dark-aware). /\n [data-theme='dark'] .ddga-progress {\n background-color: var(--ddga-color-border);\n }\n [data-theme='dark'] .ddga-circular-progress__track,\n [data-theme='dark'] .ddga-circular-progress__segment {\n stroke: var(--ddga-color-border);\n }\n\n / Reduced motion: drop indeterminate animations, keep static state visible. /\n @media (prefers-reduced-motion: reduce) {\n .ddga-progress[data-state='indeterminate'] .ddga-progress__indicator,\n .ddga-circular-progress[data-state='indeterminate'] .ddga-circular-progress__svg {\n animation: none;\n }\n .ddga-progress__indicator,\n .ddga-circular-progress__indicator,\n .ddga-circular-progress__segment {\n transition: none;\n }\n }\n\n / ─── Forced colors (Windows High Contrast) ─── /\n / background/stroke colors are overridden by the system, which would make the\n fill indistinguishable from the track. Pin the fill to Highlight and the\n track to a dim system color so progress stays readable. */\n @media (forced-colors: active) {\n .ddga-progress {\n border: 1px solid CanvasText;\n }\n .ddga-progress__indicator {\n background-color: Highlight;\n }\n .ddga-circular-progress__track,\n .ddga-circular-progress__segment {\n stroke: GrayText;\n }\n .ddga-circular-progress__indicator,\n .ddga-circular-progress__segment--filled {\n stroke: Highlight;\n }\n }\n}\n"],"names":[]}

package/dist/components/select.css CHANGED Viewed

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-select__label{color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-medium);font-size:var(--ddga-font-size-sm);line-height:1.4}.ddga-select__required{color:var(--ddga-color-error);margin-inline-start:.125rem}.ddga-select-trigger{justify-content:space-between;align-items:center;gap:var(--ddga-space-2);border:1px solid var(--ddga-color-input);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-background);inline-size:100%;color:var(--ddga-text-primary);text-align:start;cursor:pointer;transition:border-color .15s,box-shadow .15s;display:inline-flex}.ddga-select-trigger--sm{block-size:32px;padding-inline:var(--ddga-space-3);font-size:var(--ddga-font-size-sm)}.ddga-select-trigger--md{block-size:36px;padding-inline:var(--ddga-space-4);font-size:var(--ddga-font-size-base)}.ddga-select-trigger:focus-visible{border-color:var(--ddga-color-ring);box-shadow:0 0 0 1px var(--ddga-color-ring);outline:none}.ddga-select-trigger[data-placeholder]{color:var(--ddga-text-placeholder)}.ddga-select-trigger:disabled{opacity:.5;cursor:not-allowed;background-color:var(--ddga-color-muted)}.ddga-select-trigger--error{border-color:var(--ddga-color-error)}.ddga-select-trigger--error:focus-visible{border-color:var(--ddga-color-error);box-shadow:0 0 0 1px var(--ddga-color-error)}.ddga-select__icon{color:var(--ddga-text-tertiary);flex-shrink:0;transition:rotate .15s}.ddga-select-trigger[data-state=open] .ddga-select__icon{rotate:180deg}.ddga-select-content{min-inline-size:var(--radix-select-trigger-width);max-block-size:var(--radix-select-content-available-height);z-index:50;background-color:var(--ddga-color-background);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-md);box-shadow:var(--ddga-shadow-md);color:var(--ddga-text-primary);overflow:hidden}.ddga-select-viewport{padding:var(--ddga-space-1)}.ddga-select-item{block-size:32px;padding-block:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);font-size:var(--ddga-font-size-base);color:var(--ddga-text-primary);cursor:pointer;-webkit-user-select:none;user-select:none;outline:none;align-items:center;padding-inline-start:var(--ddga-space-3);padding-inline-end:var(--ddga-space-7);line-height:1.4;display:flex;position:relative}.ddga-select-item[data-highlighted]{background-color:var(--ddga-color-muted)}.ddga-select-item[data-disabled]{color:var(--ddga-text-tertiary);cursor:not-allowed;pointer-events:none}.ddga-select-item__indicator{color:var(--ddga-color-primary);align-items:center;display:inline-flex;position:absolute;inset-inline-end:var(--ddga-space-2)}.ddga-select-item__check{block-size:1em;inline-size:1em}@media (prefers-reduced-motion:reduce){.ddga-select-trigger,.ddga-select__icon{transition:none}}@media (forced-colors:active){.ddga-select-trigger{border:1px solid canvastext}.ddga-select-trigger:focus-visible{outline-offset:1px;outline:2px solid highlight}.ddga-select-trigger:disabled{color:graytext;border-color:graytext}.ddga-select-content{border:1px solid canvastext}.ddga-select-item[data-highlighted]{color:highlighttext;background-color:highlight}.ddga-select-item__indicator{color:highlighttext}}}
+@layer ddga-components{.ddga-select__label{color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-medium);font-size:var(--ddga-font-size-sm);line-height:1.4}.ddga-select__required{color:var(--ddga-color-error);margin-inline-start:.125rem}.ddga-select-trigger{justify-content:space-between;align-items:center;gap:var(--ddga-space-2);border:1px solid var(--ddga-color-input);border-radius:var(--ddga-radius-sm);background-color:var(--ddga-color-background);inline-size:100%;color:var(--ddga-text-primary);text-align:start;cursor:pointer;transition:border-color .15s,box-shadow .15s;display:inline-flex}.ddga-select-trigger--sm{block-size:32px;padding-inline:var(--ddga-space-3);font-size:var(--ddga-font-size-sm)}.ddga-select-trigger--md{block-size:36px;padding-inline:var(--ddga-space-4);font-size:var(--ddga-font-size-base)}.ddga-select-trigger:focus-visible{border-color:var(--ddga-color-ring);box-shadow:0 0 0 1px var(--ddga-color-ring);outline:none}.ddga-select-trigger[data-placeholder]{color:var(--ddga-text-placeholder)}.ddga-select-trigger:disabled{opacity:.5;cursor:not-allowed;background-color:var(--ddga-color-muted)}.ddga-select-trigger--error{border-color:var(--ddga-color-error)}.ddga-select-trigger--error:focus-visible{border-color:var(--ddga-color-error);box-shadow:0 0 0 1px var(--ddga-color-error)}.ddga-select__icon{color:var(--ddga-text-tertiary);flex-shrink:0;transition:rotate .15s}.ddga-select-trigger[data-state=open] .ddga-select__icon{rotate:180deg}.ddga-select-content{min-inline-size:var(--radix-select-trigger-width);max-block-size:var(--radix-select-content-available-height);z-index:50;background-color:var(--ddga-color-background);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-md);box-shadow:var(--ddga-shadow-md);color:var(--ddga-text-primary);overflow:hidden}.ddga-select-viewport{padding:var(--ddga-space-1)}.ddga-select-item{block-size:32px;padding-block:var(--ddga-space-2);border-radius:var(--ddga-radius-sm);font-size:var(--ddga-font-size-base);color:var(--ddga-text-primary);cursor:pointer;-webkit-user-select:none;user-select:none;outline:none;align-items:center;padding-inline-start:var(--ddga-space-3);padding-inline-end:var(--ddga-space-8);line-height:1.4;display:flex;position:relative}.ddga-select-item[data-highlighted]{background-color:var(--ddga-color-muted)}.ddga-select-item[data-disabled]{color:var(--ddga-text-tertiary);cursor:not-allowed;pointer-events:none}.ddga-select-item__indicator{color:var(--ddga-color-primary);align-items:center;display:inline-flex;position:absolute;inset-inline-end:var(--ddga-space-2)}.ddga-select-item__check{block-size:1em;inline-size:1em}@media (prefers-reduced-motion:reduce){.ddga-select-trigger,.ddga-select__icon{transition:none}}@media (forced-colors:active){.ddga-select-trigger{border:1px solid canvastext}.ddga-select-trigger:focus-visible{outline-offset:1px;outline:2px solid highlight}.ddga-select-trigger:disabled{color:graytext;border-color:graytext}.ddga-select-content{border:1px solid canvastext}.ddga-select-item[data-highlighted]{color:highlighttext;background-color:highlight}.ddga-select-item__indicator{color:highlighttext}}}
 /*# sourceMappingURL=select.css.map */

package/dist/components/select.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"mappings":"AAAA,uBAME,iJAOA,iFAOA,0WAmBA,+GAKA,iHAQA,gIAOA,0EAIA,qGAQA,iEAGA,4HAOA,wFAKA,uEAMA,0VAgBA,kDAMA,oYAoBA,6EAIA,wGAQA,2JAOA,wDAOA,uCACE,yDAQF,8BACE,iDAGA,kFAIA,mEAIA,iDAGA,mFAIA","sources":["src/components/select.css"],"sourcesContent":["@layer ddga-components {\n /* Wrapper (.ddga-field) + helper/error (.ddga-field__message) are shared\n , see field.css. Only Select-specific styles live here. /\n\n / ─── Label (above the trigger, matches Input) ─── /\n\n .ddga-select__label {\n color: var(--ddga-text-primary);\n font-weight: var(--ddga-font-weight-medium);\n font-size: var(--ddga-font-size-sm);\n line-height: 1.4;\n }\n\n .ddga-select__required {\n color: var(--ddga-color-error);\n margin-inline-start: 0.125rem;\n }\n\n / ─── Trigger (Radix Trigger , the focusable button) ─── /\n\n .ddga-select-trigger {\n display: inline-flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--ddga-space-2);\n inline-size: 100%;\n border: 1px solid var(--ddga-color-input);\n border-radius: var(--ddga-radius-sm);\n background-color: var(--ddga-color-background);\n color: var(--ddga-text-primary);\n text-align: start;\n cursor: pointer;\n transition:\n border-color 150ms ease,\n box-shadow 150ms ease;\n }\n\n / ─── Sizes (heights match Input) ─── /\n\n .ddga-select-trigger--sm {\n block-size: 32px;\n padding-inline: var(--ddga-space-3);\n font-size: var(--ddga-font-size-sm);\n }\n .ddga-select-trigger--md {\n block-size: 36px;\n padding-inline: var(--ddga-space-4);\n font-size: var(--ddga-font-size-base);\n }\n\n / ─── Trigger states ─── /\n\n .ddga-select-trigger:focus-visible {\n outline: none;\n border-color: var(--ddga-color-ring);\n box-shadow: 0 0 0 1px var(--ddga-color-ring);\n }\n\n / Radix sets `data-placeholder` on the trigger when no value is selected. /\n .ddga-select-trigger[data-placeholder] {\n color: var(--ddga-text-placeholder);\n }\n\n .ddga-select-trigger:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n background-color: var(--ddga-color-muted);\n }\n\n / ─── Error ─── /\n\n .ddga-select-trigger--error {\n border-color: var(--ddga-color-error);\n }\n .ddga-select-trigger--error:focus-visible {\n border-color: var(--ddga-color-error);\n box-shadow: 0 0 0 1px var(--ddga-color-error);\n }\n\n / ─── Chevron (Radix Icon) ─── /\n\n .ddga-select__icon {\n flex-shrink: 0;\n color: var(--ddga-text-tertiary);\n transition: rotate 150ms ease;\n }\n .ddga-select-trigger[data-state='open'] .ddga-select__icon {\n rotate: 180deg;\n }\n\n / ─── Content (the dropdown panel, rendered in a portal) ─── /\n\n .ddga-select-content {\n / Match trigger width so the panel doesn't visually float wider/narrower\n than the field. `--radix-select-trigger-width` is exposed by Radix\n when `position=\"popper\"`. /\n min-inline-size: var(--radix-select-trigger-width);\n / Cap height to viewport so long lists scroll instead of overflowing. /\n max-block-size: var(--radix-select-content-available-height);\n z-index: 50;\n overflow: hidden;\n background-color: var(--ddga-color-background);\n border: 1px solid var(--ddga-color-border);\n border-radius: var(--ddga-radius-md);\n box-shadow: var(--ddga-shadow-md);\n color: var(--ddga-text-primary);\n }\n\n .ddga-select-viewport {\n padding: var(--ddga-space-1);\n }\n\n / ─── Item ─── /\n\n .ddga-select-item {\n position: relative;\n display: flex;\n align-items: center;\n block-size: 32px;\n padding-block: var(--ddga-space-2);\n padding-inline-start: var(--ddga-space-3);\n / Reserve room for the trailing checkmark indicator so item text never\n collides with it when the row is selected. /\n padding-inline-end: var(--ddga-space-7);\n border-radius: var(--ddga-radius-sm);\n font-size: var(--ddga-font-size-base);\n line-height: 1.4;\n color: var(--ddga-text-primary);\n cursor: pointer;\n user-select: none;\n outline: none;\n }\n\n / Radix sets `data-highlighted` on the keyboard- or pointer-focused item. /\n .ddga-select-item[data-highlighted] {\n background-color: var(--ddga-color-muted);\n }\n\n .ddga-select-item[data-disabled] {\n color: var(--ddga-text-tertiary);\n cursor: not-allowed;\n pointer-events: none;\n }\n\n / ─── Item indicator (checkmark on the selected item) ─── /\n\n .ddga-select-item__indicator {\n position: absolute;\n inset-inline-end: var(--ddga-space-2);\n display: inline-flex;\n align-items: center;\n color: var(--ddga-color-primary);\n }\n .ddga-select-item__check {\n inline-size: 1em;\n block-size: 1em;\n }\n\n / ─── Reduced motion ─── /\n\n @media (prefers-reduced-motion: reduce) {\n .ddga-select-trigger,\n .ddga-select__icon {\n transition: none;\n }\n }\n\n / ─── Forced colors (Windows High Contrast) ─── */\n\n @media (forced-colors: active) {\n .ddga-select-trigger {\n border: 1px solid CanvasText;\n }\n .ddga-select-trigger:focus-visible {\n outline: 2px solid Highlight;\n outline-offset: 1px;\n }\n .ddga-select-trigger:disabled {\n color: GrayText;\n border-color: GrayText;\n }\n .ddga-select-content {\n border: 1px solid CanvasText;\n }\n .ddga-select-item[data-highlighted] {\n background-color: Highlight;\n color: HighlightText;\n }\n .ddga-select-item__indicator {\n color: HighlightText;\n }\n }\n}\n"],"names":[]}
1	+ {"version":3,"mappings":"AAAA,uBAME,iJAOA,iFAOA,0WAmBA,+GAKA,iHAQA,gIAOA,0EAIA,qGAQA,iEAGA,4HAOA,wFAKA,uEAMA,0VAgBA,kDAMA,oYAoBA,6EAIA,wGAQA,2JAOA,wDAOA,uCACE,yDAQF,8BACE,iDAGA,kFAIA,mEAIA,iDAGA,mFAIA","sources":["src/components/select.css"],"sourcesContent":["@layer ddga-components {\n /* Wrapper (.ddga-field) + helper/error (.ddga-field__message) are shared\n , see field.css. Only Select-specific styles live here. /\n\n / ─── Label (above the trigger, matches Input) ─── /\n\n .ddga-select__label {\n color: var(--ddga-text-primary);\n font-weight: var(--ddga-font-weight-medium);\n font-size: var(--ddga-font-size-sm);\n line-height: 1.4;\n }\n\n .ddga-select__required {\n color: var(--ddga-color-error);\n margin-inline-start: 0.125rem;\n }\n\n / ─── Trigger (Radix Trigger , the focusable button) ─── /\n\n .ddga-select-trigger {\n display: inline-flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--ddga-space-2);\n inline-size: 100%;\n border: 1px solid var(--ddga-color-input);\n border-radius: var(--ddga-radius-sm);\n background-color: var(--ddga-color-background);\n color: var(--ddga-text-primary);\n text-align: start;\n cursor: pointer;\n transition:\n border-color 150ms ease,\n box-shadow 150ms ease;\n }\n\n / ─── Sizes (heights match Input) ─── /\n\n .ddga-select-trigger--sm {\n block-size: 32px;\n padding-inline: var(--ddga-space-3);\n font-size: var(--ddga-font-size-sm);\n }\n .ddga-select-trigger--md {\n block-size: 36px;\n padding-inline: var(--ddga-space-4);\n font-size: var(--ddga-font-size-base);\n }\n\n / ─── Trigger states ─── /\n\n .ddga-select-trigger:focus-visible {\n outline: none;\n border-color: var(--ddga-color-ring);\n box-shadow: 0 0 0 1px var(--ddga-color-ring);\n }\n\n / Radix sets `data-placeholder` on the trigger when no value is selected. /\n .ddga-select-trigger[data-placeholder] {\n color: var(--ddga-text-placeholder);\n }\n\n .ddga-select-trigger:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n background-color: var(--ddga-color-muted);\n }\n\n / ─── Error ─── /\n\n .ddga-select-trigger--error {\n border-color: var(--ddga-color-error);\n }\n .ddga-select-trigger--error:focus-visible {\n border-color: var(--ddga-color-error);\n box-shadow: 0 0 0 1px var(--ddga-color-error);\n }\n\n / ─── Chevron (Radix Icon) ─── /\n\n .ddga-select__icon {\n flex-shrink: 0;\n color: var(--ddga-text-tertiary);\n transition: rotate 150ms ease;\n }\n .ddga-select-trigger[data-state='open'] .ddga-select__icon {\n rotate: 180deg;\n }\n\n / ─── Content (the dropdown panel, rendered in a portal) ─── /\n\n .ddga-select-content {\n / Match trigger width so the panel doesn't visually float wider/narrower\n than the field. `--radix-select-trigger-width` is exposed by Radix\n when `position=\"popper\"`. /\n min-inline-size: var(--radix-select-trigger-width);\n / Cap height to viewport so long lists scroll instead of overflowing. /\n max-block-size: var(--radix-select-content-available-height);\n z-index: 50;\n overflow: hidden;\n background-color: var(--ddga-color-background);\n border: 1px solid var(--ddga-color-border);\n border-radius: var(--ddga-radius-md);\n box-shadow: var(--ddga-shadow-md);\n color: var(--ddga-text-primary);\n }\n\n .ddga-select-viewport {\n padding: var(--ddga-space-1);\n }\n\n / ─── Item ─── /\n\n .ddga-select-item {\n position: relative;\n display: flex;\n align-items: center;\n block-size: 32px;\n padding-block: var(--ddga-space-2);\n padding-inline-start: var(--ddga-space-3);\n / Reserve room for the trailing checkmark indicator so item text never\n collides with it when the row is selected. /\n padding-inline-end: var(--ddga-space-8);\n border-radius: var(--ddga-radius-sm);\n font-size: var(--ddga-font-size-base);\n line-height: 1.4;\n color: var(--ddga-text-primary);\n cursor: pointer;\n user-select: none;\n outline: none;\n }\n\n / Radix sets `data-highlighted` on the keyboard- or pointer-focused item. /\n .ddga-select-item[data-highlighted] {\n background-color: var(--ddga-color-muted);\n }\n\n .ddga-select-item[data-disabled] {\n color: var(--ddga-text-tertiary);\n cursor: not-allowed;\n pointer-events: none;\n }\n\n / ─── Item indicator (checkmark on the selected item) ─── /\n\n .ddga-select-item__indicator {\n position: absolute;\n inset-inline-end: var(--ddga-space-2);\n display: inline-flex;\n align-items: center;\n color: var(--ddga-color-primary);\n }\n .ddga-select-item__check {\n inline-size: 1em;\n block-size: 1em;\n }\n\n / ─── Reduced motion ─── /\n\n @media (prefers-reduced-motion: reduce) {\n .ddga-select-trigger,\n .ddga-select__icon {\n transition: none;\n }\n }\n\n / ─── Forced colors (Windows High Contrast) ─── */\n\n @media (forced-colors: active) {\n .ddga-select-trigger {\n border: 1px solid CanvasText;\n }\n .ddga-select-trigger:focus-visible {\n outline: 2px solid Highlight;\n outline-offset: 1px;\n }\n .ddga-select-trigger:disabled {\n color: GrayText;\n border-color: GrayText;\n }\n .ddga-select-content {\n border: 1px solid CanvasText;\n }\n .ddga-select-item[data-highlighted] {\n background-color: Highlight;\n color: HighlightText;\n }\n .ddga-select-item__indicator {\n color: HighlightText;\n }\n }\n}\n"],"names":[]}

package/dist/components/skeleton.css CHANGED Viewed

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-skeleton{background-color:var(--ddga-gray-200);border-radius:var(--ddga-radius-md);display:block;position:relative;overflow:hidden}.ddga-skeleton--text{border-radius:var(--ddga-radius-sm);width:100%;height:1em}.ddga-skeleton--rectangle{width:100%;height:40px}.ddga-skeleton--circle{border-radius:var(--ddga-radius-full);width:40px;height:40px}.ddga-skeleton--pulse{animation:1.5s ease-in-out infinite ddga-skeleton-pulse}@keyframes ddga-skeleton-pulse{0%,to{opacity:1}50%{opacity:.55}}.ddga-skeleton--wave:after{content:"";background-image:linear-gradient(90deg, transparent, color-mix(in srgb, var(--ddga-color-background) 60%, transparent), transparent);animation:1.6s linear infinite ddga-skeleton-wave;position:absolute;inset:0;transform:translate(-100%)}@keyframes ddga-skeleton-wave{to{transform:translate(100%)}}[dir=rtl] .ddga-skeleton--wave:after{animation-name:ddga-skeleton-wave-rtl;transform:translate(100%)}@keyframes ddga-skeleton-wave-rtl{to{transform:translate(-100%)}}.ddga-skeleton--none{animation:none}.ddga-skeleton--none:after{display:none}@media (prefers-reduced-motion:reduce){.ddga-skeleton--pulse,.ddga-skeleton--wave:after{animation:none}}}
+@layer ddga-components{.ddga-skeleton{background-color:var(--ddga-gray-200);border-radius:var(--ddga-radius-md);display:block;position:relative;overflow:hidden}.ddga-skeleton--text{border-radius:var(--ddga-radius-sm);width:100%;height:1em}.ddga-skeleton--rectangle{width:100%;height:40px}.ddga-skeleton--circle{border-radius:var(--ddga-radius-full);width:40px;height:40px}.ddga-skeleton--pulse{animation:1.5s ease-in-out infinite ddga-skeleton-pulse}@keyframes ddga-skeleton-pulse{0%,to{opacity:1}50%{opacity:.55}}.ddga-skeleton--wave:after{content:"";background-image:linear-gradient(90deg, transparent, color-mix(in srgb, var(--ddga-color-background) 60%, transparent), transparent);animation:1.6s linear infinite ddga-skeleton-wave;position:absolute;inset:0;transform:translate(-100%)}@keyframes ddga-skeleton-wave{to{transform:translate(100%)}}[dir=rtl] .ddga-skeleton--wave:after{animation-name:ddga-skeleton-wave-rtl;transform:translate(100%)}@keyframes ddga-skeleton-wave-rtl{to{transform:translate(-100%)}}.ddga-skeleton--none{animation:none}.ddga-skeleton--none:after{display:none}[data-theme=dark] .ddga-skeleton{background-color:var(--ddga-color-border)}@media (prefers-reduced-motion:reduce){.ddga-skeleton--pulse,.ddga-skeleton--wave:after{animation:none}}@media (forced-colors:active){.ddga-skeleton{border:1px solid graytext}}}
 /*# sourceMappingURL=skeleton.css.map */

package/dist/components/skeleton.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"mappings":"AAAA,uBACE,yIAUA,+EAMA,iDAKA,oFAQA,8EAIA,gEAYA,kRAcA,4DAOA,qGAKA,iEAMA,oCAIA,~~wCAIA~~,uCACE","sources":["src/components/skeleton.css"],"sourcesContent":["@layer ddga-components {\n .ddga-skeleton {\n display: block;\n background-color: var(--ddga-gray-200);\n border-radius: var(--ddga-radius-md);\n position: relative;\n overflow: hidden;\n }\n\n /* ─── Shapes ─── /\n\n .ddga-skeleton--text {\n width: 100%;\n height: 1em;\n border-radius: var(--ddga-radius-sm);\n }\n\n .ddga-skeleton--rectangle {\n width: 100%;\n height: 40px;\n }\n\n .ddga-skeleton--circle {\n width: 40px;\n height: 40px;\n border-radius: var(--ddga-radius-full);\n }\n\n / ─── Animations ─── /\n\n .ddga-skeleton--pulse {\n animation: ddga-skeleton-pulse 1.5s ease-in-out infinite;\n }\n\n @keyframes ddga-skeleton-pulse {\n 0%,\n 100% {\n opacity: 1;\n }\n 50% {\n opacity: 0.55;\n }\n }\n\n / Wave: a translucent gradient sweeps across the surface using a\n pseudo-element so it doesn't interfere with the consumer's content. /\n .ddga-skeleton--wave::after {\n content: '';\n position: absolute;\n inset: 0;\n transform: translateX(-100%);\n background-image: linear-gradient(\n 90deg,\n transparent,\n color-mix(in srgb, var(--ddga-color-background) 60%, transparent),\n transparent\n );\n animation: ddga-skeleton-wave 1.6s linear infinite;\n }\n\n @keyframes ddga-skeleton-wave {\n 100% {\n transform: translateX(100%);\n }\n }\n\n / RTL: sweep direction follows reading direction so the shimmer feels native. */\n [dir='rtl'] .ddga-skeleton--wave::after {\n transform: translateX(100%);\n animation-name: ddga-skeleton-wave-rtl;\n }\n\n @keyframes ddga-skeleton-wave-rtl {\n 100% {\n transform: translateX(-100%);\n }\n }\n\n .ddga-skeleton--none {\n animation: none;\n }\n\n .ddga-skeleton--none::after {\n display: none;\n }\n\n @media (prefers-reduced-motion: reduce) {\n .ddga-skeleton--pulse,\n .ddga-skeleton--wave::after {\n animation: none;\n }\n }\n}\n"],"names":[]}
1	+ {"version":3,"mappings":"AAAA,uBACE,yIAUA,+EAMA,iDAKA,oFAQA,8EAIA,gEAYA,kRAcA,4DAOA,qGAKA,iEAMA,oCAIA,wCASA,2EAIA,uCACE,iEASF,8BACE","sources":["src/components/skeleton.css"],"sourcesContent":["@layer ddga-components {\n .ddga-skeleton {\n display: block;\n background-color: var(--ddga-gray-200);\n border-radius: var(--ddga-radius-md);\n position: relative;\n overflow: hidden;\n }\n\n /* ─── Shapes ─── /\n\n .ddga-skeleton--text {\n width: 100%;\n height: 1em;\n border-radius: var(--ddga-radius-sm);\n }\n\n .ddga-skeleton--rectangle {\n width: 100%;\n height: 40px;\n }\n\n .ddga-skeleton--circle {\n width: 40px;\n height: 40px;\n border-radius: var(--ddga-radius-full);\n }\n\n / ─── Animations ─── /\n\n .ddga-skeleton--pulse {\n animation: ddga-skeleton-pulse 1.5s ease-in-out infinite;\n }\n\n @keyframes ddga-skeleton-pulse {\n 0%,\n 100% {\n opacity: 1;\n }\n 50% {\n opacity: 0.55;\n }\n }\n\n / Wave: a translucent gradient sweeps across the surface using a\n pseudo-element so it doesn't interfere with the consumer's content. /\n .ddga-skeleton--wave::after {\n content: '';\n position: absolute;\n inset: 0;\n transform: translateX(-100%);\n background-image: linear-gradient(\n 90deg,\n transparent,\n color-mix(in srgb, var(--ddga-color-background) 60%, transparent),\n transparent\n );\n animation: ddga-skeleton-wave 1.6s linear infinite;\n }\n\n @keyframes ddga-skeleton-wave {\n 100% {\n transform: translateX(100%);\n }\n }\n\n / RTL: sweep direction follows reading direction so the shimmer feels native. /\n [dir='rtl'] .ddga-skeleton--wave::after {\n transform: translateX(100%);\n animation-name: ddga-skeleton-wave-rtl;\n }\n\n @keyframes ddga-skeleton-wave-rtl {\n 100% {\n transform: translateX(-100%);\n }\n }\n\n .ddga-skeleton--none {\n animation: none;\n }\n\n .ddga-skeleton--none::after {\n display: none;\n }\n\n / ─── Dark mode ─── /\n / The fill is the raw `--ddga-gray-200` tint, which the dark theme does NOT\n remap (only semantic `--ddga-color-` adapt). Left alone it renders as a\n bright light box on dark surfaces, so map it to the semantic border gray.\n The wave shimmer already uses `--ddga-color-background` and is fine. /\n [data-theme='dark'] .ddga-skeleton {\n background-color: var(--ddga-color-border);\n }\n\n @media (prefers-reduced-motion: reduce) {\n .ddga-skeleton--pulse,\n .ddga-skeleton--wave::after {\n animation: none;\n }\n }\n\n /* ─── Forced colors (Windows High Contrast) ─── /\n / The fill conveys \"content loading here\", but `background-color` is forced\n away in HC. Outline the placeholder so it stays perceivable. */\n @media (forced-colors: active) {\n .ddga-skeleton {\n border: 1px solid GrayText;\n }\n }\n}\n"],"names":[]}

package/dist/components/slider.css CHANGED Viewed

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-slider__header{justify-content:space-between;align-items:baseline;gap:var(--ddga-space-3);display:flex}.ddga-slider__label{color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-medium);font-size:var(--ddga-font-size-sm);line-height:1.4}.ddga-slider__value{color:var(--ddga-text-secondary);font-size:var(--ddga-font-size-sm);font-variant-numeric:tabular-nums}.ddga-slider{touch-action:none;-webkit-user-select:none;user-select:none;align-items:center;inline-size:100%;display:flex;position:relative}.ddga-slider--md{--ddga-slider-rail:6px;--ddga-slider-thumb:18px;block-size:var(--ddga-slider-thumb)}.ddga-slider--sm{--ddga-slider-rail:4px;--ddga-slider-thumb:14px;block-size:var(--ddga-slider-thumb)}.ddga-slider__track{block-size:var(--ddga-slider-rail);background-color:var(--ddga-color-input);border-radius:999px;flex-grow:1;position:relative}.ddga-slider__range{background-color:var(--ddga-color-primary);border-radius:999px;block-size:100%;position:absolute}.ddga-slider__thumb{inline-size:var(--ddga-slider-thumb);block-size:var(--ddga-slider-thumb);border:2px solid var(--ddga-color-primary);background-color:var(--ddga-color-background);cursor:grab;border-radius:999px;transition:border-color .15s,box-shadow .15s;display:block;box-shadow:0 1px 2px #00000026}.ddga-slider__thumb:active{cursor:grabbing}.ddga-slider__thumb:focus-visible{box-shadow:0 0 0 3px var(--ddga-color-ring);outline:none}.ddga-slider--error .ddga-slider__thumb{border-color:var(--ddga-color-error)}.ddga-slider--error .ddga-slider__range{background-color:var(--ddga-color-error)}.ddga-slider--error .ddga-slider__thumb:focus-visible{box-shadow:0 0 0 3px var(--ddga-color-error)}.ddga-slider[data-disabled]{opacity:.5}.ddga-slider[data-disabled] .ddga-slider__thumb{cursor:not-allowed}[data-theme=dark] .ddga-slider__thumb{background-color:#f3f4f6;box-shadow:0 1px 2px #0006}@media (prefers-reduced-motion:reduce){.ddga-slider__thumb{transition:none}}@media (forced-colors:active){.ddga-slider__track{background-color:canvas;border:1px solid canvastext}.ddga-slider__range{background-color:highlight}.ddga-slider__thumb{background-color:buttonface;border-color:canvastext}.ddga-slider__thumb:focus-visible{outline-offset:1px;outline:2px solid highlight}}}
+@layer ddga-components{.ddga-slider__header{justify-content:space-between;align-items:baseline;gap:var(--ddga-space-3);display:flex}.ddga-slider__label{color:var(--ddga-text-primary);font-weight:var(--ddga-font-weight-medium);font-size:var(--ddga-font-size-sm);line-height:1.4}.ddga-slider__value{color:var(--ddga-text-secondary);font-size:var(--ddga-font-size-sm);font-variant-numeric:tabular-nums}.ddga-slider{touch-action:none;-webkit-user-select:none;user-select:none;align-items:center;inline-size:100%;display:flex;position:relative}.ddga-slider--md{--ddga-slider-rail:6px;--ddga-slider-thumb:18px;block-size:var(--ddga-slider-thumb)}.ddga-slider--sm{--ddga-slider-rail:4px;--ddga-slider-thumb:14px;block-size:var(--ddga-slider-thumb)}.ddga-slider__track{block-size:var(--ddga-slider-rail);background-color:var(--ddga-color-input);border-radius:999px;flex-grow:1;position:relative}.ddga-slider__range{background-color:var(--ddga-color-primary);border-radius:999px;block-size:100%;position:absolute}.ddga-slider__thumb{inline-size:var(--ddga-slider-thumb);block-size:var(--ddga-slider-thumb);border:2px solid var(--ddga-color-primary);background-color:var(--ddga-color-background);cursor:grab;border-radius:999px;transition:border-color .15s,box-shadow .15s;display:block;box-shadow:0 1px 2px #00000026}.ddga-slider__thumb:active{cursor:grabbing}.ddga-slider__thumb:focus-visible{box-shadow:0 0 0 3px var(--ddga-color-ring);outline:none}.ddga-slider--error .ddga-slider__thumb{border-color:var(--ddga-color-error)}.ddga-slider--error .ddga-slider__range{background-color:var(--ddga-color-error)}.ddga-slider--error .ddga-slider__thumb:focus-visible{box-shadow:0 0 0 3px var(--ddga-color-error)}.ddga-slider[data-disabled]{opacity:.5}.ddga-slider[data-disabled] .ddga-slider__thumb{cursor:not-allowed}[data-theme=dark] .ddga-slider__thumb{background-color:var(--ddga-gray-100);box-shadow:0 1px 2px #0006}@media (prefers-reduced-motion:reduce){.ddga-slider__thumb{transition:none}}@media (forced-colors:active){.ddga-slider__track{background-color:canvas;border:1px solid canvastext}.ddga-slider__range{background-color:highlight}.ddga-slider__thumb{background-color:buttonface;border-color:canvastext}.ddga-slider__thumb:focus-visible{outline-offset:1px;outline:2px solid highlight}}}
 /*# sourceMappingURL=slider.css.map */

package/dist/components/slider.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"mappings":"AAAA,uBAQE,6GAOA,iJAOA,0HAQA,4IAWA,qGAKA,qGAQA,kJAQA,qHASA,gTAcA,2CAIA,2FAOA,6EAGA,iFAGA,mGAMA,uCAGA,mEAMA,~~0FAOA~~,uCACE,qCAOF,8BACE,wEAIA,+CAGA,wEAIA","sources":["src/components/slider.css"],"sourcesContent":["@layer ddga-components {\n /* Wrapper (.ddga-field) + helper/error (.ddga-field__message) are shared\n , see field.css. Only Slider-specific styles live here. Radix Slider\n handles RTL positioning natively via the inherited `dir` (DgaProvider\n wraps Direction.Provider), so no manual flipping is needed here. /\n\n / ─── Header (label + value readout) ─── /\n\n .ddga-slider__header {\n display: flex;\n align-items: baseline;\n justify-content: space-between;\n gap: var(--ddga-space-3);\n }\n\n .ddga-slider__label {\n color: var(--ddga-text-primary);\n font-weight: var(--ddga-font-weight-medium);\n font-size: var(--ddga-font-size-sm);\n line-height: 1.4;\n }\n\n .ddga-slider__value {\n color: var(--ddga-text-secondary);\n font-size: var(--ddga-font-size-sm);\n font-variant-numeric: tabular-nums;\n }\n\n / ─── Root ─── /\n\n .ddga-slider {\n position: relative;\n display: flex;\n align-items: center;\n inline-size: 100%;\n touch-action: none;\n user-select: none;\n }\n\n / Per-size rail thickness + thumb diameter, encoded as custom properties so\n the track/thumb rules below stay size-agnostic. /\n .ddga-slider--md {\n --ddga-slider-rail: 6px;\n --ddga-slider-thumb: 18px;\n block-size: var(--ddga-slider-thumb);\n }\n .ddga-slider--sm {\n --ddga-slider-rail: 4px;\n --ddga-slider-thumb: 14px;\n block-size: var(--ddga-slider-thumb);\n }\n\n / ─── Track + filled range ─── /\n\n .ddga-slider__track {\n position: relative;\n flex-grow: 1;\n block-size: var(--ddga-slider-rail);\n border-radius: 999px;\n background-color: var(--ddga-color-input);\n }\n\n .ddga-slider__range {\n position: absolute;\n block-size: 100%;\n border-radius: 999px;\n background-color: var(--ddga-color-primary);\n }\n\n / ─── Thumb ─── /\n\n .ddga-slider__thumb {\n display: block;\n inline-size: var(--ddga-slider-thumb);\n block-size: var(--ddga-slider-thumb);\n border: 2px solid var(--ddga-color-primary);\n border-radius: 999px;\n background-color: var(--ddga-color-background);\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);\n cursor: grab;\n transition:\n border-color 150ms ease,\n box-shadow 150ms ease;\n }\n\n .ddga-slider__thumb:active {\n cursor: grabbing;\n }\n\n .ddga-slider__thumb:focus-visible {\n outline: none;\n box-shadow: 0 0 0 3px var(--ddga-color-ring);\n }\n\n / ─── Error ─── /\n\n .ddga-slider--error .ddga-slider__thumb {\n border-color: var(--ddga-color-error);\n }\n .ddga-slider--error .ddga-slider__range {\n background-color: var(--ddga-color-error);\n }\n .ddga-slider--error .ddga-slider__thumb:focus-visible {\n box-shadow: 0 0 0 3px var(--ddga-color-error);\n }\n\n / ─── Disabled (Radix sets data-disabled on the Root) ─── /\n\n .ddga-slider[data-disabled] {\n opacity: 0.5;\n }\n .ddga-slider[data-disabled] .ddga-slider__thumb {\n cursor: not-allowed;\n }\n\n / ─── Dark mode: keep the thumb a raised light surface ─── /\n\n [data-theme='dark'] .ddga-slider__thumb {\n background-color: ~~#f3f4f6~~;\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);\n }\n\n / ─── Reduced motion ─── /\n\n @media (prefers-reduced-motion: reduce) {\n .ddga-slider__thumb {\n transition: none;\n }\n }\n\n / ─── Forced colors (Windows High Contrast) ─── */\n\n @media (forced-colors: active) {\n .ddga-slider__track {\n background-color: Canvas;\n border: 1px solid CanvasText;\n }\n .ddga-slider__range {\n background-color: Highlight;\n }\n .ddga-slider__thumb {\n background-color: ButtonFace;\n border-color: CanvasText;\n }\n .ddga-slider__thumb:focus-visible {\n outline: 2px solid Highlight;\n outline-offset: 1px;\n }\n }\n}\n"],"names":[]}
1	+ {"version":3,"mappings":"AAAA,uBAQE,6GAOA,iJAOA,0HAQA,4IAWA,qGAKA,qGAQA,kJAQA,qHASA,gTAcA,2CAIA,2FAOA,6EAGA,iFAGA,mGAMA,uCAGA,mEAMA,uGAOA,uCACE,qCAOF,8BACE,wEAIA,+CAGA,wEAIA","sources":["src/components/slider.css"],"sourcesContent":["@layer ddga-components {\n /* Wrapper (.ddga-field) + helper/error (.ddga-field__message) are shared\n , see field.css. Only Slider-specific styles live here. Radix Slider\n handles RTL positioning natively via the inherited `dir` (DgaProvider\n wraps Direction.Provider), so no manual flipping is needed here. /\n\n / ─── Header (label + value readout) ─── /\n\n .ddga-slider__header {\n display: flex;\n align-items: baseline;\n justify-content: space-between;\n gap: var(--ddga-space-3);\n }\n\n .ddga-slider__label {\n color: var(--ddga-text-primary);\n font-weight: var(--ddga-font-weight-medium);\n font-size: var(--ddga-font-size-sm);\n line-height: 1.4;\n }\n\n .ddga-slider__value {\n color: var(--ddga-text-secondary);\n font-size: var(--ddga-font-size-sm);\n font-variant-numeric: tabular-nums;\n }\n\n / ─── Root ─── /\n\n .ddga-slider {\n position: relative;\n display: flex;\n align-items: center;\n inline-size: 100%;\n touch-action: none;\n user-select: none;\n }\n\n / Per-size rail thickness + thumb diameter, encoded as custom properties so\n the track/thumb rules below stay size-agnostic. /\n .ddga-slider--md {\n --ddga-slider-rail: 6px;\n --ddga-slider-thumb: 18px;\n block-size: var(--ddga-slider-thumb);\n }\n .ddga-slider--sm {\n --ddga-slider-rail: 4px;\n --ddga-slider-thumb: 14px;\n block-size: var(--ddga-slider-thumb);\n }\n\n / ─── Track + filled range ─── /\n\n .ddga-slider__track {\n position: relative;\n flex-grow: 1;\n block-size: var(--ddga-slider-rail);\n border-radius: 999px;\n background-color: var(--ddga-color-input);\n }\n\n .ddga-slider__range {\n position: absolute;\n block-size: 100%;\n border-radius: 999px;\n background-color: var(--ddga-color-primary);\n }\n\n / ─── Thumb ─── /\n\n .ddga-slider__thumb {\n display: block;\n inline-size: var(--ddga-slider-thumb);\n block-size: var(--ddga-slider-thumb);\n border: 2px solid var(--ddga-color-primary);\n border-radius: 999px;\n background-color: var(--ddga-color-background);\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);\n cursor: grab;\n transition:\n border-color 150ms ease,\n box-shadow 150ms ease;\n }\n\n .ddga-slider__thumb:active {\n cursor: grabbing;\n }\n\n .ddga-slider__thumb:focus-visible {\n outline: none;\n box-shadow: 0 0 0 3px var(--ddga-color-ring);\n }\n\n / ─── Error ─── /\n\n .ddga-slider--error .ddga-slider__thumb {\n border-color: var(--ddga-color-error);\n }\n .ddga-slider--error .ddga-slider__range {\n background-color: var(--ddga-color-error);\n }\n .ddga-slider--error .ddga-slider__thumb:focus-visible {\n box-shadow: 0 0 0 3px var(--ddga-color-error);\n }\n\n / ─── Disabled (Radix sets data-disabled on the Root) ─── /\n\n .ddga-slider[data-disabled] {\n opacity: 0.5;\n }\n .ddga-slider[data-disabled] .ddga-slider__thumb {\n cursor: not-allowed;\n }\n\n / ─── Dark mode: keep the thumb a raised light surface ─── /\n\n [data-theme='dark'] .ddga-slider__thumb {\n background-color: var(--ddga-gray-100);\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);\n }\n\n / ─── Reduced motion ─── /\n\n @media (prefers-reduced-motion: reduce) {\n .ddga-slider__thumb {\n transition: none;\n }\n }\n\n / ─── Forced colors (Windows High Contrast) ─── */\n\n @media (forced-colors: active) {\n .ddga-slider__track {\n background-color: Canvas;\n border: 1px solid CanvasText;\n }\n .ddga-slider__range {\n background-color: Highlight;\n }\n .ddga-slider__thumb {\n background-color: ButtonFace;\n border-color: CanvasText;\n }\n .ddga-slider__thumb:focus-visible {\n outline: 2px solid Highlight;\n outline-offset: 1px;\n }\n }\n}\n"],"names":[]}

package/dist/components/stat.css CHANGED Viewed

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-stat{gap:var(--ddga-space-1);max-inline-size:20rem;padding:var(--ddga-space-5);background-color:var(--ddga-color-card);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-md);color:var(--ddga-color-card-foreground);flex-direction:column;display:flex}.ddga-stat--elevated{box-shadow:var(--ddga-shadow-md);border-color:#0000}.ddga-stat--elevated .ddga-stat__icon{border-radius:var(--ddga-radius-full);background-color:var(--ddga-sa-600);block-size:2.5rem;inline-size:2.5rem;color:var(--ddga-color-primary-foreground)}:is(.ddga-stat--accent,.ddga-stat--gradient){--ddga-stat-accent-fg:var(--ddga-sa-600);--ddga-stat-accent-bg:var(--ddga-sa-50)}:is(.ddga-stat--accent,.ddga-stat--gradient)[data-sentiment=positive]{--ddga-stat-accent-fg:var(--ddga-success-600);--ddga-stat-accent-bg:var(--ddga-success-50)}:is(.ddga-stat--accent,.ddga-stat--gradient)[data-sentiment=negative]{--ddga-stat-accent-fg:var(--ddga-error-600);--ddga-stat-accent-bg:var(--ddga-error-50)}:is(.ddga-stat--accent,.ddga-stat--gradient)[data-sentiment=neutral]{--ddga-stat-accent-fg:var(--ddga-gray-600);--ddga-stat-accent-bg:var(--ddga-gray-100)}:is(.ddga-stat--accent,.ddga-stat--gradient) .ddga-stat__icon{background-color:var(--ddga-stat-accent-bg);color:var(--ddga-stat-accent-fg)}.ddga-stat--accent{border-inline-start:3px solid var(--ddga-stat-accent-fg)}.ddga-stat--gradient{box-shadow:var(--ddga-shadow-sm);background-image:linear-gradient(135deg, var(--ddga-stat-accent-bg), transparent 65%);border-color:#0000}[dir=rtl] .ddga-stat--gradient{background-image:linear-gradient(225deg, var(--ddga-stat-accent-bg), transparent 65%)}[data-theme=dark] .ddga-stat--flat .ddga-stat__icon{color:var(--ddga-gray-300,#d2d6db);background-color:#ffffff14}[data-theme=dark] :is(.ddga-stat--accent,.ddga-stat--gradient){--ddga-stat-accent-fg:var(--ddga-sa-300,#7ed3a8);--ddga-stat-accent-bg:#25935f2e}[data-theme=dark] :is(.ddga-stat--accent,.ddga-stat--gradient)[data-sentiment=positive]{--ddga-stat-accent-fg:var(--ddga-success-200,#abefc6);--ddga-stat-accent-bg:#0794552e}[data-theme=dark] :is(.ddga-stat--accent,.ddga-stat--gradient)[data-sentiment=negative]{--ddga-stat-accent-fg:var(--ddga-error-200,#fecdca);--ddga-stat-accent-bg:#d92d202e}[data-theme=dark] :is(.ddga-stat--accent,.ddga-stat--gradient)[data-sentiment=neutral]{--ddga-stat-accent-fg:var(--ddga-gray-300,#d2d6db);--ddga-stat-accent-bg:#ffffff14}.ddga-stat__label-row{justify-content:space-between;align-items:center;gap:var(--ddga-space-2);display:flex}.ddga-stat__label{color:var(--ddga-text-secondary);font-size:var(--ddga-font-size-xs);font-weight:var(--ddga-font-weight-semibold);text-transform:uppercase;letter-spacing:.06em;line-height:1.4}[dir=rtl] .ddga-stat__label{letter-spacing:normal}.ddga-stat__icon{border-radius:var(--ddga-radius-md);background-color:var(--ddga-gray-100);block-size:2.25rem;inline-size:2.25rem;color:var(--ddga-gray-600);font-size:var(--ddga-font-size-lg);flex:none;justify-content:center;align-items:center;display:inline-flex}.ddga-stat__icon>svg{block-size:1em;inline-size:1em}.ddga-stat__value{color:var(--ddga-text-primary);font-size:var(--ddga-font-size-2xl);font-weight:var(--ddga-font-weight-semibold);letter-spacing:-.01em;font-variant-numeric:tabular-nums;line-height:1.2}.ddga-stat__change-row{align-items:center;gap:var(--ddga-space-2);display:flex}.ddga-stat__change{--ddga-stat-change-color:var(--ddga-text-secondary);align-items:center;gap:var(--ddga-space-1);color:var(--ddga-stat-change-color);font-size:var(--ddga-font-size-sm);font-weight:var(--ddga-font-weight-medium);font-variant-numeric:tabular-nums;display:inline-flex}.ddga-stat__change--positive{--ddga-stat-change-color:var(--ddga-color-success)}.ddga-stat__change--negative{--ddga-stat-change-color:var(--ddga-color-error)}.ddga-stat__change--neutral{--ddga-stat-change-color:var(--ddga-text-secondary)}.ddga-stat__change--chip{padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);border-radius:var(--ddga-radius-full);background-color:var(--ddga-gray-100)}.ddga-stat__change--chip.ddga-stat__change--positive{background-color:var(--ddga-success-50)}.ddga-stat__change--chip.ddga-stat__change--negative{background-color:var(--ddga-error-50)}[data-theme=dark] .ddga-stat__change--chip{background-color:#ffffff14}[data-theme=dark] .ddga-stat__change--chip.ddga-stat__change--positive{background-color:#0794552e}[data-theme=dark] .ddga-stat__change--chip.ddga-stat__change--negative{background-color:#d92d202e}.ddga-stat__change-icon{justify-content:center;align-items:center;font-size:.85em;display:inline-flex}.ddga-stat__change-icon>svg{block-size:1em;inline-size:1em}.ddga-stat__change-label{color:var(--ddga-text-tertiary);font-size:var(--ddga-font-size-sm)}.ddga-stat__chart{block-size:2.5rem;margin-block-start:var(--ddga-space-2)}.ddga-stat__chart>svg{block-size:100%;inline-size:100%;display:block}.ddga-stat--sm{padding:var(--ddga-space-4)}.ddga-stat--sm .ddga-stat__value{font-size:var(--ddga-font-size-xl)}.ddga-stat--lg{gap:var(--ddga-space-2);padding:var(--ddga-space-6)}.ddga-stat--lg .ddga-stat__value{font-size:var(--ddga-font-size-3xl)}.ddga-stat--xl{gap:var(--ddga-space-2);padding:var(--ddga-space-8)}.ddga-stat--xl .ddga-stat__value{font-size:2.5rem;line-height:1.1}.ddga-stat--xl .ddga-stat__chart{block-size:3.25rem}.ddga-stat-group{--ddga-stat-group-gap:var(--ddga-space-4)}.ddga-stat-group--gap-sm{--ddga-stat-group-gap:var(--ddga-space-3)}.ddga-stat-group--gap-md{--ddga-stat-group-gap:var(--ddga-space-4)}.ddga-stat-group--gap-lg{--ddga-stat-group-gap:var(--ddga-space-6)}.ddga-stat-group--horizontal{gap:var(--ddga-stat-group-gap);grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));display:grid}.ddga-stat-group--horizontal.ddga-stat-group--cols{grid-template-columns:repeat(var(--ddga-stat-group-columns), minmax(0, 1fr))}@media (max-width:40rem){.ddga-stat-group--horizontal.ddga-stat-group--cols{grid-template-columns:1fr}}.ddga-stat-group--vertical{gap:var(--ddga-stat-group-gap);flex-direction:column;display:flex}.ddga-stat-group .ddga-stat{max-inline-size:none}@media (forced-colors:active){.ddga-stat__icon,.ddga-stat__change--chip{border:1px solid canvastext}.ddga-stat--accent{border-inline-start-color:highlight}.ddga-stat--gradient{border:1px solid canvastext}}}
+@layer ddga-components{.ddga-stat{gap:var(--ddga-space-1);max-inline-size:20rem;padding:var(--ddga-space-5);background-color:var(--ddga-color-card);border:1px solid var(--ddga-color-border);border-radius:var(--ddga-radius-md);color:var(--ddga-color-card-foreground);flex-direction:column;display:flex}.ddga-stat--elevated{box-shadow:var(--ddga-shadow-md);border-color:#0000}.ddga-stat--elevated .ddga-stat__icon{border-radius:var(--ddga-radius-full);background-color:var(--ddga-sa-600);block-size:2.5rem;inline-size:2.5rem;color:var(--ddga-color-primary-foreground)}:is(.ddga-stat--accent,.ddga-stat--gradient){--ddga-stat-accent-fg:var(--ddga-sa-600);--ddga-stat-accent-bg:var(--ddga-sa-50)}:is(.ddga-stat--accent,.ddga-stat--gradient)[data-sentiment=positive]{--ddga-stat-accent-fg:var(--ddga-success-600);--ddga-stat-accent-bg:var(--ddga-success-50)}:is(.ddga-stat--accent,.ddga-stat--gradient)[data-sentiment=negative]{--ddga-stat-accent-fg:var(--ddga-error-600);--ddga-stat-accent-bg:var(--ddga-error-50)}:is(.ddga-stat--accent,.ddga-stat--gradient)[data-sentiment=neutral]{--ddga-stat-accent-fg:var(--ddga-gray-600);--ddga-stat-accent-bg:var(--ddga-gray-100)}:is(.ddga-stat--accent,.ddga-stat--gradient) .ddga-stat__icon{background-color:var(--ddga-stat-accent-bg);color:var(--ddga-stat-accent-fg)}.ddga-stat--accent{border-inline-start:3px solid var(--ddga-stat-accent-fg)}.ddga-stat--gradient{box-shadow:var(--ddga-shadow-sm);background-image:linear-gradient(135deg, var(--ddga-stat-accent-bg), transparent 65%);border-color:#0000}[dir=rtl] .ddga-stat--gradient{background-image:linear-gradient(225deg, var(--ddga-stat-accent-bg), transparent 65%)}[data-theme=dark] .ddga-stat--flat .ddga-stat__icon{color:var(--ddga-gray-300,#d2d6db);background-color:#ffffff14}[data-theme=dark] :is(.ddga-stat--accent,.ddga-stat--gradient){--ddga-stat-accent-fg:var(--ddga-sa-300,#7ed3a8);--ddga-stat-accent-bg:#25935f2e}[data-theme=dark] :is(.ddga-stat--accent,.ddga-stat--gradient)[data-sentiment=positive]{--ddga-stat-accent-fg:var(--ddga-success-200,#abefc6);--ddga-stat-accent-bg:#0794552e}[data-theme=dark] :is(.ddga-stat--accent,.ddga-stat--gradient)[data-sentiment=negative]{--ddga-stat-accent-fg:var(--ddga-error-200,#fecdca);--ddga-stat-accent-bg:#d92d202e}[data-theme=dark] :is(.ddga-stat--accent,.ddga-stat--gradient)[data-sentiment=neutral]{--ddga-stat-accent-fg:var(--ddga-gray-300,#d2d6db);--ddga-stat-accent-bg:#ffffff14}.ddga-stat__label-row{justify-content:space-between;align-items:center;gap:var(--ddga-space-2);display:flex}.ddga-stat__label{color:var(--ddga-text-secondary);font-size:var(--ddga-font-size-xs);font-weight:var(--ddga-font-weight-semibold);text-transform:uppercase;letter-spacing:.06em;line-height:1.4}[dir=rtl] .ddga-stat__label{letter-spacing:normal}.ddga-stat__icon{border-radius:var(--ddga-radius-md);background-color:var(--ddga-gray-100);block-size:2.25rem;inline-size:2.25rem;color:var(--ddga-gray-600);font-size:var(--ddga-font-size-lg);flex:none;justify-content:center;align-items:center;display:inline-flex}.ddga-stat__icon>svg{block-size:1em;inline-size:1em}.ddga-stat__value{color:var(--ddga-text-primary);font-size:var(--ddga-font-size-2xl);font-weight:var(--ddga-font-weight-semibold);letter-spacing:-.01em;font-variant-numeric:tabular-nums;line-height:1.2}[dir=rtl] .ddga-stat__value{letter-spacing:normal}.ddga-stat__change-row{align-items:center;gap:var(--ddga-space-2);display:flex}.ddga-stat__change{--ddga-stat-change-color:var(--ddga-text-secondary);align-items:center;gap:var(--ddga-space-1);color:var(--ddga-stat-change-color);font-size:var(--ddga-font-size-sm);font-weight:var(--ddga-font-weight-medium);font-variant-numeric:tabular-nums;display:inline-flex}.ddga-stat__change--positive{--ddga-stat-change-color:var(--ddga-color-success)}.ddga-stat__change--negative{--ddga-stat-change-color:var(--ddga-color-error)}.ddga-stat__change--neutral{--ddga-stat-change-color:var(--ddga-text-secondary)}.ddga-stat__change--chip{padding-block:var(--ddga-space-1);padding-inline:var(--ddga-space-2);border-radius:var(--ddga-radius-full);background-color:var(--ddga-gray-100)}.ddga-stat__change--chip.ddga-stat__change--positive{background-color:var(--ddga-success-50)}.ddga-stat__change--chip.ddga-stat__change--negative{background-color:var(--ddga-error-50)}[data-theme=dark] .ddga-stat__change--chip{background-color:#ffffff14}[data-theme=dark] .ddga-stat__change--chip.ddga-stat__change--positive{background-color:#0794552e}[data-theme=dark] .ddga-stat__change--chip.ddga-stat__change--negative{background-color:#d92d202e}.ddga-stat__change-icon{justify-content:center;align-items:center;font-size:.85em;display:inline-flex}.ddga-stat__change-icon>svg{block-size:1em;inline-size:1em}.ddga-stat__change-label{color:var(--ddga-text-tertiary);font-size:var(--ddga-font-size-sm)}.ddga-stat__chart{block-size:2.5rem;margin-block-start:var(--ddga-space-2)}.ddga-stat__chart>svg{block-size:100%;inline-size:100%;display:block}.ddga-stat--sm{padding:var(--ddga-space-4)}.ddga-stat--sm .ddga-stat__value{font-size:var(--ddga-font-size-xl)}.ddga-stat--lg{gap:var(--ddga-space-2);padding:var(--ddga-space-6)}.ddga-stat--lg .ddga-stat__value{font-size:var(--ddga-font-size-3xl)}.ddga-stat--xl{gap:var(--ddga-space-2);padding:var(--ddga-space-8)}.ddga-stat--xl .ddga-stat__value{font-size:2.5rem;line-height:1.1}.ddga-stat--xl .ddga-stat__chart{block-size:3.25rem}.ddga-stat-group{--ddga-stat-group-gap:var(--ddga-space-4)}.ddga-stat-group--gap-sm{--ddga-stat-group-gap:var(--ddga-space-3)}.ddga-stat-group--gap-md{--ddga-stat-group-gap:var(--ddga-space-4)}.ddga-stat-group--gap-lg{--ddga-stat-group-gap:var(--ddga-space-6)}.ddga-stat-group--horizontal{gap:var(--ddga-stat-group-gap);grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));display:grid}.ddga-stat-group--horizontal.ddga-stat-group--cols{grid-template-columns:repeat(var(--ddga-stat-group-columns), minmax(0, 1fr))}@media (max-width:40rem){.ddga-stat-group--horizontal.ddga-stat-group--cols{grid-template-columns:1fr}}.ddga-stat-group--vertical{gap:var(--ddga-stat-group-gap);flex-direction:column;display:flex}.ddga-stat-group .ddga-stat{max-inline-size:none}@media (forced-colors:active){.ddga-stat__icon,.ddga-stat__change--chip{border:1px solid canvastext}.ddga-stat--accent{border-inline-start-color:highlight}.ddga-stat--gradient{border:1px solid canvastext}}}
 /*# sourceMappingURL=stat.css.map */

package/dist/components/stat.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"mappings":"AAAA,uBAWE,sRAeA,yEAIA,gMAUA,8HAIA,iKAIA,6JAIA,2JAIA,2IAMA,4EAMA,+JAKA,qHAWA,kHAIA,gJAIA,8KAIA,4KAIA,0KAKA,4GAOA,iMAUA,kDAIA,wQAYA,oDAKA,0MAWA,+EAMA,0RAUA,gFAGA,8EAKA,gFAMA,0KAMA,6FAGA,2FAGA,sEAGA,kGAGA,kGAIA,sGAOA,2DAKA,4FAQA,2EAIA,qEAOA,2CAGA,oEAGA,mEAIA,qEAKA,mEAIA,kEAIA,oDAMA,2DAGA,mEAGA,mEAGA,mEAIA,kIAKA,gIAIA,yBACE,8EAKF,6FAOA,iDAKA,8BAEE,sEAIA,uDAKA","sources":["src/components/stat.css"],"sourcesContent":["@layer ddga-components {\n /* Self-contained KPI tile: owns its surface (padding/border/bg/radius) so\n `<Stat>` renders a complete tile with no Card wrapper. `max-inline-size`\n keeps a single tile from stretching full-width; inside a grid/flex the\n container controls sizing. Logical properties keep it RTL-safe; numbers\n stay LTR via Latin digits. Sentiment color flows through\n --ddga-stat-change-color. The --ddga-color-card/-border/-success/-error\n tokens (surface + change row) adapt automatically in dark mode, but the\n -50/-100 badge tints are raw palette tokens that don't, so they get\n explicit [data-theme='dark'] overrides (below). /\n\n .ddga-stat {\n display: flex;\n flex-direction: column;\n gap: var(--ddga-space-1);\n max-inline-size: 20rem;\n padding: var(--ddga-space-5);\n background-color: var(--ddga-color-card);\n border: 1px solid var(--ddga-color-border);\n border-radius: var(--ddga-radius-md);\n color: var(--ddga-color-card-foreground);\n }\n\n / ─── Variants ─── /\n / flat = the base surface (border + neutral badge). elevated/accent below. /\n\n .ddga-stat--elevated {\n border-color: transparent;\n box-shadow: var(--ddga-shadow-md);\n }\n .ddga-stat--elevated .ddga-stat__icon {\n inline-size: 2.5rem;\n block-size: 2.5rem;\n border-radius: var(--ddga-radius-full);\n background-color: var(--ddga-sa-600);\n color: var(--ddga-color-primary-foreground);\n }\n\n / accent + gradient share the sentiment-keyed tint vars (data-sentiment on\n the root). Defaults to brand when no sentiment. /\n :is(.ddga-stat--accent, .ddga-stat--gradient) {\n --ddga-stat-accent-fg: var(--ddga-sa-600);\n --ddga-stat-accent-bg: var(--ddga-sa-50);\n }\n :is(.ddga-stat--accent, .ddga-stat--gradient)[data-sentiment='positive'] {\n --ddga-stat-accent-fg: var(--ddga-success-600);\n --ddga-stat-accent-bg: var(--ddga-success-50);\n }\n :is(.ddga-stat--accent, .ddga-stat--gradient)[data-sentiment='negative'] {\n --ddga-stat-accent-fg: var(--ddga-error-600);\n --ddga-stat-accent-bg: var(--ddga-error-50);\n }\n :is(.ddga-stat--accent, .ddga-stat--gradient)[data-sentiment='neutral'] {\n --ddga-stat-accent-fg: var(--ddga-gray-600);\n --ddga-stat-accent-bg: var(--ddga-gray-100);\n }\n :is(.ddga-stat--accent, .ddga-stat--gradient) .ddga-stat__icon {\n background-color: var(--ddga-stat-accent-bg);\n color: var(--ddga-stat-accent-fg);\n }\n\n / accent: inline-start edge bar. /\n .ddga-stat--accent {\n border-inline-start: 3px solid var(--ddga-stat-accent-fg);\n }\n\n / gradient: soft sentiment-tinted surface (elevated, borderless). The tint\n fades from the inline-start corner; flip the angle in RTL. /\n .ddga-stat--gradient {\n border-color: transparent;\n box-shadow: var(--ddga-shadow-sm);\n background-image: linear-gradient(135deg, var(--ddga-stat-accent-bg), transparent 65%);\n }\n [dir='rtl'] .ddga-stat--gradient {\n background-image: linear-gradient(225deg, var(--ddga-stat-accent-bg), transparent 65%);\n }\n\n / ─── Dark mode ─── /\n / The -50/-100 badge tints are raw palette tokens (identical in dark) and read\n near-white on a dark card. Use translucent fills + lighter foregrounds\n (mirrors alert.css / empty-state.css). The change-row colors already adapt\n via the semantic --ddga-color-* tokens, and the elevated brand badge\n (--ddga-sa-600) stays legible in dark, so neither needs an override. /\n\n [data-theme='dark'] .ddga-stat--flat .ddga-stat__icon {\n background-color: rgb(255 255 255 / 0.08);\n color: var(--ddga-gray-300, #d2d6db);\n }\n [data-theme='dark'] :is(.ddga-stat--accent, .ddga-stat--gradient) {\n --ddga-stat-accent-fg: var(--ddga-sa-300, #7ed3a8);\n --ddga-stat-accent-bg: rgb(37 147 95 / 0.18);\n }\n [data-theme='dark'] :is(.ddga-stat--accent, .ddga-stat--gradient)[data-sentiment='positive'] {\n --ddga-stat-accent-fg: var(--ddga-success-200, #abefc6);\n --ddga-stat-accent-bg: rgb(7 148 85 / 0.18);\n }\n [data-theme='dark'] :is(.ddga-stat--accent, .ddga-stat--gradient)[data-sentiment='negative'] {\n --ddga-stat-accent-fg: var(--ddga-error-200, #fecdca);\n --ddga-stat-accent-bg: rgb(217 45 32 / 0.18);\n }\n [data-theme='dark'] :is(.ddga-stat--accent, .ddga-stat--gradient)[data-sentiment='neutral'] {\n --ddga-stat-accent-fg: var(--ddga-gray-300, #d2d6db);\n --ddga-stat-accent-bg: rgb(255 255 255 / 0.08);\n }\n\n .ddga-stat__label-row {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--ddga-space-2);\n }\n\n .ddga-stat__label {\n color: var(--ddga-text-secondary);\n font-size: var(--ddga-font-size-xs);\n font-weight: var(--ddga-font-weight-semibold);\n line-height: 1.4;\n text-transform: uppercase;\n / Tracked caps read as \"professional\" in LTR. Reset in RTL — letter-spacing\n breaks Arabic cursive joining; uppercase is a harmless no-op on Arabic. /\n letter-spacing: 0.06em;\n }\n [dir='rtl'] .ddga-stat__label {\n letter-spacing: normal;\n }\n\n .ddga-stat__icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex: none;\n inline-size: 2.25rem;\n block-size: 2.25rem;\n border-radius: var(--ddga-radius-md);\n background-color: var(--ddga-gray-100);\n color: var(--ddga-gray-600);\n font-size: var(--ddga-font-size-lg);\n }\n .ddga-stat__icon > svg {\n inline-size: 1em;\n block-size: 1em;\n }\n\n .ddga-stat__value {\n color: var(--ddga-text-primary);\n font-size: var(--ddga-font-size-2xl);\n font-weight: var(--ddga-font-weight-semibold);\n / tight leading for the large single-line numeric /\n line-height: 1.2;\n letter-spacing: -0.01em;\n / Align digits across a grid of tiles. /\n font-variant-numeric: tabular-nums;\n }\n\n .ddga-stat__change-row {\n display: flex;\n align-items: center;\n gap: var(--ddga-space-2);\n }\n\n .ddga-stat__change {\n --ddga-stat-change-color: var(--ddga-text-secondary);\n display: inline-flex;\n align-items: center;\n gap: var(--ddga-space-1);\n color: var(--ddga-stat-change-color);\n font-size: var(--ddga-font-size-sm);\n font-weight: var(--ddga-font-weight-medium);\n font-variant-numeric: tabular-nums;\n }\n .ddga-stat__change--positive {\n --ddga-stat-change-color: var(--ddga-color-success);\n }\n .ddga-stat__change--negative {\n --ddga-stat-change-color: var(--ddga-color-error);\n }\n / Same as the default — kept explicit so the three sentiment modifiers are\n symmetric and `--neutral` is a stable override hook. /\n .ddga-stat__change--neutral {\n --ddga-stat-change-color: var(--ddga-text-secondary);\n }\n\n / Chip: same text color, wrapped in a sentiment-tinted pill. The raw -50\n tints get dark overrides below (mirrors the accent badge). /\n .ddga-stat__change--chip {\n padding-block: var(--ddga-space-1);\n padding-inline: var(--ddga-space-2);\n border-radius: var(--ddga-radius-full);\n background-color: var(--ddga-gray-100);\n }\n .ddga-stat__change--chip.ddga-stat__change--positive {\n background-color: var(--ddga-success-50);\n }\n .ddga-stat__change--chip.ddga-stat__change--negative {\n background-color: var(--ddga-error-50);\n }\n [data-theme='dark'] .ddga-stat__change--chip {\n background-color: rgb(255 255 255 / 0.08);\n }\n [data-theme='dark'] .ddga-stat__change--chip.ddga-stat__change--positive {\n background-color: rgb(7 148 85 / 0.18);\n }\n [data-theme='dark'] .ddga-stat__change--chip.ddga-stat__change--negative {\n background-color: rgb(217 45 32 / 0.18);\n }\n\n .ddga-stat__change-icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n / caret slightly smaller than the change text for hierarchy /\n font-size: 0.85em;\n }\n .ddga-stat__change-icon > svg {\n inline-size: 1em;\n block-size: 1em;\n }\n\n .ddga-stat__change-label {\n color: var(--ddga-text-tertiary);\n font-size: var(--ddga-font-size-sm);\n }\n\n / ─── Chart slot (consumer-supplied sparkline) ─── /\n / A styled slot with a consistent height; the dropped-in chart stretches to\n fill. The library ships no charting dependency. /\n .ddga-stat__chart {\n margin-block-start: var(--ddga-space-2);\n block-size: 2.5rem;\n }\n .ddga-stat__chart > svg {\n display: block;\n inline-size: 100%;\n block-size: 100%;\n }\n\n / ─── Sizes (scale padding + value; lg/xl also open the root gap) ─── /\n .ddga-stat--sm {\n padding: var(--ddga-space-4);\n }\n .ddga-stat--sm .ddga-stat__value {\n font-size: var(--ddga-font-size-xl);\n }\n .ddga-stat--lg {\n gap: var(--ddga-space-2);\n padding: var(--ddga-space-6);\n }\n .ddga-stat--lg .ddga-stat__value {\n font-size: var(--ddga-font-size-3xl);\n }\n / Hero/display: no font-size token sits above 3xl, so the display value uses\n a component-local rem (precedent: the .625rem label size). /\n .ddga-stat--xl {\n gap: var(--ddga-space-2);\n padding: var(--ddga-space-8);\n }\n .ddga-stat--xl .ddga-stat__value {\n font-size: 2.5rem;\n line-height: 1.1;\n }\n .ddga-stat--xl .ddga-stat__chart {\n block-size: 3.25rem;\n }\n\n / ─── StatGroup (layout parent for Stat tiles) ─── /\n\n .ddga-stat-group {\n --ddga-stat-group-gap: var(--ddga-space-4);\n }\n .ddga-stat-group--gap-sm {\n --ddga-stat-group-gap: var(--ddga-space-3);\n }\n .ddga-stat-group--gap-md {\n --ddga-stat-group-gap: var(--ddga-space-4);\n }\n .ddga-stat-group--gap-lg {\n --ddga-stat-group-gap: var(--ddga-space-6);\n }\n\n .ddga-stat-group--horizontal {\n display: grid;\n gap: var(--ddga-stat-group-gap);\n grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));\n }\n .ddga-stat-group--horizontal.ddga-stat-group--cols {\n grid-template-columns: repeat(var(--ddga-stat-group-columns), minmax(0, 1fr));\n }\n / Fixed columns collapse on narrow screens so content isn't crushed. /\n @media (max-width: 40rem) {\n .ddga-stat-group--horizontal.ddga-stat-group--cols {\n grid-template-columns: 1fr;\n }\n }\n\n .ddga-stat-group--vertical {\n display: flex;\n flex-direction: column;\n gap: var(--ddga-stat-group-gap);\n }\n\n / Inside a group, tiles fill their slot — release the standalone cap. /\n .ddga-stat-group .ddga-stat {\n max-inline-size: none;\n }\n\n / ─── Forced colors ─── /\n @media (forced-colors: active) {\n / Badge + chip backgrounds flatten to Canvas; a border keeps them visible. /\n .ddga-stat__icon,\n .ddga-stat__change--chip {\n border: 1px solid CanvasText;\n }\n .ddga-stat--accent {\n border-inline-start-color: Highlight;\n }\n / gradient flattens its tinted surface + has a transparent border, so it\n would lose its boundary — restore one. */\n .ddga-stat--gradient {\n border: 1px solid CanvasText;\n }\n }\n}\n"],"names":[]}
1	+ {"version":3,"mappings":"AAAA,uBAWE,sRAeA,yEAIA,gMAUA,8HAIA,iKAIA,6JAIA,2JAIA,2IAMA,4EAMA,+JAKA,qHAWA,kHAIA,gJAIA,8KAIA,4KAIA,0KAKA,4GAOA,iMAUA,kDAIA,wQAYA,oDAKA,0MAYA,kDAIA,+EAMA,0RAUA,gFAGA,8EAKA,gFAMA,0KAMA,6FAGA,2FAGA,sEAGA,kGAGA,kGAIA,sGAOA,2DAKA,4FAQA,2EAIA,qEAOA,2CAGA,oEAGA,mEAIA,qEAKA,mEAIA,kEAIA,oDAMA,2DAGA,mEAGA,mEAGA,mEAIA,kIAKA,gIAIA,yBACE,8EAKF,6FAOA,iDAKA,8BAEE,sEAIA,uDAKA","sources":["src/components/stat.css"],"sourcesContent":["@layer ddga-components {\n /* Self-contained KPI tile: owns its surface (padding/border/bg/radius) so\n `<Stat>` renders a complete tile with no Card wrapper. `max-inline-size`\n keeps a single tile from stretching full-width; inside a grid/flex the\n container controls sizing. Logical properties keep it RTL-safe; numbers\n stay LTR via Latin digits. Sentiment color flows through\n --ddga-stat-change-color. The --ddga-color-card/-border/-success/-error\n tokens (surface + change row) adapt automatically in dark mode, but the\n -50/-100 badge tints are raw palette tokens that don't, so they get\n explicit [data-theme='dark'] overrides (below). /\n\n .ddga-stat {\n display: flex;\n flex-direction: column;\n gap: var(--ddga-space-1);\n max-inline-size: 20rem;\n padding: var(--ddga-space-5);\n background-color: var(--ddga-color-card);\n border: 1px solid var(--ddga-color-border);\n border-radius: var(--ddga-radius-md);\n color: var(--ddga-color-card-foreground);\n }\n\n / ─── Variants ─── /\n / flat = the base surface (border + neutral badge). elevated/accent below. /\n\n .ddga-stat--elevated {\n border-color: transparent;\n box-shadow: var(--ddga-shadow-md);\n }\n .ddga-stat--elevated .ddga-stat__icon {\n inline-size: 2.5rem;\n block-size: 2.5rem;\n border-radius: var(--ddga-radius-full);\n background-color: var(--ddga-sa-600);\n color: var(--ddga-color-primary-foreground);\n }\n\n / accent + gradient share the sentiment-keyed tint vars (data-sentiment on\n the root). Defaults to brand when no sentiment. /\n :is(.ddga-stat--accent, .ddga-stat--gradient) {\n --ddga-stat-accent-fg: var(--ddga-sa-600);\n --ddga-stat-accent-bg: var(--ddga-sa-50);\n }\n :is(.ddga-stat--accent, .ddga-stat--gradient)[data-sentiment='positive'] {\n --ddga-stat-accent-fg: var(--ddga-success-600);\n --ddga-stat-accent-bg: var(--ddga-success-50);\n }\n :is(.ddga-stat--accent, .ddga-stat--gradient)[data-sentiment='negative'] {\n --ddga-stat-accent-fg: var(--ddga-error-600);\n --ddga-stat-accent-bg: var(--ddga-error-50);\n }\n :is(.ddga-stat--accent, .ddga-stat--gradient)[data-sentiment='neutral'] {\n --ddga-stat-accent-fg: var(--ddga-gray-600);\n --ddga-stat-accent-bg: var(--ddga-gray-100);\n }\n :is(.ddga-stat--accent, .ddga-stat--gradient) .ddga-stat__icon {\n background-color: var(--ddga-stat-accent-bg);\n color: var(--ddga-stat-accent-fg);\n }\n\n / accent: inline-start edge bar. /\n .ddga-stat--accent {\n border-inline-start: 3px solid var(--ddga-stat-accent-fg);\n }\n\n / gradient: soft sentiment-tinted surface (elevated, borderless). The tint\n fades from the inline-start corner; flip the angle in RTL. /\n .ddga-stat--gradient {\n border-color: transparent;\n box-shadow: var(--ddga-shadow-sm);\n background-image: linear-gradient(135deg, var(--ddga-stat-accent-bg), transparent 65%);\n }\n [dir='rtl'] .ddga-stat--gradient {\n background-image: linear-gradient(225deg, var(--ddga-stat-accent-bg), transparent 65%);\n }\n\n / ─── Dark mode ─── /\n / The -50/-100 badge tints are raw palette tokens (identical in dark) and read\n near-white on a dark card. Use translucent fills + lighter foregrounds\n (mirrors alert.css / empty-state.css). The change-row colors already adapt\n via the semantic --ddga-color-* tokens, and the elevated brand badge\n (--ddga-sa-600) stays legible in dark, so neither needs an override. /\n\n [data-theme='dark'] .ddga-stat--flat .ddga-stat__icon {\n background-color: rgb(255 255 255 / 0.08);\n color: var(--ddga-gray-300, #d2d6db);\n }\n [data-theme='dark'] :is(.ddga-stat--accent, .ddga-stat--gradient) {\n --ddga-stat-accent-fg: var(--ddga-sa-300, #7ed3a8);\n --ddga-stat-accent-bg: rgb(37 147 95 / 0.18);\n }\n [data-theme='dark'] :is(.ddga-stat--accent, .ddga-stat--gradient)[data-sentiment='positive'] {\n --ddga-stat-accent-fg: var(--ddga-success-200, #abefc6);\n --ddga-stat-accent-bg: rgb(7 148 85 / 0.18);\n }\n [data-theme='dark'] :is(.ddga-stat--accent, .ddga-stat--gradient)[data-sentiment='negative'] {\n --ddga-stat-accent-fg: var(--ddga-error-200, #fecdca);\n --ddga-stat-accent-bg: rgb(217 45 32 / 0.18);\n }\n [data-theme='dark'] :is(.ddga-stat--accent, .ddga-stat--gradient)[data-sentiment='neutral'] {\n --ddga-stat-accent-fg: var(--ddga-gray-300, #d2d6db);\n --ddga-stat-accent-bg: rgb(255 255 255 / 0.08);\n }\n\n .ddga-stat__label-row {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--ddga-space-2);\n }\n\n .ddga-stat__label {\n color: var(--ddga-text-secondary);\n font-size: var(--ddga-font-size-xs);\n font-weight: var(--ddga-font-weight-semibold);\n line-height: 1.4;\n text-transform: uppercase;\n / Tracked caps read as \"professional\" in LTR. Reset in RTL — letter-spacing\n breaks Arabic cursive joining; uppercase is a harmless no-op on Arabic. /\n letter-spacing: 0.06em;\n }\n [dir='rtl'] .ddga-stat__label {\n letter-spacing: normal;\n }\n\n .ddga-stat__icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n flex: none;\n inline-size: 2.25rem;\n block-size: 2.25rem;\n border-radius: var(--ddga-radius-md);\n background-color: var(--ddga-gray-100);\n color: var(--ddga-gray-600);\n font-size: var(--ddga-font-size-lg);\n }\n .ddga-stat__icon > svg {\n inline-size: 1em;\n block-size: 1em;\n }\n\n .ddga-stat__value {\n color: var(--ddga-text-primary);\n font-size: var(--ddga-font-size-2xl);\n font-weight: var(--ddga-font-weight-semibold);\n / tight leading for the large single-line numeric /\n line-height: 1.2;\n letter-spacing: -0.01em;\n / Align digits across a grid of tiles. /\n font-variant-numeric: tabular-nums;\n }\n / Reset the tracking in RTL — values can carry Arabic text (e.g. \"مليون ريال\"),\n and letter-spacing breaks Arabic cursive joining (mirrors __label above). /\n [dir='rtl'] .ddga-stat__value {\n letter-spacing: normal;\n }\n\n .ddga-stat__change-row {\n display: flex;\n align-items: center;\n gap: var(--ddga-space-2);\n }\n\n .ddga-stat__change {\n --ddga-stat-change-color: var(--ddga-text-secondary);\n display: inline-flex;\n align-items: center;\n gap: var(--ddga-space-1);\n color: var(--ddga-stat-change-color);\n font-size: var(--ddga-font-size-sm);\n font-weight: var(--ddga-font-weight-medium);\n font-variant-numeric: tabular-nums;\n }\n .ddga-stat__change--positive {\n --ddga-stat-change-color: var(--ddga-color-success);\n }\n .ddga-stat__change--negative {\n --ddga-stat-change-color: var(--ddga-color-error);\n }\n / Same as the default — kept explicit so the three sentiment modifiers are\n symmetric and `--neutral` is a stable override hook. /\n .ddga-stat__change--neutral {\n --ddga-stat-change-color: var(--ddga-text-secondary);\n }\n\n / Chip: same text color, wrapped in a sentiment-tinted pill. The raw -50\n tints get dark overrides below (mirrors the accent badge). /\n .ddga-stat__change--chip {\n padding-block: var(--ddga-space-1);\n padding-inline: var(--ddga-space-2);\n border-radius: var(--ddga-radius-full);\n background-color: var(--ddga-gray-100);\n }\n .ddga-stat__change--chip.ddga-stat__change--positive {\n background-color: var(--ddga-success-50);\n }\n .ddga-stat__change--chip.ddga-stat__change--negative {\n background-color: var(--ddga-error-50);\n }\n [data-theme='dark'] .ddga-stat__change--chip {\n background-color: rgb(255 255 255 / 0.08);\n }\n [data-theme='dark'] .ddga-stat__change--chip.ddga-stat__change--positive {\n background-color: rgb(7 148 85 / 0.18);\n }\n [data-theme='dark'] .ddga-stat__change--chip.ddga-stat__change--negative {\n background-color: rgb(217 45 32 / 0.18);\n }\n\n .ddga-stat__change-icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n / caret slightly smaller than the change text for hierarchy /\n font-size: 0.85em;\n }\n .ddga-stat__change-icon > svg {\n inline-size: 1em;\n block-size: 1em;\n }\n\n .ddga-stat__change-label {\n color: var(--ddga-text-tertiary);\n font-size: var(--ddga-font-size-sm);\n }\n\n / ─── Chart slot (consumer-supplied sparkline) ─── /\n / A styled slot with a consistent height; the dropped-in chart stretches to\n fill. The library ships no charting dependency. /\n .ddga-stat__chart {\n margin-block-start: var(--ddga-space-2);\n block-size: 2.5rem;\n }\n .ddga-stat__chart > svg {\n display: block;\n inline-size: 100%;\n block-size: 100%;\n }\n\n / ─── Sizes (scale padding + value; lg/xl also open the root gap) ─── /\n .ddga-stat--sm {\n padding: var(--ddga-space-4);\n }\n .ddga-stat--sm .ddga-stat__value {\n font-size: var(--ddga-font-size-xl);\n }\n .ddga-stat--lg {\n gap: var(--ddga-space-2);\n padding: var(--ddga-space-6);\n }\n .ddga-stat--lg .ddga-stat__value {\n font-size: var(--ddga-font-size-3xl);\n }\n / Hero/display: no font-size token sits above 3xl, so the display value uses\n a component-local rem (precedent: the .625rem label size). /\n .ddga-stat--xl {\n gap: var(--ddga-space-2);\n padding: var(--ddga-space-8);\n }\n .ddga-stat--xl .ddga-stat__value {\n font-size: 2.5rem;\n line-height: 1.1;\n }\n .ddga-stat--xl .ddga-stat__chart {\n block-size: 3.25rem;\n }\n\n / ─── StatGroup (layout parent for Stat tiles) ─── /\n\n .ddga-stat-group {\n --ddga-stat-group-gap: var(--ddga-space-4);\n }\n .ddga-stat-group--gap-sm {\n --ddga-stat-group-gap: var(--ddga-space-3);\n }\n .ddga-stat-group--gap-md {\n --ddga-stat-group-gap: var(--ddga-space-4);\n }\n .ddga-stat-group--gap-lg {\n --ddga-stat-group-gap: var(--ddga-space-6);\n }\n\n .ddga-stat-group--horizontal {\n display: grid;\n gap: var(--ddga-stat-group-gap);\n grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));\n }\n .ddga-stat-group--horizontal.ddga-stat-group--cols {\n grid-template-columns: repeat(var(--ddga-stat-group-columns), minmax(0, 1fr));\n }\n / Fixed columns collapse on narrow screens so content isn't crushed. /\n @media (max-width: 40rem) {\n .ddga-stat-group--horizontal.ddga-stat-group--cols {\n grid-template-columns: 1fr;\n }\n }\n\n .ddga-stat-group--vertical {\n display: flex;\n flex-direction: column;\n gap: var(--ddga-stat-group-gap);\n }\n\n / Inside a group, tiles fill their slot — release the standalone cap. /\n .ddga-stat-group .ddga-stat {\n max-inline-size: none;\n }\n\n / ─── Forced colors ─── /\n @media (forced-colors: active) {\n / Badge + chip backgrounds flatten to Canvas; a border keeps them visible. /\n .ddga-stat__icon,\n .ddga-stat__change--chip {\n border: 1px solid CanvasText;\n }\n .ddga-stat--accent {\n border-inline-start-color: Highlight;\n }\n / gradient flattens its tinted surface + has a transparent border, so it\n would lose its boundary — restore one. */\n .ddga-stat--gradient {\n border: 1px solid CanvasText;\n }\n }\n}\n"],"names":[]}

package/dist/components/switch.css CHANGED Viewed

@@ -1,2 +1,2 @@
-@layer ddga-components{.ddga-switch-row{align-items:center;gap:var(--ddga-space-2);display:flex}.ddga-switch{background-color:var(--ddga-color-input);cursor:pointer;border:1px solid #0000;border-radius:999px;flex-shrink:0;align-items:center;padding:0;transition:background-color .15s,border-color .15s,box-shadow .15s;display:inline-flex;position:relative}.ddga-switch--md{--ddga-switch-thumb-travel:16px;block-size:22px;inline-size:38px}.ddga-switch--sm{--ddga-switch-thumb-travel:12px;block-size:18px;inline-size:30px}.ddga-switch[data-state=checked]{background-color:var(--ddga-color-primary)}.ddga-switch:focus-visible{box-shadow:0 0 0 2px var(--ddga-color-ring);outline:none}.ddga-switch--error{background-color:var(--ddga-color-background);border-color:var(--ddga-color-error)}.ddga-switch--error[data-state=checked]{background-color:var(--ddga-color-error);border-color:var(--ddga-color-error)}.ddga-switch--error:focus-visible{box-shadow:0 0 0 2px var(--ddga-color-error)}.ddga-switch:disabled{opacity:.5;cursor:not-allowed}.ddga-switch-row:has(.ddga-switch:disabled) .ddga-switch__label{cursor:not-allowed;color:var(--ddga-text-tertiary)}.ddga-switch__thumb{aspect-ratio:1;background-color:var(--ddga-color-background);will-change:translate;border-radius:999px;block-size:calc(100% - 4px);margin-inline-start:2px;transition:translate .15s;display:block;translate:0;box-shadow:0 1px 2px #00000026}.ddga-switch[data-state=checked] .ddga-switch__thumb{translate:var(--ddga-switch-thumb-travel) 0}[dir=rtl] .ddga-switch[data-state=checked] .ddga-switch__thumb{translate:calc(var(--ddga-switch-thumb-travel) * -1) 0}[data-theme=dark] .ddga-switch__thumb{background-color:#f3f4f6;box-shadow:0 1px 2px #0006}.ddga-switch__label{color:var(--ddga-text-primary);font-size:var(--ddga-font-size-base);cursor:pointer;line-height:1.4}.ddga-switch__required{color:var(--ddga-color-error);margin-inline-start:.125rem}@media (prefers-reduced-motion:reduce){.ddga-switch,.ddga-switch__thumb{transition:none}}@media (forced-colors:active){.ddga-switch{background-color:canvas;border:1px solid canvastext}.ddga-switch[data-state=checked]{background-color:highlight}.ddga-switch__thumb{box-shadow:none;background-color:canvastext}.ddga-switch[data-state=checked] .ddga-switch__thumb{background-color:highlighttext}.ddga-switch:focus-visible{outline-offset:1px;outline:2px solid highlight}.ddga-switch:disabled{border-color:graytext}}}
+@layer ddga-components{.ddga-switch-row{align-items:center;gap:var(--ddga-space-2);display:flex}.ddga-switch{background-color:var(--ddga-color-input);cursor:pointer;border:1px solid #0000;border-radius:999px;flex-shrink:0;align-items:center;padding:0;transition:background-color .15s,border-color .15s,box-shadow .15s;display:inline-flex;position:relative}.ddga-switch--md{--ddga-switch-thumb-travel:16px;block-size:22px;inline-size:38px}.ddga-switch--sm{--ddga-switch-thumb-travel:12px;block-size:18px;inline-size:30px}.ddga-switch[data-state=checked]{background-color:var(--ddga-color-primary)}.ddga-switch:focus-visible{box-shadow:0 0 0 2px var(--ddga-color-ring);outline:none}.ddga-switch--error{background-color:var(--ddga-color-background);border-color:var(--ddga-color-error)}.ddga-switch--error[data-state=checked]{background-color:var(--ddga-color-error);border-color:var(--ddga-color-error)}.ddga-switch--error:focus-visible{box-shadow:0 0 0 2px var(--ddga-color-error)}.ddga-switch:disabled{opacity:.5;cursor:not-allowed}.ddga-switch-row:has(.ddga-switch:disabled) .ddga-switch__label{cursor:not-allowed;color:var(--ddga-text-tertiary)}.ddga-switch__thumb{aspect-ratio:1;background-color:var(--ddga-color-background);will-change:translate;border-radius:999px;block-size:calc(100% - 4px);margin-inline-start:2px;transition:translate .15s;display:block;translate:0;box-shadow:0 1px 2px #00000026}.ddga-switch[data-state=checked] .ddga-switch__thumb{translate:var(--ddga-switch-thumb-travel) 0}[dir=rtl] .ddga-switch[data-state=checked] .ddga-switch__thumb{translate:calc(var(--ddga-switch-thumb-travel) * -1) 0}[data-theme=dark] .ddga-switch__thumb{background-color:var(--ddga-gray-100);box-shadow:0 1px 2px #0006}.ddga-switch__label{color:var(--ddga-text-primary);font-size:var(--ddga-font-size-base);cursor:pointer;line-height:1.4}.ddga-switch__required{color:var(--ddga-color-error);margin-inline-start:.125rem}@media (prefers-reduced-motion:reduce){.ddga-switch,.ddga-switch__thumb{transition:none}}@media (forced-colors:active){.ddga-switch{background-color:canvas;border:1px solid canvastext}.ddga-switch[data-state=checked]{background-color:highlight}.ddga-switch__thumb{box-shadow:none;background-color:canvastext}.ddga-switch[data-state=checked] .ddga-switch__thumb{background-color:highlighttext}.ddga-switch:focus-visible{outline-offset:1px;outline:2px solid highlight}.ddga-switch:disabled{border-color:graytext}}}
 /*# sourceMappingURL=switch.css.map */

package/dist/components/switch.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"mappings":"AAAA,uBAME,yEAQA,oQAkBA,kFAKA,kFAQA,4EAMA,oFAOA,uGAIA,sHAIA,+EAMA,oDAIA,mHAOA,kQAYA,iGAQA,sHAUA,~~0FAOA~~,uHAMA,iFAOA,uCACE,kDAQF,8BACE,iEAIA,4DAGA,gEAIA,oFAGA,0EAIA","sources":["src/components/switch.css"],"sourcesContent":["@layer ddga-components {\n /* Wrapper (.ddga-field) + helper/error (.ddga-field__message) are shared\n , see field.css. Only Switch-specific styles live here. /\n\n / ─── Row (track + label, inline) ─── /\n\n .ddga-switch-row {\n display: flex;\n align-items: center;\n gap: var(--ddga-space-2);\n }\n\n / ─── Track (Radix Root , reset the button, then style) ─── /\n\n .ddga-switch {\n position: relative;\n display: inline-flex;\n align-items: center;\n flex-shrink: 0;\n padding: 0;\n border: 1px solid transparent;\n border-radius: 999px;\n background-color: var(--ddga-color-input);\n cursor: pointer;\n transition:\n background-color 150ms ease,\n border-color 150ms ease,\n box-shadow 150ms ease;\n }\n\n / Track dimensions and travel distance. Travel is encoded as a per-size\n custom property so the thumb rule below is size-agnostic. /\n .ddga-switch--md {\n block-size: 22px;\n inline-size: 38px;\n --ddga-switch-thumb-travel: 16px;\n }\n .ddga-switch--sm {\n block-size: 18px;\n inline-size: 30px;\n --ddga-switch-thumb-travel: 12px;\n }\n\n / ─── Checked fill ─── /\n\n .ddga-switch[data-state='checked'] {\n background-color: var(--ddga-color-primary);\n }\n\n / ─── Focus (slightly thicker ring , small hit target) ─── /\n\n .ddga-switch:focus-visible {\n outline: none;\n box-shadow: 0 0 0 2px var(--ddga-color-ring);\n }\n\n / ─── Error ─── /\n\n .ddga-switch--error {\n background-color: var(--ddga-color-background);\n border-color: var(--ddga-color-error);\n }\n .ddga-switch--error[data-state='checked'] {\n background-color: var(--ddga-color-error);\n border-color: var(--ddga-color-error);\n }\n .ddga-switch--error:focus-visible {\n box-shadow: 0 0 0 2px var(--ddga-color-error);\n }\n\n / ─── Disabled ─── /\n\n .ddga-switch:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n .ddga-switch-row:has(.ddga-switch:disabled) .ddga-switch__label {\n cursor: not-allowed;\n color: var(--ddga-text-tertiary);\n }\n\n / ─── Thumb (Radix Thumb , the moving circle) ─── /\n\n .ddga-switch__thumb {\n display: block;\n block-size: calc(100% - 4px);\n aspect-ratio: 1;\n margin-inline-start: 2px;\n border-radius: 999px;\n background-color: var(--ddga-color-background);\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);\n transition: translate 150ms ease;\n translate: 0 0;\n will-change: translate;\n }\n .ddga-switch[data-state='checked'] .ddga-switch__thumb {\n translate: var(--ddga-switch-thumb-travel) 0;\n }\n / RTL: the thumb's resting position is on the right (logical start\n flips), so checked travels in the negative direction. The ancestor\n `[dir=\"rtl\"]` is set on DgaProvider; using attribute selector instead\n of `:dir()` for broader browser support (the theming pass set the\n Safari floor at 16.2; `:dir()` lands in 16.4). /\n [dir='rtl'] .ddga-switch[data-state='checked'] .ddga-switch__thumb {\n translate: calc(var(--ddga-switch-thumb-travel) -1) 0;\n }\n\n /* Dark mode: the default thumb color (--ddga-color-background, near-white\n in light mode) flips to a very dark gray-900 , darker than the off-state\n track (--ddga-color-input = gray-700) , and the thumb disappears.\n Override locally with a near-white so the puck reads as a raised\n surface in both modes. Kept in this file (not dark.css) because dark.css\n is reserved for semantic token remapping; this is a per-component fix. /\n [data-theme='dark'] .ddga-switch__thumb {\n background-color: ~~#f3f4f6~~;\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);\n }\n\n / ─── Label ─── /\n\n .ddga-switch__label {\n color: var(--ddga-text-primary);\n font-size: var(--ddga-font-size-base);\n line-height: 1.4;\n cursor: pointer;\n }\n .ddga-switch__required {\n color: var(--ddga-color-error);\n margin-inline-start: 0.125rem;\n }\n\n / ─── Reduced motion ─── /\n\n @media (prefers-reduced-motion: reduce) {\n .ddga-switch,\n .ddga-switch__thumb {\n transition: none;\n }\n }\n\n / ─── Forced colors (Windows High Contrast) ─── */\n\n @media (forced-colors: active) {\n .ddga-switch {\n border: 1px solid CanvasText;\n background-color: Canvas;\n }\n .ddga-switch[data-state='checked'] {\n background-color: Highlight;\n }\n .ddga-switch__thumb {\n background-color: CanvasText;\n box-shadow: none;\n }\n .ddga-switch[data-state='checked'] .ddga-switch__thumb {\n background-color: HighlightText;\n }\n .ddga-switch:focus-visible {\n outline: 2px solid Highlight;\n outline-offset: 1px;\n }\n .ddga-switch:disabled {\n border-color: GrayText;\n }\n }\n}\n"],"names":[]}
1	+ {"version":3,"mappings":"AAAA,uBAME,yEAQA,oQAkBA,kFAKA,kFAQA,4EAMA,oFAOA,uGAIA,sHAIA,+EAMA,oDAIA,mHAOA,kQAYA,iGAQA,sHAUA,uGAOA,uHAMA,iFAOA,uCACE,kDAQF,8BACE,iEAIA,4DAGA,gEAIA,oFAGA,0EAIA","sources":["src/components/switch.css"],"sourcesContent":["@layer ddga-components {\n /* Wrapper (.ddga-field) + helper/error (.ddga-field__message) are shared\n , see field.css. Only Switch-specific styles live here. /\n\n / ─── Row (track + label, inline) ─── /\n\n .ddga-switch-row {\n display: flex;\n align-items: center;\n gap: var(--ddga-space-2);\n }\n\n / ─── Track (Radix Root , reset the button, then style) ─── /\n\n .ddga-switch {\n position: relative;\n display: inline-flex;\n align-items: center;\n flex-shrink: 0;\n padding: 0;\n border: 1px solid transparent;\n border-radius: 999px;\n background-color: var(--ddga-color-input);\n cursor: pointer;\n transition:\n background-color 150ms ease,\n border-color 150ms ease,\n box-shadow 150ms ease;\n }\n\n / Track dimensions and travel distance. Travel is encoded as a per-size\n custom property so the thumb rule below is size-agnostic. /\n .ddga-switch--md {\n block-size: 22px;\n inline-size: 38px;\n --ddga-switch-thumb-travel: 16px;\n }\n .ddga-switch--sm {\n block-size: 18px;\n inline-size: 30px;\n --ddga-switch-thumb-travel: 12px;\n }\n\n / ─── Checked fill ─── /\n\n .ddga-switch[data-state='checked'] {\n background-color: var(--ddga-color-primary);\n }\n\n / ─── Focus (slightly thicker ring , small hit target) ─── /\n\n .ddga-switch:focus-visible {\n outline: none;\n box-shadow: 0 0 0 2px var(--ddga-color-ring);\n }\n\n / ─── Error ─── /\n\n .ddga-switch--error {\n background-color: var(--ddga-color-background);\n border-color: var(--ddga-color-error);\n }\n .ddga-switch--error[data-state='checked'] {\n background-color: var(--ddga-color-error);\n border-color: var(--ddga-color-error);\n }\n .ddga-switch--error:focus-visible {\n box-shadow: 0 0 0 2px var(--ddga-color-error);\n }\n\n / ─── Disabled ─── /\n\n .ddga-switch:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n .ddga-switch-row:has(.ddga-switch:disabled) .ddga-switch__label {\n cursor: not-allowed;\n color: var(--ddga-text-tertiary);\n }\n\n / ─── Thumb (Radix Thumb , the moving circle) ─── /\n\n .ddga-switch__thumb {\n display: block;\n block-size: calc(100% - 4px);\n aspect-ratio: 1;\n margin-inline-start: 2px;\n border-radius: 999px;\n background-color: var(--ddga-color-background);\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);\n transition: translate 150ms ease;\n translate: 0 0;\n will-change: translate;\n }\n .ddga-switch[data-state='checked'] .ddga-switch__thumb {\n translate: var(--ddga-switch-thumb-travel) 0;\n }\n / RTL: the thumb's resting position is on the right (logical start\n flips), so checked travels in the negative direction. The ancestor\n `[dir=\"rtl\"]` is set on DgaProvider; using attribute selector instead\n of `:dir()` for broader browser support (the theming pass set the\n Safari floor at 16.2; `:dir()` lands in 16.4). /\n [dir='rtl'] .ddga-switch[data-state='checked'] .ddga-switch__thumb {\n translate: calc(var(--ddga-switch-thumb-travel) -1) 0;\n }\n\n /* Dark mode: the default thumb color (--ddga-color-background, near-white\n in light mode) flips to a very dark gray-900 , darker than the off-state\n track (--ddga-color-input = gray-700) , and the thumb disappears.\n Override locally with a near-white so the puck reads as a raised\n surface in both modes. Kept in this file (not dark.css) because dark.css\n is reserved for semantic token remapping; this is a per-component fix. /\n [data-theme='dark'] .ddga-switch__thumb {\n background-color: var(--ddga-gray-100);\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);\n }\n\n / ─── Label ─── /\n\n .ddga-switch__label {\n color: var(--ddga-text-primary);\n font-size: var(--ddga-font-size-base);\n line-height: 1.4;\n cursor: pointer;\n }\n .ddga-switch__required {\n color: var(--ddga-color-error);\n margin-inline-start: 0.125rem;\n }\n\n / ─── Reduced motion ─── /\n\n @media (prefers-reduced-motion: reduce) {\n .ddga-switch,\n .ddga-switch__thumb {\n transition: none;\n }\n }\n\n / ─── Forced colors (Windows High Contrast) ─── */\n\n @media (forced-colors: active) {\n .ddga-switch {\n border: 1px solid CanvasText;\n background-color: Canvas;\n }\n .ddga-switch[data-state='checked'] {\n background-color: Highlight;\n }\n .ddga-switch__thumb {\n background-color: CanvasText;\n box-shadow: none;\n }\n .ddga-switch[data-state='checked'] .ddga-switch__thumb {\n background-color: HighlightText;\n }\n .ddga-switch:focus-visible {\n outline: 2px solid Highlight;\n outline-offset: 1px;\n }\n .ddga-switch:disabled {\n border-color: GrayText;\n }\n }\n}\n"],"names":[]}