@moneyforward/mfui-components 4.9.0 → 4.10.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/dist/src/Badge/Badge.js +2 -1
- package/dist/src/DataTable/DataTable.types.d.ts +1 -0
- package/dist/src/DataTable/DataTableBody/DataTableBody.js +5 -2
- package/dist/src/DataTable/DataTableFilterButton/DataTableFilterButton.js +3 -9
- package/dist/src/DataTable/DataTableHeaderCell/DataTableHeaderCell.js +7 -3
- package/dist/src/DataTable/DataTableHeaderCell/DataTableHeaderCell.types.d.ts +18 -6
- package/dist/src/DataTable/hooks/useVirtualizedColumns.js +2 -1
- package/dist/src/DateTimeSelection/FilterDatePicker/CalendarPopover/CalendarPopover.js +1 -1
- package/dist/src/DateTimeSelection/FilterDatePicker/FilterDatePicker.js +2 -4
- package/dist/src/DateTimeSelection/FilterDateRangePicker/DateRangePickerContent/DateRangePickerContent.js +1 -1
- package/dist/src/DateTimeSelection/FilterDateRangePicker/FilterDateRangePicker.js +2 -4
- package/dist/src/DateTimeSelection/FilterMonthPicker/FilterMonthPicker.js +2 -4
- package/dist/src/DateTimeSelection/FilterMonthPicker/MonthPickerPopover/MonthPickerPopover.js +1 -1
- package/dist/src/DateTimeSelection/FilterMonthRangePicker/FilterMonthRangePicker.js +2 -3
- package/dist/src/DateTimeSelection/FilterMonthRangePicker/MonthRangePickerPopover/MonthRangePickerPopover.js +1 -1
- package/dist/src/DateTimeSelection/shared/BaseRangePicker/BaseRangePicker.d.ts +1 -1
- package/dist/src/DateTimeSelection/shared/BaseRangePicker/BaseRangePicker.js +2 -2
- package/dist/src/DateTimeSelection/shared/BaseRangePicker/BaseRangePicker.types.d.ts +34 -0
- package/dist/src/DateTimeSelection/shared/BaseRangePicker/BaseRangePickerProvider/BaseRangePickerProvider.js +18 -17
- package/dist/src/DateTimeSelection/shared/BaseRangePicker/BaseRangePickerProvider/BaseRangePickerProvider.types.d.ts +8 -0
- package/dist/src/DateTimeSelection/shared/BaseRangePicker/BaseRangePickerTrigger/hooks/useDateRangeTriggerValueController.d.ts +2 -1
- package/dist/src/DateTimeSelection/shared/BaseRangePicker/BaseRangePickerTrigger/hooks/useDateRangeTriggerValueController.js +2 -1
- package/dist/src/DateTimeSelection/shared/DayCell/DayCell.js +2 -1
- package/dist/src/DateTimeSelection/shared/accessibility/constants.d.ts +1 -1
- package/dist/src/DateTimeSelection/shared/accessibility/constants.js +0 -4
- package/dist/src/DateTimeSelection/shared/accessibility/generateDateLabel.d.ts +4 -0
- package/dist/src/DateTimeSelection/shared/accessibility/generateDateLabel.js +4 -7
- package/dist/src/Dialog/Dialog.types.d.ts +17 -0
- package/dist/src/FileDropZone/FileDropZone.js +23 -6
- package/dist/src/Popover/Popover.d.ts +1 -1
- package/dist/src/Popover/Popover.js +118 -14
- package/dist/src/Popover/Popover.types.d.ts +16 -3
- package/dist/src/SectionMessage/SectionMessage.d.ts +6 -0
- package/dist/src/SectionMessage/SectionMessage.js +16 -1
- package/dist/src/SectionMessage/SectionMessage.types.d.ts +4 -0
- package/dist/src/Skeleton/Skeleton.d.ts +5 -2
- package/dist/src/Skeleton/Skeleton.js +5 -2
- package/dist/src/Skeleton/Skeleton.types.d.ts +9 -1
- package/dist/src/VisuallyHidden/VisuallyHidden.d.ts +17 -0
- package/dist/src/VisuallyHidden/VisuallyHidden.js +21 -0
- package/dist/src/VisuallyHidden/VisuallyHidden.types.d.ts +19 -0
- package/dist/src/VisuallyHidden/VisuallyHidden.types.js +1 -0
- package/dist/src/VisuallyHidden/index.d.ts +2 -0
- package/dist/src/VisuallyHidden/index.js +1 -0
- package/dist/src/index.d.ts +1 -0
- package/dist/src/index.js +1 -0
- package/dist/src/utilities/dom/usePopoverMenuPlacement.js +0 -5
- package/dist/src/utilities/env/isProduction.d.ts +14 -0
- package/dist/src/utilities/env/isProduction.js +22 -0
- package/dist/src/utilities/react/isComponentOrWrapped.js +2 -1
- package/dist/styled-system/recipes/badge-slot-recipe.d.ts +1 -1
- package/dist/styled-system/recipes/badge-slot-recipe.js +0 -4
- package/dist/styled-system/recipes/day-cell-slot-recipe.d.ts +1 -1
- package/dist/styled-system/recipes/day-cell-slot-recipe.js +0 -4
- package/dist/styled-system/recipes/index.d.ts +2 -1
- package/dist/styled-system/recipes/index.js +1 -0
- package/dist/styled-system/recipes/popover-slot-recipe.d.ts +1 -1
- package/dist/styled-system/recipes/popover-slot-recipe.js +4 -0
- package/dist/styled-system/recipes/visually-hidden-slot-recipe.d.ts +33 -0
- package/dist/styled-system/recipes/visually-hidden-slot-recipe.js +28 -0
- package/dist/styles.css +27 -38
- package/dist/tsconfig.build.tsbuildinfo +1 -1
- package/package.json +2 -2
|
@@ -10,7 +10,7 @@ type DayCellSlotRecipeVariantMap = {
|
|
|
10
10
|
[key in keyof DayCellSlotRecipeVariant]: Array<DayCellSlotRecipeVariant[key]>
|
|
11
11
|
}
|
|
12
12
|
|
|
13
|
-
type DayCellSlotRecipeSlot = "root" | "label"
|
|
13
|
+
type DayCellSlotRecipeSlot = "root" | "label"
|
|
14
14
|
|
|
15
15
|
export type DayCellSlotRecipeVariantProps = {
|
|
16
16
|
[key in keyof DayCellSlotRecipeVariant]?: ConditionalValue<DayCellSlotRecipeVariant[key]> | undefined
|
|
@@ -10,10 +10,6 @@ const dayCellSlotRecipeSlotNames = [
|
|
|
10
10
|
[
|
|
11
11
|
"label",
|
|
12
12
|
"DayCell__label"
|
|
13
|
-
],
|
|
14
|
-
[
|
|
15
|
-
"srOnlyLabel",
|
|
16
|
-
"DayCell__srOnlyLabel"
|
|
17
13
|
]
|
|
18
14
|
];
|
|
19
15
|
const dayCellSlotRecipeSlotFns = /* @__PURE__ */ dayCellSlotRecipeSlotNames.map(([slotName, slotKey]) => [slotName, createRecipe(slotKey, dayCellSlotRecipeDefaultVariants, getSlotCompoundVariant(dayCellSlotRecipeCompoundVariants, slotName))]);
|
|
@@ -109,4 +109,5 @@ export * from './navigation-list-slot-recipe';
|
|
|
109
109
|
export * from './navigation-list-item-slot-recipe';
|
|
110
110
|
export * from './form-footer-slot-recipe';
|
|
111
111
|
export * from './sidebar-slot-recipe';
|
|
112
|
-
export * from './sidebar-menu-heading-slot-recipe';
|
|
112
|
+
export * from './sidebar-menu-heading-slot-recipe';
|
|
113
|
+
export * from './visually-hidden-slot-recipe';
|
|
@@ -10,7 +10,7 @@ type PopoverSlotRecipeVariantMap = {
|
|
|
10
10
|
[key in keyof PopoverSlotRecipeVariant]: Array<PopoverSlotRecipeVariant[key]>
|
|
11
11
|
}
|
|
12
12
|
|
|
13
|
-
type PopoverSlotRecipeSlot = "root"
|
|
13
|
+
type PopoverSlotRecipeSlot = "root" | "contentWrapper"
|
|
14
14
|
|
|
15
15
|
export type PopoverSlotRecipeVariantProps = {
|
|
16
16
|
[key in keyof PopoverSlotRecipeVariant]?: ConditionalValue<PopoverSlotRecipeVariant[key]> | undefined
|
|
@@ -6,6 +6,10 @@ const popoverSlotRecipeSlotNames = [
|
|
|
6
6
|
[
|
|
7
7
|
"root",
|
|
8
8
|
"Popover__root"
|
|
9
|
+
],
|
|
10
|
+
[
|
|
11
|
+
"contentWrapper",
|
|
12
|
+
"Popover__contentWrapper"
|
|
9
13
|
]
|
|
10
14
|
];
|
|
11
15
|
const popoverSlotRecipeSlotFns = /* @__PURE__ */ popoverSlotRecipeSlotNames.map(([slotName, slotKey]) => [slotName, createRecipe(slotKey, popoverSlotRecipeDefaultVariants, getSlotCompoundVariant(popoverSlotRecipeCompoundVariants, slotName))]);
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
/* eslint-disable */
|
|
2
|
+
import type { ConditionalValue } from '../types/index';
|
|
3
|
+
import type { DistributiveOmit, Pretty } from '../types/system-types';
|
|
4
|
+
|
|
5
|
+
interface VisuallyHiddenSlotRecipeVariant {
|
|
6
|
+
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
type VisuallyHiddenSlotRecipeVariantMap = {
|
|
10
|
+
[key in keyof VisuallyHiddenSlotRecipeVariant]: Array<VisuallyHiddenSlotRecipeVariant[key]>
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
type VisuallyHiddenSlotRecipeSlot = "root"
|
|
14
|
+
|
|
15
|
+
export type VisuallyHiddenSlotRecipeVariantProps = {
|
|
16
|
+
[key in keyof VisuallyHiddenSlotRecipeVariant]?: ConditionalValue<VisuallyHiddenSlotRecipeVariant[key]> | undefined
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
export interface VisuallyHiddenSlotRecipeRecipe {
|
|
20
|
+
__slot: VisuallyHiddenSlotRecipeSlot
|
|
21
|
+
__type: VisuallyHiddenSlotRecipeVariantProps
|
|
22
|
+
(props?: VisuallyHiddenSlotRecipeVariantProps): Pretty<Record<VisuallyHiddenSlotRecipeSlot, string>>
|
|
23
|
+
raw: (props?: VisuallyHiddenSlotRecipeVariantProps) => VisuallyHiddenSlotRecipeVariantProps
|
|
24
|
+
variantMap: VisuallyHiddenSlotRecipeVariantMap
|
|
25
|
+
variantKeys: Array<keyof VisuallyHiddenSlotRecipeVariant>
|
|
26
|
+
splitVariantProps<Props extends VisuallyHiddenSlotRecipeVariantProps>(props: Props): [VisuallyHiddenSlotRecipeVariantProps, Pretty<DistributiveOmit<Props, keyof VisuallyHiddenSlotRecipeVariantProps>>]
|
|
27
|
+
getVariantProps: (props?: VisuallyHiddenSlotRecipeVariantProps) => VisuallyHiddenSlotRecipeVariantProps
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
/**
|
|
31
|
+
* Slot class created for the MFUI VisuallyHidden component
|
|
32
|
+
*/
|
|
33
|
+
export declare const visuallyHiddenSlotRecipe: VisuallyHiddenSlotRecipeRecipe
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { compact, getSlotCompoundVariant, memo, splitProps } from '../helpers.js';
|
|
2
|
+
import { createRecipe } from './create-recipe.js';
|
|
3
|
+
const visuallyHiddenSlotRecipeDefaultVariants = {};
|
|
4
|
+
const visuallyHiddenSlotRecipeCompoundVariants = [];
|
|
5
|
+
const visuallyHiddenSlotRecipeSlotNames = [
|
|
6
|
+
[
|
|
7
|
+
"root",
|
|
8
|
+
"VisuallyHidden__root"
|
|
9
|
+
]
|
|
10
|
+
];
|
|
11
|
+
const visuallyHiddenSlotRecipeSlotFns = /* @__PURE__ */ visuallyHiddenSlotRecipeSlotNames.map(([slotName, slotKey]) => [slotName, createRecipe(slotKey, visuallyHiddenSlotRecipeDefaultVariants, getSlotCompoundVariant(visuallyHiddenSlotRecipeCompoundVariants, slotName))]);
|
|
12
|
+
const visuallyHiddenSlotRecipeFn = memo((props = {}) => {
|
|
13
|
+
return Object.fromEntries(visuallyHiddenSlotRecipeSlotFns.map(([slotName, slotFn]) => [slotName, slotFn.recipeFn(props)]));
|
|
14
|
+
});
|
|
15
|
+
const visuallyHiddenSlotRecipeVariantKeys = [];
|
|
16
|
+
const getVariantProps = (variants) => ({ ...visuallyHiddenSlotRecipeDefaultVariants, ...compact(variants) });
|
|
17
|
+
export const visuallyHiddenSlotRecipe = /* @__PURE__ */ Object.assign(visuallyHiddenSlotRecipeFn, {
|
|
18
|
+
__recipe__: false,
|
|
19
|
+
__name__: 'visuallyHiddenSlotRecipe',
|
|
20
|
+
raw: (props) => props,
|
|
21
|
+
classNameMap: {},
|
|
22
|
+
variantKeys: visuallyHiddenSlotRecipeVariantKeys,
|
|
23
|
+
variantMap: {},
|
|
24
|
+
splitVariantProps(props) {
|
|
25
|
+
return splitProps(props, visuallyHiddenSlotRecipeVariantKeys);
|
|
26
|
+
},
|
|
27
|
+
getVariantProps
|
|
28
|
+
});
|
package/dist/styles.css
CHANGED
|
@@ -497,10 +497,6 @@
|
|
|
497
497
|
--mfui-line-heights-mfui\.typography\.line-height\.condensed-input\.narrow: 21px;
|
|
498
498
|
}
|
|
499
499
|
|
|
500
|
-
.mfui-gXBBVr {
|
|
501
|
-
overflow-y: auto;
|
|
502
|
-
}
|
|
503
|
-
|
|
504
500
|
.mfui-iHuYNm {
|
|
505
501
|
padding-block: var(--mfui-spacing-mfui\.size\.padding\.container\.vertical\.comfort);
|
|
506
502
|
flex-direction: column;
|
|
@@ -809,10 +805,6 @@
|
|
|
809
805
|
row-gap: var(--mfui-spacing-mfui\.size\.spacing\.container\.vertical\.comfort);
|
|
810
806
|
}
|
|
811
807
|
|
|
812
|
-
.mfui-hkWvKm {
|
|
813
|
-
overflow-y: auto;
|
|
814
|
-
}
|
|
815
|
-
|
|
816
808
|
.mfui-hxpVHi {
|
|
817
809
|
padding-block: var(--mfui-spacing-mfui\.size\.padding\.container\.vertical\.comfort);
|
|
818
810
|
padding-inline: 0px;
|
|
@@ -1327,18 +1319,6 @@
|
|
|
1327
1319
|
height: var(--mfui-sizes-mfui\.size\.dimension\.badge\.diameter\.comfort);
|
|
1328
1320
|
}
|
|
1329
1321
|
|
|
1330
|
-
.mfui-fCRxLF {
|
|
1331
|
-
position: absolute;
|
|
1332
|
-
width: 1px;
|
|
1333
|
-
height: 1px;
|
|
1334
|
-
padding: 0;
|
|
1335
|
-
margin: -1px;
|
|
1336
|
-
overflow: hidden;
|
|
1337
|
-
clip: rect(0, 0, 0, 0);
|
|
1338
|
-
white-space: nowrap;
|
|
1339
|
-
border-width: 0;
|
|
1340
|
-
}
|
|
1341
|
-
|
|
1342
1322
|
.mfui-jntiOR {
|
|
1343
1323
|
border-color: var(--mfui-colors-mfui\.color\.neutral\.border\.none);
|
|
1344
1324
|
border-style: solid;
|
|
@@ -2619,18 +2599,6 @@
|
|
|
2619
2599
|
color: var(--mfui-colors-mfui\.color\.base\.content\.none);
|
|
2620
2600
|
}
|
|
2621
2601
|
|
|
2622
|
-
.mfui-iYrkDO {
|
|
2623
|
-
position: absolute;
|
|
2624
|
-
width: 1px;
|
|
2625
|
-
height: 1px;
|
|
2626
|
-
padding: 0;
|
|
2627
|
-
margin: -1px;
|
|
2628
|
-
overflow: hidden;
|
|
2629
|
-
clip: rect(0, 0, 0, 0);
|
|
2630
|
-
white-space: nowrap;
|
|
2631
|
-
border-width: 0;
|
|
2632
|
-
}
|
|
2633
|
-
|
|
2634
2602
|
.mfui-fKMSWf {
|
|
2635
2603
|
gap: 0;
|
|
2636
2604
|
display: grid;
|
|
@@ -2702,7 +2670,7 @@
|
|
|
2702
2670
|
white-space: nowrap;
|
|
2703
2671
|
}
|
|
2704
2672
|
|
|
2705
|
-
.mfui-
|
|
2673
|
+
.mfui-Popover__contentWrapper > .mfui-fhtZXM {
|
|
2706
2674
|
overflow-x: hidden;
|
|
2707
2675
|
overflow-y: hidden;
|
|
2708
2676
|
}
|
|
@@ -3373,7 +3341,7 @@
|
|
|
3373
3341
|
cursor: pointer;
|
|
3374
3342
|
text-align: left;
|
|
3375
3343
|
display: flex;
|
|
3376
|
-
align-items:
|
|
3344
|
+
align-items: flex-start;
|
|
3377
3345
|
color: var(--mfui-colors-mfui\.color\.base\.content\.none);
|
|
3378
3346
|
width: 100%;
|
|
3379
3347
|
}
|
|
@@ -3488,6 +3456,7 @@
|
|
|
3488
3456
|
display: grid;
|
|
3489
3457
|
font-size: var(--mfui-font-sizes-mfui\.typography\.font-size\.icon);
|
|
3490
3458
|
min-width: var(--mfui-sizes-mfui\.size\.dimension\.icon\.square\.comfort);
|
|
3459
|
+
min-height: 24px;
|
|
3491
3460
|
margin-left: var(--mfui-spacing-mfui\.size\.spacing\.inline\.horizontal\.comfort);
|
|
3492
3461
|
}
|
|
3493
3462
|
|
|
@@ -3502,7 +3471,7 @@
|
|
|
3502
3471
|
border-radius: var(--mfui-radii-mfui\.size\.radius\.control-component\.comfort);
|
|
3503
3472
|
cursor: pointer;
|
|
3504
3473
|
display: flex;
|
|
3505
|
-
align-items:
|
|
3474
|
+
align-items: flex-start;
|
|
3506
3475
|
color: var(--mfui-colors-mfui\.color\.base\.content\.none);
|
|
3507
3476
|
}
|
|
3508
3477
|
|
|
@@ -4384,10 +4353,18 @@
|
|
|
4384
4353
|
pointer-events: auto;
|
|
4385
4354
|
display: flex;
|
|
4386
4355
|
flex-direction: column;
|
|
4356
|
+
}
|
|
4357
|
+
|
|
4358
|
+
.mfui-jxYKcw {
|
|
4359
|
+
flex: 1 1 auto;
|
|
4360
|
+
border-radius: inherit;
|
|
4361
|
+
display: flex;
|
|
4362
|
+
flex-direction: column;
|
|
4363
|
+
min-height: 0px;
|
|
4387
4364
|
overflow-y: hidden;
|
|
4388
4365
|
}
|
|
4389
4366
|
|
|
4390
|
-
.mfui-
|
|
4367
|
+
.mfui-jxYKcw > * {
|
|
4391
4368
|
flex: 1 1 auto;
|
|
4392
4369
|
overflow: auto;
|
|
4393
4370
|
min-height: 0px;
|
|
@@ -5073,6 +5050,7 @@
|
|
|
5073
5050
|
border-style: dashed;
|
|
5074
5051
|
border-width: var(--mfui-border-widths-mfui\.size\.border\.indicator\.width\.comfort);
|
|
5075
5052
|
border-radius: var(--mfui-radii-mfui\.size\.radius\.control-component\.comfort);
|
|
5053
|
+
cursor: not-allowed;
|
|
5076
5054
|
background-color: var(--mfui-colors-mfui\.color\.disabled\.background);
|
|
5077
5055
|
}
|
|
5078
5056
|
|
|
@@ -5092,6 +5070,7 @@
|
|
|
5092
5070
|
background-color: var(--mfui-colors-mfui\.color\.neutral\.thin-background\.none);
|
|
5093
5071
|
font-family: var(--mfui-fonts-mfui\.typography\.font-family\.label);
|
|
5094
5072
|
font-size: var(--mfui-font-sizes-mfui\.typography\.font-size\.control-label);
|
|
5073
|
+
cursor: pointer;
|
|
5095
5074
|
height: 100%;
|
|
5096
5075
|
}
|
|
5097
5076
|
|
|
@@ -5133,7 +5112,6 @@
|
|
|
5133
5112
|
display: flex;
|
|
5134
5113
|
align-items: center;
|
|
5135
5114
|
color: var(--mfui-colors-mfui\.color\.base\.content\.none);
|
|
5136
|
-
cursor: default;
|
|
5137
5115
|
}
|
|
5138
5116
|
|
|
5139
5117
|
.mfui-bODIPe {
|
|
@@ -6758,7 +6736,7 @@ li:last-child > .mfui-cXGJls {
|
|
|
6758
6736
|
height: 18px;
|
|
6759
6737
|
}
|
|
6760
6738
|
|
|
6761
|
-
.mfui-czdCzS {
|
|
6739
|
+
.mfui-czdCzS,.mfui-ewjNpm {
|
|
6762
6740
|
position: absolute;
|
|
6763
6741
|
width: 1px;
|
|
6764
6742
|
height: 1px;
|
|
@@ -8294,6 +8272,7 @@ li:last-child > .mfui-cXGJls {
|
|
|
8294
8272
|
display: grid;
|
|
8295
8273
|
grid-template-columns: 1fr auto;
|
|
8296
8274
|
align-content: start;
|
|
8275
|
+
align-items: center;
|
|
8297
8276
|
}
|
|
8298
8277
|
|
|
8299
8278
|
.mfui-eLqgVJ[data-mfui-nest-level="1"] {
|
|
@@ -8940,6 +8919,16 @@ li:last-child > .mfui-cXGJls {
|
|
|
8940
8919
|
color: var(--mfui-colors-mfui\.color\.neutral\.content\.none);
|
|
8941
8920
|
}
|
|
8942
8921
|
|
|
8922
|
+
.mfui-bjPlYK:is(:hover, [data-hover]) {
|
|
8923
|
+
border-color: var(--mfui-colors-mfui\.color\.neutral\.border\.hovered);
|
|
8924
|
+
background-color: var(--mfui-colors-mfui\.color\.neutral\.thin-background\.hovered);
|
|
8925
|
+
}
|
|
8926
|
+
|
|
8927
|
+
.mfui-bjPlYK:is(:active, [data-active]) {
|
|
8928
|
+
border-color: var(--mfui-colors-mfui\.color\.neutral\.border\.pressed);
|
|
8929
|
+
background-color: var(--mfui-colors-mfui\.color\.neutral\.thin-background\.pressed);
|
|
8930
|
+
}
|
|
8931
|
+
|
|
8943
8932
|
.mfui-hhZyjV {
|
|
8944
8933
|
color: var(--mfui-colors-mfui\.color\.base\.content\.none);
|
|
8945
8934
|
}
|