@mittwald/flow-react-components 1.6.0-next.10 → 1.6.0-next.12
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/assets/component-index.json +1 -1
- package/dist/assets/doc-properties.json +1 -1
- package/dist/css/all-layered.css +1 -1
- package/dist/js/packages/components/src/components/CountryOptions/CountryOptions.mjs +5 -1
- package/dist/js/packages/components/src/components/CountryOptions/CountryOptions.mjs.map +1 -1
- package/dist/js/packages/components/src/components/Icon/Icon.module.mjs.map +1 -1
- package/package.json +10 -10
|
@@ -24,7 +24,11 @@ var CountryOptions = (props) => {
|
|
|
24
24
|
textValue: country.name,
|
|
25
25
|
children: country.name
|
|
26
26
|
}, country.countryNameEn));
|
|
27
|
-
}, [
|
|
27
|
+
}, [
|
|
28
|
+
stringFormatter,
|
|
29
|
+
filterBy,
|
|
30
|
+
sortBy
|
|
31
|
+
]);
|
|
28
32
|
};
|
|
29
33
|
//#endregion
|
|
30
34
|
export { CountryOptions, CountryOptions as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CountryOptions.mjs","names":["locales"],"sources":["../../../../../../../src/components/CountryOptions/CountryOptions.tsx"],"sourcesContent":["import type { FC, PropsWithChildren } from \"react\";\nimport { useMemo } from \"react\";\nimport type { ListBoxProps } from \"react-aria-components\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport locales from \"./locales/*.locale.json\";\nimport { all, type CountryData } from \"country-codes-list\";\nimport OptionView from \"@/views/OptionView\";\nimport { uniqueBy } from \"remeda\";\n\nexport type Country = CountryData & {\n name: string;\n code: string;\n};\n\nexport type CountryFilterFn = (country: Country) => boolean;\nexport type CountrySortFn = (left: Country, right: Country) => number;\n\nexport interface CountryOptionsProps<T = object>\n extends\n PropsWithChildren<Omit<ListBoxProps<T>, \"children\">>,\n FlowComponentProps {\n filterBy?: CountryFilterFn;\n sortBy?: CountrySortFn;\n}\n\nconst defaultSortBy: CountrySortFn = (left, right) =>\n left.name.localeCompare(right.name);\nconst defaultFilterBy: CountryFilterFn = () => true;\n\n// see https://github.com/Synergy-Shock/country-codes-list/issues/37\nconst uniqueCountries = uniqueBy(all(), (c) => c.countryCode);\n\nexport const CountryOptions: FC<CountryOptionsProps> = (props) => {\n const { filterBy = defaultFilterBy, sortBy = defaultSortBy } = props;\n const stringFormatter = useLocalizedStringFormatter(\n locales,\n \"CountryOptions\",\n );\n\n return useMemo(() => {\n return uniqueCountries\n .map((countryData) => ({\n ...countryData,\n code: countryData.countryCode,\n name: stringFormatter.format(`countryCode.${countryData.countryCode}`),\n }))\n .filter(filterBy)\n .sort(sortBy)\n .map((country) => (\n <OptionView\n key={country.countryNameEn}\n value={country.countryCode}\n textValue={country.name}\n >\n {country.name}\n </OptionView>\n ));\n }, [stringFormatter]);\n};\n\nexport default CountryOptions;\n"],"mappings":";;;;;;;;;;AA0BA,IAAM,iBAAgC,MAAM,UAC1C,KAAK,KAAK,cAAc,MAAM,IAAI;AACpC,IAAM,wBAAyC;AAG/C,IAAM,kBAAkB,SAAS,IAAI,IAAI,MAAM,EAAE,WAAW;AAE5D,IAAa,kBAA2C,UAAU;CAChE,MAAM,EAAE,WAAW,iBAAiB,SAAS,kBAAkB;CAC/D,MAAM,kBAAkB,4BACtBA,kBACA,gBACF;CAEA,OAAO,cAAc;EACnB,OAAO,gBACJ,KAAK,iBAAiB;GACrB,GAAG;GACH,MAAM,YAAY;GAClB,MAAM,gBAAgB,OAAO,eAAe,YAAY,aAAa;EACvE,EAAE,CAAC,CACF,OAAO,QAAQ,CAAC,CAChB,KAAK,MAAM,CAAC,CACZ,KAAK,YACJ,oBAAC,YAAD;GAEE,OAAO,QAAQ;GACf,WAAW,QAAQ;GAElB,UAAA,QAAQ;EACC,GALL,QAAQ,aAKH,CACb;CACL,GAAG,CAAC
|
|
1
|
+
{"version":3,"file":"CountryOptions.mjs","names":["locales"],"sources":["../../../../../../../src/components/CountryOptions/CountryOptions.tsx"],"sourcesContent":["import type { FC, PropsWithChildren } from \"react\";\nimport { useMemo } from \"react\";\nimport type { ListBoxProps } from \"react-aria-components\";\nimport { useLocalizedStringFormatter } from \"@/components/TranslationProvider/useLocalizedStringFormatter\";\nimport type { FlowComponentProps } from \"@/lib/componentFactory/flowComponent\";\nimport locales from \"./locales/*.locale.json\";\nimport { all, type CountryData } from \"country-codes-list\";\nimport OptionView from \"@/views/OptionView\";\nimport { uniqueBy } from \"remeda\";\n\nexport type Country = CountryData & {\n name: string;\n code: string;\n};\n\nexport type CountryFilterFn = (country: Country) => boolean;\nexport type CountrySortFn = (left: Country, right: Country) => number;\n\nexport interface CountryOptionsProps<T = object>\n extends\n PropsWithChildren<Omit<ListBoxProps<T>, \"children\">>,\n FlowComponentProps {\n filterBy?: CountryFilterFn;\n sortBy?: CountrySortFn;\n}\n\nconst defaultSortBy: CountrySortFn = (left, right) =>\n left.name.localeCompare(right.name);\nconst defaultFilterBy: CountryFilterFn = () => true;\n\n// see https://github.com/Synergy-Shock/country-codes-list/issues/37\nconst uniqueCountries = uniqueBy(all(), (c) => c.countryCode);\n\nexport const CountryOptions: FC<CountryOptionsProps> = (props) => {\n const { filterBy = defaultFilterBy, sortBy = defaultSortBy } = props;\n const stringFormatter = useLocalizedStringFormatter(\n locales,\n \"CountryOptions\",\n );\n\n return useMemo(() => {\n return uniqueCountries\n .map((countryData) => ({\n ...countryData,\n code: countryData.countryCode,\n name: stringFormatter.format(`countryCode.${countryData.countryCode}`),\n }))\n .filter(filterBy)\n .sort(sortBy)\n .map((country) => (\n <OptionView\n key={country.countryNameEn}\n value={country.countryCode}\n textValue={country.name}\n >\n {country.name}\n </OptionView>\n ));\n }, [stringFormatter, filterBy, sortBy]);\n};\n\nexport default CountryOptions;\n"],"mappings":";;;;;;;;;;AA0BA,IAAM,iBAAgC,MAAM,UAC1C,KAAK,KAAK,cAAc,MAAM,IAAI;AACpC,IAAM,wBAAyC;AAG/C,IAAM,kBAAkB,SAAS,IAAI,IAAI,MAAM,EAAE,WAAW;AAE5D,IAAa,kBAA2C,UAAU;CAChE,MAAM,EAAE,WAAW,iBAAiB,SAAS,kBAAkB;CAC/D,MAAM,kBAAkB,4BACtBA,kBACA,gBACF;CAEA,OAAO,cAAc;EACnB,OAAO,gBACJ,KAAK,iBAAiB;GACrB,GAAG;GACH,MAAM,YAAY;GAClB,MAAM,gBAAgB,OAAO,eAAe,YAAY,aAAa;EACvE,EAAE,CAAC,CACF,OAAO,QAAQ,CAAC,CAChB,KAAK,MAAM,CAAC,CACZ,KAAK,YACJ,oBAAC,YAAD;GAEE,OAAO,QAAQ;GACf,WAAW,QAAQ;GAElB,UAAA,QAAQ;EACC,GALL,QAAQ,aAKH,CACb;CACL,GAAG;EAAC;EAAiB;EAAU;CAAM,CAAC;AACxC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Icon.module.mjs","names":[],"sources":["../../../../../../../src/components/Icon/Icon.module.scss"],"sourcesContent":["@use \"@/styles/mixins/skeleton\";\n\n.icon {\n flex-shrink: 0;\n max-width: none;\n display: inline-block;\n\n @extend .size-m;\n\n /* Sizes */\n @mixin size($size, $faPadding) {\n &:where(.size-#{$size}) {\n width: var(--icon--size--#{$size});\n height: var(--icon--size--#{$size});\n\n /*\n * FontAwesome inserts its stylesheet as an unlayered `<style>` element at\n * runtime (`autoAddCss` defaults to true), outside of Flow's build, and\n *
|
|
1
|
+
{"version":3,"file":"Icon.module.mjs","names":[],"sources":["../../../../../../../src/components/Icon/Icon.module.scss"],"sourcesContent":["@use \"@/styles/mixins/skeleton\";\n\n.icon {\n flex-shrink: 0;\n max-width: none;\n display: inline-block;\n\n @extend .size-m;\n\n /* Sizes */\n @mixin size($size, $faPadding) {\n &:where(.size-#{$size}) {\n width: var(--icon--size--#{$size});\n height: var(--icon--size--#{$size});\n\n /*\n * FontAwesome inserts its stylesheet as an unlayered `<style>` element at\n * runtime (`autoAddCss` defaults to true), outside of Flow's build, and\n * sizes `.svg-inline--fa` itself (`content-box`, `1.25em` × `1em`).\n * Unlayered CSS beats layered CSS regardless of specificity, so this\n * override only applies in the layered stylesheet variant if it leaves\n * the cascade layer as well.\n *\n * The size goes back to Flow's layered rules (`revert-layer`) instead of\n * the token, so a context's size (`Avatar`'s 70 %) still applies. The\n * variants without layers drop these declarations — there Flow's rules\n * already win, and `revert-layer` would discard them all.\n *\n * Marked at the leaf rather than in a separate block, because these rules\n * live in a size mixin – a block would have to duplicate it.\n */\n &:global(.svg-inline--fa) {\n @layer flow.unlayered {\n width: revert-layer;\n height: revert-layer;\n box-sizing: border-box;\n padding: $faPadding;\n }\n }\n }\n }\n\n @include size(m, var(--size-rem--xxs));\n @include size(s, var(--size-rem--xxs));\n @include size(l, var(--size-rem--xs));\n\n /* Colors */\n @mixin color($color) {\n &.#{$color} {\n color: var(--icon--#{$color}-color);\n }\n }\n\n &.neutral {\n color: var(--icon--color);\n }\n\n @include color(\"danger\");\n @include color(\"success\");\n @include color(\"warning\");\n @include color(\"info\");\n @include color(\"unavailable\");\n @include color(\"blue\");\n @include color(\"violet\");\n @include color(\"teal\");\n @include color(\"lilac\");\n @include color(\"dark\");\n @include color(\"light\");\n @include color(\"dark-static\");\n @include color(\"light-static\");\n\n /* SkeletonMode */\n\n &.skeleton {\n @include skeleton.shape;\n\n --skeleton-radius: var(--corner-radius--s);\n }\n}\n\n@include skeleton.keyframes;\n"],"mappings":""}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mittwald/flow-react-components",
|
|
3
|
-
"version": "1.6.0-next.
|
|
3
|
+
"version": "1.6.0-next.12",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "A React implementation of Flow, mittwald’s design system",
|
|
6
6
|
"homepage": "https://flow.mittwald.de",
|
|
@@ -84,9 +84,9 @@
|
|
|
84
84
|
"@internationalized/string-compiler": "^3.4.1",
|
|
85
85
|
"@lezer/common": "^1.5.2",
|
|
86
86
|
"@lezer/highlight": "^1.2.3",
|
|
87
|
-
"@mittwald/flow-icons": "^1.6.0-next.
|
|
87
|
+
"@mittwald/flow-icons": "^1.6.0-next.12",
|
|
88
88
|
"@mittwald/password-tools-js": "^3.0.0",
|
|
89
|
-
"@mittwald/react-tunnel": "^1.6.0-next.
|
|
89
|
+
"@mittwald/react-tunnel": "^1.6.0-next.12",
|
|
90
90
|
"@mittwald/react-use-promise": "^4.2.2",
|
|
91
91
|
"@react-aria/form": "^3.2.1",
|
|
92
92
|
"@react-aria/i18n": "^3.13.1",
|
|
@@ -139,13 +139,13 @@
|
|
|
139
139
|
"@internationalized/date": "^3.12.3",
|
|
140
140
|
"@lezer/generator": "^1.8.0",
|
|
141
141
|
"@lezer/lr": "^1.4.10",
|
|
142
|
-
"@mittwald/flow-components-base": "1.6.0-next.
|
|
143
|
-
"@mittwald/flow-core": "1.6.0-next.
|
|
144
|
-
"@mittwald/flow-design-tokens": "1.6.0-next.
|
|
145
|
-
"@mittwald/flow-icons-base": "1.6.0-next.
|
|
142
|
+
"@mittwald/flow-components-base": "1.6.0-next.12",
|
|
143
|
+
"@mittwald/flow-core": "1.6.0-next.12",
|
|
144
|
+
"@mittwald/flow-design-tokens": "1.6.0-next.12",
|
|
145
|
+
"@mittwald/flow-icons-base": "1.6.0-next.12",
|
|
146
146
|
"@mittwald/react-use-promise": "^4.2.2",
|
|
147
147
|
"@mittwald/remote-dom-react": "1.2.2-mittwald.10",
|
|
148
|
-
"@mittwald/typescript-config": "1.6.0-next.
|
|
148
|
+
"@mittwald/typescript-config": "1.6.0-next.12",
|
|
149
149
|
"@nx/storybook": "^22.7.6",
|
|
150
150
|
"@storybook/addon-a11y": "^10.5.10",
|
|
151
151
|
"@storybook/addon-actions": "^9.0.8",
|
|
@@ -199,7 +199,7 @@
|
|
|
199
199
|
},
|
|
200
200
|
"peerDependencies": {
|
|
201
201
|
"@internationalized/date": "^3.12.2",
|
|
202
|
-
"@mittwald/flow-icons-pro": "1.6.0-next.
|
|
202
|
+
"@mittwald/flow-icons-pro": "1.6.0-next.12",
|
|
203
203
|
"@mittwald/react-use-promise": "^4.2.2",
|
|
204
204
|
"next": "^16.2.3",
|
|
205
205
|
"react": "^19.2.0",
|
|
@@ -223,5 +223,5 @@
|
|
|
223
223
|
"browserslist": [
|
|
224
224
|
"baseline widely available"
|
|
225
225
|
],
|
|
226
|
-
"gitHead": "
|
|
226
|
+
"gitHead": "ad3c7e48d367df343daec04de9cd082cd4cc46ed"
|
|
227
227
|
}
|