@studiolxd/brand 49.28.0 → 50.0.0
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/LICENSE +61 -0
- package/README.md +26 -4
- package/dist/_shared/assign-ref.js +6 -0
- package/dist/_shared/calendargrid.js +57 -57
- package/dist/_shared/datepicker.js +67 -65
- package/dist/_shared/default-render-link.js +7 -0
- package/dist/_shared/dialogsurface.js +1 -1
- package/dist/_shared/dropdownitems.js +14 -20
- package/dist/_shared/imagecropdialog.js +38 -441
- package/dist/_shared/overflow-focusable.js +15 -0
- package/dist/_shared/side-offset.js +13 -0
- package/dist/_shared/tokens.js +31 -129
- package/dist/_shared/useasyncoptions.js +30 -0
- package/dist/_types/atoms/Accordion/Accordion.d.ts +7 -1
- package/dist/_types/atoms/AsyncMultiSelect/AsyncMultiSelect.d.ts +8 -4
- package/dist/_types/atoms/AsyncSelect/AsyncSelect.d.ts +8 -4
- package/dist/_types/atoms/Autocomplete/Autocomplete.d.ts +10 -6
- package/dist/_types/atoms/CloseButton/CloseButton.d.ts +13 -3
- package/dist/_types/atoms/Fieldset/Fieldset.d.ts +1 -1
- package/dist/_types/atoms/InputPhone/InputPhone.d.ts +2 -0
- package/dist/_types/atoms/MultiSelect/MultiSelect.d.ts +11 -10
- package/dist/_types/atoms/Select/Select.d.ts +6 -0
- package/dist/_types/atoms/Skeleton/Skeleton.d.ts +1 -1
- package/dist/_types/atoms/Spinner/Spinner.d.ts +3 -1
- package/dist/_types/atoms/TypingIndicator/TypingIndicator.d.ts +3 -1
- package/dist/_types/atoms/_shared/useAsyncOptions.d.ts +36 -0
- package/dist/_types/constants/assign-ref.d.ts +12 -0
- package/dist/_types/constants/default-render-link.d.ts +13 -0
- package/dist/_types/constants/overflow-focusable.d.ts +15 -0
- package/dist/_types/constants/side-offset.d.ts +18 -0
- package/dist/_types/email/EmailLayout.d.ts +38 -21
- package/dist/_types/messages/BrandMessages.d.ts +8 -2
- package/dist/_types/messages/index.d.ts +1 -1
- package/dist/_types/molecules/AppLauncher/AppLauncher.d.ts +9 -3
- package/dist/_types/molecules/Calendar/Calendar.d.ts +10 -1
- package/dist/_types/molecules/CalendarPlanner/CalendarPlanner.d.ts +43 -13
- package/dist/_types/molecules/CalendarRoster/CalendarRoster.d.ts +10 -2
- package/dist/_types/molecules/ContextMenu/ContextMenu.d.ts +8 -1
- package/dist/_types/molecules/DatePicker/DatePicker.d.ts +6 -0
- package/dist/_types/molecules/DateTimeField/DateTimeField.d.ts +2 -0
- package/dist/_types/molecules/DocsSearch/DocsSearch.d.ts +2 -2
- package/dist/_types/molecules/FloatingToolbar/FloatingToolbar.d.ts +83 -0
- package/dist/_types/molecules/FormField/FormField.d.ts +5 -6
- package/dist/_types/molecules/LanguageSwitcher/LanguageSwitcher.d.ts +7 -3
- package/dist/_types/molecules/LoadingRegion/LoadingRegion.d.ts +12 -4
- package/dist/_types/molecules/Modal/Modal.d.ts +10 -4
- package/dist/_types/molecules/OrgSwitcher/OrgSwitcher.d.ts +7 -1
- package/dist/_types/molecules/PasswordField/PasswordField.d.ts +9 -2
- package/dist/_types/molecules/PrevNextNav/PrevNextNav.d.ts +3 -1
- package/dist/_types/molecules/RecurrenceField/RecurrenceField.d.ts +6 -1
- package/dist/_types/molecules/SidebarNav/SidebarNav.d.ts +18 -2
- package/dist/_types/molecules/SiteNav/SiteNav.d.ts +4 -1
- package/dist/_types/molecules/StatTile/StatTile.d.ts +15 -1
- package/dist/_types/molecules/Table/Table.d.ts +1 -1
- package/dist/_types/molecules/ThemeSwitcher/ThemeSwitcher.d.ts +38 -3
- package/dist/_types/molecules/Toast/Toaster.d.ts +8 -0
- package/dist/_types/molecules/UserMenu/UserMenu.d.ts +7 -1
- package/dist/_types/molecules/_shared/calendarGrid.d.ts +15 -2
- package/dist/_types/molecules/_shared/dialogSurface.d.ts +6 -1
- package/dist/_types/molecules/_shared/dropdownItems.d.ts +0 -2
- package/dist/_types/sections/AppHeader/AppHeader.d.ts +3 -1
- package/dist/_types/sections/AppShell/AppShell.d.ts +6 -1
- package/dist/_types/sections/LegalFooter/LegalFooter.d.ts +7 -1
- package/dist/_types/sections/Sidebar/Sidebar.d.ts +3 -1
- package/dist/_types/sections/SiteFooter/SiteFooter.d.ts +6 -2
- package/dist/_types/sections/SiteHeader/SiteHeader.d.ts +2 -2
- package/dist/_types/templates/ConnectorAuth/ConnectorAuthShell.d.ts +5 -2
- package/dist/_types/templates/ConnectorAuth/ConnectorConsentPage.d.ts +1 -1
- package/dist/_types/templates/ConnectorAuth/ConnectorExternalSignInPage.d.ts +1 -1
- package/dist/_types/templates/ConnectorAuth/ConnectorRejectionPage.d.ts +1 -1
- package/dist/_types/templates/ConnectorAuth/ConnectorSignInPage.d.ts +1 -1
- package/dist/_types/templates/ErrorPage/ErrorPage.d.ts +7 -1
- package/dist/_types/templates/NotFoundPage/NotFoundPage.d.ts +7 -1
- package/dist/_types/templates/PublicPageShell/PublicPageShell.d.ts +6 -0
- package/dist/accordion.css +1 -1
- package/dist/accordion.js +6 -5
- package/dist/alert.css +1 -1
- package/dist/app-header.js +16 -21
- package/dist/app-launcher.css +1 -1
- package/dist/app-launcher.js +29 -21
- package/dist/app-shell.js +43 -43
- package/dist/async-multi-select.css +1 -1
- package/dist/async-multi-select.js +104 -173
- package/dist/async-select.css +1 -1
- package/dist/async-select.js +81 -137
- package/dist/autocomplete.css +1 -1
- package/dist/autocomplete.js +76 -115
- package/dist/brand.css +77 -987
- package/dist/breadcrumb.js +11 -16
- package/dist/button.css +1 -1
- package/dist/calendar-planner.css +1 -1
- package/dist/calendar-planner.js +100 -95
- package/dist/calendar-roster.css +1 -1
- package/dist/calendar-roster.js +69 -61
- package/dist/calendar.css +1 -1
- package/dist/calendar.js +86 -85
- package/dist/card.css +1 -1
- package/dist/card.js +42 -41
- package/dist/chart.css +1 -1
- package/dist/chat-shell.js +48 -47
- package/dist/checkbox.css +1 -1
- package/dist/close-button.js +14 -12
- package/dist/command-palette.css +1 -1
- package/dist/connector-consent-page.js +19 -18
- package/dist/connector-external-sign-in-page.js +6 -5
- package/dist/connector-rejection-page.js +5 -4
- package/dist/connector-sign-in-page.js +10 -9
- package/dist/consent.css +1 -1
- package/dist/context-menu.js +3 -2
- package/dist/conversation-list.css +1 -1
- package/dist/conversation-thread.css +1 -1
- package/dist/conversation-thread.js +1 -0
- package/dist/data-table.js +74 -1625
- package/dist/date-time-field.js +7 -6
- package/dist/docs-search.js +36 -38
- package/dist/email.js +10 -7
- package/dist/error-page.js +2 -2
- package/dist/fieldset.css +1 -1
- package/dist/figure.js +1 -0
- package/dist/file-upload.css +1 -1
- package/dist/file-upload.js +48 -50
- package/dist/floating-toolbar.css +1 -0
- package/dist/floating-toolbar.js +64 -0
- package/dist/form-field.js +55 -53
- package/dist/imagecropdialog.css +1 -1
- package/dist/input-phone.css +1 -1
- package/dist/input-phone.js +30 -31
- package/dist/input.css +1 -1
- package/dist/label.css +1 -1
- package/dist/language-switcher.js +37 -44
- package/dist/legal-footer.js +12 -17
- package/dist/loading-region.css +1 -1
- package/dist/loading-region.js +8 -8
- package/dist/menu.css +1 -1
- package/dist/menu.js +4 -3
- package/dist/message-bubble.css +1 -1
- package/dist/message-composer.css +1 -1
- package/dist/modal.css +1 -1
- package/dist/modal.js +9 -9
- package/dist/multi-select.css +1 -1
- package/dist/multi-select.js +104 -172
- package/dist/not-found-page.js +8 -5
- package/dist/notification-list.js +16 -21
- package/dist/notification-panel.js +34 -46
- package/dist/number-badge.css +1 -1
- package/dist/number-input.css +1 -1
- package/dist/org-switcher.css +1 -1
- package/dist/org-switcher.js +13 -11
- package/dist/password-field.js +40 -39
- package/dist/popover.css +1 -1
- package/dist/popover.js +9 -15
- package/dist/prev-next-nav.js +8 -7
- package/dist/public-page-shell.js +7 -6
- package/dist/radio.css +1 -1
- package/dist/recurrence-field.css +1 -1
- package/dist/recurrence-field.js +38 -37
- package/dist/select.css +1 -1
- package/dist/select.js +3 -2
- package/dist/sheet.css +1 -1
- package/dist/sidebar-nav.css +1 -1
- package/dist/sidebar-nav.js +75 -70
- package/dist/sidebar.css +1 -1
- package/dist/sidebar.js +46 -42
- package/dist/site-footer.js +28 -28
- package/dist/site-header.js +39 -44
- package/dist/site-nav.js +10 -19
- package/dist/site-search.js +34 -36
- package/dist/site-shell.js +17 -16
- package/dist/skeleton.js +8 -6
- package/dist/sortable.js +20 -19
- package/dist/spinner.js +11 -7
- package/dist/stat-tile.js +24 -26
- package/dist/switcher.css +1 -1
- package/dist/table.css +1 -1
- package/dist/table.js +57 -45
- package/dist/textarea.css +1 -1
- package/dist/theme-switcher.js +57 -56
- package/dist/toaster.css +1 -1
- package/dist/toggle.css +1 -1
- package/dist/tokens.css +75 -986
- package/dist/tooltip.css +1 -1
- package/dist/tooltip.js +20 -27
- package/dist/typing-indicator.css +1 -1
- package/dist/typing-indicator.js +4 -4
- package/dist/user-menu.css +1 -1
- package/dist/user-menu.js +38 -45
- package/dist/visuallyhidden.css +1 -1
- package/package.json +26 -14
- package/src/tokens/components/async-multi-select.css +4 -0
- package/src/tokens/components/async-select.css +3 -0
- package/src/tokens/components/autocomplete.css +1 -0
- package/src/tokens/components/breadcrumb.css +0 -2
- package/src/tokens/components/button.css +0 -23
- package/src/tokens/components/control.css +0 -4
- package/src/tokens/components/file-upload.css +0 -4
- package/src/tokens/components/radio.css +2 -0
- package/src/tokens/components/site-header.css +0 -1
- package/src/tokens/index.css +5 -7
- package/src/tokens/molecules/async-multi-select-field.css +0 -6
- package/src/tokens/molecules/async-select-field.css +0 -6
- package/src/tokens/molecules/autocomplete-field.css +0 -5
- package/src/tokens/molecules/avatar-upload.css +0 -6
- package/src/tokens/molecules/calendar-roster.css +5 -0
- package/src/tokens/molecules/chart.css +0 -3
- package/src/tokens/molecules/checkbox-field.css +0 -6
- package/src/tokens/molecules/consent.css +1 -0
- package/src/tokens/molecules/conversation-thread.css +10 -0
- package/src/tokens/molecules/date-picker-field.css +0 -6
- package/src/tokens/molecules/date-time-field.css +0 -6
- package/src/tokens/molecules/dropdown-field.css +0 -6
- package/src/tokens/molecules/file-upload-field.css +0 -6
- package/src/tokens/molecules/floating-toolbar.css +18 -0
- package/src/tokens/molecules/floating-toolbar.ts +4 -0
- package/src/tokens/molecules/input-field.css +0 -1
- package/src/tokens/molecules/input-phone-field.css +0 -6
- package/src/tokens/molecules/modal.css +1 -0
- package/src/tokens/molecules/multi-select-field.css +0 -6
- package/src/tokens/molecules/number-input-field.css +0 -6
- package/src/tokens/molecules/otp-field.css +0 -6
- package/src/tokens/molecules/radio-field.css +0 -6
- package/src/tokens/molecules/recurrence-field.css +1 -0
- package/src/tokens/molecules/select-field.css +0 -6
- package/src/tokens/molecules/sidebar-nav.css +0 -6
- package/src/tokens/molecules/site-search.css +0 -2
- package/src/tokens/molecules/switcher-field.css +0 -1
- package/src/tokens/molecules/table.css +1 -0
- package/src/tokens/molecules/textarea-field.css +0 -6
- package/src/tokens/molecules/time-field.css +0 -6
- package/src/tokens/scss/_index.legacy.scss +1 -0
- package/src/tokens/scss/_index.scss +1 -0
- package/src/tokens/scss/components/_async-multi-select.scss +4 -0
- package/src/tokens/scss/components/_async-select.scss +3 -0
- package/src/tokens/scss/components/_autocomplete.scss +1 -0
- package/src/tokens/scss/components/_breadcrumb.scss +0 -2
- package/src/tokens/scss/components/_button.scss +0 -23
- package/src/tokens/scss/components/_control.scss +0 -4
- package/src/tokens/scss/components/_file-upload.scss +0 -4
- package/src/tokens/scss/components/_site-header.scss +0 -1
- package/src/tokens/scss/molecules/_async-multi-select-field.scss +0 -5
- package/src/tokens/scss/molecules/_async-select-field.scss +0 -5
- package/src/tokens/scss/molecules/_autocomplete-field.scss +0 -5
- package/src/tokens/scss/molecules/_avatar-upload.scss +0 -5
- package/src/tokens/scss/molecules/_calendar-roster.scss +4 -0
- package/src/tokens/scss/molecules/_chart.scss +0 -2
- package/src/tokens/scss/molecules/_checkbox-field.scss +0 -5
- package/src/tokens/scss/molecules/_consent.scss +1 -0
- package/src/tokens/scss/molecules/_conversation-thread.scss +3 -0
- package/src/tokens/scss/molecules/_date-picker-field.scss +0 -5
- package/src/tokens/scss/molecules/_date-time-field.scss +0 -5
- package/src/tokens/scss/molecules/_dropdown-field.scss +0 -5
- package/src/tokens/scss/molecules/_file-upload-field.scss +0 -5
- package/src/tokens/scss/molecules/_floating-toolbar.scss +15 -0
- package/src/tokens/scss/molecules/_input-field.scss +0 -1
- package/src/tokens/scss/molecules/_input-phone-field.scss +0 -5
- package/src/tokens/scss/molecules/_modal.scss +1 -0
- package/src/tokens/scss/molecules/_multi-select-field.scss +0 -5
- package/src/tokens/scss/molecules/_number-input-field.scss +0 -5
- package/src/tokens/scss/molecules/_otp-field.scss +0 -5
- package/src/tokens/scss/molecules/_radio-field.scss +0 -5
- package/src/tokens/scss/molecules/_recurrence-field.scss +1 -0
- package/src/tokens/scss/molecules/_select-field.scss +0 -5
- package/src/tokens/scss/molecules/_sidebar-nav.scss +0 -4
- package/src/tokens/scss/molecules/_site-search.scss +0 -2
- package/src/tokens/scss/molecules/_switcher-field.scss +0 -1
- package/src/tokens/scss/molecules/_table.scss +1 -0
- package/src/tokens/scss/molecules/_textarea-field.scss +0 -5
- package/src/tokens/scss/molecules/_time-field.scss +0 -5
- package/src/tokens/surface-dark-derived.css +2 -1
- package/src/tokens/surface-invert.css +15 -21
- package/src/tokens/surface-public.css +0 -19
- package/src/tokens/tokens.json +31 -129
- package/CHANGELOG.md +0 -8154
- package/dist/_types/data/home.d.ts +0 -83
- package/dist/_types/pages/Auth/AuthPage.d.ts +0 -24
- package/dist/_types/pages/Onboarding/OnboardingPage.d.ts +0 -37
- package/dist/_types/pages/Status/StatusPage.d.ts +0 -37
- package/dist/_types/pages/Status/_datos.d.ts +0 -47
- package/src/tokens/surface-light.css +0 -782
- package/src/tokens/utils.test.ts +0 -86
package/LICENSE
ADDED
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2026 Studio LXD
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
|
22
|
+
|
|
23
|
+
-------------------------------------------------------------------------------
|
|
24
|
+
|
|
25
|
+
BRAND ASSETS ARE NOT INCLUDED
|
|
26
|
+
|
|
27
|
+
This license covers the source code, styles, design tokens and documentation.
|
|
28
|
+
It does NOT grant any right to use the name "Studio LXD", its logo, logomark,
|
|
29
|
+
favicons, app icons or any other brand asset. These remain the exclusive
|
|
30
|
+
property of Studio LXD, all rights reserved. They include, among others, the
|
|
31
|
+
files under dist/assets/ (logo.svg, logomark.svg, logomark-safe.svg, icons/,
|
|
32
|
+
email/logo-*.png), the Logo and Logomark components and their drawings, and
|
|
33
|
+
the files under public/brand/, public/logo.svg and public/favicon.svg.
|
|
34
|
+
|
|
35
|
+
You may not use the brand assets to identify your own products or services,
|
|
36
|
+
or in a way that suggests endorsement by Studio LXD, without prior written
|
|
37
|
+
permission.
|
|
38
|
+
|
|
39
|
+
THIRD-PARTY COMPONENTS
|
|
40
|
+
|
|
41
|
+
Some files keep their own license:
|
|
42
|
+
|
|
43
|
+
- Fonts under dist/assets/fonts/ and src/assets/fonts/ (Google Sans Flex,
|
|
44
|
+
Google Sans Code, Libre Bodoni): SIL Open Font License 1.1. Each family
|
|
45
|
+
ships its LICENSE.txt next to the font files.
|
|
46
|
+
- src/vendor/normalize.css: MIT License, Copyright (c) Nicolas Gallagher and
|
|
47
|
+
Jonathan Neal.
|
|
48
|
+
|
|
49
|
+
-------------------------------------------------------------------------------
|
|
50
|
+
|
|
51
|
+
LOS ACTIVOS DE MARCA NO ESTÁN INCLUIDOS
|
|
52
|
+
|
|
53
|
+
Esta licencia cubre el código, los estilos, los tokens de diseño y la
|
|
54
|
+
documentación. NO concede ningún derecho de uso sobre el nombre «Studio LXD»,
|
|
55
|
+
su logotipo, su isotipo, los favicons, los iconos de aplicación ni ningún otro
|
|
56
|
+
activo de marca, que son propiedad exclusiva de Studio LXD, con todos los
|
|
57
|
+
derechos reservados. Quedan excluidos, entre otros, los ficheros de
|
|
58
|
+
dist/assets/ citados arriba, los componentes Logo y Logomark y sus dibujos, y
|
|
59
|
+
los ficheros de public/brand/, public/logo.svg y public/favicon.svg.
|
|
60
|
+
|
|
61
|
+
Las fuentes y normalize.css conservan su propia licencia, indicada arriba.
|
package/README.md
CHANGED
|
@@ -11,10 +11,18 @@ y el catálogo de Storybook es su fuente de verdad.
|
|
|
11
11
|
pnpm add @studiolxd/brand
|
|
12
12
|
```
|
|
13
13
|
|
|
14
|
-
El paquete declara como peer dependencies `react` y `react-dom` (>=
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
14
|
+
El paquete declara como peer dependencies `react` y `react-dom` (>=19). Hay
|
|
15
|
+
peers **opcionales**, que solo hacen falta si se consume el subpath que los
|
|
16
|
+
importa:
|
|
17
|
+
|
|
18
|
+
| Peer | Lo pide |
|
|
19
|
+
| --- | --- |
|
|
20
|
+
| `react-hook-form` (>=7) | `@studiolxd/brand/form-field` |
|
|
21
|
+
| `react-email` (>=6) | `@studiolxd/brand/email` |
|
|
22
|
+
| `@tanstack/react-table` (^8.21) | `@studiolxd/brand/data-table` |
|
|
23
|
+
| `react-image-crop` (^11.1) | `@studiolxd/brand/image-crop-dialog` y `@studiolxd/brand/avatar-upload` |
|
|
24
|
+
|
|
25
|
+
Pide Node 20 o superior.
|
|
18
26
|
|
|
19
27
|
## Uso
|
|
20
28
|
|
|
@@ -138,3 +146,17 @@ paleta, la escala tipográfica, las variantes de cada componente y las reglas
|
|
|
138
146
|
que las gobiernan responden a la marca de Studio LXD y se deciden aquí
|
|
139
147
|
dentro. Si el sistema le sirve tal cual a alguien más, encantados; si hace
|
|
140
148
|
falta que sea otra cosa, un fork es mejor camino que una petición.
|
|
149
|
+
|
|
150
|
+
## Cambios
|
|
151
|
+
|
|
152
|
+
El historial de versiones está en
|
|
153
|
+
[`CHANGELOG.md`](https://github.com/studiolxd/brand/blob/main/CHANGELOG.md), en el
|
|
154
|
+
repositorio. No viaja en el paquete de npm.
|
|
155
|
+
|
|
156
|
+
## Licencia
|
|
157
|
+
|
|
158
|
+
El código, los estilos, los tokens y la documentación se publican con licencia
|
|
159
|
+
[MIT](./LICENSE). El nombre «Studio LXD», el logotipo, el isotipo y el resto de
|
|
160
|
+
activos de marca **no** están incluidos: son propiedad de Studio LXD y no se
|
|
161
|
+
pueden usar sin permiso. Las fuentes conservan su licencia SIL Open Font License
|
|
162
|
+
1.1, que viaja junto a cada familia. El detalle, en [`LICENSE`](./LICENSE).
|
|
@@ -139,32 +139,32 @@ function x(e, t) {
|
|
|
139
139
|
return new Date(n.getFullYear(), n.getMonth(), Math.min(e.getDate(), r));
|
|
140
140
|
}
|
|
141
141
|
function S(e) {
|
|
142
|
+
let [t] = a(() => /* @__PURE__ */ new Date());
|
|
143
|
+
return e ?? t;
|
|
144
|
+
}
|
|
145
|
+
function C(e) {
|
|
142
146
|
return `${e.getFullYear()}-${e.getMonth()}-${e.getDate()}`;
|
|
143
147
|
}
|
|
144
|
-
function
|
|
145
|
-
let [
|
|
146
|
-
|
|
147
|
-
if (s && l(s, e)) return s;
|
|
148
|
-
let t = /* @__PURE__ */ new Date();
|
|
149
|
-
return l(t, e) ? t : new Date(e.getFullYear(), e.getMonth(), 1);
|
|
150
|
-
}, [
|
|
151
|
-
p,
|
|
148
|
+
function w({ month: e, onMonthChange: o, selected: s, today: u, onActivate: d, minDate: f, maxDate: p }) {
|
|
149
|
+
let [m, h] = a(() => s ?? u), g = i(/* @__PURE__ */ new Map()), _ = i(!1), v = r(() => l(m, e) ? m : s && l(s, e) ? s : l(u, e) ? u : new Date(e.getFullYear(), e.getMonth(), 1), [
|
|
150
|
+
m,
|
|
152
151
|
e,
|
|
153
|
-
s
|
|
152
|
+
s,
|
|
153
|
+
u
|
|
154
154
|
]);
|
|
155
155
|
n(() => {
|
|
156
|
-
|
|
157
|
-
}, [
|
|
158
|
-
let
|
|
159
|
-
let n = y(t,
|
|
160
|
-
|
|
156
|
+
_.current && (_.current = !1, g.current.get(C(v))?.focus());
|
|
157
|
+
}, [v]);
|
|
158
|
+
let S = t((t) => {
|
|
159
|
+
let n = y(t, f, p);
|
|
160
|
+
_.current = !0, h(n), l(n, e) || o(new Date(n.getFullYear(), n.getMonth(), 1));
|
|
161
161
|
}, [
|
|
162
|
+
p,
|
|
162
163
|
f,
|
|
163
|
-
d,
|
|
164
164
|
e,
|
|
165
165
|
o
|
|
166
|
-
]),
|
|
167
|
-
let t =
|
|
166
|
+
]), w = t((e) => {
|
|
167
|
+
let t = v, n = null;
|
|
168
168
|
switch (e.key) {
|
|
169
169
|
case "ArrowLeft":
|
|
170
170
|
n = b(t, -1);
|
|
@@ -192,46 +192,46 @@ function C({ month: e, onMonthChange: o, selected: s, onActivate: u, minDate: d,
|
|
|
192
192
|
break;
|
|
193
193
|
case "Enter":
|
|
194
194
|
case " ":
|
|
195
|
-
|
|
195
|
+
d && (e.preventDefault(), d(t));
|
|
196
196
|
return;
|
|
197
197
|
default: return;
|
|
198
198
|
}
|
|
199
|
-
e.preventDefault(),
|
|
199
|
+
e.preventDefault(), S(n);
|
|
200
200
|
}, [
|
|
201
|
-
_,
|
|
202
201
|
v,
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
202
|
+
S,
|
|
203
|
+
d
|
|
204
|
+
]), T = t((e) => (t) => {
|
|
205
|
+
let n = C(e);
|
|
206
|
+
t ? g.current.set(n, t) : g.current.delete(n);
|
|
207
207
|
}, []);
|
|
208
208
|
return {
|
|
209
|
-
activeDate:
|
|
210
|
-
isTabbable: t((e) => c(e,
|
|
211
|
-
cellRef:
|
|
212
|
-
onKeyDown:
|
|
213
|
-
onCellFocus: t((e) =>
|
|
209
|
+
activeDate: v,
|
|
210
|
+
isTabbable: t((e) => c(e, v), [v]),
|
|
211
|
+
cellRef: T,
|
|
212
|
+
onKeyDown: w,
|
|
213
|
+
onCellFocus: t((e) => h(e), [])
|
|
214
214
|
};
|
|
215
215
|
}
|
|
216
|
-
function
|
|
217
|
-
let [
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
216
|
+
function T({ weekStart: e, onWeekChange: o, today: s, onActivate: l, minDate: u, maxDate: d }) {
|
|
217
|
+
let [p, m] = a(() => s), h = i(/* @__PURE__ */ new Map()), g = i(!1), _ = r(() => f(e), [e]), v = r(() => c(f(p), _) ? p : c(f(s), _) ? s : _, [
|
|
218
|
+
p,
|
|
219
|
+
_,
|
|
220
|
+
s
|
|
221
|
+
]);
|
|
222
222
|
n(() => {
|
|
223
|
-
|
|
224
|
-
}, [
|
|
225
|
-
let
|
|
226
|
-
let t = y(e,
|
|
227
|
-
|
|
223
|
+
g.current && (g.current = !1, h.current.get(C(v))?.focus());
|
|
224
|
+
}, [v]);
|
|
225
|
+
let x = t((e) => {
|
|
226
|
+
let t = y(e, u, d);
|
|
227
|
+
g.current = !0, m(t), c(f(t), _) || o(f(t));
|
|
228
228
|
}, [
|
|
229
|
+
d,
|
|
229
230
|
u,
|
|
230
|
-
l,
|
|
231
231
|
o,
|
|
232
|
-
|
|
233
|
-
]),
|
|
234
|
-
let t =
|
|
232
|
+
_
|
|
233
|
+
]), S = t((e) => {
|
|
234
|
+
let t = v, n = null;
|
|
235
235
|
switch (e.key) {
|
|
236
236
|
case "ArrowLeft":
|
|
237
237
|
case "ArrowUp":
|
|
@@ -255,26 +255,26 @@ function w({ weekStart: e, onWeekChange: o, onActivate: s, minDate: l, maxDate:
|
|
|
255
255
|
break;
|
|
256
256
|
case "Enter":
|
|
257
257
|
case " ":
|
|
258
|
-
|
|
258
|
+
l && (e.preventDefault(), l(t));
|
|
259
259
|
return;
|
|
260
260
|
default: return;
|
|
261
261
|
}
|
|
262
|
-
e.preventDefault(),
|
|
262
|
+
e.preventDefault(), x(n);
|
|
263
263
|
}, [
|
|
264
|
-
_,
|
|
265
264
|
v,
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
265
|
+
x,
|
|
266
|
+
l
|
|
267
|
+
]), w = t((e) => (t) => {
|
|
268
|
+
let n = C(e);
|
|
269
|
+
t ? h.current.set(n, t) : h.current.delete(n);
|
|
270
270
|
}, []);
|
|
271
271
|
return {
|
|
272
|
-
activeDate:
|
|
273
|
-
isTabbable: t((e) => c(e,
|
|
274
|
-
cellRef:
|
|
275
|
-
onKeyDown:
|
|
276
|
-
onCellFocus: t((e) =>
|
|
272
|
+
activeDate: v,
|
|
273
|
+
isTabbable: t((e) => c(e, v), [v]),
|
|
274
|
+
cellRef: w,
|
|
275
|
+
onKeyDown: S,
|
|
276
|
+
onCellFocus: t((e) => m(e), [])
|
|
277
277
|
};
|
|
278
278
|
}
|
|
279
279
|
//#endregion
|
|
280
|
-
export { c as a, _ as c, f as d,
|
|
280
|
+
export { c as a, _ as c, f as d, w as f, g as i, u as l, S as m, d as n, l as o, T as p, m as r, v as s, h as t, p as u };
|
|
@@ -2,9 +2,10 @@ import '../datepicker.css';
|
|
|
2
2
|
import { n as e } from "./brandmessagescontext.js";
|
|
3
3
|
import { Icon as t } from "../icon.js";
|
|
4
4
|
import { Input as n } from "../input.js";
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
5
|
+
import { t as r } from "./assign-ref.js";
|
|
6
|
+
import { Popover as i } from "../popover.js";
|
|
7
|
+
import { Calendar as a } from "../calendar.js";
|
|
8
|
+
import { forwardRef as o, useCallback as s, useId as c, useMemo as l, useRef as ee, useState as u } from "react";
|
|
8
9
|
import { jsx as d, jsxs as f } from "react/jsx-runtime";
|
|
9
10
|
//#region src/stories/molecules/DatePicker/dateMask.ts
|
|
10
11
|
var p = /[]/g, m = new Date(2026, 8, 25);
|
|
@@ -57,110 +58,111 @@ function g(e) {
|
|
|
57
58
|
function _(e) {
|
|
58
59
|
return `${String(e.getFullYear()).padStart(4, "0")}-${String(e.getMonth() + 1).padStart(2, "0")}-${String(e.getDate()).padStart(2, "0")}`;
|
|
59
60
|
}
|
|
60
|
-
var v =
|
|
61
|
-
let
|
|
62
|
-
|
|
63
|
-
let
|
|
64
|
-
|
|
65
|
-
}, [
|
|
66
|
-
(
|
|
67
|
-
}, [
|
|
61
|
+
var v = o(function({ value: o, onChange: p, placeholder: m, maskLetters: h, invalidMessage: v, openCalendarLabel: y, minDate: b, maxDate: x, disabledDates: te, size: S = "md", disabled: C, readOnly: w, error: T = !1, locale: E = "es-ES", id: D, name: O, describedBy: k, "aria-describedby": ne, "aria-label": re, calendarLabel: ie, previousMonthLabel: ae, nextMonthLabel: A, previousYearsLabel: j, nextYearsLabel: M, yearGridLabel: N, gridLabel: P, today: F, onBlur: I, className: L }, R) {
|
|
62
|
+
let z = e("datePicker"), [B, V] = u(!1), H = l(() => g(E), [E]), U = o instanceof Date ? H.format(o) : "", [W, G] = u(U), [K, q] = u(U);
|
|
63
|
+
U !== K && (q(U), G(U));
|
|
64
|
+
let J = ee(null), oe = s((e) => {
|
|
65
|
+
J.current = e, r(R, e);
|
|
66
|
+
}, [R]), Y = W.trim(), X = Y ? H.parse(W) : null, Z = Y !== "" && !X, se = T || Z, Q = `${c()}-date-picker-invalid`, ce = [k ?? ne, Z ? Q : void 0].filter(Boolean).join(" ") || void 0, le = s((e) => {
|
|
67
|
+
(w || C) && e || V(e);
|
|
68
|
+
}, [C, w]), ue = s((e) => {
|
|
68
69
|
let t = e.target.value;
|
|
69
|
-
if (
|
|
70
|
+
if (G(t), t.trim() === "") {
|
|
70
71
|
p?.(null);
|
|
71
72
|
return;
|
|
72
73
|
}
|
|
73
|
-
let n =
|
|
74
|
+
let n = H.parse(t);
|
|
74
75
|
n && p?.(n);
|
|
75
|
-
}, [
|
|
76
|
-
if (e.key === "ArrowDown" && !
|
|
77
|
-
e.preventDefault(),
|
|
76
|
+
}, [H, p]), de = s((e) => {
|
|
77
|
+
if (e.key === "ArrowDown" && !w && !C) {
|
|
78
|
+
e.preventDefault(), V(!0);
|
|
78
79
|
return;
|
|
79
80
|
}
|
|
80
|
-
e.key === "Escape" &&
|
|
81
|
+
e.key === "Escape" && B && (e.preventDefault(), V(!1));
|
|
81
82
|
}, [
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
]),
|
|
86
|
-
|
|
87
|
-
}, [
|
|
83
|
+
C,
|
|
84
|
+
B,
|
|
85
|
+
w
|
|
86
|
+
]), fe = s((e) => {
|
|
87
|
+
G(H.format(e)), p?.(e), V(!1), requestAnimationFrame(() => J.current?.focus());
|
|
88
|
+
}, [H, p]), pe = /* @__PURE__ */ d("button", {
|
|
88
89
|
type: "button",
|
|
89
90
|
className: "date-picker__button",
|
|
90
|
-
"aria-label":
|
|
91
|
+
"aria-label": z("openCalendar", y),
|
|
91
92
|
"aria-haspopup": "dialog",
|
|
92
|
-
"aria-expanded":
|
|
93
|
-
disabled:
|
|
94
|
-
tabIndex:
|
|
93
|
+
"aria-expanded": B,
|
|
94
|
+
disabled: C,
|
|
95
|
+
tabIndex: w ? -1 : void 0,
|
|
95
96
|
children: /* @__PURE__ */ d(t, {
|
|
96
97
|
name: "calendar",
|
|
97
98
|
size: "sm",
|
|
98
99
|
className: "date-picker__glyph"
|
|
99
100
|
})
|
|
100
|
-
}), $ =
|
|
101
|
+
}), $ = z("calendar", ie);
|
|
101
102
|
return /* @__PURE__ */ f("div", {
|
|
102
103
|
className: [
|
|
103
104
|
"date-picker",
|
|
104
|
-
|
|
105
|
-
|
|
105
|
+
S === "md" ? "" : `date-picker--${S}`,
|
|
106
|
+
L ?? ""
|
|
106
107
|
].filter(Boolean).join(" "),
|
|
107
108
|
children: [
|
|
108
|
-
|
|
109
|
+
O && /* @__PURE__ */ d("input", {
|
|
109
110
|
type: "hidden",
|
|
110
|
-
name:
|
|
111
|
-
value:
|
|
111
|
+
name: O,
|
|
112
|
+
value: o instanceof Date ? _(o) : ""
|
|
112
113
|
}),
|
|
113
114
|
/* @__PURE__ */ f("div", {
|
|
114
115
|
className: "date-picker__control",
|
|
115
116
|
children: [/* @__PURE__ */ d(n, {
|
|
116
|
-
ref:
|
|
117
|
-
id:
|
|
117
|
+
ref: oe,
|
|
118
|
+
id: D,
|
|
118
119
|
className: "date-picker__input",
|
|
119
120
|
type: "text",
|
|
120
121
|
inputMode: "numeric",
|
|
121
122
|
autoComplete: "off",
|
|
122
|
-
size:
|
|
123
|
-
error:
|
|
124
|
-
value:
|
|
125
|
-
placeholder: m ??
|
|
126
|
-
disabled:
|
|
127
|
-
readOnly:
|
|
128
|
-
"aria-label":
|
|
129
|
-
"aria-describedby":
|
|
130
|
-
onChange:
|
|
131
|
-
onKeyDown:
|
|
132
|
-
onBlur:
|
|
133
|
-
}), /* @__PURE__ */ d(
|
|
134
|
-
trigger:
|
|
123
|
+
size: S,
|
|
124
|
+
error: se,
|
|
125
|
+
value: W,
|
|
126
|
+
placeholder: m ?? H.mask(z("maskLetters", h)),
|
|
127
|
+
disabled: C,
|
|
128
|
+
readOnly: w,
|
|
129
|
+
"aria-label": re,
|
|
130
|
+
"aria-describedby": ce,
|
|
131
|
+
onChange: ue,
|
|
132
|
+
onKeyDown: de,
|
|
133
|
+
onBlur: I
|
|
134
|
+
}), /* @__PURE__ */ d(i, {
|
|
135
|
+
trigger: pe,
|
|
135
136
|
label: $,
|
|
136
|
-
open:
|
|
137
|
-
onOpenChange:
|
|
137
|
+
open: B,
|
|
138
|
+
onOpenChange: le,
|
|
138
139
|
side: "bottom",
|
|
139
140
|
align: "end",
|
|
140
141
|
sideOffset: -1,
|
|
141
142
|
className: "date-picker__popover",
|
|
142
|
-
children: /* @__PURE__ */ d(
|
|
143
|
-
value:
|
|
144
|
-
onChange:
|
|
145
|
-
gridLabel:
|
|
146
|
-
previousMonthLabel:
|
|
147
|
-
nextMonthLabel:
|
|
148
|
-
previousYearsLabel:
|
|
149
|
-
nextYearsLabel:
|
|
150
|
-
yearGridLabel:
|
|
143
|
+
children: /* @__PURE__ */ d(a, {
|
|
144
|
+
value: X ?? o ?? null,
|
|
145
|
+
onChange: fe,
|
|
146
|
+
gridLabel: P ?? $,
|
|
147
|
+
previousMonthLabel: ae,
|
|
148
|
+
nextMonthLabel: A,
|
|
149
|
+
previousYearsLabel: j,
|
|
150
|
+
nextYearsLabel: M,
|
|
151
|
+
yearGridLabel: N,
|
|
152
|
+
today: F,
|
|
151
153
|
minDate: b,
|
|
152
154
|
maxDate: x,
|
|
153
|
-
disabledDates:
|
|
154
|
-
locale:
|
|
155
|
-
size:
|
|
155
|
+
disabledDates: te,
|
|
156
|
+
locale: E,
|
|
157
|
+
size: S
|
|
156
158
|
})
|
|
157
159
|
})]
|
|
158
160
|
}),
|
|
159
|
-
|
|
160
|
-
id:
|
|
161
|
+
Z && /* @__PURE__ */ d("span", {
|
|
162
|
+
id: Q,
|
|
161
163
|
className: "date-picker__message",
|
|
162
164
|
role: "alert",
|
|
163
|
-
children:
|
|
165
|
+
children: z("invalid", v)
|
|
164
166
|
})
|
|
165
167
|
]
|
|
166
168
|
});
|
|
@@ -7,7 +7,7 @@ function r({ className: r }) {
|
|
|
7
7
|
return /* @__PURE__ */ e(t.Backdrop, { className: n("dialog-overlay", r) });
|
|
8
8
|
}
|
|
9
9
|
function i({ layout: t, noTitle: r = !1, className: i, children: a }) {
|
|
10
|
-
return /* @__PURE__ */ e("
|
|
10
|
+
return /* @__PURE__ */ e("div", {
|
|
11
11
|
className: n("dialog-header", `dialog-header--${t}`, r && "dialog-header--no-title", i),
|
|
12
12
|
children: a
|
|
13
13
|
});
|
|
@@ -1,13 +1,7 @@
|
|
|
1
1
|
import { Fragment as e, jsx as t, jsxs as n } from "react/jsx-runtime";
|
|
2
2
|
import { Menu as r } from "@base-ui/react/menu";
|
|
3
3
|
//#region src/stories/molecules/_shared/dropdownItems.tsx
|
|
4
|
-
function i(
|
|
5
|
-
return /* @__PURE__ */ t("a", {
|
|
6
|
-
...n,
|
|
7
|
-
children: e
|
|
8
|
-
});
|
|
9
|
-
}
|
|
10
|
-
function a(r, i, a, o) {
|
|
4
|
+
function i(r, i, a, o) {
|
|
11
5
|
let s = a && o ? /* @__PURE__ */ n("span", {
|
|
12
6
|
className: `${o}__item-text`,
|
|
13
7
|
children: [/* @__PURE__ */ t("span", {
|
|
@@ -24,7 +18,7 @@ function a(r, i, a, o) {
|
|
|
24
18
|
children: i
|
|
25
19
|
}), s] }) : /* @__PURE__ */ t(e, { children: s });
|
|
26
20
|
}
|
|
27
|
-
function
|
|
21
|
+
function a(e) {
|
|
28
22
|
return e.reduce((e, t) => {
|
|
29
23
|
let n = t.type === "radio", r = e[e.length - 1];
|
|
30
24
|
return r && r.radio === n ? r.items.push(t) : e.push({
|
|
@@ -33,26 +27,26 @@ function o(e) {
|
|
|
33
27
|
}), e;
|
|
34
28
|
}, []);
|
|
35
29
|
}
|
|
36
|
-
function
|
|
37
|
-
let f = (e,
|
|
38
|
-
if (e.type === "separator") return /* @__PURE__ */ t(r.Separator, { className:
|
|
30
|
+
function o({ items: e, itemClass: n, separatorClass: o, renderLink: s, labelClass: c, blockClass: l, radioValue: u, onRadioValueChange: d }) {
|
|
31
|
+
let f = (e, a) => {
|
|
32
|
+
if (e.type === "separator") return /* @__PURE__ */ t(r.Separator, { className: o }, a);
|
|
39
33
|
if (e.type === "label") return c ? /* @__PURE__ */ t(r.Group, { children: /* @__PURE__ */ t(r.GroupLabel, {
|
|
40
34
|
className: c,
|
|
41
35
|
children: e.label
|
|
42
|
-
}) },
|
|
36
|
+
}) }, a) : null;
|
|
43
37
|
if (e.type === "radio") return /* @__PURE__ */ t(r.RadioItem, {
|
|
44
38
|
className: n(),
|
|
45
39
|
value: e.value,
|
|
46
40
|
disabled: e.disabled,
|
|
47
41
|
closeOnClick: e.closeOnSelect !== !1,
|
|
48
|
-
children:
|
|
49
|
-
},
|
|
50
|
-
let u =
|
|
42
|
+
children: i(e.label, e.icon, void 0, l)
|
|
43
|
+
}, a);
|
|
44
|
+
let u = i(e.label, e.icon, e.description, l);
|
|
51
45
|
return e.type === "link" ? e.disabled ? /* @__PURE__ */ t(r.Item, {
|
|
52
46
|
className: n(e.destructive),
|
|
53
47
|
disabled: !0,
|
|
54
48
|
children: u
|
|
55
|
-
},
|
|
49
|
+
}, a) : /* @__PURE__ */ t(r.Item, {
|
|
56
50
|
className: n(e.destructive),
|
|
57
51
|
render: (t) => s({
|
|
58
52
|
...t,
|
|
@@ -60,7 +54,7 @@ function s({ items: e, itemClass: n, separatorClass: i, renderLink: s, labelClas
|
|
|
60
54
|
className: t.className ?? n(e.destructive),
|
|
61
55
|
children: u
|
|
62
56
|
})
|
|
63
|
-
},
|
|
57
|
+
}, a) : /* @__PURE__ */ t(r.Item, {
|
|
64
58
|
className: n(e.destructive),
|
|
65
59
|
disabled: e.disabled,
|
|
66
60
|
closeOnClick: e.closeOnSelect !== !1,
|
|
@@ -72,11 +66,11 @@ function s({ items: e, itemClass: n, separatorClass: i, renderLink: s, labelClas
|
|
|
72
66
|
setTimeout(() => e.onClick(), 0);
|
|
73
67
|
},
|
|
74
68
|
children: u
|
|
75
|
-
},
|
|
69
|
+
}, a);
|
|
76
70
|
}, p = e;
|
|
77
71
|
if (!p.some((e) => e.type === "radio")) return p.map(f);
|
|
78
72
|
let m = 0;
|
|
79
|
-
return
|
|
73
|
+
return a(p).map((e, n) => {
|
|
80
74
|
let i = m;
|
|
81
75
|
m += e.items.length;
|
|
82
76
|
let a = e.items.map((e, t) => f(e, i + t));
|
|
@@ -88,4 +82,4 @@ function s({ items: e, itemClass: n, separatorClass: i, renderLink: s, labelClas
|
|
|
88
82
|
});
|
|
89
83
|
}
|
|
90
84
|
//#endregion
|
|
91
|
-
export {
|
|
85
|
+
export { o as t };
|