@os-design/core 1.0.119 → 1.0.122
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/cjs/List/index.js
CHANGED
|
@@ -81,6 +81,7 @@ var List = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
|
81
81
|
threshold = _ref$threshold === void 0 ? 10 : _ref$threshold,
|
|
82
82
|
_ref$overscanCount = _ref.overscanCount,
|
|
83
83
|
overscanCount = _ref$overscanCount === void 0 ? 10 : _ref$overscanCount,
|
|
84
|
+
heightProp = _ref.height,
|
|
84
85
|
_ref$paddingTop = _ref.paddingTop,
|
|
85
86
|
paddingTop = _ref$paddingTop === void 0 ? 0 : _ref$paddingTop,
|
|
86
87
|
_ref$paddingBottom = _ref.paddingBottom,
|
|
@@ -120,12 +121,15 @@ var List = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
|
120
121
|
var paddingBottomSize = (0, _react.useMemo)(function () {
|
|
121
122
|
return ((hasNavigation && !isMinMd ? theme.navigationTabHeight : 0) + paddingBottom) * fontSize + safeAreaInset.bottom;
|
|
122
123
|
}, [hasNavigation, theme.navigationTabHeight, isMinMd, paddingBottom, fontSize, safeAreaInset.bottom]);
|
|
124
|
+
var height = (0, _react.useMemo)(function () {
|
|
125
|
+
return heightProp || size.height;
|
|
126
|
+
}, [heightProp, size.height]);
|
|
123
127
|
var scrollLoadNextHandler = (0, _useRWLoadNext["default"])({
|
|
124
128
|
itemCount: itemCount,
|
|
125
129
|
threshold: threshold,
|
|
126
130
|
itemSize: itemSize,
|
|
127
131
|
paddingTop: paddingTopSize,
|
|
128
|
-
height:
|
|
132
|
+
height: height,
|
|
129
133
|
onLoadNext: onLoadNext
|
|
130
134
|
});
|
|
131
135
|
var scrollHandler = (0, _react.useCallback)(function (_ref2) {
|
|
@@ -152,11 +156,11 @@ var List = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
|
152
156
|
}, /*#__PURE__*/_react["default"].createElement(_reactWindow.FixedSizeList, {
|
|
153
157
|
ref: mergedListRef,
|
|
154
158
|
width: "100%",
|
|
155
|
-
height:
|
|
159
|
+
height: height,
|
|
156
160
|
itemData: itemData,
|
|
157
161
|
itemSize: itemSize,
|
|
158
162
|
itemCount: itemCount,
|
|
159
|
-
style: {
|
|
163
|
+
style: heightProp ? {} : {
|
|
160
164
|
height: '100% important!'
|
|
161
165
|
},
|
|
162
166
|
overscanCount: overscanCount,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/List/index.tsx"],"names":["List","ref","itemCount","itemData","itemHeight","threshold","overscanCount","paddingTop","paddingBottom","onLoadNext","itemRenderer","outerRef","innerRef","listRef","mergedListRef","size","fontSize","document","body","LayoutContext","hasNavigation","hasPageHeader","theme","isMinMd","safeAreaInset","itemSize","paddingTopSize","pageHeaderHeight","paddingBottomSize","navigationTabHeight","bottom","scrollLoadNextHandler","
|
|
1
|
+
{"version":3,"sources":["../../../src/List/index.tsx"],"names":["List","ref","itemCount","itemData","itemHeight","threshold","overscanCount","heightProp","height","paddingTop","paddingBottom","onLoadNext","itemRenderer","outerRef","innerRef","listRef","mergedListRef","size","fontSize","document","body","LayoutContext","hasNavigation","hasPageHeader","theme","isMinMd","safeAreaInset","itemSize","paddingTopSize","pageHeaderHeight","paddingBottomSize","navigationTabHeight","bottom","scrollLoadNextHandler","scrollHandler","top","current","scrollTo","InnerElement","innerElementRef","style","rest","parseFloat","displayName","toString"],"mappings":"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","sourcesContent":["import React, { forwardRef, useCallback, useContext, useMemo } from 'react';\nimport {\n FixedSizeList,\n FixedSizeListProps,\n ListChildComponentProps,\n} from 'react-window';\nimport {\n useForwardedRef,\n useSize,\n useFontSize,\n useSafeAreaInset,\n} from '@os-design/utils';\nimport { useTheme } from '@os-design/theming';\nimport { useIsMinWidth } from '@os-design/media';\nimport WindowScroller, { ScrollPosition } from './WindowScroller';\nimport useRWLoadNext from './utils/useRWLoadNext';\nimport LayoutContext from '../Layout/LayoutContext';\n\nexport interface ListProps {\n /**\n * Total count of items.\n */\n itemCount: number;\n /**\n * Array of items.\n */\n itemData?: any; // eslint-disable-line @typescript-eslint/no-explicit-any\n /**\n * The item height in em.\n * @default 4\n */\n itemHeight?: number;\n /**\n * A threshold N means that the onLoadNext function calls when a user scrolls all items except N.\n * @default 10\n */\n threshold?: number;\n /**\n * Defines how many items outside of the visible \"window\" to render at all times.\n * @default 10\n */\n overscanCount?: number;\n /**\n * The height of the list in px.\n * @default undefined\n */\n height?: number;\n /**\n * The top padding in em.\n * @default 0\n */\n paddingTop?: number;\n /**\n * The bottom padding in em.\n * @default 0\n */\n paddingBottom?: number;\n /**\n * The callback to load more items.\n * @default undefined\n */\n onLoadNext?: () => void;\n /**\n * The callback to render items.\n * @default () => null\n */\n itemRenderer?: React.FC<ListChildComponentProps>;\n /**\n * Ref to attach to the outer container element.\n * @default undefined\n */\n outerRef?: FixedSizeListProps['outerRef'];\n /**\n * Ref to attach to the inner container element.\n * @default undefined\n */\n innerRef?: FixedSizeListProps['innerRef'];\n}\n\n/**\n * Virtualized list.\n * Used the react-window library.\n */\nconst List = forwardRef<FixedSizeList, ListProps>(\n (\n {\n itemCount,\n itemData,\n itemHeight = 4,\n threshold = 10,\n overscanCount = 10,\n height: heightProp,\n paddingTop = 0,\n paddingBottom = 0,\n onLoadNext = () => {},\n itemRenderer = () => null,\n outerRef,\n innerRef,\n },\n ref\n ) => {\n const [listRef, mergedListRef] = useForwardedRef(ref);\n const size = useSize();\n const fontSize = useFontSize(document.body);\n const { hasNavigation, hasPageHeader } = useContext(LayoutContext);\n const { theme } = useTheme();\n const isMinMd = useIsMinWidth('md');\n const safeAreaInset = useSafeAreaInset();\n\n const itemSize = useMemo(\n () => itemHeight * fontSize,\n [itemHeight, fontSize]\n );\n\n const paddingTopSize = useMemo(\n () =>\n ((hasPageHeader ? theme.pageHeaderHeight[isMinMd ? 1 : 0] : 0) +\n paddingTop) *\n fontSize,\n [hasPageHeader, theme.pageHeaderHeight, isMinMd, paddingTop, fontSize]\n );\n\n const paddingBottomSize = useMemo(\n () =>\n ((hasNavigation && !isMinMd ? theme.navigationTabHeight : 0) +\n paddingBottom) *\n fontSize +\n safeAreaInset.bottom,\n [\n hasNavigation,\n theme.navigationTabHeight,\n isMinMd,\n paddingBottom,\n fontSize,\n safeAreaInset.bottom,\n ]\n );\n\n const height = useMemo(\n () => heightProp || size.height,\n [heightProp, size.height]\n );\n\n const scrollLoadNextHandler = useRWLoadNext({\n itemCount,\n threshold,\n itemSize,\n paddingTop: paddingTopSize,\n height,\n onLoadNext,\n });\n\n const scrollHandler = useCallback(\n ({ top }: ScrollPosition) => {\n // Set the scroll position to the list\n if (listRef.current) listRef.current.scrollTo(top);\n scrollLoadNextHandler(top);\n },\n [listRef, scrollLoadNextHandler]\n );\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const InnerElement = forwardRef<HTMLDivElement, any>(\n ({ style, ...rest }, innerElementRef) => (\n <div\n ref={innerElementRef}\n style={{\n ...style,\n height: `${\n parseFloat(style.height) + paddingTopSize + paddingBottomSize\n }px`,\n }}\n {...rest}\n />\n )\n );\n InnerElement.displayName = 'InnerElement';\n\n return (\n <WindowScroller onScroll={scrollHandler}>\n <FixedSizeList\n ref={mergedListRef}\n width='100%'\n height={height}\n itemData={itemData}\n itemSize={itemSize}\n itemCount={itemCount}\n style={heightProp ? {} : { height: '100% important!' }}\n overscanCount={overscanCount}\n innerElementType={InnerElement}\n outerRef={outerRef}\n innerRef={innerRef}\n >\n {({ style, ...rest }) =>\n itemRenderer({\n style: {\n ...style,\n top: `${\n parseFloat(style.top ? style.top.toString() : '0') +\n paddingTopSize\n }px`,\n },\n ...rest,\n })\n }\n </FixedSizeList>\n </WindowScroller>\n );\n }\n);\n\nList.displayName = 'List';\n\nexport { default as WindowScroller } from './WindowScroller';\nexport { default as useRWLoadNext } from './utils/useRWLoadNext';\n\nexport default List;\n"],"file":"index.js"}
|
package/dist/esm/List/index.js
CHANGED
|
@@ -19,6 +19,7 @@ const List = /*#__PURE__*/forwardRef(({
|
|
|
19
19
|
itemHeight = 4,
|
|
20
20
|
threshold = 10,
|
|
21
21
|
overscanCount = 10,
|
|
22
|
+
height: heightProp,
|
|
22
23
|
paddingTop = 0,
|
|
23
24
|
paddingBottom = 0,
|
|
24
25
|
onLoadNext = () => {},
|
|
@@ -41,12 +42,13 @@ const List = /*#__PURE__*/forwardRef(({
|
|
|
41
42
|
const itemSize = useMemo(() => itemHeight * fontSize, [itemHeight, fontSize]);
|
|
42
43
|
const paddingTopSize = useMemo(() => ((hasPageHeader ? theme.pageHeaderHeight[isMinMd ? 1 : 0] : 0) + paddingTop) * fontSize, [hasPageHeader, theme.pageHeaderHeight, isMinMd, paddingTop, fontSize]);
|
|
43
44
|
const paddingBottomSize = useMemo(() => ((hasNavigation && !isMinMd ? theme.navigationTabHeight : 0) + paddingBottom) * fontSize + safeAreaInset.bottom, [hasNavigation, theme.navigationTabHeight, isMinMd, paddingBottom, fontSize, safeAreaInset.bottom]);
|
|
45
|
+
const height = useMemo(() => heightProp || size.height, [heightProp, size.height]);
|
|
44
46
|
const scrollLoadNextHandler = useRWLoadNext({
|
|
45
47
|
itemCount,
|
|
46
48
|
threshold,
|
|
47
49
|
itemSize,
|
|
48
50
|
paddingTop: paddingTopSize,
|
|
49
|
-
height
|
|
51
|
+
height,
|
|
50
52
|
onLoadNext
|
|
51
53
|
});
|
|
52
54
|
const scrollHandler = useCallback(({
|
|
@@ -72,11 +74,11 @@ const List = /*#__PURE__*/forwardRef(({
|
|
|
72
74
|
}, /*#__PURE__*/React.createElement(FixedSizeList, {
|
|
73
75
|
ref: mergedListRef,
|
|
74
76
|
width: "100%",
|
|
75
|
-
height:
|
|
77
|
+
height: height,
|
|
76
78
|
itemData: itemData,
|
|
77
79
|
itemSize: itemSize,
|
|
78
80
|
itemCount: itemCount,
|
|
79
|
-
style: {
|
|
81
|
+
style: heightProp ? {} : {
|
|
80
82
|
height: '100% important!'
|
|
81
83
|
},
|
|
82
84
|
overscanCount: overscanCount,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/List/index.tsx"],"names":["React","forwardRef","useCallback","useContext","useMemo","FixedSizeList","useForwardedRef","useSize","useFontSize","useSafeAreaInset","useTheme","useIsMinWidth","WindowScroller","useRWLoadNext","LayoutContext","List","itemCount","itemData","itemHeight","threshold","overscanCount","paddingTop","paddingBottom","onLoadNext","itemRenderer","outerRef","innerRef","ref","listRef","mergedListRef","size","fontSize","document","body","hasNavigation","hasPageHeader","theme","isMinMd","safeAreaInset","itemSize","paddingTopSize","pageHeaderHeight","paddingBottomSize","navigationTabHeight","bottom","scrollLoadNextHandler","
|
|
1
|
+
{"version":3,"sources":["../../../src/List/index.tsx"],"names":["React","forwardRef","useCallback","useContext","useMemo","FixedSizeList","useForwardedRef","useSize","useFontSize","useSafeAreaInset","useTheme","useIsMinWidth","WindowScroller","useRWLoadNext","LayoutContext","List","itemCount","itemData","itemHeight","threshold","overscanCount","height","heightProp","paddingTop","paddingBottom","onLoadNext","itemRenderer","outerRef","innerRef","ref","listRef","mergedListRef","size","fontSize","document","body","hasNavigation","hasPageHeader","theme","isMinMd","safeAreaInset","itemSize","paddingTopSize","pageHeaderHeight","paddingBottomSize","navigationTabHeight","bottom","scrollLoadNextHandler","scrollHandler","top","current","scrollTo","InnerElement","style","rest","innerElementRef","parseFloat","displayName","toString","default"],"mappings":"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","sourcesContent":["import React, { forwardRef, useCallback, useContext, useMemo } from 'react';\nimport {\n FixedSizeList,\n FixedSizeListProps,\n ListChildComponentProps,\n} from 'react-window';\nimport {\n useForwardedRef,\n useSize,\n useFontSize,\n useSafeAreaInset,\n} from '@os-design/utils';\nimport { useTheme } from '@os-design/theming';\nimport { useIsMinWidth } from '@os-design/media';\nimport WindowScroller, { ScrollPosition } from './WindowScroller';\nimport useRWLoadNext from './utils/useRWLoadNext';\nimport LayoutContext from '../Layout/LayoutContext';\n\nexport interface ListProps {\n /**\n * Total count of items.\n */\n itemCount: number;\n /**\n * Array of items.\n */\n itemData?: any; // eslint-disable-line @typescript-eslint/no-explicit-any\n /**\n * The item height in em.\n * @default 4\n */\n itemHeight?: number;\n /**\n * A threshold N means that the onLoadNext function calls when a user scrolls all items except N.\n * @default 10\n */\n threshold?: number;\n /**\n * Defines how many items outside of the visible \"window\" to render at all times.\n * @default 10\n */\n overscanCount?: number;\n /**\n * The height of the list in px.\n * @default undefined\n */\n height?: number;\n /**\n * The top padding in em.\n * @default 0\n */\n paddingTop?: number;\n /**\n * The bottom padding in em.\n * @default 0\n */\n paddingBottom?: number;\n /**\n * The callback to load more items.\n * @default undefined\n */\n onLoadNext?: () => void;\n /**\n * The callback to render items.\n * @default () => null\n */\n itemRenderer?: React.FC<ListChildComponentProps>;\n /**\n * Ref to attach to the outer container element.\n * @default undefined\n */\n outerRef?: FixedSizeListProps['outerRef'];\n /**\n * Ref to attach to the inner container element.\n * @default undefined\n */\n innerRef?: FixedSizeListProps['innerRef'];\n}\n\n/**\n * Virtualized list.\n * Used the react-window library.\n */\nconst List = forwardRef<FixedSizeList, ListProps>(\n (\n {\n itemCount,\n itemData,\n itemHeight = 4,\n threshold = 10,\n overscanCount = 10,\n height: heightProp,\n paddingTop = 0,\n paddingBottom = 0,\n onLoadNext = () => {},\n itemRenderer = () => null,\n outerRef,\n innerRef,\n },\n ref\n ) => {\n const [listRef, mergedListRef] = useForwardedRef(ref);\n const size = useSize();\n const fontSize = useFontSize(document.body);\n const { hasNavigation, hasPageHeader } = useContext(LayoutContext);\n const { theme } = useTheme();\n const isMinMd = useIsMinWidth('md');\n const safeAreaInset = useSafeAreaInset();\n\n const itemSize = useMemo(\n () => itemHeight * fontSize,\n [itemHeight, fontSize]\n );\n\n const paddingTopSize = useMemo(\n () =>\n ((hasPageHeader ? theme.pageHeaderHeight[isMinMd ? 1 : 0] : 0) +\n paddingTop) *\n fontSize,\n [hasPageHeader, theme.pageHeaderHeight, isMinMd, paddingTop, fontSize]\n );\n\n const paddingBottomSize = useMemo(\n () =>\n ((hasNavigation && !isMinMd ? theme.navigationTabHeight : 0) +\n paddingBottom) *\n fontSize +\n safeAreaInset.bottom,\n [\n hasNavigation,\n theme.navigationTabHeight,\n isMinMd,\n paddingBottom,\n fontSize,\n safeAreaInset.bottom,\n ]\n );\n\n const height = useMemo(\n () => heightProp || size.height,\n [heightProp, size.height]\n );\n\n const scrollLoadNextHandler = useRWLoadNext({\n itemCount,\n threshold,\n itemSize,\n paddingTop: paddingTopSize,\n height,\n onLoadNext,\n });\n\n const scrollHandler = useCallback(\n ({ top }: ScrollPosition) => {\n // Set the scroll position to the list\n if (listRef.current) listRef.current.scrollTo(top);\n scrollLoadNextHandler(top);\n },\n [listRef, scrollLoadNextHandler]\n );\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const InnerElement = forwardRef<HTMLDivElement, any>(\n ({ style, ...rest }, innerElementRef) => (\n <div\n ref={innerElementRef}\n style={{\n ...style,\n height: `${\n parseFloat(style.height) + paddingTopSize + paddingBottomSize\n }px`,\n }}\n {...rest}\n />\n )\n );\n InnerElement.displayName = 'InnerElement';\n\n return (\n <WindowScroller onScroll={scrollHandler}>\n <FixedSizeList\n ref={mergedListRef}\n width='100%'\n height={height}\n itemData={itemData}\n itemSize={itemSize}\n itemCount={itemCount}\n style={heightProp ? {} : { height: '100% important!' }}\n overscanCount={overscanCount}\n innerElementType={InnerElement}\n outerRef={outerRef}\n innerRef={innerRef}\n >\n {({ style, ...rest }) =>\n itemRenderer({\n style: {\n ...style,\n top: `${\n parseFloat(style.top ? style.top.toString() : '0') +\n paddingTopSize\n }px`,\n },\n ...rest,\n })\n }\n </FixedSizeList>\n </WindowScroller>\n );\n }\n);\n\nList.displayName = 'List';\n\nexport { default as WindowScroller } from './WindowScroller';\nexport { default as useRWLoadNext } from './utils/useRWLoadNext';\n\nexport default List;\n"],"file":"index.js"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/List/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAuD,MAAM,OAAO,CAAC;AAC5E,OAAO,EACL,aAAa,EACb,kBAAkB,EAClB,uBAAuB,EACxB,MAAM,cAAc,CAAC;AAatB,MAAM,WAAW,SAAS;IAIxB,SAAS,EAAE,MAAM,CAAC;IAIlB,QAAQ,CAAC,EAAE,GAAG,CAAC;IAKf,UAAU,CAAC,EAAE,MAAM,CAAC;IAKpB,SAAS,CAAC,EAAE,MAAM,CAAC;IAKnB,aAAa,CAAC,EAAE,MAAM,CAAC;IAKvB,UAAU,CAAC,EAAE,MAAM,CAAC;IAKpB,aAAa,CAAC,EAAE,MAAM,CAAC;IAKvB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IAKxB,YAAY,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAAC,CAAC;IAKjD,QAAQ,CAAC,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;IAK1C,QAAQ,CAAC,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;CAC3C;AAMD,QAAA,MAAM,IAAI,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/List/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAuD,MAAM,OAAO,CAAC;AAC5E,OAAO,EACL,aAAa,EACb,kBAAkB,EAClB,uBAAuB,EACxB,MAAM,cAAc,CAAC;AAatB,MAAM,WAAW,SAAS;IAIxB,SAAS,EAAE,MAAM,CAAC;IAIlB,QAAQ,CAAC,EAAE,GAAG,CAAC;IAKf,UAAU,CAAC,EAAE,MAAM,CAAC;IAKpB,SAAS,CAAC,EAAE,MAAM,CAAC;IAKnB,aAAa,CAAC,EAAE,MAAM,CAAC;IAKvB,MAAM,CAAC,EAAE,MAAM,CAAC;IAKhB,UAAU,CAAC,EAAE,MAAM,CAAC;IAKpB,aAAa,CAAC,EAAE,MAAM,CAAC;IAKvB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IAKxB,YAAY,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAAC,CAAC;IAKjD,QAAQ,CAAC,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;IAK1C,QAAQ,CAAC,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;CAC3C;AAMD,QAAA,MAAM,IAAI,sFA8HT,CAAC;AAIF,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAEjE,eAAe,IAAI,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@os-design/core",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.122",
|
|
4
4
|
"license": "UNLICENSED",
|
|
5
5
|
"repository": "git@gitlab.com:os-team/libs/os-design.git",
|
|
6
6
|
"main": "dist/cjs/index.js",
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
"build:cjs": "cross-env BABEL_ENV=cjs babel src --root-mode upward --extensions .ts,.tsx --out-dir dist/cjs --source-maps",
|
|
23
23
|
"build:types": "tsc --emitDeclarationOnly --declaration --declarationDir dist/types",
|
|
24
24
|
"build": "yarn clean && npm-run-all build:*",
|
|
25
|
-
"ncu": "ncu -u
|
|
25
|
+
"ncu": "ncu -u"
|
|
26
26
|
},
|
|
27
27
|
"publishConfig": {
|
|
28
28
|
"access": "public"
|
|
@@ -36,7 +36,7 @@
|
|
|
36
36
|
"@os-design/portal": "^1.0.1",
|
|
37
37
|
"@os-design/styles": "^1.0.32",
|
|
38
38
|
"@os-design/theming": "^1.0.30",
|
|
39
|
-
"@os-design/utils": "^1.0.
|
|
39
|
+
"@os-design/utils": "^1.0.46",
|
|
40
40
|
"@os-team/password-score": "^1.0.3",
|
|
41
41
|
"facepaint": "^1.2.1",
|
|
42
42
|
"react-focus-lock": "^2.8.1",
|
|
@@ -56,5 +56,5 @@
|
|
|
56
56
|
"react": ">=18",
|
|
57
57
|
"react-dom": ">=18"
|
|
58
58
|
},
|
|
59
|
-
"gitHead": "
|
|
59
|
+
"gitHead": "2a6bf50dc00b3212dc1bb57acc9a79fa44243737"
|
|
60
60
|
}
|