@mittwald/flow-react-components 1.3.8 → 1.3.10
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/assets/component-index.json +1 -1
- package/dist/assets/doc-properties.json +1 -1
- package/dist/css/all-layered.css +1 -1
- package/dist/css/all.css +1 -1
- package/dist/js/packages/components/src/components/Calendar/Calendar.module.mjs.map +1 -1
- package/package.json +9 -9
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Calendar.module.mjs","names":[],"sources":["../../../../../../../src/components/Calendar/Calendar.module.scss"],"sourcesContent":["@use \"@/styles/mixins/focus\";\n\n.calendar {\n width: fit-content;\n\n .calendarHeader {\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: var(--calendar--spacing);\n\n /* react-aria's Heading — CalendarHeader passes no className, so its\n default class is the handle. */\n :global(.react-aria-Heading) {\n font-size: var(--calendar--heading-font-size);\n }\n }\n\n .container {\n display: flex;\n flex-direction: row;\n gap: var(--popover--padding--m);\n\n .presetMenu {\n max-width: 200px;\n }\n }\n\n @media (max-width: 530px) {\n .container {\n flex-direction: column-reverse;\n }\n }\n\n :global(.react-aria-CalendarHeaderCell) {\n font-size: var(--calendar--cell-font-size);\n height: var(--calendar--cell-size);\n }\n\n :global(.react-aria-CalendarGrid) {\n border-spacing: var(--calendar--spacing);\n }\n\n :global(.react-aria-CalendarCell) {\n width: var(--calendar--cell-size);\n height: var(--calendar--cell-size);\n display: inline-flex;\n align-items: center;\n justify-content: center;\n cursor: default;\n border-radius: var(--calendar--cell-corner-radius);\n font-size: var(--calendar--cell-font-size);\n transition-property: background-color;\n transition-duration: var(--transition--duration--default);\n\n @include focus.focus;\n\n &[data-outside-month] {\n display: none;\n }\n\n &:hover {\n background: var(--calendar--cell-background-color--hover);\n }\n\n &[data-pressed] {\n background: var(--calendar--cell-background-color--pressed);\n }\n\n &[data-selected] {\n background: var(--calendar--cell-background-color--selected);\n color: var(--calendar--cell-content-color--selected);\n }\n\n &[data-disabled],\n &[data-unavailable=\"true\"] {\n background: var(--calendar--cell-background-color--disabled);\n color: var(--calendar--cell-content-color--disabled);\n }\n\n @include focus.focus;\n }\n\n &.range {\n :global(.react-aria-CalendarCell) {\n position: relative;\n isolation: isolate;\n transition-duration: 0s;\n\n &[data-selected] {\n &::before {\n content: \"\";\n background: var(--calendar--range-background-color);\n border-block: var(--calendar--range-border-width)\n var(--calendar--range-border-style)\n var(--calendar--range-border-color);\n width: calc(100% + 0.375rem);\n height: 100%;\n position: absolute;\n z-index: -1;\n }\n\n &::after {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n z-index: -1;\n border-radius: var(--calendar--cell-corner-radius);\n }\n\n &:hover {\n &::after {\n background: var(--calendar--cell-background-color--hover);\n }\n }\n\n &[data-pressed] {\n &::after {\n background: var(--calendar--cell-background-color--pressed);\n }\n }\n\n &[data-selection-start],\n &[data-selection-end] {\n &::after {\n background: var(--calendar--cell-background-color--selected);\n }\n }\n\n &[data-selection-start] {\n &::before {\n border-start-start-radius: var(--calendar--cell-corner-radius);\n border-end-start-radius: var(--calendar--cell-corner-radius);\n inset-inline-start: 0;\n }\n }\n\n &[data-selection-end] {\n &::before {\n border-start-end-radius: var(--calendar--cell-corner-radius);\n border-end-end-radius: var(--calendar--cell-corner-radius);\n inset-inline-end: 0;\n }\n }\n\n &:not([data-selection-start], [data-selection-end]) {\n color: var(--text--color--default);\n background: none;\n }\n\n &[data-selection-start][data-selection-end] {\n &::before {\n display: none;\n }\n }\n }\n }\n }\n}\n\n@media (max-width: 360px) {\n .calendar {\n --calendar--cell-size: 2.1rem;\n --calendar--cell-font-size: 0.8rem;\n }\n}\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"Calendar.module.mjs","names":[],"sources":["../../../../../../../src/components/Calendar/Calendar.module.scss"],"sourcesContent":["@use \"@/styles/mixins/focus\";\n\n.calendar {\n width: fit-content;\n\n .calendarHeader {\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: var(--calendar--spacing);\n\n /* react-aria's Heading — CalendarHeader passes no className, so its\n default class is the handle. */\n :global(.react-aria-Heading) {\n font-size: var(--calendar--heading-font-size);\n }\n }\n\n .container {\n display: flex;\n flex-direction: row;\n gap: var(--popover--padding--m);\n\n .presetMenu {\n max-width: 200px;\n\n /*\n * With an auto width, WebKit resolved the menu one item padding wider on\n * every layout. Each reposition of the popover then resized it again,\n * inside react-aria's resize observer on the popover: a\n * \"ResizeObserver loop\" error per step.\n */\n width: max-content;\n }\n }\n\n @media (max-width: 530px) {\n .container {\n flex-direction: column-reverse;\n\n .presetMenu {\n width: auto;\n }\n }\n }\n\n :global(.react-aria-CalendarHeaderCell) {\n font-size: var(--calendar--cell-font-size);\n height: var(--calendar--cell-size);\n }\n\n :global(.react-aria-CalendarGrid) {\n border-spacing: var(--calendar--spacing);\n }\n\n :global(.react-aria-CalendarCell) {\n width: var(--calendar--cell-size);\n height: var(--calendar--cell-size);\n display: inline-flex;\n align-items: center;\n justify-content: center;\n cursor: default;\n border-radius: var(--calendar--cell-corner-radius);\n font-size: var(--calendar--cell-font-size);\n transition-property: background-color;\n transition-duration: var(--transition--duration--default);\n\n @include focus.focus;\n\n &[data-outside-month] {\n display: none;\n }\n\n &:hover {\n background: var(--calendar--cell-background-color--hover);\n }\n\n &[data-pressed] {\n background: var(--calendar--cell-background-color--pressed);\n }\n\n &[data-selected] {\n background: var(--calendar--cell-background-color--selected);\n color: var(--calendar--cell-content-color--selected);\n }\n\n &[data-disabled],\n &[data-unavailable=\"true\"] {\n background: var(--calendar--cell-background-color--disabled);\n color: var(--calendar--cell-content-color--disabled);\n }\n\n @include focus.focus;\n }\n\n &.range {\n :global(.react-aria-CalendarCell) {\n position: relative;\n isolation: isolate;\n transition-duration: 0s;\n\n &[data-selected] {\n &::before {\n content: \"\";\n background: var(--calendar--range-background-color);\n border-block: var(--calendar--range-border-width)\n var(--calendar--range-border-style)\n var(--calendar--range-border-color);\n width: calc(100% + 0.375rem);\n height: 100%;\n position: absolute;\n z-index: -1;\n }\n\n &::after {\n content: \"\";\n width: 100%;\n height: 100%;\n position: absolute;\n z-index: -1;\n border-radius: var(--calendar--cell-corner-radius);\n }\n\n &:hover {\n &::after {\n background: var(--calendar--cell-background-color--hover);\n }\n }\n\n &[data-pressed] {\n &::after {\n background: var(--calendar--cell-background-color--pressed);\n }\n }\n\n &[data-selection-start],\n &[data-selection-end] {\n &::after {\n background: var(--calendar--cell-background-color--selected);\n }\n }\n\n &[data-selection-start] {\n &::before {\n border-start-start-radius: var(--calendar--cell-corner-radius);\n border-end-start-radius: var(--calendar--cell-corner-radius);\n inset-inline-start: 0;\n }\n }\n\n &[data-selection-end] {\n &::before {\n border-start-end-radius: var(--calendar--cell-corner-radius);\n border-end-end-radius: var(--calendar--cell-corner-radius);\n inset-inline-end: 0;\n }\n }\n\n &:not([data-selection-start], [data-selection-end]) {\n color: var(--text--color--default);\n background: none;\n }\n\n &[data-selection-start][data-selection-end] {\n &::before {\n display: none;\n }\n }\n }\n }\n }\n}\n\n@media (max-width: 360px) {\n .calendar {\n --calendar--cell-size: 2.1rem;\n --calendar--cell-font-size: 0.8rem;\n }\n}\n"],"mappings":""}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mittwald/flow-react-components",
|
|
3
|
-
"version": "1.3.
|
|
3
|
+
"version": "1.3.10",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "A React implementation of Flow, mittwald’s design system",
|
|
6
6
|
"homepage": "https://flow.mittwald.de",
|
|
@@ -83,9 +83,9 @@
|
|
|
83
83
|
"@internationalized/string-compiler": "^3.4.1",
|
|
84
84
|
"@lezer/common": "^1.5.2",
|
|
85
85
|
"@lezer/highlight": "^1.2.3",
|
|
86
|
-
"@mittwald/flow-icons": "^1.3.
|
|
86
|
+
"@mittwald/flow-icons": "^1.3.10",
|
|
87
87
|
"@mittwald/password-tools-js": "^3.0.0",
|
|
88
|
-
"@mittwald/react-tunnel": "^1.3.
|
|
88
|
+
"@mittwald/react-tunnel": "^1.3.10",
|
|
89
89
|
"@mittwald/react-use-promise": "^4.2.2",
|
|
90
90
|
"@react-aria/form": "^3.2.1",
|
|
91
91
|
"@react-aria/i18n": "^3.13.1",
|
|
@@ -138,12 +138,12 @@
|
|
|
138
138
|
"@internationalized/date": "^3.12.3",
|
|
139
139
|
"@lezer/generator": "^1.8.0",
|
|
140
140
|
"@lezer/lr": "^1.4.10",
|
|
141
|
-
"@mittwald/flow-core": "1.3.
|
|
142
|
-
"@mittwald/flow-design-tokens": "1.3.
|
|
143
|
-
"@mittwald/flow-icons-base": "1.3.
|
|
141
|
+
"@mittwald/flow-core": "1.3.10",
|
|
142
|
+
"@mittwald/flow-design-tokens": "1.3.10",
|
|
143
|
+
"@mittwald/flow-icons-base": "1.3.10",
|
|
144
144
|
"@mittwald/react-use-promise": "^4.2.2",
|
|
145
145
|
"@mittwald/remote-dom-react": "1.2.2-mittwald.10",
|
|
146
|
-
"@mittwald/typescript-config": "1.3.
|
|
146
|
+
"@mittwald/typescript-config": "1.3.10",
|
|
147
147
|
"@nx/storybook": "^22.7.6",
|
|
148
148
|
"@storybook/addon-a11y": "^10.5.10",
|
|
149
149
|
"@storybook/addon-actions": "^9.0.8",
|
|
@@ -195,7 +195,7 @@
|
|
|
195
195
|
},
|
|
196
196
|
"peerDependencies": {
|
|
197
197
|
"@internationalized/date": "^3.12.2",
|
|
198
|
-
"@mittwald/flow-icons-pro": "1.3.
|
|
198
|
+
"@mittwald/flow-icons-pro": "1.3.10",
|
|
199
199
|
"@mittwald/react-use-promise": "^4.2.2",
|
|
200
200
|
"next": "^16.2.3",
|
|
201
201
|
"react": "^19.2.0",
|
|
@@ -219,5 +219,5 @@
|
|
|
219
219
|
"browserslist": [
|
|
220
220
|
"baseline widely available"
|
|
221
221
|
],
|
|
222
|
-
"gitHead": "
|
|
222
|
+
"gitHead": "20897dad6d35b1471cb04cce84ad37f929b88b37"
|
|
223
223
|
}
|