@os-design-mobile/menu 1.0.64 → 1.0.65
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/MenuGroup.d.ts +12 -5
- package/dist/MenuGroup.d.ts.map +1 -1
- package/dist/MenuGroup.js +1 -1
- package/dist/MenuGroup.js.map +1 -1
- package/package.json +4 -4
package/dist/MenuGroup.d.ts
CHANGED
|
@@ -1,12 +1,19 @@
|
|
|
1
1
|
import React, { PropsWithChildren } from 'react';
|
|
2
2
|
import { View, ViewProps } from 'react-native';
|
|
3
|
-
|
|
3
|
+
interface BaseMenuGroupProps<T> extends PropsWithChildren<ViewProps> {
|
|
4
4
|
title?: string;
|
|
5
|
-
maxSelectedItems?: number
|
|
6
|
-
value?:
|
|
7
|
-
defaultValue?:
|
|
8
|
-
onChange?: (value:
|
|
5
|
+
maxSelectedItems?: number;
|
|
6
|
+
value?: T;
|
|
7
|
+
defaultValue?: T;
|
|
8
|
+
onChange?: (value: T) => void;
|
|
9
9
|
}
|
|
10
|
+
interface MenuGroupNotMultipleProps extends BaseMenuGroupProps<string | null> {
|
|
11
|
+
multiple?: false;
|
|
12
|
+
}
|
|
13
|
+
interface MenuGroupMultipleProps extends BaseMenuGroupProps<string[]> {
|
|
14
|
+
multiple: true;
|
|
15
|
+
}
|
|
16
|
+
export type MenuGroupProps = MenuGroupNotMultipleProps | MenuGroupMultipleProps;
|
|
10
17
|
declare const MenuGroup: React.ForwardRefExoticComponent<MenuGroupProps & React.RefAttributes<View>>;
|
|
11
18
|
export default MenuGroup;
|
|
12
19
|
//# sourceMappingURL=MenuGroup.d.ts.map
|
package/dist/MenuGroup.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuGroup.d.ts","sourceRoot":"","sources":["../src/MenuGroup.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"MenuGroup.d.ts","sourceRoot":"","sources":["../src/MenuGroup.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,EAEZ,iBAAiB,EAGlB,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAI/C,UAAU,kBAAkB,CAAC,CAAC,CAAE,SAAQ,iBAAiB,CAAC,SAAS,CAAC;IAKlE,KAAK,CAAC,EAAE,MAAM,CAAC;IAMf,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAK1B,KAAK,CAAC,EAAE,CAAC,CAAC;IAKV,YAAY,CAAC,EAAE,CAAC,CAAC;IAKjB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;CAC/B;AACD,UAAU,yBAA0B,SAAQ,kBAAkB,CAAC,MAAM,GAAG,IAAI,CAAC;IAK3E,QAAQ,CAAC,EAAE,KAAK,CAAC;CAClB;AACD,UAAU,sBAAuB,SAAQ,kBAAkB,CAAC,MAAM,EAAE,CAAC;IAKnE,QAAQ,EAAE,IAAI,CAAC;CAChB;AACD,MAAM,MAAM,cAAc,GAAG,yBAAyB,GAAG,sBAAsB,CAAC;AAahF,QAAA,MAAM,SAAS,6EA2Fd,CAAC;AAIF,eAAe,SAAS,CAAC"}
|
package/dist/MenuGroup.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var
|
|
1
|
+
var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _toConsumableArray2=_interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _native=_interopRequireDefault(require("@emotion/native"));var _theming=require("@os-design-mobile/theming");var _useForwardedState3=_interopRequireDefault(require("@os-design/use-forwarded-state"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _reactNativeSafeAreaContext=require("react-native-safe-area-context");var _MenuItem=_interopRequireDefault(require("./MenuItem"));var _jsxRuntime=require("react/jsx-runtime");var _excluded=["title","multiple","maxSelectedItems","value","defaultValue","onChange","children"];function _getRequireWildcardCache(nodeInterop){if(typeof WeakMap!=="function")return null;var cacheBabelInterop=new WeakMap();var cacheNodeInterop=new WeakMap();return(_getRequireWildcardCache=function _getRequireWildcardCache(nodeInterop){return nodeInterop?cacheNodeInterop:cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj,nodeInterop){if(!nodeInterop&&obj&&obj.__esModule){return obj;}if(obj===null||typeof obj!=="object"&&typeof obj!=="function"){return{default:obj};}var cache=_getRequireWildcardCache(nodeInterop);if(cache&&cache.has(obj)){return cache.get(obj);}var newObj={};var hasPropertyDescriptor=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var key in obj){if(key!=="default"&&Object.prototype.hasOwnProperty.call(obj,key)){var desc=hasPropertyDescriptor?Object.getOwnPropertyDescriptor(obj,key):null;if(desc&&(desc.get||desc.set)){Object.defineProperty(newObj,key,desc);}else{newObj[key]=obj[key];}}}newObj.default=obj;if(cache){cache.set(obj,newObj);}return newObj;}var Title=_native.default.Text(function(p){return{fontWeight:'500',fontSize:p.theme.sizes.small*p.theme.fontSize,color:(0,_theming.clr)(p.theme.menuGroupColorTitle),marginBottom:0.4*p.theme.fontSize,paddingHorizontal:p.theme.modalBodyPaddingHorizontal*p.theme.fontSize};});var MenuGroup=(0,_react.forwardRef)(function(_ref,ref){var title=_ref.title,_ref$multiple=_ref.multiple,multiple=_ref$multiple===void 0?false:_ref$multiple,_ref$maxSelectedItems=_ref.maxSelectedItems,maxSelectedItems=_ref$maxSelectedItems===void 0?0:_ref$maxSelectedItems,value=_ref.value,defaultValue=_ref.defaultValue,_ref$onChange=_ref.onChange,onChange=_ref$onChange===void 0?function(){}:_ref$onChange,children=_ref.children,rest=(0,_objectWithoutProperties2.default)(_ref,_excluded);var _useForwardedState=(0,_useForwardedState3.default)({value:value,defaultValue:defaultValue,onChange:onChange}),_useForwardedState2=(0,_slicedToArray2.default)(_useForwardedState,2),forwardedValue=_useForwardedState2[0],setForwardedValue=_useForwardedState2[1];var safeAreaInsets=(0,_reactNativeSafeAreaContext.useSafeAreaInsets)();var onSelect=(0,_react.useCallback)(function(v){if(multiple){if((forwardedValue||[]).includes(v)){setForwardedValue((forwardedValue||[]).filter(function(item){return item!==v;}));return;}if(maxSelectedItems===0||(forwardedValue||[]).length<maxSelectedItems){setForwardedValue([].concat((0,_toConsumableArray2.default)(forwardedValue||[]),[v]));return;}return;}setForwardedValue(v);},[forwardedValue,maxSelectedItems,multiple,setForwardedValue]);var menuItems=(0,_react.useMemo)(function(){return _react.default.Children.map(children,function(child){if(!_react.default.isValidElement(child)||child.type!==_MenuItem.default)return child;var _child$props=child.props,childValue=_child$props.value,childOnPress=_child$props.onPress;var selected=multiple&&(forwardedValue||[]).includes(childValue)||!multiple&&forwardedValue===childValue;return _react.default.cloneElement(child,{key:childValue,selected:selected,onPress:function onPress(e){if(!childValue)return;onSelect(childValue);if(childOnPress)childOnPress(e);}});});},[children,forwardedValue,multiple,onSelect]);return(0,_jsxRuntime.jsxs)(_reactNative.View,Object.assign({},rest,{ref:ref,children:[title&&(0,_jsxRuntime.jsx)(Title,{numberOfLines:1,style:Object.assign({},safeAreaInsets.left>0?{paddingLeft:safeAreaInsets.left}:{},safeAreaInsets.right>0?{paddingRight:safeAreaInsets.right}:{}),children:title}),menuItems]}));});MenuGroup.displayName='MenuGroup';var _default=MenuGroup;exports.default=_default;
|
|
2
2
|
//# sourceMappingURL=MenuGroup.js.map
|
package/dist/MenuGroup.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuGroup.js","names":["Title","styled","Text","p","fontWeight","fontSize","theme","sizes","small","color","clr","menuGroupColorTitle","marginBottom","paddingHorizontal","modalBodyPaddingHorizontal","MenuGroup","forwardRef","ref","title","maxSelectedItems","value","defaultValue","onChange","children","rest","useForwardedState","forwardedValue","setForwardedValue","safeAreaInsets","useSafeAreaInsets","onSelect","
|
|
1
|
+
{"version":3,"file":"MenuGroup.js","names":["Title","styled","Text","p","fontWeight","fontSize","theme","sizes","small","color","clr","menuGroupColorTitle","marginBottom","paddingHorizontal","modalBodyPaddingHorizontal","MenuGroup","forwardRef","ref","title","multiple","maxSelectedItems","value","defaultValue","onChange","children","rest","useForwardedState","forwardedValue","setForwardedValue","safeAreaInsets","useSafeAreaInsets","onSelect","useCallback","v","includes","filter","item","length","menuItems","useMemo","React","Children","map","child","isValidElement","type","MenuItem","props","childValue","childOnPress","onPress","selected","cloneElement","key","e","left","paddingLeft","right","paddingRight","displayName"],"sources":["../src/MenuGroup.tsx"],"sourcesContent":["import styled from '@emotion/native';\nimport { clr } from '@os-design-mobile/theming';\nimport useForwardedState from '@os-design/use-forwarded-state';\nimport React, {\n forwardRef,\n PropsWithChildren,\n useCallback,\n useMemo,\n} from 'react';\nimport { View, ViewProps } from 'react-native';\nimport { useSafeAreaInsets } from 'react-native-safe-area-context';\nimport MenuItem from './MenuItem';\n\ninterface BaseMenuGroupProps<T> extends PropsWithChildren<ViewProps> {\n /**\n * The title of the menu group.\n * @default undefined\n */\n title?: string;\n /**\n * The max number of options that the user can select. Zero means unlimited.\n * Works only when multiple is true.\n * @default 0\n */\n maxSelectedItems?: number;\n /**\n * Selected menu items.\n * @default undefined\n */\n value?: T;\n /**\n * The default value.\n * @default undefined\n */\n defaultValue?: T;\n /**\n * The change event handler.\n * @default undefined\n */\n onChange?: (value: T) => void;\n}\ninterface MenuGroupNotMultipleProps extends BaseMenuGroupProps<string | null> {\n /**\n * Is it possible to select multiple values.\n * @default false\n */\n multiple?: false;\n}\ninterface MenuGroupMultipleProps extends BaseMenuGroupProps<string[]> {\n /**\n * Is it possible to select multiple values.\n * @default false\n */\n multiple: true;\n}\nexport type MenuGroupProps = MenuGroupNotMultipleProps | MenuGroupMultipleProps;\n\nconst Title = styled.Text((p) => ({\n fontWeight: '500',\n fontSize: p.theme.sizes.small * p.theme.fontSize,\n color: clr(p.theme.menuGroupColorTitle),\n marginBottom: 0.4 * p.theme.fontSize,\n paddingHorizontal: p.theme.modalBodyPaddingHorizontal * p.theme.fontSize,\n}));\n\n/**\n * The group of menu items.\n */\nconst MenuGroup = forwardRef<View, MenuGroupProps>(\n (\n {\n title,\n multiple = false,\n maxSelectedItems = 0,\n value,\n defaultValue,\n onChange = () => {},\n children,\n ...rest\n },\n ref\n ) => {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const [forwardedValue, setForwardedValue] = useForwardedState<any>({\n value,\n defaultValue,\n onChange,\n });\n const safeAreaInsets = useSafeAreaInsets();\n\n const onSelect = useCallback(\n (v: string) => {\n if (multiple) {\n // Delete the value because it was already selected\n if ((forwardedValue || []).includes(v)) {\n setForwardedValue(\n (forwardedValue || []).filter((item) => item !== v)\n );\n return;\n }\n\n // Add a new value if the number of selected items is less than max\n if (\n maxSelectedItems === 0 ||\n (forwardedValue || []).length < maxSelectedItems\n ) {\n setForwardedValue([...(forwardedValue || []), v]);\n return;\n }\n return;\n }\n setForwardedValue(v);\n },\n [forwardedValue, maxSelectedItems, multiple, setForwardedValue]\n );\n\n const menuItems = useMemo(\n () =>\n React.Children.map(children, (child) => {\n if (!React.isValidElement(child) || child.type !== MenuItem)\n return child;\n const { value: childValue, onPress: childOnPress } = child.props;\n const selected =\n (multiple && (forwardedValue || []).includes(childValue)) ||\n (!multiple && forwardedValue === childValue);\n return React.cloneElement<any>(child, {\n key: childValue,\n selected,\n onPress: (e) => {\n if (!childValue) return;\n onSelect(childValue);\n if (childOnPress) childOnPress(e);\n },\n });\n }),\n [children, forwardedValue, multiple, onSelect]\n );\n\n return (\n <View {...rest} ref={ref}>\n {title && (\n <Title\n numberOfLines={1}\n style={{\n ...(safeAreaInsets.left > 0\n ? { paddingLeft: safeAreaInsets.left }\n : {}),\n ...(safeAreaInsets.right > 0\n ? { paddingRight: safeAreaInsets.right }\n : {}),\n }}\n >\n {title}\n </Title>\n )}\n {menuItems}\n </View>\n );\n }\n);\n\nMenuGroup.displayName = 'MenuGroup';\n\nexport default MenuGroup;\n"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@os-design-mobile/menu",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.65",
|
|
4
4
|
"license": "UNLICENSED",
|
|
5
5
|
"repository": "git@gitlab.com:os-team/libs/os-design-mobile.git",
|
|
6
6
|
"main": "dist/index.js",
|
|
@@ -21,9 +21,9 @@
|
|
|
21
21
|
"dependencies": {
|
|
22
22
|
"@os-design-mobile/button": "^1.0.45",
|
|
23
23
|
"@os-design-mobile/icons": "^1.0.44",
|
|
24
|
-
"@os-design-mobile/modal": "^1.0.
|
|
24
|
+
"@os-design-mobile/modal": "^1.0.69",
|
|
25
25
|
"@os-design-mobile/theming": "^1.0.31",
|
|
26
|
-
"@os-design/menu-utils": "^1.0.
|
|
26
|
+
"@os-design/menu-utils": "^1.0.12",
|
|
27
27
|
"@os-design/use-forwarded-state": "^1.0.10"
|
|
28
28
|
},
|
|
29
29
|
"devDependencies": {
|
|
@@ -39,5 +39,5 @@
|
|
|
39
39
|
"react-native-safe-area-context": ">=3",
|
|
40
40
|
"react-native-svg": ">=12"
|
|
41
41
|
},
|
|
42
|
-
"gitHead": "
|
|
42
|
+
"gitHead": "1049e3bf8d396d12a961348cca54b083dc94875e"
|
|
43
43
|
}
|