@owodesign/owoui 0.1.5 → 0.1.7-beta
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +4 -0
- package/dist/index.css +4 -0
- package/dist/index.d.ts +40 -20
- package/dist/index.min.js +1 -1
- package/dist/preset-default.css +5 -118
- package/dist/preset-elevated.css +12 -146
- package/dist/preset-flat.css +5 -119
- package/dist/preset-glass.css +15 -158
- package/dist/storybook/index.css +4 -0
- package/dist/storybook/index.min.js +87 -14
- package/dist/storybook-static/app.css +381 -3813
- package/dist/storybook-static/assets/main.css +1 -2
- package/dist/storybook-static/assets/main.js +93 -21
- package/dist/style.css +152 -2785
- package/dist/theme-dark.css +9 -152
- package/dist/theme-light.css +23 -152
- package/dist/tokens.css +105 -5
- package/dist/tokens.d.ts +2 -2
- package/dist/tokens.min.js +1 -1
- package/package.json +17 -7
package/README.md
CHANGED
|
@@ -100,6 +100,10 @@ The dev host lives inside this package itself (`vite.config.ts`, `postcss.config
|
|
|
100
100
|
- [token-layering-and-naming.md](./docs/spec/token-layering-and-naming.md): raw / alias / semantic token layering and naming rules
|
|
101
101
|
- [token-naming-upgrade-plan.md](./docs/spec/token-naming-upgrade-plan.md): `--owo-ref-*` / `--owo-sys-*` / `--owo-cmp-*` naming migration plan
|
|
102
102
|
|
|
103
|
+
## Pitches
|
|
104
|
+
|
|
105
|
+
- [future-data-density-plan.md](./docs/pitch/future-data-density-plan.md): phased proposal for control height tokens and future `data-density` support
|
|
106
|
+
|
|
103
107
|
## Release Checks
|
|
104
108
|
|
|
105
109
|
From the package root:
|
package/dist/index.css
ADDED
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
@layer owoui.components {
|
|
2
|
+
.root{--avatar-bg: var(--owo-cmp-surface-bg-inset);--avatar-text: var(--owo-cmp-text-secondary);--avatar-border: transparent;display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;overflow:hidden;border-radius:var(--owo-cmp-control-radius-full);font-weight:500;user-select:none;background:var(--avatar-bg);color:var(--avatar-text);border:1px solid var(--avatar-border)}.root[data-size=xs]{height:1.5rem;width:1.5rem;font-size:10px}.root[data-size=sm]{height:2rem;width:2rem;font-size:.75rem;line-height:1rem}.root[data-size=md]{height:2.5rem;width:2.5rem;font-size:.875rem;line-height:1.25rem}.root[data-size=lg]{height:3.5rem;width:3.5rem;font-size:1.125rem;line-height:1.75rem}.root>img{height:100%;width:100%;object-fit:cover}.root[data-tone=subtle]{--avatar-bg: var(--owo-cmp-surface-bg-subtle);--avatar-text: var(--owo-cmp-text-muted)}.root{--badge-bg: var(--owo-cmp-surface-bg-inset);--badge-text: var(--owo-cmp-text-secondary);--badge-border: transparent;display:inline-flex;align-items:center;border-radius:var(--owo-cmp-control-radius-full);border:1px solid var(--badge-border);color:var(--badge-text);background:var(--badge-bg)}.root[data-size=xs]{padding:.25rem .625rem;font-size:11px}.root[data-size=sm]{padding:.25rem .75rem;font-size:.75rem;line-height:1rem;font-weight:500}.root[data-variant=outline]{--badge-bg: transparent;--badge-border: var(--owo-cmp-surface-border)}.root[data-tone=info]{--badge-bg: var(--owo-cmp-info-bg);--badge-text: var(--owo-cmp-info-text);--badge-border: var(--owo-cmp-info-border)}.root[data-tone=info][data-variant=outline]{--badge-bg: transparent}.root[data-tone=success]{--badge-bg: var(--owo-cmp-success-bg);--badge-text: var(--owo-cmp-success-text);--badge-border: var(--owo-cmp-success-border)}.root[data-tone=success][data-variant=outline]{--badge-bg: transparent}.root[data-tone=warning]{--badge-bg: var(--owo-cmp-warning-bg);--badge-text: var(--owo-cmp-warning-text);--badge-border: var(--owo-cmp-warning-border)}.root[data-tone=warning][data-variant=outline]{--badge-bg: transparent}.root[data-tone=danger]{--badge-bg: var(--owo-cmp-danger-bg);--badge-text: var(--owo-cmp-danger-text);--badge-border: var(--owo-cmp-danger-border)}.root[data-tone=danger][data-variant=outline]{--badge-bg: transparent}.root{display:inline-flex}.root[data-animate=spin]{animation:owo-spin 1s linear infinite}@keyframes owo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.root[data-animate=spin]{animation:none}}.root{--button-bg: var(--owo-cmp-surface-bg);--button-bg-hover: var(--owo-cmp-surface-bg-inset);--button-bg-active: var(--owo-cmp-surface-bg-subtle);--button-text: var(--owo-cmp-text-primary);--button-border: var(--owo-cmp-surface-border);--button-ring: var(--owo-cmp-control-focus-ring);--button-disabled-opacity: .5;display:inline-flex;align-items:center;justify-content:center;padding:0;gap:.5rem;border-radius:var(--owo-cmp-control-radius-md);border:1px solid var(--button-border);font-weight:500;transition-property:color,background-color,border-color;transition-duration:.15s;appearance:none;background:var(--button-bg);color:var(--button-text)}.root[data-size=xs]{min-height:var(--owo-cmp-control-height-xs);padding-inline:.625rem;font-size:.6875rem;line-height:.875rem}.root[data-size=sm]{min-height:var(--owo-cmp-control-height-sm);padding-inline:.75rem;font-size:.75rem;line-height:1rem}.root[data-size=md]{min-height:var(--owo-cmp-control-height-md);padding-inline:1rem;font-size:.875rem;line-height:1.25rem}.root[data-size=lg]{min-height:var(--owo-cmp-control-height-lg);padding-inline:1.125rem;font-size:.9375rem;line-height:1.375rem}.root[data-size=xl]{min-height:var(--owo-cmp-control-height-xl);padding-inline:1.25rem;font-size:1rem;line-height:1.5rem}.root:focus-visible{box-shadow:inset 0 0 0 2px var(--button-ring);outline:none}.root:hover{background:var(--button-bg-hover)}.root:active{background:var(--button-bg-active)}.root:disabled{cursor:not-allowed;opacity:var(--button-disabled-opacity)}.root[data-loading=true]{pointer-events:none;cursor:wait}.icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;line-height:0}.icon svg{display:block}.label{display:inline-flex;align-items:center}.root[data-variant=primary]{--button-bg: var(--owo-cmp-accent-bg);--button-bg-hover: var(--owo-cmp-accent-bg-hover);--button-bg-active: color-mix(in srgb, var(--owo-cmp-accent-bg-hover) 88%, black);--button-text: var(--owo-cmp-accent-text);--button-border: transparent}.root[data-variant=ghost]{--button-bg: transparent;--button-bg-hover: var(--owo-cmp-surface-bg-inset);--button-bg-active: var(--owo-cmp-surface-bg-subtle);--button-text: var(--owo-cmp-text-secondary);--button-border: transparent}.root[data-variant=danger]{--button-bg: var(--owo-cmp-danger-bg);--button-bg-hover: color-mix(in srgb, var(--owo-cmp-danger-bg) 92%, var(--owo-cmp-danger-border));--button-bg-active: color-mix(in srgb, var(--owo-cmp-danger-bg) 84%, var(--owo-cmp-danger-border));--button-text: var(--owo-cmp-danger-text);--button-border: var(--owo-cmp-danger-border);--button-ring: var(--owo-cmp-danger-border)}:where(.root [data-part=trigger]){border:0;padding:0;appearance:none;background:var(--collapsible-trigger-bg, transparent);color:inherit;font:inherit;cursor:pointer;transition:background-color .18s ease,color .18s ease}:where(.root [data-part=trigger]:hover){background:var(--collapsible-trigger-bg-hover, var(--collapsible-trigger-bg, transparent))}:where(.root [data-part=trigger][data-state=open]){background:var(--collapsible-trigger-bg-open, var(--collapsible-trigger-bg-hover, var(--collapsible-trigger-bg, transparent)))}:where(.root [data-part=content]){height:auto;overflow:hidden;transition:height .18s ease;background:var(--collapsible-content-bg, transparent)}.triggerInner{display:flex;width:100%;align-items:center;gap:var(--collapsible-trigger-gap, .75rem)}.triggerIcon,.triggerIndicator{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;line-height:0;color:inherit}.triggerLabel{min-width:0;flex:1 1 auto;text-align:inherit}.contentInner{min-height:0}.overlay{position:fixed;inset:0;z-index:var(--owo-cmp-z-modal);display:flex;align-items:center;justify-content:center}.overlay [data-part=backdrop]{position:absolute;inset:0;padding:0;border:0;background:var(--owo-cmp-overlay-bg);animation:dialog-backdrop-in .2s var(--owo-cmp-motion-ease-standard)}.panel{position:relative;z-index:10;width:100%;border-radius:var(--owo-cmp-control-radius-xl);background:var(--owo-cmp-surface-bg-raised);border:1px solid var(--owo-cmp-surface-border);color:var(--owo-cmp-text-primary);box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a;animation:dialog-in .2s var(--owo-cmp-motion-ease-standard)}.panel[data-size=sm]{max-width:26rem}.panel[data-size=md]{max-width:32rem}.overlay [data-part=header]{padding:1.25rem 1.25rem .25rem;font-size:1rem;line-height:1.5;font-weight:600;color:var(--owo-cmp-text-primary)}.overlay [data-part=body]{padding:.75rem 1.25rem;font-size:.875rem;line-height:1.25rem;color:var(--owo-cmp-text-secondary)}.overlay [data-part=footer]{display:flex;align-items:center;justify-content:flex-end;gap:.5rem;padding:.75rem 1.25rem 1.25rem}.confirmDescription{white-space:pre-wrap}@keyframes dialog-in{0%{opacity:0;transform:scale(.95) translateY(4px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes dialog-backdrop-in{0%{opacity:0}to{opacity:1}}.trigger{border:0;padding:0;appearance:none;background:transparent;color:inherit;font:inherit}.content{min-width:12rem;overflow-y:auto;border:1px solid var(--owo-cmp-surface-border);border-radius:var(--owo-cmp-control-radius-lg);background:var(--owo-cmp-surface-bg-raised);box-shadow:var(--_owo-dropdown-menu-shadow, var(--owo-cmp-surface-shadow-strong));padding:.375rem;color:var(--owo-cmp-text-primary);outline:none;z-index:var(--owo-cmp-z-dropdown);animation:owo-dropdown-menu-in var(--owo-cmp-motion-duration-fast) var(--owo-cmp-motion-ease-standard)}.content[data-side=top]{transform-origin:bottom center}.content[data-side=bottom]{transform-origin:top center}.content[data-side=left]{transform-origin:center right}.content[data-side=right]{transform-origin:center left}.content [data-part=group]+[data-part=group]{margin-top:.375rem;padding-top:.375rem;border-top:1px solid color-mix(in srgb,var(--owo-cmp-surface-border) 80%,transparent)}.content [data-part=label]{padding:.35rem .625rem .25rem;font-size:.675rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--owo-cmp-text-muted)}.content [data-part=separator]{margin:.375rem .25rem;border-top:1px solid color-mix(in srgb,var(--owo-cmp-surface-border) 82%,transparent)}.content [data-part=item],.subTrigger{display:flex;width:100%;align-items:center;gap:.75rem;border:0;border-radius:calc(var(--owo-cmp-control-radius-md) - .125rem);background:transparent;padding:.625rem .75rem;text-align:left;color:inherit;cursor:default;transition:background-color var(--owo-cmp-motion-duration-fast) var(--owo-cmp-motion-ease-standard),color var(--owo-cmp-motion-duration-fast) var(--owo-cmp-motion-ease-standard);appearance:none}.content [data-part=item]:hover,.content [data-part=item][data-highlighted],.subTrigger:hover,.subTrigger[data-highlighted]{background:var(--owo-cmp-surface-bg-inset)}.content [data-part=item][data-selected]{background:color-mix(in srgb,var(--owo-cmp-accent-bg) 10%,var(--owo-cmp-surface-bg-raised))}.content [data-part=item][data-selected] .itemMain{color:var(--owo-cmp-text-primary);font-weight:600}.content [data-part=item][data-disabled],.subTrigger[data-disabled]{opacity:.5;cursor:not-allowed}.content [data-part=item][data-destructive],.subTrigger[data-destructive]{color:var(--owo-cmp-danger-text)}.itemInset{padding-left:1rem}.itemMain{min-width:0;flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.shortcut,.indicator,.submenuIndicator{flex:0 0 auto;color:var(--owo-cmp-text-muted);font-size:.75rem}.indicator{min-width:1rem;text-align:center;color:var(--owo-cmp-accent-bg);font-weight:700}.subTrigger[data-state=open]{background:var(--owo-cmp-surface-bg-inset)}@keyframes owo-dropdown-menu-in{0%{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}.panel{--drawer-surface: var(--owo-cmp-surface-bg-raised);--drawer-border: var(--owo-cmp-surface-border);--drawer-shadow: var(--owo-cmp-surface-shadow-strong);z-index:calc(var(--owo-cmp-z-modal) + 1);display:flex;max-width:100%;flex-direction:column;will-change:transform;transform:translate(0);transition:transform var(--owo-cmp-motion-duration-default) var(--owo-cmp-motion-ease-standard);background:var(--drawer-surface);border-color:var(--drawer-border);box-shadow:var(--drawer-shadow)}.panel[data-position=fixed]{position:fixed}.panel[data-position=absolute]{position:absolute}.panel[data-side=left]{left:0;top:0}.panel[data-side=right]{right:0;top:0}.panel[data-state=open]{pointer-events:auto;visibility:visible;transform:translate(0)}.panel[data-state=closed]{pointer-events:none;visibility:hidden}.panel[data-state=closed][data-side=left]{transform:translate(-100%)}.panel[data-state=closed][data-side=right]{transform:translate(100%)}.backdrop{--drawer-backdrop: var(--owo-cmp-overlay-bg);inset:0;z-index:var(--owo-cmp-z-modal);padding:0;border:0;background:var(--drawer-backdrop)}.backdrop[data-position=fixed]{position:fixed}.backdrop[data-position=absolute]{position:absolute}.root{--field-label: var(--owo-cmp-text-secondary);--field-help: var(--owo-cmp-text-muted);display:block}.root .label{display:block;margin-bottom:.25rem;font-size:.75rem;line-height:1rem;color:var(--field-label)}.root .help{display:block;margin-top:.25rem;font-size:.75rem;line-height:1rem;color:var(--field-help)}.root{--icon-button-bg: transparent;--icon-button-bg-hover: var(--owo-cmp-surface-bg-inset);--icon-button-bg-active: var(--owo-cmp-surface-bg-subtle);--icon-button-text: var(--owo-cmp-text-muted);--icon-button-ring: var(--owo-cmp-control-focus-ring);display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:var(--owo-cmp-control-radius-md);transition-property:color,background-color;transition-duration:.15s;background:var(--icon-button-bg);color:var(--icon-button-text)}.root[data-size=xs]{height:var(--owo-cmp-control-height-xs);width:var(--owo-cmp-control-height-xs)}.root[data-size=sm]{height:var(--owo-cmp-control-height-sm);width:var(--owo-cmp-control-height-sm)}.root[data-size=md]{height:var(--owo-cmp-control-height-md);width:var(--owo-cmp-control-height-md)}.root[data-size=lg]{height:var(--owo-cmp-control-height-lg);width:var(--owo-cmp-control-height-lg)}.root[data-size=xl]{height:var(--owo-cmp-control-height-xl);width:var(--owo-cmp-control-height-xl)}.root:focus-visible{box-shadow:inset 0 0 0 2px var(--icon-button-ring);outline:none}.root:hover{background:var(--icon-button-bg-hover);color:var(--owo-cmp-text-primary)}.root:active{background:var(--icon-button-bg-active)}.root[data-variant=subtle]{--icon-button-bg: var(--owo-cmp-surface-bg-inset);--icon-button-bg-hover: var(--owo-cmp-surface-bg-subtle);--icon-button-bg-active: var(--owo-cmp-surface-bg-raised);--icon-button-text: var(--owo-cmp-text-primary)}.root{--field-bg: var(--owo-cmp-surface-bg);--field-border: var(--owo-cmp-surface-border);--field-text: var(--owo-cmp-text-primary);--field-placeholder: var(--owo-cmp-text-muted);--field-ring: var(--owo-cmp-control-focus-ring);background:var(--field-bg);border:1px solid var(--field-border);color:var(--field-text);width:100%;min-height:var(--owo-cmp-control-height-md);border-radius:var(--owo-cmp-control-radius-md);padding:.5rem .75rem;font-size:.875rem;line-height:1.25rem}.root[data-size=xs]{min-height:var(--owo-cmp-control-height-xs);padding:.25rem .5rem;font-size:.6875rem;line-height:.875rem}.root[data-size=sm]{min-height:var(--owo-cmp-control-height-sm);padding:.375rem .625rem;font-size:.75rem;line-height:1rem}.root[data-size=lg]{min-height:var(--owo-cmp-control-height-lg);padding:.5625rem .875rem;font-size:.9375rem;line-height:1.375rem}.root[data-size=xl]{min-height:var(--owo-cmp-control-height-xl);padding:.75rem 1rem;font-size:1rem;line-height:1.5rem}.root::placeholder{color:var(--field-placeholder)}.root:hover:not(:disabled){--field-border: var(--owo-cmp-surface-border-strong)}.root:focus-visible{outline:none;--field-border: var(--field-ring);box-shadow:none}.root[data-tone=warning]{--field-border: var(--owo-cmp-warning-border);--field-ring: var(--owo-cmp-warning-border)}.root{--panel-bg: var(--owo-cmp-surface-bg);--panel-border: var(--owo-cmp-surface-border);--panel-section-border: var(--owo-cmp-surface-border);--panel-shadow: none;border-radius:var(--owo-cmp-control-radius-lg);border:1px solid var(--panel-border);background:var(--panel-bg);box-shadow:var(--panel-shadow)}.root[data-padding=sm]{padding:1rem}.root[data-padding=md]{padding:1.25rem}.root[data-padding=lg]{padding:1.5rem}.root [data-part=header]{border-bottom:1px solid var(--panel-section-border);padding:1.25rem 1.5rem}.root [data-part=body]{padding:1.25rem 1.5rem}.root [data-part=footer]{border-top:1px solid var(--panel-section-border);padding:1rem 1.5rem}.root[data-variant=subtle]{--panel-bg: var(--owo-cmp-surface-bg-subtle)}.root[data-variant=raised]{--panel-bg: var(--owo-cmp-surface-bg-raised);--panel-shadow: var(--owo-cmp-surface-shadow)}.root{--segmented-bg: var(--owo-cmp-surface-bg-inset);--segmented-border: var(--owo-cmp-surface-border);--segmented-item-text: var(--owo-cmp-text-muted);--segmented-item-hover-text: var(--owo-cmp-text-secondary);--segmented-item-active-bg: var(--owo-cmp-surface-bg-raised);--segmented-item-active-text: var(--owo-cmp-text-primary);--segmented-ring: var(--owo-cmp-control-focus-ring);display:inline-flex;border-radius:var(--owo-cmp-control-radius-md);padding:.125rem;background:var(--segmented-bg);box-shadow:0 0 0 1px var(--segmented-border)}.root[data-size=xs]{font-size:.6875rem;line-height:.875rem}.root[data-size=sm]{font-size:.75rem;line-height:1rem}.root[data-size=md]{font-size:.875rem;line-height:1.25rem}.root[data-size=lg]{font-size:.9375rem;line-height:1.375rem}.root[data-size=xl]{font-size:1rem;line-height:1.5rem}.item{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:var(--owo-cmp-control-radius-sm);background:transparent;font-weight:500;transition:color .15s,background-color .15s;color:var(--segmented-item-text)}.item:focus{outline:none}.item:focus-visible{box-shadow:inset 0 0 0 1px var(--segmented-ring)}.item:disabled{cursor:not-allowed;opacity:.5}.item:hover{color:var(--segmented-item-hover-text)}.item[data-active=true]{background:var(--segmented-item-active-bg);color:var(--segmented-item-active-text)}.root[data-size=xs]>.item{min-height:calc(var(--owo-cmp-control-height-xs) - .25rem);padding:.125rem .5rem}.root[data-size=sm]>.item{min-height:calc(var(--owo-cmp-control-height-sm) - .25rem);padding:.25rem .625rem}.root[data-size=md]>.item{min-height:calc(var(--owo-cmp-control-height-md) - .25rem);padding:.375rem .75rem}.root[data-size=lg]>.item{min-height:calc(var(--owo-cmp-control-height-lg) - .25rem);padding:.5rem .875rem}.root[data-size=xl]>.item{min-height:calc(var(--owo-cmp-control-height-xl) - .25rem);padding:.625rem 1rem}.root{position:relative;display:inline-block}.root [data-part=trigger]{--select-bg: var(--owo-cmp-surface-bg);--select-border: var(--owo-cmp-surface-border);--select-text: var(--owo-cmp-text-primary);--select-ring: var(--owo-cmp-control-focus-ring);display:flex;width:100%;align-items:center;justify-content:space-between;padding:0;gap:.5rem;border-radius:var(--owo-cmp-control-radius-md);text-align:left;transition:color .15s,background-color .15s,border-color .15s;appearance:none;background:var(--select-bg);border:.5px solid var(--select-border);color:var(--select-text)}.root [data-part=trigger]:focus-visible{outline:none;--select-border: var(--select-ring);box-shadow:none}.root [data-part=trigger][data-size=xs]{height:var(--owo-cmp-control-height-xs);min-height:var(--owo-cmp-control-height-xs);padding:0 .5rem;font-size:.6875rem;line-height:.875rem}.root [data-part=trigger][data-size=sm]{height:var(--owo-cmp-control-height-sm);min-height:var(--owo-cmp-control-height-sm);padding:0 .5rem;font-size:.75rem;line-height:1rem}.root [data-part=trigger][data-size=md]{height:var(--owo-cmp-control-height-md);min-height:var(--owo-cmp-control-height-md);padding:0 .75rem;font-size:.875rem;line-height:1.25rem}.root [data-part=trigger][data-size=lg]{height:var(--owo-cmp-control-height-lg);min-height:var(--owo-cmp-control-height-lg);padding:0 .875rem;font-size:.9375rem;line-height:1.375rem}.root [data-part=trigger][data-size=xl]{height:var(--owo-cmp-control-height-xl);min-height:var(--owo-cmp-control-height-xl);padding:0 1rem;font-size:1rem;line-height:1.5rem}.root [data-part=trigger]:hover:not(:disabled){--select-border: var(--owo-cmp-surface-border-strong)}.root [data-part=trigger][data-state=open]{--select-border: var(--owo-cmp-surface-border-strong)}.root [data-part=trigger][data-tone=warning]{--select-border: var(--owo-cmp-warning-border);--select-ring: var(--owo-cmp-warning-border)}.valueText{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.placeholder{color:var(--owo-cmp-text-muted)}.root [data-part=chevron]{width:.875rem;height:.875rem;flex-shrink:0;transition:transform .15s;color:var(--owo-cmp-text-muted)}.root [data-part=chevron][data-state=open]{transform:rotate(180deg)}.root [data-part=dropdown]{--select-dropdown-shadow: var(--owo-cmp-surface-shadow-strong);position:absolute;z-index:var(--owo-cmp-z-dropdown);margin-top:.25rem;max-height:15rem;width:100%;overflow:auto;border:1px solid var(--owo-cmp-surface-border);border-radius:var(--owo-cmp-control-radius-md);padding:.25rem 0;background:var(--owo-cmp-surface-bg-raised);box-shadow:var(--select-dropdown-shadow)}.root [data-part=dropdown][data-size=sm]{font-size:.75rem;line-height:1rem}.root [data-part=dropdown][data-size=md]{font-size:.875rem;line-height:1.25rem}.root [data-part=dropdown][data-size=xs]{font-size:.6875rem;line-height:.875rem}.root [data-part=dropdown][data-size=lg]{font-size:.9375rem;line-height:1.375rem}.root [data-part=dropdown][data-size=xl]{font-size:1rem;line-height:1.5rem}.root [data-part=option]{cursor:default;user-select:none;padding:.375rem .75rem;transition:background-color .15s}.root [data-part=option][data-disabled]{cursor:not-allowed;opacity:.5}.root [data-part=option][data-focused]{background:var(--owo-cmp-surface-bg-inset)}.root [data-part=option][data-selected]{color:var(--owo-cmp-accent-bg);font-weight:500}.root{border-radius:var(--owo-cmp-control-radius-sm);--_owo-skeleton-scan-duration: 3.6s;--skeleton-bg: linear-gradient( 180deg, color-mix(in srgb, var(--owo-cmp-surface-bg-inset) 94%, white) 0%, color-mix(in srgb, var(--owo-cmp-surface-bg-inset) 100%, var(--owo-cmp-surface-border)) 100% );--skeleton-bg-emphasis: linear-gradient( 180deg, color-mix(in srgb, var(--owo-cmp-surface-bg-subtle) 78%, var(--owo-ref-color-highlight-soft)) 0%, color-mix(in srgb, var(--owo-cmp-surface-bg-inset) 86%, var(--owo-cmp-surface-border)) 100% );--skeleton-sheen: linear-gradient( 100deg, transparent 0%, color-mix(in srgb, var(--owo-ref-color-highlight-sheen) 10%, transparent) 28%, color-mix(in srgb, var(--owo-ref-color-highlight-sheen) 35%, transparent) 40%, var(--owo-ref-color-highlight-sheen) 50%, color-mix(in srgb, var(--owo-ref-color-highlight-sheen) 35%, transparent) 60%, color-mix(in srgb, var(--owo-ref-color-highlight-sheen) 10%, transparent) 72%, transparent 100% );--skeleton-top-highlight: var(--owo-ref-color-highlight-soft);position:relative;overflow:hidden;background:var(--skeleton-bg);box-shadow:inset 0 1px 0 var(--skeleton-top-highlight);transform:translateZ(0)}.root[data-tone=emphasis]{background:var(--skeleton-bg-emphasis)}.root:before{content:"";position:absolute;inset:0;background:inherit;opacity:.84}.root:after{content:"";position:absolute;inset:-35%;background:var(--skeleton-sheen);transform:translate(-140%) skew(-14deg);opacity:0;will-change:transform,opacity}.root[data-animation=pulse]:after{display:none}.root[data-animation=pulse]:before{animation:owo-skeleton-breathe 2.6s var(--owo-cmp-motion-ease-standard) infinite}.root[data-animation=scan]:before{opacity:1;filter:none}.root[data-animation=scan]:after{opacity:1;animation:owo-skeleton-scan var(--_owo-skeleton-scan-duration) cubic-bezier(.3,0,.2,1) infinite}@keyframes owo-skeleton-breathe{0%,to{opacity:.8;filter:saturate(.96) brightness(.98)}50%{opacity:1;filter:saturate(1.04) brightness(1.04)}}@keyframes owo-skeleton-scan{0%{transform:translate(-140%) skew(-14deg);opacity:0}18%{opacity:.82}52%{transform:translate(6%) skew(-14deg);opacity:1}82%{opacity:.82}to{transform:translate(140%) skew(-14deg);opacity:0}}@media(prefers-reduced-motion:reduce){.root:before{animation:none;opacity:.94;filter:none}.root:after{animation:none;opacity:0}}.root{--status-notice-bg: var(--owo-feedback-neutral-bg);--status-notice-border: var(--owo-feedback-neutral-border);--status-notice-text: var(--owo-feedback-neutral-text);--status-notice-icon: var(--owo-feedback-neutral-icon);border-radius:var(--owo-cmp-control-radius-md);border-width:1px;border-style:solid;padding:.75rem 1rem;font-size:.875rem;line-height:1.25rem;background:var(--status-notice-bg);border-color:var(--status-notice-border);color:var(--status-notice-text)}.withIcon{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.75rem}.icon{color:var(--status-notice-icon)}.root:not([data-layout=vertical]) .icon{margin-top:.125rem;flex-shrink:0}.text{min-width:0}.title{font-weight:500;color:var(--owo-cmp-text-primary)}.root[data-layout=vertical]{border-radius:var(--owo-cmp-control-radius-lg)}.root[data-layout=vertical] .body{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:1rem 0;text-align:center}.root[data-layout=vertical] .icon{font-size:1.125rem;line-height:1.75rem}.root[data-layout=vertical] .title{color:var(--status-notice-text)}.root[data-layout=vertical] .action{margin-top:.5rem}.root[data-tone=info]{--status-notice-bg: var(--owo-feedback-info-bg);--status-notice-border: var(--owo-feedback-info-border);--status-notice-text: var(--owo-feedback-info-text);--status-notice-icon: var(--owo-feedback-info-icon)}.root[data-tone=success]{--status-notice-bg: var(--owo-feedback-success-bg);--status-notice-border: var(--owo-feedback-success-border);--status-notice-text: var(--owo-feedback-success-text);--status-notice-icon: var(--owo-feedback-success-icon)}.root[data-tone=warning]{--status-notice-bg: var(--owo-feedback-warning-bg);--status-notice-border: var(--owo-feedback-warning-border);--status-notice-text: var(--owo-feedback-warning-text);--status-notice-icon: var(--owo-feedback-warning-icon)}.root[data-tone=danger]{--status-notice-bg: var(--owo-feedback-danger-bg);--status-notice-border: var(--owo-feedback-danger-border);--status-notice-text: var(--owo-feedback-danger-text);--status-notice-icon: var(--owo-feedback-danger-icon)}.root{--switch-track-width: calc(var(--owo-cmp-control-height-md) + .5rem);--switch-thumb-size: 1.125rem;--switch-thumb-offset: .125rem;position:relative;display:inline-flex;flex-shrink:0;cursor:pointer;align-items:center;padding:0;box-sizing:border-box;border-radius:var(--owo-cmp-control-radius-full);border:2px solid transparent;transition:background-color .15s,border-color .15s;background:var(--owo-cmp-surface-border-strong)}.root:focus{outline:none}.root:focus-visible{box-shadow:0 0 0 2px var(--owo-cmp-surface-bg),0 0 0 4px var(--owo-cmp-control-focus-ring)}.root:disabled{cursor:not-allowed;opacity:.5}.root[data-size=xs]{height:calc(var(--owo-cmp-control-height-xs) - .75rem);width:calc(var(--owo-cmp-control-height-xs) + .25rem);--switch-track-width: calc(var(--owo-cmp-control-height-xs) + .25rem);--switch-thumb-size: .625rem}.root[data-size=sm]{height:calc(var(--owo-cmp-control-height-sm) - .75rem);width:calc(var(--owo-cmp-control-height-sm) + .25rem);--switch-track-width: calc(var(--owo-cmp-control-height-sm) + .25rem);--switch-thumb-size: .875rem}.root[data-size=md]{height:calc(var(--owo-cmp-control-height-md) - .75rem);width:calc(var(--owo-cmp-control-height-md) + .5rem);--switch-track-width: calc(var(--owo-cmp-control-height-md) + .5rem);--switch-thumb-size: 1.125rem}.root[data-size=lg]{height:calc(var(--owo-cmp-control-height-lg) - .75rem);width:calc(var(--owo-cmp-control-height-lg) + .5rem);--switch-track-width: calc(var(--owo-cmp-control-height-lg) + .5rem);--switch-thumb-size: 1.375rem}.root[data-size=xl]{height:calc(var(--owo-cmp-control-height-xl) - .75rem);width:calc(var(--owo-cmp-control-height-xl) + .5rem);--switch-track-width: calc(var(--owo-cmp-control-height-xl) + .5rem);--switch-thumb-size: 1.875rem}.root[aria-checked=true]{background:var(--owo-cmp-accent-bg)}.root:hover:not(:disabled){background:color-mix(in srgb,var(--owo-cmp-surface-border-strong) 82%,var(--owo-cmp-text-muted))}.root[aria-checked=true]:hover:not(:disabled){background:var(--owo-cmp-accent-bg-hover)}.root .thumb{pointer-events:none;display:inline-block;border-radius:var(--owo-cmp-control-radius-full);background:#fff;box-shadow:0 1px 3px #00000026;transition:transform .15s;transform:translate(var(--switch-thumb-offset))}.root[data-size=xs]>.thumb{height:.625rem;width:.625rem}.root[data-size=sm]>.thumb{height:.875rem;width:.875rem}.root[data-size=md]>.thumb{height:1.125rem;width:1.125rem}.root[data-size=lg]>.thumb{height:1.375rem;width:1.375rem}.root[data-size=xl]>.thumb{height:1.875rem;width:1.875rem}.root[aria-checked=true]>.thumb{transform:translate(calc(var(--switch-track-width) - var(--switch-thumb-size) - var(--switch-thumb-offset)))}.root [data-part=list]{--tabs-border: var(--owo-cmp-surface-border);display:flex;align-items:flex-end;gap:.25rem;border-bottom-width:1px;border-bottom-style:solid;border-color:var(--tabs-border)}.root [data-part=trigger]{--tabs-text: var(--owo-cmp-text-muted);--tabs-hover-text: var(--owo-cmp-text-secondary);--tabs-active-text: var(--owo-cmp-text-primary);--tabs-active-border: var(--owo-cmp-accent-border);--tabs-active-bg: color-mix(in srgb, var(--owo-cmp-accent-bg-muted) 35%, transparent);--tabs-ring: var(--owo-cmp-control-focus-ring);position:relative;margin-bottom:-1px;display:inline-flex;min-height:var(--owo-cmp-control-height-md);align-items:center;justify-content:center;border:0;border-top-left-radius:var(--owo-cmp-control-radius-md);border-top-right-radius:var(--owo-cmp-control-radius-md);border-bottom:2px solid transparent;padding:.5rem .75rem;font-size:.875rem;line-height:1.25rem;font-weight:500;transition:color .15s ease;appearance:none;background:transparent;color:var(--tabs-text)}.root [data-part=trigger]:focus{outline:none}.root [data-part=trigger]:focus-visible{box-shadow:inset 0 0 0 2px var(--tabs-ring)}.root [data-part=trigger]:disabled{cursor:not-allowed;opacity:.5}.root [data-part=trigger]:hover{color:var(--tabs-hover-text)}.root [data-part=trigger][data-state=active]{background:var(--tabs-active-bg);border-bottom-color:var(--tabs-active-border);color:var(--tabs-active-text)}.root [data-part=content]{padding-top:1rem;color:var(--owo-cmp-text-primary)}.root{min-height:calc(4.5em + 1rem);line-height:1.5}.root[data-auto-resize=true]{overflow-y:hidden}.container{pointer-events:none;position:fixed;bottom:1rem;right:1rem;z-index:var(--owo-cmp-z-toast);display:flex;flex-direction:column-reverse;gap:.5rem}.toast{--toast-bg: var(--owo-feedback-neutral-bg);--toast-border: var(--owo-feedback-neutral-border);--toast-text: var(--owo-feedback-neutral-text);--toast-icon: var(--owo-feedback-neutral-icon);--toast-shadow: var(--owo-cmp-surface-shadow-strong);pointer-events:auto;border-radius:var(--owo-cmp-control-radius-lg);border:1px solid var(--toast-border);font-size:.875rem;line-height:1.25rem;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:var(--toast-bg);color:var(--toast-text);box-shadow:var(--toast-shadow);animation:toast-in .25s var(--owo-cmp-motion-ease-standard)}.toastDefault{display:flex;align-items:flex-start;gap:.5rem;padding:.75rem 1rem}.toast [data-part=icon]{margin-top:.125rem;flex-shrink:0;color:var(--toast-icon)}.toast [data-part=content]{min-width:0;flex:1}.toast [data-part=title]{display:block;font-weight:500;color:inherit}.toast [data-part=message]{display:block}.toast [data-part=close]{margin-right:-.25rem;margin-top:-.125rem;flex-shrink:0;border-radius:var(--owo-cmp-control-radius-sm);padding:.125rem;color:currentColor;opacity:.5;transition:opacity .15s;background:transparent;border:0;cursor:pointer}.toast [data-part=close]:hover{opacity:1}.toast[data-tone=success]{--toast-bg: var(--owo-feedback-success-bg);--toast-border: var(--owo-feedback-success-border);--toast-text: var(--owo-feedback-success-text);--toast-icon: var(--owo-feedback-success-icon)}.toast[data-tone=warning]{--toast-bg: var(--owo-feedback-warning-bg);--toast-border: var(--owo-feedback-warning-border);--toast-text: var(--owo-feedback-warning-text);--toast-icon: var(--owo-feedback-warning-icon)}.toast[data-tone=danger]{--toast-bg: var(--owo-feedback-danger-bg);--toast-border: var(--owo-feedback-danger-border);--toast-text: var(--owo-feedback-danger-text);--toast-icon: var(--owo-feedback-danger-icon)}.toast[data-tone=info]{--toast-bg: var(--owo-feedback-info-bg);--toast-border: var(--owo-feedback-info-border);--toast-text: var(--owo-feedback-info-text);--toast-icon: var(--owo-feedback-info-icon)}@keyframes toast-in{0%{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}.trigger{display:inline-flex}.content{--tooltip-bg: var(--owo-cmp-surface-bg-raised);--tooltip-border: var(--owo-cmp-surface-border);--tooltip-text: var(--owo-cmp-text-primary);--tooltip-shadow: var(--owo-cmp-surface-shadow-strong);--tooltip-arrow-color: var(--tooltip-bg);position:fixed;z-index:var(--owo-cmp-z-toast);border-radius:var(--owo-cmp-control-radius-lg);line-height:1.625;background:var(--tooltip-bg);color:var(--tooltip-text);border:1px solid var(--tooltip-border);box-shadow:var(--tooltip-shadow);backdrop-filter:blur(10px);animation:tooltip-in .15s var(--owo-cmp-motion-ease-standard)}.content[data-density=compact]{padding:.25rem .5rem;font-size:11px;max-width:200px}.content[data-density=default]{padding:.5rem .75rem;font-size:.75rem;line-height:1rem;max-width:20rem}.content [data-part=arrow]{position:absolute;color:var(--tooltip-arrow-color);filter:drop-shadow(0 1px 0 var(--tooltip-border))}@keyframes tooltip-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}
|
|
3
|
+
|
|
4
|
+
}
|
package/dist/index.d.ts
CHANGED
|
@@ -25,7 +25,7 @@ interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {
|
|
|
25
25
|
declare function Badge({ tone, variant, size, className, children, ...props }: BadgeProps): react_jsx_runtime.JSX.Element;
|
|
26
26
|
|
|
27
27
|
type ButtonVariant = 'primary' | 'secondary' | 'ghost' | 'danger';
|
|
28
|
-
type ButtonSize = 'sm' | 'md';
|
|
28
|
+
type ButtonSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
29
29
|
type SharedProps$1 = {
|
|
30
30
|
variant?: ButtonVariant;
|
|
31
31
|
size?: ButtonSize;
|
|
@@ -42,20 +42,25 @@ type LinkElementProps = SharedProps$1 & Omit<AnchorHTMLAttributes<HTMLAnchorElem
|
|
|
42
42
|
href: string;
|
|
43
43
|
};
|
|
44
44
|
type ButtonProps = ButtonElementProps | LinkElementProps;
|
|
45
|
-
declare function buttonClassName({
|
|
45
|
+
declare function buttonClassName({ className, }: Pick<ButtonProps, 'variant' | 'size' | 'loading' | 'className'>): string;
|
|
46
46
|
declare function Button(props: ButtonProps): react_jsx_runtime.JSX.Element;
|
|
47
47
|
|
|
48
|
+
type CollapsiblePart = 'trigger' | 'content' | 'triggerInner' | 'triggerIcon' | 'triggerLabel' | 'triggerIndicator' | 'contentInner';
|
|
48
49
|
interface CollapsibleRootProps extends HTMLAttributes<HTMLDivElement> {
|
|
49
50
|
children: ReactNode;
|
|
50
51
|
open?: boolean;
|
|
51
52
|
defaultOpen?: boolean;
|
|
52
53
|
onOpenChange?: (open: boolean) => void;
|
|
54
|
+
classNames?: Partial<Record<CollapsiblePart, string>>;
|
|
53
55
|
}
|
|
54
|
-
declare function CollapsibleRoot({ children, open, defaultOpen, onOpenChange, className, ...props }: CollapsibleRootProps): react_jsx_runtime.JSX.Element;
|
|
56
|
+
declare function CollapsibleRoot({ children, open, defaultOpen, onOpenChange, classNames, className, ...props }: CollapsibleRootProps): react_jsx_runtime.JSX.Element;
|
|
55
57
|
interface CollapsibleTriggerProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
56
58
|
children: ReactNode;
|
|
59
|
+
icon?: ReactNode;
|
|
60
|
+
indicator?: ReactNode;
|
|
61
|
+
iconPosition?: 'start' | 'end';
|
|
57
62
|
}
|
|
58
|
-
declare function CollapsibleTrigger({ children, className, onClick, ...props }: CollapsibleTriggerProps): react_jsx_runtime.JSX.Element;
|
|
63
|
+
declare function CollapsibleTrigger({ children, icon, indicator, iconPosition, className, onClick, ...props }: CollapsibleTriggerProps): react_jsx_runtime.JSX.Element;
|
|
59
64
|
interface CollapsibleContentProps extends HTMLAttributes<HTMLDivElement> {
|
|
60
65
|
children: ReactNode;
|
|
61
66
|
}
|
|
@@ -81,6 +86,7 @@ declare function ConfirmProvider({ children }: {
|
|
|
81
86
|
}): react_jsx_runtime.JSX.Element;
|
|
82
87
|
|
|
83
88
|
type DialogSize = 'sm' | 'md';
|
|
89
|
+
type DialogPart = 'overlay' | 'backdrop' | 'header' | 'body' | 'footer';
|
|
84
90
|
interface DialogProps extends HTMLAttributes<HTMLDivElement> {
|
|
85
91
|
open: boolean;
|
|
86
92
|
onClose: () => void;
|
|
@@ -88,11 +94,12 @@ interface DialogProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
88
94
|
children: ReactNode;
|
|
89
95
|
overlayClassName?: string;
|
|
90
96
|
panelClassName?: string;
|
|
97
|
+
classNames?: Partial<Record<DialogPart, string>>;
|
|
91
98
|
}
|
|
92
99
|
declare function DialogHeader({ className, children, ...props }: HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
|
|
93
100
|
declare function DialogBody({ className, children, ...props }: HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
|
|
94
101
|
declare function DialogFooter({ className, children, ...props }: HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
|
|
95
|
-
declare function Dialog({ open, onClose, size, children, className, overlayClassName, panelClassName, ...props }: DialogProps): react_jsx_runtime.JSX.Element | null;
|
|
102
|
+
declare function Dialog({ open, onClose, size, children, className, overlayClassName, panelClassName, classNames, ...props }: DialogProps): react_jsx_runtime.JSX.Element | null;
|
|
96
103
|
declare namespace Dialog {
|
|
97
104
|
var Header: typeof DialogHeader;
|
|
98
105
|
var Body: typeof DialogBody;
|
|
@@ -102,6 +109,7 @@ declare namespace Dialog {
|
|
|
102
109
|
type DropdownMenuSide = 'top' | 'bottom' | 'left' | 'right';
|
|
103
110
|
type DropdownMenuAlign = 'start' | 'center' | 'end';
|
|
104
111
|
type DropdownMenuRole = 'menu' | 'listbox';
|
|
112
|
+
type DropdownMenuPart = 'trigger' | 'content' | 'group' | 'label' | 'item' | 'separator';
|
|
105
113
|
interface DropdownMenuProps {
|
|
106
114
|
open?: boolean;
|
|
107
115
|
defaultOpen?: boolean;
|
|
@@ -113,6 +121,7 @@ interface DropdownMenuProps {
|
|
|
113
121
|
collisionPadding?: number;
|
|
114
122
|
portal?: boolean;
|
|
115
123
|
contentRole?: DropdownMenuRole;
|
|
124
|
+
classNames?: Partial<Record<DropdownMenuPart, string>>;
|
|
116
125
|
children: ReactNode;
|
|
117
126
|
}
|
|
118
127
|
interface DropdownMenuTriggerProps {
|
|
@@ -149,7 +158,7 @@ interface DropdownSubmenuProps extends Omit<DropdownMenuProps, 'contentRole'> {
|
|
|
149
158
|
}
|
|
150
159
|
interface DropdownSubTriggerProps extends Omit<DropdownMenuItemProps, 'indicator' | 'selected' | 'closeOnSelect'> {
|
|
151
160
|
}
|
|
152
|
-
declare function DropdownMenuRoot({ open, defaultOpen, onOpenChange, side, align, sideOffset, alignOffset, collisionPadding, portal, contentRole, children, }: DropdownMenuProps): react_jsx_runtime.JSX.Element;
|
|
161
|
+
declare function DropdownMenuRoot({ open, defaultOpen, onOpenChange, side, align, sideOffset, alignOffset, collisionPadding, portal, contentRole, classNames, children, }: DropdownMenuProps): react_jsx_runtime.JSX.Element;
|
|
153
162
|
declare function DropdownMenuTrigger({ asChild, disabled, className, children, }: DropdownMenuTriggerProps): react_jsx_runtime.JSX.Element;
|
|
154
163
|
declare function DropdownMenuContent({ className, children, style, matchTriggerWidth, maxHeight, ...props }: DropdownMenuContentProps): react_jsx_runtime.JSX.Element | null;
|
|
155
164
|
declare function DropdownMenuGroup({ className, children, ...props }: DropdownMenuGroupProps): react_jsx_runtime.JSX.Element;
|
|
@@ -171,6 +180,7 @@ declare const DropdownMenu: typeof DropdownMenuRoot & {
|
|
|
171
180
|
|
|
172
181
|
type DrawerSide = 'left' | 'right';
|
|
173
182
|
type DrawerPosition = 'fixed' | 'absolute';
|
|
183
|
+
type DrawerPart = 'backdrop' | 'panel';
|
|
174
184
|
interface DrawerProps extends HTMLAttributes<HTMLElement> {
|
|
175
185
|
as?: ElementType;
|
|
176
186
|
open: boolean;
|
|
@@ -181,8 +191,9 @@ interface DrawerProps extends HTMLAttributes<HTMLElement> {
|
|
|
181
191
|
onClose?: () => void;
|
|
182
192
|
closeLabel?: string;
|
|
183
193
|
backdropClassName?: string;
|
|
194
|
+
classNames?: Partial<Record<DrawerPart, string>>;
|
|
184
195
|
}
|
|
185
|
-
declare function Drawer({ as: Component, open, children, side, position, showBackdrop, onClose, closeLabel, backdropClassName, className, ...props }: DrawerProps): react_jsx_runtime.JSX.Element;
|
|
196
|
+
declare function Drawer({ as: Component, open, children, side, position, showBackdrop, onClose, closeLabel, backdropClassName, className, classNames, ...props }: DrawerProps): react_jsx_runtime.JSX.Element;
|
|
186
197
|
|
|
187
198
|
interface FieldProps extends HTMLAttributes<HTMLDivElement> {
|
|
188
199
|
label: ReactNode;
|
|
@@ -193,7 +204,7 @@ interface FieldProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
193
204
|
declare function Field({ label, help, htmlFor, children, className, ...props }: FieldProps): react_jsx_runtime.JSX.Element;
|
|
194
205
|
|
|
195
206
|
type IconButtonVariant = 'ghost' | 'subtle';
|
|
196
|
-
type IconButtonSize = 'sm' | 'md';
|
|
207
|
+
type IconButtonSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
197
208
|
type SharedProps = {
|
|
198
209
|
variant?: IconButtonVariant;
|
|
199
210
|
size?: IconButtonSize;
|
|
@@ -213,15 +224,17 @@ declare function IconButton({ variant, size, label, icon, className, ...props }:
|
|
|
213
224
|
type InputBaseProps = {
|
|
214
225
|
className?: string;
|
|
215
226
|
tone?: 'default' | 'warning';
|
|
227
|
+
size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
216
228
|
};
|
|
217
|
-
type TextInputProps = InputBaseProps & InputHTMLAttributes<HTMLInputElement> & {
|
|
229
|
+
type TextInputProps = InputBaseProps & Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> & {
|
|
218
230
|
as?: 'input';
|
|
219
231
|
};
|
|
220
|
-
type TextareaProps$1 = InputBaseProps & TextareaHTMLAttributes<HTMLTextAreaElement> & {
|
|
232
|
+
type TextareaProps$1 = InputBaseProps & Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'size'> & {
|
|
221
233
|
as: 'textarea';
|
|
222
234
|
};
|
|
223
235
|
type InputProps = TextInputProps | TextareaProps$1;
|
|
224
|
-
declare function Input(props:
|
|
236
|
+
declare function Input(props: TextInputProps): React.JSX.Element;
|
|
237
|
+
declare function Input(props: TextareaProps$1): React.JSX.Element;
|
|
225
238
|
|
|
226
239
|
type PanelVariant = 'default' | 'subtle' | 'raised';
|
|
227
240
|
type PanelPadding = 'none' | 'sm' | 'md' | 'lg';
|
|
@@ -248,7 +261,7 @@ interface SegmentedControlProps<T extends string> {
|
|
|
248
261
|
value: T;
|
|
249
262
|
onChange: (value: T) => void;
|
|
250
263
|
options: Array<SegmentedOption<T>>;
|
|
251
|
-
size?: 'sm' | 'md';
|
|
264
|
+
size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
252
265
|
className?: string;
|
|
253
266
|
ariaLabel: string;
|
|
254
267
|
}
|
|
@@ -270,24 +283,26 @@ interface SelectRenderOptionArgs<T extends string> {
|
|
|
270
283
|
selected: boolean;
|
|
271
284
|
highlighted: boolean;
|
|
272
285
|
}
|
|
286
|
+
type SelectPart = 'trigger' | 'chevron' | 'dropdown' | 'option';
|
|
273
287
|
interface SelectProps<T extends string> {
|
|
274
288
|
value: T | '';
|
|
275
289
|
onChange: (value: T) => void;
|
|
276
290
|
options: Array<SelectOption<T>>;
|
|
277
291
|
placeholder?: string;
|
|
278
|
-
size?: 'sm' | 'md';
|
|
292
|
+
size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
279
293
|
tone?: 'default' | 'warning';
|
|
280
294
|
disabled?: boolean;
|
|
281
295
|
className?: string;
|
|
282
296
|
ariaLabel: string;
|
|
283
297
|
renderValue?: (args: SelectRenderValueArgs<T>) => ReactNode;
|
|
284
298
|
renderOption?: (args: SelectRenderOptionArgs<T>) => ReactNode;
|
|
299
|
+
classNames?: Partial<Record<SelectPart, string>>;
|
|
285
300
|
}
|
|
286
|
-
declare function Select<T extends string>({ value, onChange, options, placeholder, size, tone, disabled, className, ariaLabel, renderValue, renderOption, }: SelectProps<T>): react_jsx_runtime.JSX.Element;
|
|
301
|
+
declare function Select<T extends string>({ value, onChange, options, placeholder, size, tone, disabled, className, ariaLabel, renderValue, renderOption, classNames, }: SelectProps<T>): react_jsx_runtime.JSX.Element;
|
|
287
302
|
|
|
288
303
|
type SkeletonAnimation = 'pulse' | 'scan';
|
|
289
304
|
type SkeletonTone = 'default' | 'emphasis' | 'warm';
|
|
290
|
-
type SkeletonSpeed = 'slow' | '
|
|
305
|
+
type SkeletonSpeed = 'slow' | 'medium' | 'fast';
|
|
291
306
|
interface SkeletonProps extends HTMLAttributes<HTMLDivElement> {
|
|
292
307
|
animation?: SkeletonAnimation;
|
|
293
308
|
tone?: SkeletonTone;
|
|
@@ -318,7 +333,7 @@ interface StatusNoticeProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'
|
|
|
318
333
|
}
|
|
319
334
|
declare function StatusNotice({ tone, layout, icon, title, description, action, className, children, ...props }: StatusNoticeProps): react_jsx_runtime.JSX.Element;
|
|
320
335
|
|
|
321
|
-
type SwitchSize = 'sm' | 'md';
|
|
336
|
+
type SwitchSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
322
337
|
interface SwitchProps {
|
|
323
338
|
checked: boolean;
|
|
324
339
|
onChange: (checked: boolean) => void;
|
|
@@ -361,12 +376,14 @@ declare const Tabs: typeof TabsRoot & {
|
|
|
361
376
|
interface TextareaProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'children'> {
|
|
362
377
|
className?: string;
|
|
363
378
|
tone?: 'default' | 'warning';
|
|
379
|
+
size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
364
380
|
resize?: 'none' | 'vertical' | 'both';
|
|
365
381
|
autoResize?: boolean;
|
|
366
382
|
}
|
|
367
|
-
declare function Textarea({ className, tone, resize, autoResize, style, onInput, rows, ...props }: TextareaProps): react_jsx_runtime.JSX.Element;
|
|
383
|
+
declare function Textarea({ className, tone, size, resize, autoResize, style, onInput, rows, ...props }: TextareaProps): react_jsx_runtime.JSX.Element;
|
|
368
384
|
|
|
369
385
|
type ToastTone = 'success' | 'warning' | 'danger' | 'info';
|
|
386
|
+
type ToastPart = 'container' | 'toast' | 'icon' | 'content' | 'title' | 'message' | 'close';
|
|
370
387
|
interface ToastInput {
|
|
371
388
|
title?: string;
|
|
372
389
|
message: string;
|
|
@@ -391,13 +408,15 @@ interface ToastRenderArgs {
|
|
|
391
408
|
icon: ReactNode;
|
|
392
409
|
}
|
|
393
410
|
declare function useToast(): ToastAPI;
|
|
394
|
-
declare function ToastProvider({ children, renderToast, }: {
|
|
411
|
+
declare function ToastProvider({ children, renderToast, classNames, }: {
|
|
395
412
|
children: ReactNode;
|
|
396
413
|
renderToast?: (args: ToastRenderArgs) => ReactNode;
|
|
414
|
+
classNames?: Partial<Record<ToastPart, string>>;
|
|
397
415
|
}): react_jsx_runtime.JSX.Element;
|
|
398
416
|
|
|
399
417
|
type TooltipPlacement = 'top' | 'bottom' | 'left' | 'right';
|
|
400
418
|
type TooltipDensity = 'compact' | 'default';
|
|
419
|
+
type TooltipPart = 'trigger' | 'content' | 'arrow';
|
|
401
420
|
interface TooltipProps {
|
|
402
421
|
content: ReactNode;
|
|
403
422
|
placement?: TooltipPlacement;
|
|
@@ -410,7 +429,8 @@ interface TooltipProps {
|
|
|
410
429
|
}) => ReactNode;
|
|
411
430
|
className?: string;
|
|
412
431
|
children: ReactNode;
|
|
432
|
+
classNames?: Partial<Record<TooltipPart, string>>;
|
|
413
433
|
}
|
|
414
|
-
declare function Tooltip({ content, placement: preferredPlacement, density, showDelay, hideDelay, arrow, renderArrow, className, children, }: TooltipProps): react_jsx_runtime.JSX.Element;
|
|
434
|
+
declare function Tooltip({ content, placement: preferredPlacement, density, showDelay, hideDelay, arrow, renderArrow, className, children, classNames, }: TooltipProps): react_jsx_runtime.JSX.Element;
|
|
415
435
|
|
|
416
|
-
export { Avatar, Badge, type BadgeProps, Button, type ButtonProps, Collapsible, CollapsibleContent, type CollapsibleContentProps, CollapsibleRoot, type CollapsibleRootProps, CollapsibleTrigger, type CollapsibleTriggerProps, ConfirmProvider, Dialog, Drawer, DropdownMenu, type DropdownMenuAlign, type DropdownMenuContentProps, type DropdownMenuItemProps, type DropdownMenuProps, type DropdownMenuRole, type DropdownMenuSide, type DropdownMenuTriggerProps, Field, IconButton, type IconButtonProps, Input, type InputProps, Panel, PanelBody, PanelFooter, PanelHeader, SegmentedControl, type SegmentedOption, Select, type SelectOption, type SelectRenderOptionArgs, type SelectRenderValueArgs, Skeleton, type SkeletonAnimation, type SkeletonSpeed, type SkeletonTone, Spinner, StatusNotice, type StatusNoticeProps, Switch, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsListProps, TabsRoot, type TabsRootProps, TabsTrigger, type TabsTriggerProps, Textarea, type TextareaProps, type ToastInput, ToastProvider, type ToastRenderArgs, Tooltip, buttonClassName, useConfirm, useToast };
|
|
436
|
+
export { Avatar, Badge, type BadgeProps, Button, type ButtonProps, Collapsible, CollapsibleContent, type CollapsibleContentProps, type CollapsiblePart, CollapsibleRoot, type CollapsibleRootProps, CollapsibleTrigger, type CollapsibleTriggerProps, ConfirmProvider, Dialog, Drawer, DropdownMenu, type DropdownMenuAlign, type DropdownMenuContentProps, type DropdownMenuItemProps, type DropdownMenuProps, type DropdownMenuRole, type DropdownMenuSide, type DropdownMenuTriggerProps, Field, IconButton, type IconButtonProps, Input, type InputProps, Panel, PanelBody, PanelFooter, PanelHeader, SegmentedControl, type SegmentedOption, Select, type SelectOption, type SelectRenderOptionArgs, type SelectRenderValueArgs, Skeleton, type SkeletonAnimation, type SkeletonSpeed, type SkeletonTone, Spinner, StatusNotice, type StatusNoticeProps, Switch, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsListProps, TabsRoot, type TabsRootProps, TabsTrigger, type TabsTriggerProps, Textarea, type TextareaProps, type ToastInput, ToastProvider, type ToastRenderArgs, Tooltip, buttonClassName, useConfirm, useToast };
|
package/dist/index.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{clsx as Yt}from"clsx";import{useState as Qt}from"react";import{jsx as Le}from"react/jsx-runtime";var jt={xs:"h-6 w-6 text-[10px]",sm:"h-8 w-8 text-xs",md:"h-10 w-10 text-sm",lg:"h-14 w-14 text-lg"};function en(e){let t=e.trim().split(/\s+/);return t.length>=2?(t[0][0]+t[t.length-1][0]).toUpperCase():e.slice(0,2).toUpperCase()}function Ke({src:e,alt:t,name:n,size:o="md",tone:i="neutral",className:a}){let[r,l]=Qt(!1),u=e&&!r,s=n?en(n):"?";return Le("span",{"data-tone":i,className:Yt("owo-avatar inline-flex shrink-0 items-center justify-center overflow-hidden rounded-[var(--owo-cmp-control-radius-full)] font-medium select-none",jt[o],a),children:u?Le("img",{src:e,alt:t??n??"",className:"h-full w-full object-cover",onError:()=>l(!0)}):Le("span",{"aria-label":t??n,children:s})})}import{clsx as tn}from"clsx";import{jsx as nn}from"react/jsx-runtime";function Ue({tone:e="neutral",variant:t="soft",size:n="xs",className:o,children:i,...a}){return nn("span",{"data-tone":e,"data-variant":t,"data-size":n,className:tn("owo-badge inline-flex items-center rounded-[var(--owo-cmp-control-radius-full)] border text-[var(--badge-text)]",n==="xs"?"px-2.5 py-1 text-[11px]":"px-3 py-1 text-xs font-medium",o),...a,children:i})}import{clsx as bn}from"clsx";import{clsx as on}from"clsx";import{jsx as M,jsxs as Y}from"react/jsx-runtime";var rn={xs:12,sm:14,md:16,lg:24};function an({px:e}){let n=Math.PI*2*9;return Y("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",children:[M("circle",{cx:"12",cy:"12",r:9,stroke:"currentColor",strokeWidth:"3",opacity:"0.2"}),M("circle",{cx:"12",cy:"12",r:9,stroke:"currentColor",strokeWidth:"3",strokeLinecap:"round",strokeDasharray:`${n*.28} ${n*.72}`})]})}function sn({px:e}){return Y("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",children:[M("path",{d:"M12 2a10 10 0 0 1 10 10",opacity:"0.9"}),M("path",{d:"M12 2a10 10 0 0 0-7.07 2.93",opacity:"0.2"}),M("path",{d:"M4.93 4.93A10 10 0 0 0 2 12",opacity:"0.2"}),M("path",{d:"M2 12a10 10 0 0 0 2.93 7.07",opacity:"0.2"}),M("path",{d:"M4.93 19.07A10 10 0 0 0 12 22",opacity:"0.2"}),M("path",{d:"M12 22a10 10 0 0 0 7.07-2.93",opacity:"0.2"}),M("path",{d:"M19.07 19.07A10 10 0 0 0 22 12",opacity:"0.2"})]})}function ln({px:e}){return M("svg",{width:e,height:e,viewBox:"0 0 24 24",children:[0,1,2,3,4,5,6,7].map(n=>{let o=n/8*360,i=.15+n/8*.85;return M("circle",{cx:"12",cy:"3.5",r:"1.8",fill:"currentColor",opacity:i,transform:`rotate(${o} 12 12)`},n)})})}function un({px:e}){return M("svg",{width:e,height:e,viewBox:"0 0 24 24",children:[0,1,2,3].map(t=>Y("rect",{x:3+t*5.5,y:"4",width:"3",height:"16",rx:"1.5",fill:"currentColor",opacity:"0.3",children:[M("animate",{attributeName:"opacity",values:"0.3;1;0.3",dur:"1s",begin:`${t*.15}s`,repeatCount:"indefinite"}),M("animate",{attributeName:"height",values:"16;8;16",dur:"1s",begin:`${t*.15}s`,repeatCount:"indefinite"}),M("animate",{attributeName:"y",values:"4;8;4",dur:"1s",begin:`${t*.15}s`,repeatCount:"indefinite"})]},t))})}function cn({px:e}){let t=e*.14,n=e*.33,o=e/2-n,i=e/2,a=e/2+n,r=e/2;return M("svg",{width:e,height:e,viewBox:`0 0 ${e} ${e}`,children:[o,i,a].map((l,u)=>Y("circle",{cx:l,cy:r,r:t,fill:"currentColor",opacity:"0.4",children:[M("animate",{attributeName:"cy",values:`${r};${r-e*.25};${r}`,dur:"0.6s",begin:`${u*.12}s`,repeatCount:"indefinite",calcMode:"spline",keySplines:"0.4 0 0.2 1;0.4 0 0.2 1"}),M("animate",{attributeName:"opacity",values:"0.4;1;0.4",dur:"0.6s",begin:`${u*.12}s`,repeatCount:"indefinite"})]},u))})}function dn({px:e}){return Y("svg",{width:e,height:e,viewBox:"0 0 24 24",children:[Y("circle",{cx:"12",cy:"12",r:"0",fill:"currentColor",opacity:"0",children:[M("animate",{attributeName:"r",values:"4;10;4",dur:"1.2s",repeatCount:"indefinite"}),M("animate",{attributeName:"opacity",values:"0.8;0.1;0.8",dur:"1.2s",repeatCount:"indefinite"})]}),M("circle",{cx:"12",cy:"12",r:"3.5",fill:"currentColor",opacity:"0.7"})]})}function pn({px:e}){return Y("svg",{width:e,height:e,viewBox:"0 0 24 24",children:[M("circle",{cx:"12",cy:"12",r:"8",stroke:"currentColor",strokeWidth:"1.5",fill:"none",opacity:"0.15"}),M("circle",{cx:"12",cy:"4",r:"2.2",fill:"currentColor",children:M("animateTransform",{attributeName:"transform",type:"rotate",from:"0 12 12",to:"360 12 12",dur:"0.9s",repeatCount:"indefinite"})}),M("circle",{cx:"12",cy:"20",r:"1.5",fill:"currentColor",opacity:"0.5",children:M("animateTransform",{attributeName:"transform",type:"rotate",from:"0 12 12",to:"-360 12 12",dur:"0.9s",repeatCount:"indefinite"})})]})}function mn({px:e}){let t=e*.14,n=e*.33,o=e/2-n,i=e/2,a=e/2+n,r=e/2;return M("svg",{width:e,height:e,viewBox:`0 0 ${e} ${e}`,children:[o,i,a].map((l,u)=>M("circle",{cx:l,cy:r,r:t,fill:"currentColor",opacity:"0.25",children:M("animate",{attributeName:"opacity",values:"0.25;1;0.25",dur:"0.9s",begin:`${u*.2}s`,repeatCount:"indefinite"})},u))})}var fn={ring:an,arc:sn,dots:ln,bars:un,bounce:cn,pulse:dn,orbit:pn,flow:mn},gn=new Set(["ring","arc","dots"]);function be({variant:e="ring",size:t="md",className:n,label:o}){let i=typeof t=="number"?t:rn[t],a=fn[e];return M("span",{"aria-hidden":!o,"aria-label":o,role:o?"img":void 0,className:on("owo-spinner inline-flex",gn.has(e)&&"animate-spin",n),children:M(a,{px:i})})}import{Fragment as vn,jsx as Q,jsxs as wn}from"react/jsx-runtime";function We({variant:e="secondary",size:t="md",loading:n=!1,className:o}){return bn("owo-button","inline-flex items-center justify-center gap-2 rounded-[var(--owo-cmp-control-radius-md)] border font-medium transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-inset disabled:cursor-not-allowed disabled:opacity-[var(--button-disabled-opacity)]",t==="sm"?"min-h-8 px-3 text-xs":"min-h-9 px-4 text-sm",n&&"pointer-events-none cursor-wait",o)}function ae(e){let{variant:t="secondary",size:n="md",loading:o=!1,leadingIcon:i,trailingIcon:a,className:r,children:l,...u}=e,s=wn(vn,{children:[o?Q("span",{className:"shrink-0",children:Q(be,{size:n==="sm"?"sm":"md"})}):i?Q("span",{className:"shrink-0",children:i}):null,Q("span",{children:l}),!o&&a?Q("span",{className:"shrink-0",children:a}):null]}),d=We({variant:t,size:n,loading:o,className:r});if("href"in e&&e.href){let{href:g,...p}=u;return Q("a",{href:g,"data-variant":t,"data-size":n,"data-loading":o?"true":void 0,"aria-disabled":o||void 0,tabIndex:o?-1:void 0,className:d,onClick:o?m=>m.preventDefault():void 0,...p,children:s})}let c=u;return Q("button",{type:c.type??"button","data-variant":t,"data-size":n,"data-loading":o?"true":void 0,disabled:c.disabled||o,className:d,...c,children:s})}import{clsx as Ee}from"clsx";import{createContext as xn,useContext as hn,useEffect as Tn,useId as yn,useMemo as Mn,useRef as qe,useState as Ge}from"react";import{jsx as se}from"react/jsx-runtime";var Xe=xn(null);function Ze(e){let t=hn(Xe);if(!t)throw new Error(`${e} must be used within Collapsible.Root`);return t}function Pn({open:e,defaultOpen:t,onOpenChange:n}){let[o,i]=Ge(t??!1),a=e!==void 0,r=a?e:o;function l(u){a||i(u),n?.(u)}return[r,l]}function Ie({children:e,open:t,defaultOpen:n,onOpenChange:o,className:i,...a}){let[r,l]=Pn({open:t,defaultOpen:n,onOpenChange:o}),u=yn(),s=Mn(()=>({open:r,setOpen:l,contentId:u}),[u,r,l]);return se(Xe.Provider,{value:s,children:se("div",{"data-state":r?"open":"closed",className:Ee("owo-collapsible",i),...a,children:e})})}function Je({children:e,className:t,onClick:n,...o}){let{open:i,setOpen:a,contentId:r}=Ze("Collapsible.Trigger");return se("button",{type:"button","aria-expanded":i,"aria-controls":r,"data-state":i?"open":"closed",className:Ee("owo-collapsible__trigger",t),onClick:l=>{n?.(l),l.defaultPrevented||a(!i)},...o,children:e})}function Ye({children:e,className:t,...n}){let{open:o,contentId:i}=Ze("Collapsible.Content"),[a,r]=Ge(o),l=qe(null),u=qe(null);return Tn(()=>{let s=l.current,d=u.current;if(!s||!d)return;let c=0,g=0,p=()=>{s.style.height="auto",s.style.overflow="visible"};if(o&&r(!0),!a&&!o)return;let m=w=>{w.target!==s||w.propertyName!=="height"||(s.removeEventListener("transitionend",m),o?p():r(!1))};return(()=>{let w=d.scrollHeight;if(s.style.overflow="hidden",o){s.style.height="0px",c=window.requestAnimationFrame(()=>{s.addEventListener("transitionend",m),s.style.height=`${w}px`}),g=window.setTimeout(p,240);return}s.style.height=`${w}px`,c=window.requestAnimationFrame(()=>{s.addEventListener("transitionend",m),s.style.height="0px"}),g=window.setTimeout(()=>r(!1),240)})(),()=>{window.cancelAnimationFrame(c),window.clearTimeout(g),s.removeEventListener("transitionend",m)}},[o,a]),!a&&!o?null:se("div",{id:i,ref:l,"data-state":o?"open":"closed","aria-hidden":!o,className:Ee("owo-collapsible__content",t),...n,children:se("div",{ref:u,className:"owo-collapsible__content-inner",children:e})})}var Cn=Object.assign(Ie,{Root:Ie,Trigger:Je,Content:Ye}),Sn=Cn;import{createContext as kn,useCallback as je,useContext as Hn,useRef as An,useState as _n}from"react";import{clsx as ie}from"clsx";import{useEffect as Nn,useRef as Qe,useCallback as Rn}from"react";import{jsx as le,jsxs as Dn}from"react/jsx-runtime";function Ln({className:e,children:t,...n}){return le("div",{className:ie("owo-dialog__header px-5 pt-5 pb-1 text-base font-semibold",e),...n,children:t})}function In({className:e,children:t,...n}){return le("div",{className:ie("owo-dialog__body px-5 py-3 text-sm",e),...n,children:t})}function En({className:e,children:t,...n}){return le("div",{className:ie("owo-dialog__footer flex items-center justify-end gap-2 px-5 pt-3 pb-5",e),...n,children:t})}function $({open:e,onClose:t,size:n="sm",children:o,className:i,overlayClassName:a,panelClassName:r,...l}){let u=Qe(null),s=Qe(null),d=Rn(c=>{c.key==="Escape"&&(c.stopPropagation(),t())},[t]);return Nn(()=>(e?(s.current=document.activeElement,document.body.style.overflow="hidden",requestAnimationFrame(()=>{let c=u.current;if(!c)return;let g=c.querySelector('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');g?g.focus():c.focus()}),document.addEventListener("keydown",d)):(document.body.style.overflow="",s.current?.focus()),()=>{document.removeEventListener("keydown",d),document.body.style.overflow=""}),[e,d]),e?Dn("div",{"data-state":"open",className:"owo-dialog-overlay fixed inset-0 z-[var(--owo-cmp-z-modal)] flex items-center justify-center",children:[le("button",{type:"button","aria-label":"Close dialog","data-state":"open",className:ie("owo-dialog-backdrop absolute inset-0 bg-[var(--owo-cmp-overlay-bg)]",a),onClick:t}),le("div",{ref:u,role:"dialog","aria-modal":"true",tabIndex:-1,"data-state":"open","data-size":n,className:ie("owo-dialog relative z-10 w-full rounded-[var(--owo-cmp-control-radius-xl)] shadow-xl","animate-[dialog-in_0.2s_var(--owo-cmp-motion-ease-standard)]",n==="sm"?"max-w-[26rem]":"max-w-[32rem]",r,i),...l,children:o})]}):null}$.Header=Ln;$.Body=In;$.Footer=En;import{Fragment as Vn,jsx as te,jsxs as De}from"react/jsx-runtime";var et=kn(null);function Bn(){let e=Hn(et);if(!e)throw new Error("useConfirm must be used within <ConfirmProvider>");return e}function On({children:e}){let[t,n]=_n(null),o=An(null),i=je(r=>(o.current&&o.current.resolve(!1),new Promise(l=>{let u={options:r,resolve:l};o.current=u,n(u)})),[]),a=je(r=>{o.current&&(o.current.resolve(r),o.current=null),n(null)},[]);return De(et.Provider,{value:i,children:[e,te($,{open:t!==null,onClose:()=>a(!1),children:t&&De(Vn,{children:[te($.Header,{children:t.options.title}),te($.Body,{children:typeof t.options.description=="string"?te("p",{className:"whitespace-pre-wrap",children:t.options.description}):t.options.description}),De($.Footer,{children:[te(ae,{variant:"ghost",size:"sm",onClick:()=>a(!1),children:t.options.cancelLabel??"\u53D6\u6D88"}),te(ae,{variant:t.options.variant??"primary",size:"sm",onClick:()=>a(!0),children:t.options.confirmLabel??"\u786E\u8BA4"})]})]})})]})}import{clsx as J}from"clsx";import{autoUpdate as zn,computePosition as Fn,flip as $n,offset as Kn,shift as Un}from"@floating-ui/dom";import{Children as Wn,cloneElement as qn,createContext as tt,isValidElement as Gn,useCallback as A,useContext as ke,useEffect as j,useId as ve,useLayoutEffect as Xn,useMemo as xe,useRef as Z,useState as ue}from"react";import{createPortal as Zn}from"react-dom";import{jsx as _,jsxs as st}from"react/jsx-runtime";var nt=tt(null),He=tt(null);function Ae(e){let t=ke(nt);if(!t)throw new Error(`${e} must be used within DropdownMenu.`);return t}function ot(e){let t=ke(He);if(!t)throw new Error(`${e} must be used within DropdownMenu.Content.`);return t}function ne(e,t){return n=>{e?.(n),t(n)}}function rt(...e){return t=>{for(let n of e)n&&(typeof n=="function"?n(t):n.current=t)}}function we(e){return typeof e=="string"||typeof e=="number"?String(e):Array.isArray(e)?e.map(we).join(" "):!e||typeof e=="boolean"?"":Gn(e)?we(e.props.children):""}function Jn(e){return[...e].sort((t,n)=>{let o=t.ref.current,i=n.ref.current;if(!o||!i)return 0;let a=o.compareDocumentPosition(i);return a&Node.DOCUMENT_POSITION_FOLLOWING?-1:a&Node.DOCUMENT_POSITION_PRECEDING?1:0})}function Yn(e,t){return t==="center"?e:`${e}-${t}`}function Qn(e){let t=e.split("-");return{side:t[0],align:t[1]??"center"}}function at({open:e,defaultOpen:t=!1,onOpenChange:n,side:o="bottom",align:i="start",sideOffset:a=8,alignOffset:r=0,collisionPadding:l=8,portal:u=!0,contentRole:s="menu",children:d}){let c=ke(He),[g,p]=ue(t),m=e!==void 0,T=m?e:g,w=Z(null),b=Z(null),C=Z("selected"),x=ve(),R=ve(),h=A(P=>{m||p(P),n?.(P)},[m,n]),L=A(()=>{h(!1)},[h]),S=A(()=>{h(!1),c?.closeTree()},[c,h]),I=A(()=>{h(!T)},[T,h]),H=A(()=>{w.current?.focus()},[]),f=xe(()=>({open:T,setOpen:h,toggleOpen:I,triggerRef:w,contentRef:b,side:o,align:i,sideOffset:a,alignOffset:r,collisionPadding:l,portal:u,contentRole:s,triggerId:x,contentId:R,focusIntentRef:C,parentList:c,isSubmenu:!!c,closeSelf:L,closeTree:S,focusTrigger:H}),[T,i,r,L,S,l,s,c,u,h,o,a,I,x,R,H]);return _(nt.Provider,{value:f,children:d})}function jn({asChild:e=!1,disabled:t=!1,className:n,children:o}){let{open:i,setOpen:a,toggleOpen:r,triggerRef:l,contentRole:u,triggerId:s,contentId:d,focusIntentRef:c,isSubmenu:g}=Ae("DropdownMenu.Trigger"),p=Wn.only(o),m=p.props??{},T=typeof m.className=="string"?m.className:void 0,w={id:s,"data-state":i?"open":"closed","aria-expanded":i,"aria-haspopup":u,"aria-controls":i?d:void 0,onClick:ne(m.onClick,b=>{if(t){b.preventDefault();return}c.current="selected",r()}),onKeyDown:ne(m.onKeyDown,b=>{t||(b.key==="ArrowDown"?(b.preventDefault(),c.current="first",a(!0)):b.key==="ArrowUp"?(b.preventDefault(),c.current="last",a(!0)):!g&&(b.key==="Enter"||b.key===" ")&&(b.preventDefault(),c.current="selected",r()))})};return e?qn(p,{...w,ref:rt(l,m.ref),className:J(n,T),type:p.type==="button"?m.type??"button":m.type}):_("button",{ref:l,disabled:t,type:"button",className:J("owo-dropdown-menu__trigger",n),...w,children:p})}function eo({className:e,children:t,style:n,matchTriggerWidth:o=!1,maxHeight:i=320,...a}){let{open:r,setOpen:l,triggerRef:u,contentRef:s,side:d,align:c,sideOffset:g,alignOffset:p,collisionPadding:m,portal:T,contentRole:w,triggerId:b,contentId:C,focusIntentRef:x,parentList:R,isSubmenu:h,closeSelf:L,closeTree:S,focusTrigger:I}=Ae("DropdownMenu.Content"),H=Z([]),[f,P]=ue(null),[B,W]=ue(null),[O,q]=ue(null),[V,Ve]=ue(!1),re=Z(""),G=Z(null),ge=A(v=>(H.current=[...H.current.filter(N=>N.id!==v.id),v],()=>{H.current=H.current.filter(N=>N.id!==v.id)}),[]),k=A(()=>Jn(H.current),[]),ze=A(v=>{x.current=v},[x]);j(()=>{Ve(!0)},[]);let Zt=xe(()=>({role:w,highlightedId:f,setHighlightedId:P,registerItem:ge,getItems:k,requestFocusIntent:ze,closeTree:S,closeSelf:L,focusTrigger:I,activeSubmenuId:B,setActiveSubmenuId:W,contentRef:s}),[B,L,S,s,w,I,k,f,ge,ze]);Xn(()=>!r||!V||!u.current||!s.current?void 0:zn(u.current,s.current,()=>{!u.current||!s.current||Fn(u.current,s.current,{placement:Yn(d,c),strategy:"fixed",middleware:[Kn({mainAxis:g,crossAxis:p}),$n({padding:m}),Un({padding:m})]}).then(({x:N,y,placement:E})=>{let z=Qn(E);q({top:y,left:N,side:z.side,align:z.align})})}),[c,p,m,s,V,r,d,g,u]),j(()=>{if(!r){P(null),W(null);return}let v=k().filter(y=>!y.disabled);if(v.length===0)return;let N=v[0];x.current==="last"?N=v[v.length-1]:x.current==="selected"&&(N=v.find(y=>y.selected)??v[0]),P(N.id),requestAnimationFrame(()=>{s.current?.focus(),N.ref.current?.scrollIntoView({block:"nearest"})})},[s,x,k,r]),j(()=>{if(!r)return;function v(N){let y=N.target,E=u.current?.contains(y),z=s.current?.contains(y);if(!E&&!z){let F=R?.contentRef.current?.contains(y);if(h&&F){L(),R?.setActiveSubmenuId(null);return}S()}}return document.addEventListener("mousedown",v),()=>document.removeEventListener("mousedown",v)},[L,S,s,h,r,R,u]),j(()=>{if(r)return()=>{G.current&&clearTimeout(G.current)}},[r]);let X=A(v=>{if(P(v),!v){W(null);return}k().find(y=>y.id===v)?.submenu||W(null)},[k]),Re=A((v,N="first")=>{let y=k().filter(K=>!K.disabled);if(y.length===0)return;let E=y.findIndex(K=>K.id===f);if(E===-1){X(N==="last"?y[y.length-1].id:y[0].id);return}let z=(E+v+y.length)%y.length,F=y[z];X(F.id),F.ref.current?.scrollIntoView({block:"nearest"})},[k,f,X]),Fe=A(v=>{let N=v.length===1?v.toLowerCase():"";if(!N)return;G.current&&clearTimeout(G.current),re.current+=N,G.current=setTimeout(()=>{re.current="",G.current=null},350);let y=k().filter(K=>!K.disabled);if(y.length===0)return;let E=y.findIndex(K=>K.id===f),F=(E>=0?[...y.slice(E+1),...y.slice(0,E+1)]:y).find(K=>K.textValue.toLowerCase().startsWith(re.current));F&&(X(F.id),F.ref.current?.scrollIntoView({block:"nearest"}))},[k,f,X]),Jt=A(v=>{let N=k(),y=N.find(E=>E.id===f)??null;switch(v.key){case"ArrowDown":v.preventDefault(),Re(1);break;case"ArrowUp":v.preventDefault(),Re(-1,"last");break;case"Home":v.preventDefault();{let E=N.find(z=>!z.disabled);E&&X(E.id)}break;case"End":v.preventDefault();{let E=N.filter(F=>!F.disabled),z=E[E.length-1];z&&X(z.id)}break;case"Enter":case" ":y&&!y.disabled&&(v.preventDefault(),y.click());break;case"ArrowRight":y?.submenu&&(v.preventDefault(),y.openSubmenu?.());break;case"ArrowLeft":h&&(v.preventDefault(),L(),I(),R?.setActiveSubmenuId(null));break;case"Tab":S();break;case"Escape":v.preventDefault(),L(),I(),h&&R?.setActiveSubmenuId(null);break;default:Fe(v.key)}},[L,S,I,k,Fe,f,X,h,Re,R]);if(!r||!V)return null;let $e=_(He.Provider,{value:Zt,children:_("div",{ref:s,id:C,role:w,tabIndex:-1,"aria-labelledby":w==="menu"?b:void 0,"data-state":"open","data-side":O?.side??d,"data-align":O?.align??c,className:J("owo-dropdown-menu__content",h&&"owo-dropdown-menu__content--submenu",e),style:{...n,position:"fixed",top:O?.top??0,left:O?.left??0,maxHeight:i,minWidth:o?u.current?.getBoundingClientRect().width:void 0},onKeyDown:Jt,...a,children:t})});return T?Zn($e,document.body):$e}function to({className:e,children:t,...n}){return _("div",{className:J("owo-dropdown-menu__group",e),...n,children:t})}function no({className:e,children:t,...n}){return _("div",{className:J("owo-dropdown-menu__label",e),...n,children:t})}function oo({className:e,...t}){return _("div",{role:"separator",className:J("owo-dropdown-menu__separator",e),...t})}function ro({className:e,children:t,inset:n=!1,disabled:o=!1,selected:i=!1,destructive:a=!1,closeOnSelect:r=!0,shortcut:l,indicator:u,onSelect:s,onMouseEnter:d,onClick:c,...g}){let p=ve(),m=Z(null),{role:T,highlightedId:w,setHighlightedId:b,registerItem:C,closeTree:x,setActiveSubmenuId:R}=ot("DropdownMenu.Item"),h=xe(()=>we(t),[t]),L=w===p,S=A(()=>{o||(s?.(),r&&x())},[r,x,o,s]);return j(()=>C({id:p,ref:m,disabled:o,submenu:!1,selected:i,textValue:h,closeOnSelect:r,click:S}),[r,o,S,p,C,i,h]),st("button",{ref:m,id:p,type:"button",role:T==="listbox"?"option":"menuitem",tabIndex:-1,disabled:o,"aria-selected":T==="listbox"?i:void 0,"data-highlighted":L||void 0,"data-selected":i||void 0,"data-disabled":o||void 0,"data-destructive":a||void 0,className:J("owo-dropdown-menu__item",n&&"owo-dropdown-menu__item--inset",e),onMouseEnter:ne(d,()=>{o||(b(p),R(null))}),onClick:ne(c,I=>{I.preventDefault(),S()}),...g,children:[_("span",{className:"owo-dropdown-menu__item-main",children:t}),l?_("span",{className:"owo-dropdown-menu__shortcut",children:l}):null,i?_("span",{className:"owo-dropdown-menu__indicator",children:u??"\u2713"}):null]})}function ao(e){return _(at,{side:"right",align:"start",sideOffset:6,...e,contentRole:"menu"})}function so({className:e,children:t,inset:n=!1,disabled:o=!1,destructive:i=!1,shortcut:a,onSelect:r,onMouseEnter:l,onClick:u,...s}){let d=ve(),c=Z(null),g=Ae("DropdownMenu.SubTrigger"),{highlightedId:p,setHighlightedId:m,registerItem:T,setActiveSubmenuId:w,activeSubmenuId:b}=ot("DropdownMenu.SubTrigger"),C=xe(()=>we(t),[t]),x=p===d,R=g.open&&b===d,h=A(()=>{o||(g.focusIntentRef.current="first",m(d),w(d),g.setOpen(!0))},[o,d,w,m,g]);return j(()=>T({id:d,ref:c,disabled:o,submenu:!0,selected:!1,textValue:C,closeOnSelect:!1,click:h,openSubmenu:h}),[o,d,h,T,C]),j(()=>{b!==d&&g.open&&g.setOpen(!1)},[b,d,g]),st("button",{ref:rt(c,g.triggerRef),id:g.triggerId,type:"button",role:"menuitem",tabIndex:-1,"aria-haspopup":"menu","aria-expanded":g.open,"aria-controls":g.open?g.contentId:void 0,"data-highlighted":x||void 0,"data-state":R?"open":"closed","data-disabled":o||void 0,"data-destructive":i||void 0,className:J("owo-dropdown-menu__item owo-dropdown-menu__sub-trigger",n&&"owo-dropdown-menu__item--inset",e),onMouseEnter:ne(l,()=>{h()}),onClick:ne(u,L=>{L.preventDefault(),h(),r?.()}),...s,children:[_("span",{className:"owo-dropdown-menu__item-main",children:t}),a?_("span",{className:"owo-dropdown-menu__shortcut",children:a}):null,_("span",{className:"owo-dropdown-menu__submenu-indicator","aria-hidden":"true",children:"\u203A"})]})}var io=Object.assign(at,{Trigger:jn,Content:eo,Group:to,Label:no,Item:ro,Separator:oo,Submenu:ao,SubTrigger:so}),lo=io;import{clsx as it}from"clsx";import{Fragment as uo,jsx as lt,jsxs as co}from"react/jsx-runtime";function ut({as:e="aside",open:t,children:n,side:o="right",position:i="fixed",showBackdrop:a=!0,onClose:r,closeLabel:l="\u5173\u95ED\u62BD\u5C49",backdropClassName:u,className:s,...d}){let c=o==="left"?"-translate-x-full":"translate-x-full",g=o==="left"?"left-0 top-0":"right-0 top-0",p=i==="fixed"?"fixed":"absolute";return co(uo,{children:[a&&t&&r&<("button",{type:"button","aria-label":l,"data-state":"open",className:it("owo-drawer-backdrop inset-0 z-[var(--owo-cmp-z-modal)]",p,u),onClick:r}),lt(e,{"aria-hidden":!t,"data-state":t?"open":"closed","data-side":o,className:it("owo-drawer",p,g,"z-[calc(var(--owo-cmp-z-modal)+1)] flex max-w-full transform flex-col transition-transform duration-[var(--owo-cmp-motion-duration-default)] ease-[var(--owo-cmp-motion-ease-standard)]",t?"pointer-events-auto visible translate-x-0":`pointer-events-none invisible ${c}`,s),...d,children:n})]})}import{clsx as po}from"clsx";import{jsx as ct,jsxs as mo}from"react/jsx-runtime";function dt({label:e,help:t,htmlFor:n,children:o,className:i,...a}){return mo("div",{className:po("owo-field block",i),...a,children:[ct("label",{htmlFor:n,className:"owo-field__label mb-1 block text-xs",children:e}),o,t?ct("span",{className:"owo-field__help mt-1 block text-xs",children:t}):null]})}import{clsx as fo}from"clsx";import{jsx as pt}from"react/jsx-runtime";function mt({variant:e="ghost",size:t="md",label:n,icon:o,className:i,...a}){let r=fo("owo-icon-button","inline-flex items-center justify-center rounded-[var(--owo-cmp-control-radius-md)] transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-inset disabled:cursor-not-allowed disabled:opacity-50",t==="sm"?"h-7 w-7":"h-8 w-8",i);if("href"in a&&a.href){let{href:u,...s}=a;return pt("a",{href:u,"aria-label":n,title:s.title??n,"data-variant":e,"data-size":t,className:r,...s,children:o})}let l=a;return pt("button",{type:l.type??"button","aria-label":n,title:l.title??n,"data-variant":e,"data-size":t,className:r,...l,children:o})}import{clsx as go}from"clsx";import{jsx as ft}from"react/jsx-runtime";function he(e){return go("owo-input w-full rounded-[var(--owo-cmp-control-radius-lg)] px-3 py-2 text-sm placeholder:text-[var(--field-placeholder)] focus:outline-none focus:ring-1",e)}function gt(e){let{className:t,tone:n="default",...o}=e;return e.as==="textarea"?ft("textarea",{"data-tone":n,className:he(t),...o}):ft("input",{"data-tone":n,className:he(t),...o})}import{clsx as Te}from"clsx";import{jsx as ye}from"react/jsx-runtime";function bo(e){switch(e){case"none":return"";case"sm":return"p-4";case"lg":return"p-6";default:return"p-5"}}function bt({as:e="section",variant:t="default",padding:n="none",className:o,children:i,...a}){return ye(e,{"data-variant":t,className:Te("owo-panel rounded-[var(--owo-cmp-control-radius-lg)] border",bo(n),o),...a,children:i})}function vo({className:e,children:t,...n}){return ye("div",{className:Te("owo-panel-header border-b px-6 py-5",e),...n,children:t})}function wo({className:e,children:t,...n}){return ye("div",{className:Te("px-6 py-5",e),...n,children:t})}function xo({className:e,children:t,...n}){return ye("div",{className:Te("owo-panel-footer border-t px-6 py-4",e),...n,children:t})}import{clsx as vt}from"clsx";import{jsx as wt}from"react/jsx-runtime";function xt({value:e,onChange:t,options:n,size:o="sm",className:i,ariaLabel:a}){return wt("div",{role:"tablist","aria-label":a,className:vt("owo-segmented-control inline-flex rounded-[var(--owo-cmp-control-radius-md)] p-0.5 ring-1",o==="sm"?"text-xs":"text-sm",i),children:n.map(r=>{let l=r.value===e;return wt("button",{type:"button",role:"tab","aria-selected":l,disabled:r.disabled,"data-active":l?"true":void 0,className:vt("owo-segmented-control__item rounded-[var(--owo-cmp-control-radius-sm)] font-medium transition-colors focus:outline-none focus-visible:ring-1 focus-visible:ring-inset disabled:cursor-not-allowed disabled:opacity-50",o==="sm"?"px-2.5 py-1":"px-3 py-1.5"),onClick:()=>t(r.value),children:r.label},r.value)})})}import{clsx as oe}from"clsx";import{useCallback as _e,useEffect as ht,useId as ho,useMemo as To,useRef as Tt,useState as yt}from"react";import{jsx as ce,jsxs as Mt}from"react/jsx-runtime";function Pt({value:e,onChange:t,options:n,placeholder:o="Select\u2026",size:i="md",tone:a="default",disabled:r=!1,className:l,ariaLabel:u,renderValue:s,renderOption:d}){let[c,g]=yt(!1),[p,m]=yt(-1),T=Tt(null),w=Tt(null),b=ho(),C=n.find(f=>f.value===e),x=To(()=>n.reduce((f,P,B)=>(P.disabled||f.push(B),f),[]),[n]),R=_e(()=>{if(r||n.length===0)return;g(!0);let f=n.findIndex(P=>P.value===e);m(f>=0?f:x[0]??-1)},[r,n,e,x]),h=_e(()=>{g(!1),m(-1)},[]),L=_e(f=>{f.disabled||(t(f.value),h())},[t,h]);ht(()=>{if(!c)return;function f(P){T.current&&!T.current.contains(P.target)&&h()}return document.addEventListener("mousedown",f),()=>document.removeEventListener("mousedown",f)},[c,h]),ht(()=>{if(!c||p<0)return;w.current?.children[p]?.scrollIntoView({block:"nearest"})},[c,p]);function S(f){if(!r)switch(f.key){case"Enter":case" ":{f.preventDefault(),c?p>=0&&n[p]&&!n[p].disabled&&L(n[p]):R();break}case"ArrowDown":{if(f.preventDefault(),!c)R();else{let P=x.indexOf(p),B=x[P+1];B!==void 0&&m(B)}break}case"ArrowUp":{if(f.preventDefault(),!c)R();else{let P=x.indexOf(p),B=x[P-1];B!==void 0&&m(B)}break}case"Escape":{c&&(f.preventDefault(),h());break}case"Tab":{c&&h();break}}}let I=e!==""&&C,H=s?s({open:c,placeholder:o,selectedOption:C}):ce("span",{className:oe("truncate",!I&&"owo-select__placeholder"),children:I?C.label:o});return Mt("div",{ref:T,"data-state":c?"open":"closed","data-disabled":r||void 0,"data-size":i,"data-tone":a,className:oe("owo-select relative inline-block",l),children:[Mt("button",{type:"button",role:"combobox","aria-expanded":c,"aria-haspopup":"listbox","aria-controls":b,"aria-label":u,"aria-activedescendant":c&&p>=0?`${b}-opt-${p}`:void 0,"data-state":c?"open":"closed","data-disabled":r||void 0,"data-tone":a,"data-size":i,"data-open":c||void 0,"data-has-value":I||void 0,disabled:r,className:oe("owo-select__trigger flex w-full items-center justify-between gap-2 rounded-[var(--owo-cmp-control-radius-lg)] text-left transition-colors focus:outline-none",i==="sm"?"min-h-7 px-2 py-1 text-xs":"min-h-9 px-3 py-2 text-sm"),onClick:()=>c?h():R(),onKeyDown:S,children:[H,ce("svg",{"aria-hidden":"true",className:oe("owo-select__chevron h-3.5 w-3.5 shrink-0 transition-transform",c&&"rotate-180"),viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:ce("path",{d:"M4 6l4 4 4-4"})})]}),c&&ce("ul",{ref:w,id:b,role:"listbox","aria-label":u,"data-state":"open",className:oe("owo-select__dropdown absolute z-[var(--owo-cmp-z-dropdown)] mt-1 max-h-60 w-full overflow-auto rounded-[var(--owo-cmp-control-radius-lg)] py-1 ring-1",i==="sm"?"text-xs":"text-sm"),children:n.map((f,P)=>ce("li",{id:`${b}-opt-${P}`,role:"option","aria-selected":f.value===e,"aria-disabled":f.disabled||void 0,"data-state":f.value===e?"selected":P===p?"highlighted":"idle","data-focused":P===p||void 0,"data-selected":f.value===e||void 0,"data-disabled":f.disabled||void 0,"data-highlighted":P===p||void 0,className:oe("owo-select__option cursor-default select-none px-3 py-1.5 transition-colors",f.disabled&&"cursor-not-allowed opacity-50"),onClick:()=>L(f),onMouseEnter:()=>!f.disabled&&m(P),children:d?d({option:f,index:P,selected:f.value===e,highlighted:P===p}):f.label},f.value))})]})}import{clsx as yo}from"clsx";import{jsx as Po}from"react/jsx-runtime";var Mo={slow:"4s",default:"3s",fast:"2s"};function Ct({className:e,animation:t="scan",tone:n="default",speed:o="default",style:i,...a}){let r=n==="warm"?"emphasis":n,l={...i,"--_owo-skeleton-scan-duration":Mo[o]};return Po("div",{className:yo("owo-skeleton rounded-[var(--owo-cmp-control-radius-sm)]",e),"data-animation":t,"data-tone":r,"aria-hidden":"true",style:l,...a})}import{clsx as St}from"clsx";import{Fragment as Nt,jsx as U,jsxs as Me}from"react/jsx-runtime";function Rt({tone:e="neutral",layout:t="horizontal",icon:n,title:o,description:i,action:a,className:r,children:l,...u}){if(t==="vertical"){let s=n||o||i||a;return U("div",{"data-tone":e,"data-layout":"vertical",className:St("owo-status-notice rounded-[var(--owo-cmp-control-radius-lg)] border px-4 py-3 text-sm",r),...u,children:s?Me("div",{className:"flex flex-col items-center gap-2 py-4 text-center",children:[n&&U("div",{className:"owo-status-notice__icon text-lg",children:n}),o&&U("div",{className:"owo-status-notice__title font-medium",children:o}),i&&U("div",{className:"owo-status-notice__description",children:i}),a&&U("div",{className:"mt-2",children:a})]}):l})}return U("div",{"data-tone":e,className:St("owo-status-notice rounded-[var(--owo-cmp-control-radius-md)] border px-4 py-3 text-sm",n&&"owo-status-notice--with-icon grid grid-cols-[auto_minmax(0,1fr)] gap-3",r),...u,children:n?Me(Nt,{children:[U("span",{className:"owo-status-notice__icon mt-0.5 shrink-0","aria-hidden":"true",children:n}),Me("div",{className:"min-w-0",children:[o&&U("div",{className:"owo-status-notice__title font-medium",children:o}),l]})]}):Me(Nt,{children:[o&&U("div",{className:"owo-status-notice__title font-medium",children:o}),l]})})}import{clsx as Lt}from"clsx";import{jsx as It}from"react/jsx-runtime";var Co={sm:"h-5 w-9",md:"h-6 w-11"},So={sm:"h-3.5 w-3.5",md:"h-4.5 w-4.5"},No={sm:"translate-x-4",md:"translate-x-5"};function Et({checked:e,onChange:t,size:n="md",disabled:o=!1,className:i,ariaLabel:a}){return It("button",{type:"button",role:"switch","aria-checked":e,"aria-label":a,disabled:o,"data-size":n,className:Lt("owo-switch relative inline-flex shrink-0 cursor-pointer items-center rounded-[var(--owo-cmp-control-radius-full)] border-2 border-transparent transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2",Co[n],o&&"cursor-not-allowed opacity-50",i),onClick:()=>t(!e),children:It("span",{"aria-hidden":"true",className:Lt("owo-switch__thumb pointer-events-none inline-block rounded-[var(--owo-cmp-control-radius-full)] bg-white shadow transition-transform",So[n],e?No[n]:"translate-x-0.5")})})}import{clsx as Ce}from"clsx";import{createContext as Ro,useContext as Lo,useId as Io,useMemo as Eo,useState as Do}from"react";import{jsx as de}from"react/jsx-runtime";var Dt=Ro(null);function kt(e){let t=Lo(Dt);if(!t)throw new Error(`${e} must be used within Tabs.Root`);return t}function Pe(e){return e.replace(/[^a-zA-Z0-9_-]+/g,"-")}function ko({value:e,defaultValue:t,onValueChange:n}){let[o,i]=Do(t??""),a=e!==void 0,r=a?e:o;function l(u){a||i(u),n?.(u)}return[r,l]}function Be({children:e,value:t,defaultValue:n,onValueChange:o,className:i,...a}){let[r,l]=ko({value:t,defaultValue:n,onValueChange:o}),u=Io(),s=Eo(()=>({value:r,setValue:l,baseId:u}),[u,r,l]);return de(Dt.Provider,{value:s,children:de("div",{className:Ce("owo-tabs",i),...a,children:e})})}function Ht({children:e,className:t,ariaLabel:n,...o}){return de("div",{role:"tablist","aria-label":n,className:Ce("owo-tabs__list flex items-end gap-1 border-b",t),...o,children:e})}function At({children:e,className:t,value:n,disabled:o,onClick:i,onKeyDown:a,...r}){let{value:l,setValue:u,baseId:s}=kt("Tabs.Trigger"),d=l===n,c=`${s}-trigger-${Pe(n)}`,g=`${s}-panel-${Pe(n)}`;function p(m,T){let w=m.closest('[role="tablist"]');if(!w)return;let b=Array.from(w.querySelectorAll('[role="tab"]:not([disabled])')),C=b.indexOf(m);if(C<0)return;let x;T==="first"&&(x=b[0]),T==="last"&&(x=b[b.length-1]),T==="next"&&(x=b[(C+1)%b.length]),T==="prev"&&(x=b[(C-1+b.length)%b.length]),x&&(x.focus(),x.click())}return de("button",{type:"button",id:c,role:"tab","aria-selected":d,"aria-controls":g,tabIndex:d?0:-1,"data-state":d?"active":"inactive",disabled:o,className:Ce("owo-tabs__trigger relative -mb-px inline-flex min-h-9 items-center justify-center rounded-t-[var(--owo-cmp-control-radius-md)] border-b-2 px-3 py-2 text-sm font-medium transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-inset disabled:cursor-not-allowed disabled:opacity-50",t),onClick:m=>{i?.(m),!m.defaultPrevented&&!o&&u(n)},onKeyDown:m=>{if(a?.(m),m.defaultPrevented||o)return;let T=m.currentTarget;switch(m.key){case"ArrowRight":m.preventDefault(),p(T,"next");break;case"ArrowLeft":m.preventDefault(),p(T,"prev");break;case"Home":m.preventDefault(),p(T,"first");break;case"End":m.preventDefault(),p(T,"last");break}},...r,children:e})}function _t({children:e,className:t,value:n,...o}){let{value:i,baseId:a}=kt("Tabs.Content"),r=i===n,l=`${a}-trigger-${Pe(n)}`,u=`${a}-panel-${Pe(n)}`;return r?de("div",{id:u,role:"tabpanel","aria-labelledby":l,"data-state":"active",className:Ce("owo-tabs__content pt-4",t),...o,children:e}):null}var Ho=Object.assign(Be,{Root:Be,List:Ht,Trigger:At,Content:_t}),Ao=Ho;import{useCallback as _o,useEffect as Bo,useRef as Oo}from"react";import{jsx as Vo}from"react/jsx-runtime";function Bt({className:e,tone:t="default",resize:n="vertical",autoResize:o=!1,style:i,onInput:a,rows:r=3,...l}){let u=Oo(null),s=a,d=_o(()=>{if(!o||!u.current)return;let p=u.current;p.style.height="auto",p.style.height=`${p.scrollHeight}px`},[o]);Bo(()=>{d()},[d,l.value,l.defaultValue,r]);function c(p){d(),s?.(p)}let g={...i,resize:o?"none":n};return Vo("textarea",{...l,ref:u,rows:r,"data-tone":t,"data-auto-resize":o||void 0,className:he(`owo-textarea ${e??""}`),style:g,onInput:c})}import{clsx as Ot}from"clsx";import{createContext as zo,useCallback as Vt,useContext as Fo,useMemo as $o,useRef as zt,useState as Ko}from"react";import{jsx as D,jsxs as pe}from"react/jsx-runtime";var $t=zo(null),Oe=5,Ft=4e3;function Uo(){let e=Fo($t);if(!e)throw new Error("useToast must be used within <ToastProvider>");return e}function Wo({tone:e}){let t={width:16,height:16,viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"};switch(e){case"success":return D("svg",{...t,children:D("path",{d:"M3.5 8.5l3 3 6-7"})});case"warning":return pe("svg",{...t,children:[D("path",{d:"M8 5v4"}),D("circle",{cx:"8",cy:"11.5",r:"0.5",fill:"currentColor",stroke:"none"})]});case"danger":return D("svg",{...t,children:D("path",{d:"M4.5 4.5l7 7M11.5 4.5l-7 7"})});case"info":return pe("svg",{...t,children:[D("circle",{cx:"8",cy:"3.5",r:"1.2",fill:"currentColor",stroke:"none"}),D("path",{d:"M8 7v5.5"})]})}}function qo(e,t){return typeof e=="string"?{message:e,duration:t??Ft}:{title:e.title,message:e.message,duration:e.duration??t??Ft}}function Go({item:e,onDismiss:t,renderToast:n}){let o=()=>t(e.id),i=D(Wo,{tone:e.tone});return n?D("div",{role:"status","aria-live":"polite","data-state":"open","data-tone":e.tone,className:Ot("owo-toast pointer-events-auto rounded-[var(--owo-cmp-control-radius-lg)] border text-sm backdrop-blur-sm","animate-[toast-in_0.25s_var(--owo-cmp-motion-ease-standard)]"),children:n({item:e,dismiss:o,icon:i})}):pe("div",{role:"status","aria-live":"polite","data-state":"open","data-tone":e.tone,className:Ot("owo-toast pointer-events-auto flex items-start gap-2 rounded-[var(--owo-cmp-control-radius-lg)] border px-4 py-3 text-sm backdrop-blur-sm","animate-[toast-in_0.25s_var(--owo-cmp-motion-ease-standard)]"),children:[D("span",{className:"owo-toast__icon mt-0.5 shrink-0","aria-hidden":"true",children:i}),pe("span",{className:"min-w-0 flex-1",children:[e.title?D("span",{className:"owo-toast__title block font-medium",children:e.title}):null,D("span",{className:"block",children:e.message})]}),D("button",{type:"button",onClick:o,className:"owo-toast__close -mr-1 -mt-0.5 shrink-0 rounded-[var(--owo-cmp-control-radius-sm)] p-0.5 text-current opacity-50 transition-opacity hover:opacity-100","aria-label":"Dismiss",children:D("svg",{width:"14",height:"14",viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",children:D("path",{d:"M4 4l8 8M12 4l-8 8"})})})]})}function Xo({children:e,renderToast:t}){let[n,o]=Ko([]),i=zt(0),a=zt(new Map),r=Vt(s=>{let d=a.current.get(s);d&&clearTimeout(d),a.current.delete(s),o(c=>c.filter(g=>g.id!==s))},[]),l=Vt((s,d,c)=>{let g=i.current++,p=qo(d,c),m={id:g,tone:s,...p};o(T=>{let w=[...T,m];if(w.length>Oe){let b=w.slice(0,w.length-Oe);for(let C of b){let x=a.current.get(C.id);x&&clearTimeout(x),a.current.delete(C.id)}return w.slice(-Oe)}return w}),m.duration>0&&a.current.set(g,setTimeout(()=>r(g),m.duration))},[r]),u=$o(()=>({success:(s,d)=>l("success",s,d),warning:(s,d)=>l("warning",s,d),danger:(s,d)=>l("danger",s,d),info:(s,d)=>l("info",s,d)}),[l]);return pe($t.Provider,{value:u,children:[e,D("div",{"aria-label":"Notifications","data-state":n.length>0?"open":"closed",className:"pointer-events-none fixed bottom-4 right-4 z-[var(--owo-cmp-z-toast)] flex flex-col-reverse gap-2",children:n.map(s=>D(Go,{item:s,onDismiss:r,renderToast:t},s.id))})]})}import{clsx as Zo}from"clsx";import{autoUpdate as Jo,computePosition as Yo,flip as Qo,offset as jo,shift as er,arrow as tr}from"@floating-ui/dom";import{useCallback as ee,useEffect as Kt,useId as nr,useLayoutEffect as or,useRef as me,useState as Se}from"react";import{createPortal as rr}from"react-dom";import{Fragment as ir,jsx as Ne,jsxs as Gt}from"react/jsx-runtime";var fe=6,Ut=8,Wt=4,ar={compact:"px-2 py-1 text-[11px] max-w-[200px]",default:"px-3 py-2 text-xs max-w-xs"};function sr(e){return e.split("-")[0]}var qt={top:"",bottom:"rotate(180deg)",left:"rotate(-90deg)",right:"rotate(90deg)"};function Xt({content:e,placement:t="top",density:n="default",showDelay:o=300,hideDelay:i=150,arrow:a=!0,renderArrow:r,className:l,children:u}){let[s,d]=Se(!1),[c,g]=Se(null),[p,m]=Se(t),[T,w]=Se({}),b=me(null),C=me(null),x=me(null),R=me(void 0),h=me(void 0),L=nr(),S=ee(()=>{clearTimeout(R.current),clearTimeout(h.current)},[]),I=ee(()=>{S(),R.current=setTimeout(()=>d(!0),o)},[S,o]),H=ee(()=>{S(),d(!0)},[S]),f=ee(()=>{S(),h.current=setTimeout(()=>d(!1),i)},[S,i]),P=ee(V=>{if(V.target===b.current){I();return}H()},[I,H]),B=ee(V=>{V.pointerType!=="mouse"&&H()},[H]),W=ee(V=>{V.key==="Escape"&&s&&d(!1)},[s]);or(()=>{if(!s||!b.current||!C.current)return;let V=[jo(a?Ut+fe:Ut),Qo({padding:Wt}),er({padding:Wt})];return a&&x.current&&V.push(tr({element:x.current})),Jo(b.current,C.current,()=>{!b.current||!C.current||Yo(b.current,C.current,{placement:t,strategy:"fixed",middleware:V}).then(({x:re,y:G,placement:ge,middlewareData:k})=>{g({top:G,left:re}),m(sr(ge)),k.arrow&&w({x:k.arrow.x,y:k.arrow.y})})})},[s,t,a]),Kt(()=>{if(s)return document.addEventListener("keydown",W),()=>document.removeEventListener("keydown",W)},[s,W]),Kt(()=>S,[S]);let O={position:"absolute"},q=p;return q==="top"||q==="bottom"?(O.left=T.x??0,O[q==="top"?"bottom":"top"]=-fe,O.transform=qt[q]||void 0):(O.top=T.y??0,O[q==="left"?"right":"left"]=-fe,O.transform=qt[q]),Gt(ir,{children:[Ne("span",{ref:b,"data-state":s?"open":"closed",className:"owo-tooltip-trigger inline-flex",onMouseEnter:I,onMouseLeave:f,onFocus:P,onBlur:f,onPointerDown:B,"aria-describedby":s?L:void 0,children:u}),s&&rr(Gt("div",{ref:C,id:L,role:"tooltip","data-state":s?"open":"closed","data-placement":p,"data-density":n,className:Zo("owo-tooltip fixed z-[var(--owo-cmp-z-toast)] rounded-[var(--owo-cmp-control-radius-lg)] leading-relaxed",ar[n],"animate-[tooltip-in_0.15s_var(--owo-cmp-motion-ease-standard)]",l),style:c?{top:c.top,left:c.left}:{visibility:"hidden"},onMouseEnter:I,onMouseLeave:f,children:[e,a&&Ne("span",{ref:x,className:"owo-tooltip__arrow absolute",style:O,children:r?r({placement:p}):Ne("svg",{width:fe*2,height:fe,viewBox:"0 0 12 6",children:Ne("path",{d:"M0 0l6 6 6-6z",fill:"currentColor"})})})]}),document.body)]})}export{Ke as Avatar,Ue as Badge,ae as Button,Sn as Collapsible,Ye as CollapsibleContent,Ie as CollapsibleRoot,Je as CollapsibleTrigger,On as ConfirmProvider,$ as Dialog,ut as Drawer,lo as DropdownMenu,dt as Field,mt as IconButton,gt as Input,bt as Panel,wo as PanelBody,xo as PanelFooter,vo as PanelHeader,xt as SegmentedControl,Pt as Select,Ct as Skeleton,be as Spinner,Rt as StatusNotice,Et as Switch,Ao as Tabs,_t as TabsContent,Ht as TabsList,Be as TabsRoot,At as TabsTrigger,Bt as Textarea,Xo as ToastProvider,Xt as Tooltip,We as buttonClassName,Bn as useConfirm,Uo as useToast};
|
|
1
|
+
"use client";import{clsx as To}from"clsx";import{useState as ko}from"react";var it={};import{jsx as Xe}from"react/jsx-runtime";function Po(e){let t=e.trim().split(/\s+/);return t.length>=2?(t[0][0]+t[t.length-1][0]).toUpperCase():e.slice(0,2).toUpperCase()}function st({src:e,alt:t,name:o,size:r="md",tone:a="neutral",className:i}){let[n,c]=ko(!1),d=e&&!n,u=o?Po(o):"?";return Xe("span",{"data-tone":a,"data-size":r,className:To("owo-avatar",it.root,i),children:d?Xe("img",{src:e,alt:t??o??"",onError:()=>c(!0)}):Xe("span",{"aria-label":t??o,children:u})})}import{clsx as Co}from"clsx";var dt={};import{jsx as Io}from"react/jsx-runtime";function ct({tone:e="neutral",variant:t="soft",size:o="xs",className:r,children:a,...i}){return Io("span",{"data-tone":e,"data-variant":t,"data-size":o,className:Co("owo-badge",dt.root,r),...i,children:a})}import{clsx as Xo}from"clsx";import{clsx as Ro}from"clsx";var lt={};import{jsx as k,jsxs as ae}from"react/jsx-runtime";var So={xs:12,sm:14,md:16,lg:24};function Lo({px:e}){let o=Math.PI*2*9;return ae("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",children:[k("circle",{cx:"12",cy:"12",r:9,stroke:"currentColor",strokeWidth:"3",opacity:"0.2"}),k("circle",{cx:"12",cy:"12",r:9,stroke:"currentColor",strokeWidth:"3",strokeLinecap:"round",strokeDasharray:`${o*.28} ${o*.72}`})]})}function Do({px:e}){return ae("svg",{width:e,height:e,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2.5",strokeLinecap:"round",children:[k("path",{d:"M12 2a10 10 0 0 1 10 10",opacity:"0.9"}),k("path",{d:"M12 2a10 10 0 0 0-7.07 2.93",opacity:"0.2"}),k("path",{d:"M4.93 4.93A10 10 0 0 0 2 12",opacity:"0.2"}),k("path",{d:"M2 12a10 10 0 0 0 2.93 7.07",opacity:"0.2"}),k("path",{d:"M4.93 19.07A10 10 0 0 0 12 22",opacity:"0.2"}),k("path",{d:"M12 22a10 10 0 0 0 7.07-2.93",opacity:"0.2"}),k("path",{d:"M19.07 19.07A10 10 0 0 0 22 12",opacity:"0.2"})]})}function Eo({px:e}){return k("svg",{width:e,height:e,viewBox:"0 0 24 24",children:[0,1,2,3,4,5,6,7].map(o=>{let r=o/8*360,a=.15+o/8*.85;return k("circle",{cx:"12",cy:"3.5",r:"1.8",fill:"currentColor",opacity:a,transform:`rotate(${r} 12 12)`},o)})})}function zo({px:e}){return k("svg",{width:e,height:e,viewBox:"0 0 24 24",children:[0,1,2,3].map(t=>ae("rect",{x:3+t*5.5,y:"4",width:"3",height:"16",rx:"1.5",fill:"currentColor",opacity:"0.3",children:[k("animate",{attributeName:"opacity",values:"0.3;1;0.3",dur:"1s",begin:`${t*.15}s`,repeatCount:"indefinite"}),k("animate",{attributeName:"height",values:"16;8;16",dur:"1s",begin:`${t*.15}s`,repeatCount:"indefinite"}),k("animate",{attributeName:"y",values:"4;8;4",dur:"1s",begin:`${t*.15}s`,repeatCount:"indefinite"})]},t))})}function Ho({px:e}){let t=e*.14,o=e*.33,r=e/2-o,a=e/2,i=e/2+o,n=e/2;return k("svg",{width:e,height:e,viewBox:`0 0 ${e} ${e}`,children:[r,a,i].map((c,d)=>ae("circle",{cx:c,cy:n,r:t,fill:"currentColor",opacity:"0.4",children:[k("animate",{attributeName:"cy",values:`${n};${n-e*.25};${n}`,dur:"0.6s",begin:`${d*.12}s`,repeatCount:"indefinite",calcMode:"spline",keySplines:"0.4 0 0.2 1;0.4 0 0.2 1"}),k("animate",{attributeName:"opacity",values:"0.4;1;0.4",dur:"0.6s",begin:`${d*.12}s`,repeatCount:"indefinite"})]},d))})}function Ao({px:e}){return ae("svg",{width:e,height:e,viewBox:"0 0 24 24",children:[ae("circle",{cx:"12",cy:"12",r:"0",fill:"currentColor",opacity:"0",children:[k("animate",{attributeName:"r",values:"4;10;4",dur:"1.2s",repeatCount:"indefinite"}),k("animate",{attributeName:"opacity",values:"0.8;0.1;0.8",dur:"1.2s",repeatCount:"indefinite"})]}),k("circle",{cx:"12",cy:"12",r:"3.5",fill:"currentColor",opacity:"0.7"})]})}function Bo({px:e}){return ae("svg",{width:e,height:e,viewBox:"0 0 24 24",children:[k("circle",{cx:"12",cy:"12",r:"8",stroke:"currentColor",strokeWidth:"1.5",fill:"none",opacity:"0.15"}),k("circle",{cx:"12",cy:"4",r:"2.2",fill:"currentColor",children:k("animateTransform",{attributeName:"transform",type:"rotate",from:"0 12 12",to:"360 12 12",dur:"0.9s",repeatCount:"indefinite"})}),k("circle",{cx:"12",cy:"20",r:"1.5",fill:"currentColor",opacity:"0.5",children:k("animateTransform",{attributeName:"transform",type:"rotate",from:"0 12 12",to:"-360 12 12",dur:"0.9s",repeatCount:"indefinite"})})]})}function Oo({px:e}){let t=e*.14,o=e*.33,r=e/2-o,a=e/2,i=e/2+o,n=e/2;return k("svg",{width:e,height:e,viewBox:`0 0 ${e} ${e}`,children:[r,a,i].map((c,d)=>k("circle",{cx:c,cy:n,r:t,fill:"currentColor",opacity:"0.25",children:k("animate",{attributeName:"opacity",values:"0.25;1;0.25",dur:"0.9s",begin:`${d*.2}s`,repeatCount:"indefinite"})},d))})}var Vo={ring:Lo,arc:Do,dots:Eo,bars:zo,bounce:Ho,pulse:Ao,orbit:Bo,flow:Oo},Fo=new Set(["ring","arc","dots"]);function Ie({variant:e="ring",size:t="md",className:o,label:r}){let a=typeof t=="number"?t:So[t],i=Vo[e];return k("span",{"aria-hidden":!r,"aria-label":r,role:r?"img":void 0,"data-animate":Fo.has(e)?"spin":void 0,className:Ro("owo-spinner",lt.root,o),children:k(i,{px:a})})}var ce={};import{Fragment as Ko,jsx as ne,jsxs as Uo}from"react/jsx-runtime";function pt({className:e}){return Xo("owo-button",ce.root,e)}function be(e){let{variant:t="secondary",size:o="md",loading:r=!1,leadingIcon:a,trailingIcon:i,className:n,children:c,...d}=e,u=Uo(Ko,{children:[r?ne("span",{className:ce.icon,children:ne(Ie,{size:o==="xs"?"xs":o==="sm"?"sm":o==="xl"?"lg":"md"})}):a?ne("span",{className:ce.icon,children:a}):null,ne("span",{className:ce.label,children:c}),!r&&i?ne("span",{className:ce.icon,children:i}):null]}),s=pt({variant:t,size:o,loading:r,className:n});if("href"in e&&e.href){let{href:l,...b}=d;return ne("a",{href:l,"data-variant":t,"data-size":o,"data-loading":r?"true":void 0,"aria-disabled":r||void 0,tabIndex:r?-1:void 0,className:s,onClick:r?p=>p.preventDefault():void 0,...b,children:u})}let m=d;return ne("button",{type:m.type??"button","data-variant":t,"data-size":o,"data-loading":r?"true":void 0,disabled:m.disabled||r,className:s,...m,children:u})}import{clsx as q}from"clsx";import{createContext as _o,useContext as qo,useEffect as Go,useId as Yo,useMemo as Jo,useRef as ut,useState as mt}from"react";var ee={};import{jsx as G,jsxs as er}from"react/jsx-runtime";var gt=_o(null);function ft(e){let t=qo(gt);if(!t)throw new Error(`${e} must be used within Collapsible.Root`);return t}function Zo({open:e,defaultOpen:t,onOpenChange:o}){let[r,a]=mt(t??!1),i=e!==void 0,n=i?e:r;function c(d){i||a(d),o?.(d)}return[n,c]}function Ke({children:e,open:t,defaultOpen:o,onOpenChange:r,classNames:a,className:i,...n}){let[c,d]=Zo({open:t,defaultOpen:o,onOpenChange:r}),u=Yo(),s=Jo(()=>({open:c,setOpen:d,contentId:u,classNames:a}),[u,c,d,a]);return G(gt.Provider,{value:s,children:G("div",{"data-state":c?"open":"closed","data-scope":"collapsible",className:q("owo-collapsible",ee.root,i),...n,children:e})})}function bt({children:e,icon:t,indicator:o,iconPosition:r="start",className:a,onClick:i,...n}){let{open:c,setOpen:d,contentId:u,classNames:s}=ft("Collapsible.Trigger"),l=t!==void 0||o!==void 0?er("span",{"data-part":"triggerInner",className:q(ee.triggerInner,s?.triggerInner),children:[t&&r==="start"?G("span",{"data-part":"triggerIcon","aria-hidden":"true",className:q(ee.triggerIcon,s?.triggerIcon),children:t}):null,G("span",{"data-part":"triggerLabel",className:q(ee.triggerLabel,s?.triggerLabel),children:e}),t&&r==="end"?G("span",{"data-part":"triggerIcon","aria-hidden":"true",className:q(ee.triggerIcon,s?.triggerIcon),children:t}):null,o?G("span",{"data-part":"triggerIndicator","aria-hidden":"true",className:q(ee.triggerIndicator,s?.triggerIndicator),children:o}):null]}):e;return G("button",{type:"button","aria-expanded":c,"aria-controls":u,"data-state":c?"open":"closed","data-scope":"collapsible","data-part":"trigger",className:q(s?.trigger,a),onClick:b=>{i?.(b),b.defaultPrevented||d(!c)},...n,children:l})}function ht({children:e,className:t,...o}){let{open:r,contentId:a,classNames:i}=ft("Collapsible.Content"),[n,c]=mt(r),d=ut(null),u=ut(null);return Go(()=>{let s=d.current,m=u.current;if(!s||!m)return;let l=0,b=0,p=()=>{s.style.height="auto",s.style.overflow="visible"};if(r&&c(!0),!n&&!r)return;let f=h=>{h.target!==s||h.propertyName!=="height"||(s.removeEventListener("transitionend",f),r?p():c(!1))};return(()=>{let h=m.scrollHeight;if(s.style.overflow="hidden",r){s.style.height="0px",l=window.requestAnimationFrame(()=>{s.addEventListener("transitionend",f),s.style.height=`${h}px`}),b=window.setTimeout(p,240);return}s.style.height=`${h}px`,l=window.requestAnimationFrame(()=>{s.addEventListener("transitionend",f),s.style.height="0px"}),b=window.setTimeout(()=>c(!1),240)})(),()=>{window.cancelAnimationFrame(l),window.clearTimeout(b),s.removeEventListener("transitionend",f)}},[r,n]),!n&&!r?null:G("div",{id:a,ref:d,"data-state":r?"open":"closed","data-scope":"collapsible","data-part":"content","aria-hidden":!r,className:q(i?.content,t),...o,children:G("div",{ref:u,"data-part":"contentInner",className:q(ee.contentInner,i?.contentInner),children:e})})}var jo=Object.assign(Ke,{Root:Ke,Trigger:bt,Content:ht}),Qo=jo;import{createContext as cr,useCallback as wt,useContext as lr,useRef as pr,useState as ur}from"react";import{clsx as le}from"clsx";import{createContext as or,useEffect as rr,useRef as vt,useCallback as ar,useContext as Ue}from"react";var he={};import{jsx as pe,jsxs as dr}from"react/jsx-runtime";var Ne=or(void 0);function nr({className:e,children:t,...o}){let r=Ue(Ne);return pe("div",{"data-scope":"dialog","data-part":"header",className:le(r?.header,e),...o,children:t})}function ir({className:e,children:t,...o}){let r=Ue(Ne);return pe("div",{"data-scope":"dialog","data-part":"body",className:le(r?.body,e),...o,children:t})}function sr({className:e,children:t,...o}){let r=Ue(Ne);return pe("div",{"data-scope":"dialog","data-part":"footer",className:le(r?.footer,e),...o,children:t})}function W({open:e,onClose:t,size:o="sm",children:r,className:a,overlayClassName:i,panelClassName:n,classNames:c,...d}){let u=vt(null),s=vt(null),m=ar(l=>{l.key==="Escape"&&(l.stopPropagation(),t())},[t]);return rr(()=>(e?(s.current=document.activeElement,document.body.style.overflow="hidden",requestAnimationFrame(()=>{let l=u.current;if(!l)return;let b=l.querySelector('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');b?b.focus():l.focus()}),document.addEventListener("keydown",m)):(document.body.style.overflow="",s.current?.focus()),()=>{document.removeEventListener("keydown",m),document.body.style.overflow=""}),[e,m]),e?pe(Ne.Provider,{value:c,children:dr("div",{"data-state":"open","data-scope":"dialog","data-part":"overlay",className:le("owo-dialog-overlay",he.overlay,c?.overlay),children:[pe("button",{type:"button","aria-label":"Close dialog","data-state":"open","data-scope":"dialog","data-part":"backdrop",className:le("owo-dialog-backdrop",i,c?.backdrop),onClick:t}),pe("div",{ref:u,role:"dialog","aria-modal":"true",tabIndex:-1,"data-state":"open","data-size":o,className:le("owo-dialog",he.panel,n,a),...d,children:r})]})}):null}W.Header=nr;W.Body=ir;W.Footer=sr;import{Fragment as fr,jsx as ue,jsxs as We}from"react/jsx-runtime";var xt=cr(null);function mr(){let e=lr(xt);if(!e)throw new Error("useConfirm must be used within <ConfirmProvider>");return e}function gr({children:e}){let[t,o]=ur(null),r=pr(null),a=wt(n=>(r.current&&r.current.resolve(!1),new Promise(c=>{let d={options:n,resolve:c};r.current=d,o(d)})),[]),i=wt(n=>{r.current&&(r.current.resolve(n),r.current=null),o(null)},[]);return We(xt.Provider,{value:a,children:[e,ue(W,{open:t!==null,onClose:()=>i(!1),children:t&&We(fr,{children:[ue(W.Header,{children:t.options.title}),ue(W.Body,{children:typeof t.options.description=="string"?ue("p",{className:he.confirmDescription,children:t.options.description}):t.options.description}),We(W.Footer,{children:[ue(be,{variant:"ghost",size:"sm",onClick:()=>i(!1),children:t.options.cancelLabel??"\u53D6\u6D88"}),ue(be,{variant:t.options.variant??"primary",size:"sm",onClick:()=>i(!0),children:t.options.confirmLabel??"\u786E\u8BA4"})]})]})})]})}import{clsx as oe}from"clsx";import{autoUpdate as hr,computePosition as vr,flip as wr,offset as xr,shift as yr}from"@floating-ui/dom";import{Children as Tr,cloneElement as kr,createContext as yt,isValidElement as Pr,useCallback as A,useContext as _e,useEffect as ie,useId as Re,useLayoutEffect as Mr,useMemo as Le,useRef as te,useState as ve}from"react";import{createPortal as Cr}from"react-dom";var O={};import{jsx as B,jsxs as Ct}from"react/jsx-runtime";var Tt=yt(null),qe=yt(null);function se(e){let t=_e(Tt);if(!t)throw new Error(`${e} must be used within DropdownMenu.`);return t}function kt(e){let t=_e(qe);if(!t)throw new Error(`${e} must be used within DropdownMenu.Content.`);return t}function me(e,t){return o=>{e?.(o),t(o)}}function Pt(...e){return t=>{for(let o of e)o&&(typeof o=="function"?o(t):o.current=t)}}function Se(e){return typeof e=="string"||typeof e=="number"?String(e):Array.isArray(e)?e.map(Se).join(" "):!e||typeof e=="boolean"?"":Pr(e)?Se(e.props.children):""}function Ir(e){return[...e].sort((t,o)=>{let r=t.ref.current,a=o.ref.current;if(!r||!a)return 0;let i=r.compareDocumentPosition(a);return i&Node.DOCUMENT_POSITION_FOLLOWING?-1:i&Node.DOCUMENT_POSITION_PRECEDING?1:0})}function Nr(e,t){return t==="center"?e:`${e}-${t}`}function Rr(e){let t=e.split("-");return{side:t[0],align:t[1]??"center"}}function Mt({open:e,defaultOpen:t=!1,onOpenChange:o,side:r="bottom",align:a="start",sideOffset:i=8,alignOffset:n=0,collisionPadding:c=8,portal:d=!0,contentRole:u="menu",classNames:s,children:m}){let l=_e(qe),[b,p]=ve(t),f=e!==void 0,P=f?e:b,h=te(null),v=te(null),x=te("selected"),C=Re(),I=Re(),y=A(M=>{f||p(M),o?.(M)},[f,o]),D=A(()=>{y(!1)},[y]),N=A(()=>{y(!1),l?.closeTree()},[l,y]),z=A(()=>{y(!P)},[P,y]),H=A(()=>{h.current?.focus()},[]),g=Le(()=>({open:P,setOpen:y,toggleOpen:z,triggerRef:h,contentRef:v,side:r,align:a,sideOffset:i,alignOffset:n,collisionPadding:c,portal:d,contentRole:u,triggerId:C,contentId:I,focusIntentRef:x,parentList:l,isSubmenu:!!l,closeSelf:D,closeTree:N,focusTrigger:H,classNames:s}),[P,a,n,s,D,N,c,u,l,d,y,r,i,z,C,I,H]);return B(Tt.Provider,{value:g,children:m})}function Sr({asChild:e=!1,disabled:t=!1,className:o,children:r}){let{open:a,setOpen:i,toggleOpen:n,triggerRef:c,contentRole:d,triggerId:u,contentId:s,focusIntentRef:m,isSubmenu:l,classNames:b}=se("DropdownMenu.Trigger"),p=Tr.only(r),f=p.props??{},P=typeof f.className=="string"?f.className:void 0,h={id:u,"data-state":a?"open":"closed","aria-expanded":a,"aria-haspopup":d,"aria-controls":a?s:void 0,onClick:me(f.onClick,v=>{if(t){v.preventDefault();return}m.current="selected",n()}),onKeyDown:me(f.onKeyDown,v=>{t||(v.key==="ArrowDown"?(v.preventDefault(),m.current="first",i(!0)):v.key==="ArrowUp"?(v.preventDefault(),m.current="last",i(!0)):!l&&(v.key==="Enter"||v.key===" ")&&(v.preventDefault(),m.current="selected",n()))})};return e?kr(p,{...h,ref:Pt(c,f.ref),className:oe(O.trigger,b?.trigger,o,P),type:p.type==="button"?f.type??"button":f.type}):B("button",{ref:c,disabled:t,type:"button","data-scope":"dropdown-menu","data-part":"trigger",className:oe(O.trigger,b?.trigger,o),...h,children:p})}function Lr({className:e,children:t,style:o,matchTriggerWidth:r=!1,maxHeight:a=320,...i}){let{open:n,setOpen:c,triggerRef:d,contentRef:u,side:s,align:m,sideOffset:l,alignOffset:b,collisionPadding:p,portal:f,contentRole:P,triggerId:h,contentId:v,focusIntentRef:x,parentList:C,isSubmenu:I,closeSelf:y,closeTree:D,focusTrigger:N,classNames:z}=se("DropdownMenu.Content"),H=te([]),[g,M]=ve(null),[V,J]=ve(null),[F,Z]=ve(null),[$,ot]=ve(!1),fe=te(""),j=te(null),Ce=A(w=>(H.current=[...H.current.filter(R=>R.id!==w.id),w],()=>{H.current=H.current.filter(R=>R.id!==w.id)}),[]),E=A(()=>Ir(H.current),[]),rt=A(w=>{x.current=w},[x]);ie(()=>{ot(!0)},[]);let wo=Le(()=>({role:P,highlightedId:g,setHighlightedId:M,registerItem:Ce,getItems:E,requestFocusIntent:rt,closeTree:D,closeSelf:y,focusTrigger:N,activeSubmenuId:V,setActiveSubmenuId:J,contentRef:u}),[V,y,D,u,P,N,E,g,Ce,rt]);Mr(()=>!n||!$||!d.current||!u.current?void 0:hr(d.current,u.current,()=>{!d.current||!u.current||vr(d.current,u.current,{placement:Nr(s,m),strategy:"fixed",middleware:[xr({mainAxis:l,crossAxis:b}),wr({padding:p}),yr({padding:p})]}).then(({x:R,y:T,placement:S})=>{let X=Rr(S);Z({top:T,left:R,side:X.side,align:X.align})})}),[m,b,p,u,$,n,s,l,d]),ie(()=>{if(!n){M(null),J(null);return}let w=E().filter(T=>!T.disabled);if(w.length===0)return;let R=w[0];x.current==="last"?R=w[w.length-1]:x.current==="selected"&&(R=w.find(T=>T.selected)??w[0]),M(R.id),requestAnimationFrame(()=>{u.current?.focus(),R.ref.current?.scrollIntoView({block:"nearest"})})},[u,x,E,n]),ie(()=>{if(!n)return;function w(R){let T=R.target,S=d.current?.contains(T),X=u.current?.contains(T);if(!S&&!X){let U=C?.contentRef.current?.contains(T);if(I&&U){y(),C?.setActiveSubmenuId(null);return}D()}}return document.addEventListener("mousedown",w),()=>document.removeEventListener("mousedown",w)},[y,D,u,I,n,C,d]),ie(()=>{if(n)return()=>{j.current&&clearTimeout(j.current)}},[n]);let Q=A(w=>{if(M(w),!w){J(null);return}E().find(T=>T.id===w)?.submenu||J(null)},[E]),$e=A((w,R="first")=>{let T=E().filter(_=>!_.disabled);if(T.length===0)return;let S=T.findIndex(_=>_.id===g);if(S===-1){Q(R==="last"?T[T.length-1].id:T[0].id);return}let X=(S+w+T.length)%T.length,U=T[X];Q(U.id),U.ref.current?.scrollIntoView({block:"nearest"})},[E,g,Q]),at=A(w=>{let R=w.length===1?w.toLowerCase():"";if(!R)return;j.current&&clearTimeout(j.current),fe.current+=R,j.current=setTimeout(()=>{fe.current="",j.current=null},350);let T=E().filter(_=>!_.disabled);if(T.length===0)return;let S=T.findIndex(_=>_.id===g),U=(S>=0?[...T.slice(S+1),...T.slice(0,S+1)]:T).find(_=>_.textValue.toLowerCase().startsWith(fe.current));U&&(Q(U.id),U.ref.current?.scrollIntoView({block:"nearest"}))},[E,g,Q]),xo=A(w=>{let R=E(),T=R.find(S=>S.id===g)??null;switch(w.key){case"ArrowDown":w.preventDefault(),$e(1);break;case"ArrowUp":w.preventDefault(),$e(-1,"last");break;case"Home":w.preventDefault();{let S=R.find(X=>!X.disabled);S&&Q(S.id)}break;case"End":w.preventDefault();{let S=R.filter(U=>!U.disabled),X=S[S.length-1];X&&Q(X.id)}break;case"Enter":case" ":T&&!T.disabled&&(w.preventDefault(),T.click());break;case"ArrowRight":T?.submenu&&(w.preventDefault(),T.openSubmenu?.());break;case"ArrowLeft":I&&(w.preventDefault(),y(),N(),C?.setActiveSubmenuId(null));break;case"Tab":D();break;case"Escape":w.preventDefault(),y(),N(),I&&C?.setActiveSubmenuId(null);break;default:at(w.key)}},[y,D,N,E,at,g,Q,I,$e,C]);if(!n||!$)return null;let nt=B(qe.Provider,{value:wo,children:B("div",{ref:u,id:v,role:P,tabIndex:-1,"aria-labelledby":P==="menu"?h:void 0,"data-state":"open","data-side":F?.side??s,"data-align":F?.align??m,"data-scope":"dropdown-menu","data-part":"content",className:oe(O.content,z?.content,e),style:{...o,position:"fixed",top:F?.top??0,left:F?.left??0,maxHeight:a,minWidth:r?d.current?.getBoundingClientRect().width:void 0},onKeyDown:xo,...i,children:t})});return f?Cr(nt,document.body):nt}function Dr({className:e,children:t,...o}){let{classNames:r}=se("DropdownMenu.Group");return B("div",{"data-scope":"dropdown-menu","data-part":"group",className:oe(r?.group,e),...o,children:t})}function Er({className:e,children:t,...o}){let{classNames:r}=se("DropdownMenu.Label");return B("div",{"data-scope":"dropdown-menu","data-part":"label",className:oe(r?.label,e),...o,children:t})}function zr({className:e,...t}){let{classNames:o}=se("DropdownMenu.Separator");return B("div",{role:"separator","data-scope":"dropdown-menu","data-part":"separator",className:oe(o?.separator,e),...t})}function Hr({className:e,children:t,inset:o=!1,disabled:r=!1,selected:a=!1,destructive:i=!1,closeOnSelect:n=!0,shortcut:c,indicator:d,onSelect:u,onMouseEnter:s,onClick:m,...l}){let b=Re(),p=te(null),{role:f,highlightedId:P,setHighlightedId:h,registerItem:v,closeTree:x,setActiveSubmenuId:C}=kt("DropdownMenu.Item"),{classNames:I}=se("DropdownMenu.Item"),y=Le(()=>Se(t),[t]),D=P===b,N=A(()=>{r||(u?.(),n&&x())},[n,x,r,u]);return ie(()=>v({id:b,ref:p,disabled:r,submenu:!1,selected:a,textValue:y,closeOnSelect:n,click:N}),[n,r,N,b,v,a,y]),Ct("button",{ref:p,id:b,type:"button",role:f==="listbox"?"option":"menuitem",tabIndex:-1,disabled:r,"aria-selected":f==="listbox"?a:void 0,"data-highlighted":D||void 0,"data-selected":a||void 0,"data-disabled":r||void 0,"data-destructive":i||void 0,"data-scope":"dropdown-menu","data-part":"item",className:oe(o&&O.itemInset,I?.item,e),onMouseEnter:me(s,()=>{r||(h(b),C(null))}),onClick:me(m,z=>{z.preventDefault(),N()}),...l,children:[B("span",{className:O.itemMain,children:t}),c?B("span",{className:O.shortcut,children:c}):null,a?B("span",{className:O.indicator,children:d??"\u2713"}):null]})}function Ar(e){return B(Mt,{side:"right",align:"start",sideOffset:6,...e,contentRole:"menu"})}function Br({className:e,children:t,inset:o=!1,disabled:r=!1,destructive:a=!1,shortcut:i,onSelect:n,onMouseEnter:c,onClick:d,...u}){let s=Re(),m=te(null),l=se("DropdownMenu.SubTrigger"),{highlightedId:b,setHighlightedId:p,registerItem:f,setActiveSubmenuId:P,activeSubmenuId:h}=kt("DropdownMenu.SubTrigger"),v=Le(()=>Se(t),[t]),x=b===s,C=l.open&&h===s,I=A(()=>{r||(l.focusIntentRef.current="first",p(s),P(s),l.setOpen(!0))},[r,s,P,p,l]);return ie(()=>f({id:s,ref:m,disabled:r,submenu:!0,selected:!1,textValue:v,closeOnSelect:!1,click:I,openSubmenu:I}),[r,s,I,f,v]),ie(()=>{h!==s&&l.open&&l.setOpen(!1)},[h,s,l]),Ct("button",{ref:Pt(m,l.triggerRef),id:l.triggerId,type:"button",role:"menuitem",tabIndex:-1,"aria-haspopup":"menu","aria-expanded":l.open,"aria-controls":l.open?l.contentId:void 0,"data-highlighted":x||void 0,"data-state":C?"open":"closed","data-disabled":r||void 0,"data-destructive":a||void 0,className:oe(O.subTrigger,o&&O.itemInset,e),onMouseEnter:me(c,()=>{I()}),onClick:me(d,y=>{y.preventDefault(),I(),n?.()}),...u,children:[B("span",{className:O.itemMain,children:t}),i?B("span",{className:O.shortcut,children:i}):null,B("span",{className:O.submenuIndicator,"aria-hidden":"true",children:"\u203A"})]})}var Or=Object.assign(Mt,{Trigger:Sr,Content:Lr,Group:Dr,Label:Er,Item:Hr,Separator:zr,Submenu:Ar,SubTrigger:Br}),Vr=Or;import{clsx as It}from"clsx";var Ge={};import{Fragment as $r,jsx as Nt,jsxs as Xr}from"react/jsx-runtime";function Rt({as:e="aside",open:t,children:o,side:r="right",position:a="fixed",showBackdrop:i=!0,onClose:n,closeLabel:c="\u5173\u95ED\u62BD\u5C49",backdropClassName:d,className:u,classNames:s,...m}){return Xr($r,{children:[i&&t&&n&&Nt("button",{type:"button","aria-label":c,"data-state":"open","data-scope":"drawer","data-part":"backdrop","data-position":a,className:It("owo-drawer-backdrop",Ge.backdrop,d,s?.backdrop),onClick:n}),Nt(e,{"aria-hidden":!t,"data-state":t?"open":"closed","data-side":r,"data-position":a,"data-scope":"drawer","data-part":"panel",className:It("owo-drawer",Ge.panel,u,s?.panel),...m,children:o})]})}import{clsx as Ur}from"clsx";var De={};import{jsx as St,jsxs as Wr}from"react/jsx-runtime";function Lt({label:e,help:t,htmlFor:o,children:r,className:a,...i}){return Wr("div",{className:Ur("owo-field",De.root,a),...i,children:[St("label",{htmlFor:o,className:De.label,children:e}),r,t?St("span",{className:De.help,children:t}):null]})}import{clsx as qr}from"clsx";var Dt={};import{jsx as Et}from"react/jsx-runtime";function zt({variant:e="ghost",size:t="md",label:o,icon:r,className:a,...i}){let n=qr("owo-icon-button",Dt.root,a);if("href"in i&&i.href){let{href:d,...u}=i;return Et("a",{href:d,"aria-label":o,title:u.title??o,"data-variant":e,"data-size":t,className:n,...u,children:r})}let c=i;return Et("button",{type:c.type??"button","aria-label":o,title:c.title??o,"data-variant":e,"data-size":t,className:n,...c,children:r})}import{clsx as Ht}from"clsx";var we={};import{jsx as At}from"react/jsx-runtime";function Bt(e){let{className:t,tone:o="default",size:r="md",...a}=e;return e.as==="textarea"?At("textarea",{"data-tone":o,"data-size":r,className:Ht("owo-input",we.root,t),...a}):At("input",{"data-tone":o,"data-size":r,className:Ht("owo-input",we.root,t),...a})}import{clsx as Ee}from"clsx";var Ot={};import{jsx as ze}from"react/jsx-runtime";function Vt({as:e="section",variant:t="default",padding:o="none",className:r,children:a,...i}){return ze(e,{"data-variant":t,"data-padding":o!=="none"?o:void 0,"data-scope":"panel",className:Ee("owo-panel",Ot.root,r),...i,children:a})}function Jr({className:e,children:t,...o}){return ze("div",{"data-scope":"panel","data-part":"header",className:Ee(e),...o,children:t})}function Zr({className:e,children:t,...o}){return ze("div",{"data-scope":"panel","data-part":"body",className:Ee(e),...o,children:t})}function jr({className:e,children:t,...o}){return ze("div",{"data-scope":"panel","data-part":"footer",className:Ee(e),...o,children:t})}import{clsx as ea}from"clsx";var Ye={};import{jsx as Ft}from"react/jsx-runtime";function $t({value:e,onChange:t,options:o,size:r="md",className:a,ariaLabel:i}){return Ft("div",{role:"tablist","aria-label":i,"data-size":r,className:ea("owo-segmented-control",Ye.root,a),children:o.map(n=>{let c=n.value===e;return Ft("button",{type:"button",role:"tab","aria-selected":c,disabled:n.disabled,"data-active":c?"true":void 0,className:Ye.item,onClick:()=>t(n.value),children:n.label},n.value)})})}import{clsx as ge}from"clsx";import{useCallback as Je,useEffect as Xt,useId as oa,useMemo as ra,useRef as Kt,useState as Ut}from"react";var He={};import{jsx as xe,jsxs as Wt}from"react/jsx-runtime";function _t({value:e,onChange:t,options:o,placeholder:r="Select\u2026",size:a="md",tone:i="default",disabled:n=!1,className:c,ariaLabel:d,renderValue:u,renderOption:s,classNames:m}){let[l,b]=Ut(!1),[p,f]=Ut(-1),P=Kt(null),h=Kt(null),v=oa(),x=o.find(g=>g.value===e),C=ra(()=>o.reduce((g,M,V)=>(M.disabled||g.push(V),g),[]),[o]),I=Je(()=>{if(n||o.length===0)return;b(!0);let g=o.findIndex(M=>M.value===e);f(g>=0?g:C[0]??-1)},[n,o,e,C]),y=Je(()=>{b(!1),f(-1)},[]),D=Je(g=>{g.disabled||(t(g.value),y())},[t,y]);Xt(()=>{if(!l)return;function g(M){P.current&&!P.current.contains(M.target)&&y()}return document.addEventListener("mousedown",g),()=>document.removeEventListener("mousedown",g)},[l,y]),Xt(()=>{if(!l||p<0)return;h.current?.children[p]?.scrollIntoView({block:"nearest"})},[l,p]);function N(g){if(!n)switch(g.key){case"Enter":case" ":{g.preventDefault(),l?p>=0&&o[p]&&!o[p].disabled&&D(o[p]):I();break}case"ArrowDown":{if(g.preventDefault(),!l)I();else{let M=C.indexOf(p),V=C[M+1];V!==void 0&&f(V)}break}case"ArrowUp":{if(g.preventDefault(),!l)I();else{let M=C.indexOf(p),V=C[M-1];V!==void 0&&f(V)}break}case"Escape":{l&&(g.preventDefault(),y());break}case"Tab":{l&&y();break}}}let z=e!==""&&x,H=u?u({open:l,placeholder:r,selectedOption:x}):xe("span",{className:ge(He.valueText,!z&&He.placeholder),children:z?x.label:r});return Wt("div",{ref:P,"data-state":l?"open":"closed","data-disabled":n||void 0,"data-size":a,"data-tone":i,"data-scope":"select",className:ge("owo-select",He.root,c),children:[Wt("button",{type:"button",role:"combobox","aria-expanded":l,"aria-haspopup":"listbox","aria-controls":v,"aria-label":d,"aria-activedescendant":l&&p>=0?`${v}-opt-${p}`:void 0,"data-state":l?"open":"closed","data-disabled":n||void 0,"data-tone":i,"data-size":a,"data-has-value":z||void 0,"data-scope":"select","data-part":"trigger",disabled:n,className:ge(m?.trigger),onClick:()=>l?y():I(),onKeyDown:N,children:[H,xe("svg",{"aria-hidden":"true","data-state":l?"open":"closed","data-scope":"select","data-part":"chevron",className:ge(m?.chevron),viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:xe("path",{d:"M4 6l4 4 4-4"})})]}),l&&xe("ul",{ref:h,id:v,role:"listbox","aria-label":d,"data-state":"open","data-size":a,"data-scope":"select","data-part":"dropdown",className:ge(m?.dropdown),children:o.map((g,M)=>xe("li",{id:`${v}-opt-${M}`,role:"option","aria-selected":g.value===e,"aria-disabled":g.disabled||void 0,"data-state":g.value===e?"selected":M===p?"highlighted":"idle","data-focused":M===p||void 0,"data-selected":g.value===e||void 0,"data-disabled":g.disabled||void 0,"data-highlighted":M===p||void 0,"data-scope":"select","data-part":"option",className:ge(m?.option),onClick:()=>D(g),onMouseEnter:()=>!g.disabled&&f(M),children:s?s({option:g,index:M,selected:g.value===e,highlighted:M===p}):g.label},g.value))})]})}import{clsx as na}from"clsx";var qt={};import{jsx as sa}from"react/jsx-runtime";var ia={slow:"4s",medium:"3s",fast:"2s"};function Gt({className:e,animation:t="scan",tone:o="default",speed:r="medium",style:a,...i}){let n=o==="warm"?"emphasis":o,c={...a,"--_owo-skeleton-scan-duration":ia[r]};return sa("div",{className:na("owo-skeleton",qt.root,e),"data-animation":t,"data-tone":n,"aria-hidden":"true",style:c,...i})}import{clsx as Yt}from"clsx";var K={};import{Fragment as Jt,jsx as Y,jsxs as Ae}from"react/jsx-runtime";function Zt({tone:e="neutral",layout:t="horizontal",icon:o,title:r,description:a,action:i,className:n,children:c,...d}){if(t==="vertical"){let u=o||r||a||i;return Y("div",{"data-tone":e,"data-layout":"vertical",className:Yt("owo-status-notice",K.root,n),...d,children:u?Ae("div",{className:K.body,children:[o&&Y("div",{className:K.icon,children:o}),r&&Y("div",{className:K.title,children:r}),a&&Y("div",{children:a}),i&&Y("div",{className:K.action,children:i})]}):c})}return Y("div",{"data-tone":e,className:Yt("owo-status-notice",K.root,o&&K.withIcon,n),...d,children:o?Ae(Jt,{children:[Y("span",{className:K.icon,"aria-hidden":"true",children:o}),Ae("div",{className:K.text,children:[r&&Y("div",{className:K.title,children:r}),c]})]}):Ae(Jt,{children:[r&&Y("div",{className:K.title,children:r}),c]})})}import{clsx as la}from"clsx";var Ze={};import{jsx as jt}from"react/jsx-runtime";function Qt({checked:e,onChange:t,size:o="md",disabled:r=!1,className:a,ariaLabel:i}){return jt("button",{type:"button",role:"switch","aria-checked":e,"aria-label":i,disabled:r,"data-size":o,className:la("owo-switch",Ze.root,a),onClick:()=>t(!e),children:jt("span",{"aria-hidden":"true",className:Ze.thumb})})}import{clsx as Oe}from"clsx";import{createContext as ua,useContext as ma,useId as ga,useMemo as fa,useState as ba}from"react";var eo={};import{jsx as ye}from"react/jsx-runtime";var to=ua(null);function oo(e){let t=ma(to);if(!t)throw new Error(`${e} must be used within Tabs.Root`);return t}function Be(e){return e.replace(/[^a-zA-Z0-9_-]+/g,"-")}function ha({value:e,defaultValue:t,onValueChange:o}){let[r,a]=ba(t??""),i=e!==void 0,n=i?e:r;function c(d){i||a(d),o?.(d)}return[n,c]}function je({children:e,value:t,defaultValue:o,onValueChange:r,className:a,...i}){let[n,c]=ha({value:t,defaultValue:o,onValueChange:r}),d=ga(),u=fa(()=>({value:n,setValue:c,baseId:d}),[d,n,c]);return ye(to.Provider,{value:u,children:ye("div",{"data-scope":"tabs",className:Oe("owo-tabs",eo.root,a),...i,children:e})})}function ro({children:e,className:t,ariaLabel:o,...r}){return ye("div",{role:"tablist","aria-label":o,"data-scope":"tabs","data-part":"list",className:Oe(t),...r,children:e})}function ao({children:e,className:t,value:o,disabled:r,onClick:a,onKeyDown:i,...n}){let{value:c,setValue:d,baseId:u}=oo("Tabs.Trigger"),s=c===o,m=`${u}-trigger-${Be(o)}`,l=`${u}-panel-${Be(o)}`;function b(p,f){let P=p.closest('[role="tablist"]');if(!P)return;let h=Array.from(P.querySelectorAll('[role="tab"]:not([disabled])')),v=h.indexOf(p);if(v<0)return;let x;f==="first"&&(x=h[0]),f==="last"&&(x=h[h.length-1]),f==="next"&&(x=h[(v+1)%h.length]),f==="prev"&&(x=h[(v-1+h.length)%h.length]),x&&(x.focus(),x.click())}return ye("button",{type:"button",id:m,role:"tab","aria-selected":s,"aria-controls":l,tabIndex:s?0:-1,"data-state":s?"active":"inactive","data-scope":"tabs","data-part":"trigger",disabled:r,className:Oe(t),onClick:p=>{a?.(p),!p.defaultPrevented&&!r&&d(o)},onKeyDown:p=>{if(i?.(p),p.defaultPrevented||r)return;let f=p.currentTarget;switch(p.key){case"ArrowRight":p.preventDefault(),b(f,"next");break;case"ArrowLeft":p.preventDefault(),b(f,"prev");break;case"Home":p.preventDefault(),b(f,"first");break;case"End":p.preventDefault(),b(f,"last");break}},...n,children:e})}function no({children:e,className:t,value:o,...r}){let{value:a,baseId:i}=oo("Tabs.Content"),n=a===o,c=`${i}-trigger-${Be(o)}`,d=`${i}-panel-${Be(o)}`;return n?ye("div",{id:d,role:"tabpanel","aria-labelledby":c,"data-state":"active","data-scope":"tabs","data-part":"content",className:Oe(t),...r,children:e}):null}var va=Object.assign(je,{Root:je,List:ro,Trigger:ao,Content:no}),wa=va;import{clsx as ya}from"clsx";import{useCallback as Ta,useEffect as ka,useRef as Pa}from"react";var io={};import{jsx as Ma}from"react/jsx-runtime";function so({className:e,tone:t="default",size:o="md",resize:r="vertical",autoResize:a=!1,style:i,onInput:n,rows:c=3,...d}){let u=Pa(null),s=n,m=Ta(()=>{if(!a||!u.current)return;let p=u.current;p.style.height="auto",p.style.height=`${p.scrollHeight}px`},[a]);ka(()=>{m()},[m,d.value,d.defaultValue,c]);function l(p){m(),s?.(p)}let b={...i,resize:a?"none":r};return Ma("textarea",{...d,ref:u,rows:c,"data-tone":t,"data-size":o,"data-auto-resize":a||void 0,className:ya("owo-input",we.root,"owo-textarea",io.root,e),style:b,onInput:l})}import{clsx as re}from"clsx";import{createContext as Ia,useCallback as co,useContext as Na,useMemo as Ra,useRef as lo,useState as Sa}from"react";var Te={};import{jsx as L,jsxs as ke}from"react/jsx-runtime";var uo=Ia(null),Qe=5,po=4e3;function La(){let e=Na(uo);if(!e)throw new Error("useToast must be used within <ToastProvider>");return e}function Da({tone:e}){let t={width:16,height:16,viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"};switch(e){case"success":return L("svg",{...t,children:L("path",{d:"M3.5 8.5l3 3 6-7"})});case"warning":return ke("svg",{...t,children:[L("path",{d:"M8 5v4"}),L("circle",{cx:"8",cy:"11.5",r:"0.5",fill:"currentColor",stroke:"none"})]});case"danger":return L("svg",{...t,children:L("path",{d:"M4.5 4.5l7 7M11.5 4.5l-7 7"})});case"info":return ke("svg",{...t,children:[L("circle",{cx:"8",cy:"3.5",r:"1.2",fill:"currentColor",stroke:"none"}),L("path",{d:"M8 7v5.5"})]})}}function Ea(e,t){return typeof e=="string"?{message:e,duration:t??po}:{title:e.title,message:e.message,duration:e.duration??t??po}}function za({item:e,onDismiss:t,renderToast:o,classNames:r}){let a=()=>t(e.id),i=L(Da,{tone:e.tone});return o?L("div",{role:"status","aria-live":"polite","data-state":"open","data-tone":e.tone,"data-scope":"toast","data-part":"toast",className:re("owo-toast",Te.toast,r?.toast),children:o({item:e,dismiss:a,icon:i})}):ke("div",{role:"status","aria-live":"polite","data-state":"open","data-tone":e.tone,"data-scope":"toast","data-part":"toast",className:re("owo-toast",Te.toast,Te.toastDefault,r?.toast),children:[L("span",{"data-scope":"toast","data-part":"icon",className:re(r?.icon),"aria-hidden":"true",children:i}),ke("span",{"data-scope":"toast","data-part":"content",className:re(r?.content),children:[e.title?L("span",{"data-scope":"toast","data-part":"title",className:re(r?.title),children:e.title}):null,L("span",{"data-scope":"toast","data-part":"message",className:re(r?.message),children:e.message})]}),L("button",{type:"button",onClick:a,"data-scope":"toast","data-part":"close",className:re(r?.close),"aria-label":"Dismiss",children:L("svg",{width:"14",height:"14",viewBox:"0 0 16 16",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",children:L("path",{d:"M4 4l8 8M12 4l-8 8"})})})]})}function Ha({children:e,renderToast:t,classNames:o}){let[r,a]=Sa([]),i=lo(0),n=lo(new Map),c=co(s=>{let m=n.current.get(s);m&&clearTimeout(m),n.current.delete(s),a(l=>l.filter(b=>b.id!==s))},[]),d=co((s,m,l)=>{let b=i.current++,p=Ea(m,l),f={id:b,tone:s,...p};a(P=>{let h=[...P,f];if(h.length>Qe){let v=h.slice(0,h.length-Qe);for(let x of v){let C=n.current.get(x.id);C&&clearTimeout(C),n.current.delete(x.id)}return h.slice(-Qe)}return h}),f.duration>0&&n.current.set(b,setTimeout(()=>c(b),f.duration))},[c]),u=Ra(()=>({success:(s,m)=>d("success",s,m),warning:(s,m)=>d("warning",s,m),danger:(s,m)=>d("danger",s,m),info:(s,m)=>d("info",s,m)}),[d]);return ke(uo.Provider,{value:u,children:[e,L("div",{"aria-label":"Notifications","data-state":r.length>0?"open":"closed","data-scope":"toast","data-part":"container",className:re("owo-toast-container",Te.container,o?.container),children:r.map(s=>L(za,{item:s,onDismiss:c,renderToast:t,classNames:o},s.id))})]})}import{clsx as tt}from"clsx";import{autoUpdate as Ba,computePosition as Oa,flip as Va,offset as Fa,shift as $a,arrow as Xa}from"@floating-ui/dom";import{useCallback as de,useEffect as mo,useId as Ka,useLayoutEffect as Ua,useRef as Pe,useState as Ve}from"react";import{createPortal as Wa}from"react-dom";var et={};import{Fragment as qa,jsx as Fe,jsxs as ho}from"react/jsx-runtime";var Me=6,go=8,fo=4;function _a(e){return e.split("-")[0]}var bo={top:"",bottom:"rotate(180deg)",left:"rotate(-90deg)",right:"rotate(90deg)"};function vo({content:e,placement:t="top",density:o="default",showDelay:r=300,hideDelay:a=150,arrow:i=!0,renderArrow:n,className:c,children:d,classNames:u}){let[s,m]=Ve(!1),[l,b]=Ve(null),[p,f]=Ve(t),[P,h]=Ve({}),v=Pe(null),x=Pe(null),C=Pe(null),I=Pe(void 0),y=Pe(void 0),D=Ka(),N=de(()=>{clearTimeout(I.current),clearTimeout(y.current)},[]),z=de(()=>{N(),I.current=setTimeout(()=>m(!0),r)},[N,r]),H=de(()=>{N(),m(!0)},[N]),g=de(()=>{N(),y.current=setTimeout(()=>m(!1),a)},[N,a]),M=de($=>{if($.target===v.current){z();return}H()},[z,H]),V=de($=>{$.pointerType!=="mouse"&&H()},[H]),J=de($=>{$.key==="Escape"&&s&&m(!1)},[s]);Ua(()=>{if(!s||!v.current||!x.current)return;let $=[Fa(i?go+Me:go),Va({padding:fo}),$a({padding:fo})];return i&&C.current&&$.push(Xa({element:C.current})),Ba(v.current,x.current,()=>{!v.current||!x.current||Oa(v.current,x.current,{placement:t,strategy:"fixed",middleware:$}).then(({x:fe,y:j,placement:Ce,middlewareData:E})=>{b({top:j,left:fe}),f(_a(Ce)),E.arrow&&h({x:E.arrow.x,y:E.arrow.y})})})},[s,t,i]),mo(()=>{if(s)return document.addEventListener("keydown",J),()=>document.removeEventListener("keydown",J)},[s,J]),mo(()=>N,[N]);let F={position:"absolute"},Z=p;return Z==="top"||Z==="bottom"?(F.left=P.x??0,F[Z==="top"?"bottom":"top"]=-Me,F.transform=bo[Z]||void 0):(F.top=P.y??0,F[Z==="left"?"right":"left"]=-Me,F.transform=bo[Z]),ho(qa,{children:[Fe("span",{ref:v,"data-state":s?"open":"closed","data-scope":"tooltip","data-part":"trigger",className:tt("owo-tooltip-trigger",et.trigger,u?.trigger),onMouseEnter:z,onMouseLeave:g,onFocus:M,onBlur:g,onPointerDown:V,"aria-describedby":s?D:void 0,children:d}),s&&Wa(ho("div",{ref:x,id:D,role:"tooltip","data-state":s?"open":"closed","data-placement":p,"data-density":o,"data-scope":"tooltip","data-part":"content",className:tt("owo-tooltip",et.content,u?.content,c),style:l?{top:l.top,left:l.left}:{visibility:"hidden"},onMouseEnter:z,onMouseLeave:g,children:[e,i&&Fe("span",{ref:C,"data-scope":"tooltip","data-part":"arrow",className:tt(u?.arrow),style:F,children:n?n({placement:p}):Fe("svg",{width:Me*2,height:Me,viewBox:"0 0 12 6",children:Fe("path",{d:"M0 0l6 6 6-6z",fill:"currentColor"})})})]}),document.body)]})}export{st as Avatar,ct as Badge,be as Button,Qo as Collapsible,ht as CollapsibleContent,Ke as CollapsibleRoot,bt as CollapsibleTrigger,gr as ConfirmProvider,W as Dialog,Rt as Drawer,Vr as DropdownMenu,Lt as Field,zt as IconButton,Bt as Input,Vt as Panel,Zr as PanelBody,jr as PanelFooter,Jr as PanelHeader,$t as SegmentedControl,_t as Select,Gt as Skeleton,Ie as Spinner,Zt as StatusNotice,Qt as Switch,wa as Tabs,no as TabsContent,ro as TabsList,je as TabsRoot,ao as TabsTrigger,so as Textarea,Ha as ToastProvider,vo as Tooltip,pt as buttonClassName,mr as useConfirm,La as useToast};
|