oolib 2.227.8 → 2.227.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/dist/v2/components/Dropdowns/DropdownMulti/index.d.ts +2 -1
- package/dist/v2/components/Dropdowns/DropdownMulti/index.js +11 -9
- package/dist/v2/components/Dropdowns/comps/OptionsMulti/index.d.ts +2 -1
- package/dist/v2/components/Dropdowns/comps/OptionsMulti/index.js +2 -2
- package/dist/v2/components/Dropdowns/utils/genLinkOrText.js +13 -3
- package/dist/v2/components/Dropdowns/utils/genTagComp.js +4 -1
- package/package.json +2 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export function DropdownMulti({ saveValueAsString, value: valueProp, id, onChange: parentOnChange, className, readOnly, selectClassName, optionsClassName, selectStyleOverride, optionsFn, options: optionsProp, isTagsStyle, isSearchable, searchFieldsConfig, setFilteredOptions: setFilteredOptionsInParent, setSearchString: setSearchStringInParent, searchString: searchStringInParent, label, optionsModalLabel, genCreateTagButton, placeholder, genCustomSelectComp, disableSelectTextUpdate, selectConfig, lightboxHeight, lightboxStyle, optionsAnchor, popOutOfOverflowHiddenParent, S, disabled, broadcastShowOptions, tagColor, searchbarPlaceholder, alignDropdown, variant, matchSelectInputWidth }: {
|
|
1
|
+
export function DropdownMulti({ saveValueAsString, value: valueProp, id, onChange: parentOnChange, className, readOnly, selectClassName, optionsClassName, selectStyleOverride, optionsFn, options: optionsProp, isTagsStyle, isSearchable, searchFieldsConfig, setFilteredOptions: setFilteredOptionsInParent, setSearchString: setSearchStringInParent, searchString: searchStringInParent, label, optionsModalLabel, genCreateTagButton, placeholder, genCustomSelectComp, disableSelectTextUpdate, selectConfig, lightboxHeight, lightboxStyle, optionsAnchor, popOutOfOverflowHiddenParent, S, disabled, broadcastShowOptions, tagColor, searchbarPlaceholder, alignDropdown, variant, matchSelectInputWidth, observerRef }: {
|
|
2
2
|
saveValueAsString: any;
|
|
3
3
|
value: any;
|
|
4
4
|
id: any;
|
|
@@ -35,5 +35,6 @@ export function DropdownMulti({ saveValueAsString, value: valueProp, id, onChang
|
|
|
35
35
|
alignDropdown?: string;
|
|
36
36
|
variant?: string;
|
|
37
37
|
matchSelectInputWidth?: boolean;
|
|
38
|
+
observerRef: any;
|
|
38
39
|
}, ...args: any[]): React.JSX.Element;
|
|
39
40
|
import React from "react";
|
|
@@ -74,7 +74,7 @@ function DropdownMulti(_a) {
|
|
|
74
74
|
optionsClassName = _a.optionsClassName, //used to override font size in priimary header
|
|
75
75
|
selectStyleOverride = _a.selectStyleOverride, optionsFn = _a.optionsFn, optionsProp = _a.options, isTagsStyle = _a.isTagsStyle, isSearchable = _a.isSearchable, searchFieldsConfig = _a.searchFieldsConfig, setFilteredOptionsInParent = _a.setFilteredOptions, setSearchStringInParent = _a.setSearchString, searchStringInParent = _a.searchString, label = _a.label, optionsModalLabel = _a.optionsModalLabel, genCreateTagButton = _a.genCreateTagButton, placeholder = _a.placeholder, genCustomSelectComp = _a.genCustomSelectComp, disableSelectTextUpdate = _a.disableSelectTextUpdate, selectConfig = _a.selectConfig,
|
|
76
76
|
//props whose existence needs to be questioned:
|
|
77
|
-
lightboxHeight = _a.lightboxHeight, lightboxStyle = _a.lightboxStyle, optionsAnchor = _a.optionsAnchor, popOutOfOverflowHiddenParent = _a.popOutOfOverflowHiddenParent, S = _a.S, disabled = _a.disabled, broadcastShowOptions = _a.broadcastShowOptions, tagColor = _a.tagColor, searchbarPlaceholder = _a.searchbarPlaceholder, _b = _a.alignDropdown, alignDropdown = _b === void 0 ? "left" : _b, _c = _a.variant, variant = _c === void 0 ? "default" : _c, _d = _a.matchSelectInputWidth, matchSelectInputWidth = _d === void 0 ? false : _d;
|
|
77
|
+
lightboxHeight = _a.lightboxHeight, lightboxStyle = _a.lightboxStyle, optionsAnchor = _a.optionsAnchor, popOutOfOverflowHiddenParent = _a.popOutOfOverflowHiddenParent, S = _a.S, disabled = _a.disabled, broadcastShowOptions = _a.broadcastShowOptions, tagColor = _a.tagColor, searchbarPlaceholder = _a.searchbarPlaceholder, _b = _a.alignDropdown, alignDropdown = _b === void 0 ? "left" : _b, _c = _a.variant, variant = _c === void 0 ? "default" : _c, _d = _a.matchSelectInputWidth, matchSelectInputWidth = _d === void 0 ? false : _d, observerRef = _a.observerRef;
|
|
78
78
|
var theme = (0, styled_components_1.useTheme)();
|
|
79
79
|
var props = arguments[0];
|
|
80
80
|
var value = (0, getValue_1.getValue_MULTI)({ valueProp: valueProp, optionsFn: optionsFn, options: optionsProp, theme: theme, saveValueAsString: saveValueAsString });
|
|
@@ -127,15 +127,17 @@ function DropdownMulti(_a) {
|
|
|
127
127
|
options = (0, react_1.useMemo)(function () {
|
|
128
128
|
return (!isSearchable && !isTagsStyle)
|
|
129
129
|
? options
|
|
130
|
-
:
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
130
|
+
: !!observerRef === true //if this exists that means search is being handled on the backend via elastic search
|
|
131
|
+
? options
|
|
132
|
+
: (0, keywordSearchOptions_1.keywordSearchOptions)({
|
|
133
|
+
options: options,
|
|
134
|
+
searchString: searchString,
|
|
135
|
+
searchFieldsConfig: searchFieldsConfig,
|
|
136
|
+
setFilteredOptionsInParent: setFilteredOptionsInParent,
|
|
137
|
+
});
|
|
136
138
|
}, [
|
|
137
139
|
searchString,
|
|
138
|
-
// showOptions,
|
|
140
|
+
// showOptions,
|
|
139
141
|
optionsFn === null || optionsFn === void 0 ? void 0 : optionsFn.fn,
|
|
140
142
|
optionsFn === null || optionsFn === void 0 ? void 0 : optionsFn.args,
|
|
141
143
|
options,
|
|
@@ -192,7 +194,7 @@ function DropdownMulti(_a) {
|
|
|
192
194
|
? !showOptions && handleShowOptions() //if tagsStyle, then click always shows options
|
|
193
195
|
: showOptions ? handleHideOptions() : handleShowOptions(); //if dropdowns, then click toggles show/hide
|
|
194
196
|
} }, isTagsStyle ? genSelectTagsInput() : (react_1.default.createElement(SelectDropdown_1.SelectDropdown, { value: value, placeholder: placeholder, selectClassName: selectClassName, selectStyleOverride: selectStyleOverride, showOptions: showOptions, genCustomSelectComp: genCustomSelectComp, disableSelectTextUpdate: disableSelectTextUpdate, selectConfig: selectConfig, S: S, disabled: disabled, variant: variant }))),
|
|
195
|
-
react_1.default.createElement(OptionsMulti_1.OptionsMulti, { parentOnChange: parentOnChange, id: id, value: value, relativeToRef: selectRef, showOptions: showOptions, handleSelect: handleSelect, handleHideOptions: handleHideOptions, optionsClassName: optionsClassName, options: options, optionsFn: optionsFn, label: label, optionsModalLabel: optionsModalLabel, isTagsStyle: isTagsStyle, genCreateTagButton: genCreateTagButton, lightboxHeight: lightboxHeight, lightboxStyle: lightboxStyle, optionsAnchor: optionsAnchor, SelectComp: isTagsStyle && genSelectTagsInput({ style: { position: 'sticky', top: 0, zIndex: 1000 } }), setFocusSelectTagsInput: setFocusSelectTagsInput, popOutOfOverflowHiddenParent: popOutOfOverflowHiddenParent, S: S, alignDropdown: alignDropdown, matchSelectInputWidth: matchSelectInputWidth, searchbarPlaceholder: searchbarPlaceholder, isSearchable: isTagsStyle ? false : isSearchable, searchString: searchString, setSearchString: setSearchString })));
|
|
197
|
+
react_1.default.createElement(OptionsMulti_1.OptionsMulti, { parentOnChange: parentOnChange, id: id, value: value, relativeToRef: selectRef, showOptions: showOptions, handleSelect: handleSelect, handleHideOptions: handleHideOptions, optionsClassName: optionsClassName, options: options, optionsFn: optionsFn, label: label, optionsModalLabel: optionsModalLabel, isTagsStyle: isTagsStyle, genCreateTagButton: genCreateTagButton, lightboxHeight: lightboxHeight, lightboxStyle: lightboxStyle, optionsAnchor: optionsAnchor, SelectComp: isTagsStyle && genSelectTagsInput({ style: { position: 'sticky', top: 0, zIndex: 1000 } }), setFocusSelectTagsInput: setFocusSelectTagsInput, popOutOfOverflowHiddenParent: popOutOfOverflowHiddenParent, S: S, alignDropdown: alignDropdown, matchSelectInputWidth: matchSelectInputWidth, observerRef: observerRef, searchbarPlaceholder: searchbarPlaceholder, isSearchable: isTagsStyle ? false : isSearchable, searchString: searchString, setSearchString: setSearchString })));
|
|
196
198
|
};
|
|
197
199
|
return (react_1.default.createElement("div", { className: "OKE-Dropdown ".concat(className, " OKE-Dropdown--").concat(readOnly ? "displayComp" : "inputComp") },
|
|
198
200
|
react_1.default.createElement(BlockLabel_1.BlockLabel, __assign({}, (0, getBlockLabelProps_1.getBlockLabelProps)(props))),
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export function OptionsMulti({ lightboxHeight, lightboxStyle, optionsAnchor, value, id, optionsClassName, relativeToRef, showOptions, handleHideOptions, handleSelect, options, parentOnChange, isSearchable, label, optionsModalLabel, searchString, setSearchString, SelectComp, isTagsStyle, genCreateTagButton, setFocusSelectTagsInput, popOutOfOverflowHiddenParent, S, searchbarPlaceholder, alignDropdown, matchSelectInputWidth }: {
|
|
1
|
+
export function OptionsMulti({ lightboxHeight, lightboxStyle, optionsAnchor, value, id, optionsClassName, relativeToRef, showOptions, handleHideOptions, handleSelect, options, parentOnChange, isSearchable, label, optionsModalLabel, searchString, setSearchString, SelectComp, isTagsStyle, genCreateTagButton, setFocusSelectTagsInput, popOutOfOverflowHiddenParent, S, observerRef, searchbarPlaceholder, alignDropdown, matchSelectInputWidth }: {
|
|
2
2
|
lightboxHeight: any;
|
|
3
3
|
lightboxStyle: any;
|
|
4
4
|
optionsAnchor: any;
|
|
@@ -22,6 +22,7 @@ export function OptionsMulti({ lightboxHeight, lightboxStyle, optionsAnchor, val
|
|
|
22
22
|
setFocusSelectTagsInput: any;
|
|
23
23
|
popOutOfOverflowHiddenParent: any;
|
|
24
24
|
S: any;
|
|
25
|
+
observerRef: any;
|
|
25
26
|
searchbarPlaceholder: any;
|
|
26
27
|
alignDropdown: any;
|
|
27
28
|
matchSelectInputWidth: any;
|
|
@@ -48,7 +48,7 @@ var OptionsMulti = function (_a) {
|
|
|
48
48
|
relativeToRef = _a.relativeToRef, //the element that this lightbox is being rendered against. i.e top or bottom
|
|
49
49
|
showOptions = _a.showOptions, handleHideOptions = _a.handleHideOptions, handleSelect = _a.handleSelect, options = _a.options, parentOnChange = _a.parentOnChange, isSearchable = _a.isSearchable, label = _a.label, optionsModalLabel = _a.optionsModalLabel, //label is just a fallback for optionsModalLabel. Don't know why both are needed
|
|
50
50
|
searchString = _a.searchString, setSearchString = _a.setSearchString, SelectComp = _a.SelectComp, // for mobile
|
|
51
|
-
isTagsStyle = _a.isTagsStyle, genCreateTagButton = _a.genCreateTagButton, setFocusSelectTagsInput = _a.setFocusSelectTagsInput, popOutOfOverflowHiddenParent = _a.popOutOfOverflowHiddenParent, S = _a.S, searchbarPlaceholder = _a.searchbarPlaceholder, alignDropdown = _a.alignDropdown, matchSelectInputWidth = _a.matchSelectInputWidth;
|
|
51
|
+
isTagsStyle = _a.isTagsStyle, genCreateTagButton = _a.genCreateTagButton, setFocusSelectTagsInput = _a.setFocusSelectTagsInput, popOutOfOverflowHiddenParent = _a.popOutOfOverflowHiddenParent, S = _a.S, observerRef = _a.observerRef, searchbarPlaceholder = _a.searchbarPlaceholder, alignDropdown = _a.alignDropdown, matchSelectInputWidth = _a.matchSelectInputWidth;
|
|
52
52
|
//INIT ORIENTATION STATE AND CUSTOM HOOK
|
|
53
53
|
var optionsRef = (0, react_1.useRef)(null);
|
|
54
54
|
var yOrientation = (0, useSetYOrientation_1.useSetYOrientation)({
|
|
@@ -107,7 +107,7 @@ var OptionsMulti = function (_a) {
|
|
|
107
107
|
return (react_1.default.createElement(OptionsShell_1.OptionsShell, { ref: optionsRef, yOrientation: yOrientation, lightboxHeight: lightboxHeight, lightboxStyle: lightboxStyle, options: options, optionsAnchor: optionsAnchor, showOptions: showOptions, handleHideOptions: handleHideOptions, SelectComp: SelectComp, label: label, optionsModalLabel: optionsModalLabel, showDoneButton: true, popOutOfOverflowHiddenParent: popOutOfOverflowHiddenParent, relativeToRef: relativeToRef, S: S, alignDropdown: alignDropdown, matchSelectInputWidth: matchSelectInputWidth },
|
|
108
108
|
react_1.default.createElement(List_1.List, { options: options, value: value, focussedOp: focussedOp, scrollFocussedOpIntoView: scrollFocussedOpIntoView, onChange: function (id, v) {
|
|
109
109
|
handleSelect(v);
|
|
110
|
-
}, optionsClassName: optionsClassName, S: S, isMulti: true, disableShadow: true, isSearchable: isSearchable, searchbarPlaceholder: searchbarPlaceholder, searchBarFocus: searchBarFocus, searchString: searchString, setSearchString: setSearchString, setSearchBarFocus: setSearchBarFocus, children: !isTagsStyle && createSelectedOptions(), showList: showOptions, usedIn: "dropdown" }),
|
|
110
|
+
}, optionsClassName: optionsClassName, S: S, observerRef: observerRef, isMulti: true, disableShadow: true, isSearchable: isSearchable, searchbarPlaceholder: searchbarPlaceholder, searchBarFocus: searchBarFocus, searchString: searchString, setSearchString: setSearchString, setSearchBarFocus: setSearchBarFocus, children: !isTagsStyle && createSelectedOptions(), showList: showOptions, usedIn: "dropdown" }),
|
|
111
111
|
genCreateTagButton && genCreateTagButton(options)));
|
|
112
112
|
};
|
|
113
113
|
exports.OptionsMulti = OptionsMulti;
|
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.genLinkOrText = void 0;
|
|
4
|
+
var ootils_1 = require("@okf/ootils");
|
|
4
5
|
var genLinkOrText = function (value, cb, options) {
|
|
5
6
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
6
7
|
if (cb === void 0) { cb = undefined; }
|
|
7
8
|
if (options === void 0) { options = {}; }
|
|
9
|
+
var SELF_MANAGED_BASE_CONFIGS = options.SELF_MANAGED_BASE_CONFIGS;
|
|
8
10
|
if ((!value.data ||
|
|
9
11
|
!value.data._id ||
|
|
10
12
|
(!((_a = value.data.meta) === null || _a === void 0 ? void 0 : _a.content_type) &&
|
|
@@ -18,9 +20,13 @@ var genLinkOrText = function (value, cb, options) {
|
|
|
18
20
|
// create links for content types
|
|
19
21
|
if ((_e = (_d = value.data) === null || _d === void 0 ? void 0 : _d.meta) === null || _e === void 0 ? void 0 : _e.content_type) {
|
|
20
22
|
var _k = value.data, content_type = _k.meta.content_type, _id = _k._id;
|
|
21
|
-
link =
|
|
23
|
+
link = (0, ootils_1.getRoutePathToPublishedContent)({
|
|
24
|
+
contentType: content_type,
|
|
25
|
+
contentId: _id,
|
|
26
|
+
SELF_MANAGED_BASE_CONFIGS: SELF_MANAGED_BASE_CONFIGS,
|
|
27
|
+
});
|
|
22
28
|
}
|
|
23
|
-
// create links for profiles
|
|
29
|
+
// create links for profiles
|
|
24
30
|
else if (((_g = (_f = value.data) === null || _f === void 0 ? void 0 : _f.meta) === null || _g === void 0 ? void 0 : _g.profile_type) || ((_h = value.data) === null || _h === void 0 ? void 0 : _h.profileType)) {
|
|
25
31
|
var profileType = ((_j = value.data.meta) === null || _j === void 0 ? void 0 : _j.profile_type) || value.data.profileType;
|
|
26
32
|
var _l = value.data, user = _l.user, _id = _l._id;
|
|
@@ -40,7 +46,11 @@ var genLinkOrText = function (value, cb, options) {
|
|
|
40
46
|
//create links for content tags
|
|
41
47
|
else if (value.tagCategory === 'contentTags') {
|
|
42
48
|
//i think value.tagType is redundant, but will have to check
|
|
43
|
-
link =
|
|
49
|
+
link = (0, ootils_1.getRoutePathToPublishedContent)({
|
|
50
|
+
contentType: value.tagType || value.meta.kp_content_type,
|
|
51
|
+
contentId: value._id,
|
|
52
|
+
SELF_MANAGED_BASE_CONFIGS: SELF_MANAGED_BASE_CONFIGS,
|
|
53
|
+
});
|
|
44
54
|
}
|
|
45
55
|
return cb ? (cb(value.display, link)) : ({ link: link });
|
|
46
56
|
}
|
|
@@ -8,8 +8,11 @@ var react_1 = __importDefault(require("react"));
|
|
|
8
8
|
var genLinkOrText_1 = require("./genLinkOrText");
|
|
9
9
|
var Tags_1 = require("../../Tags");
|
|
10
10
|
var genTagComp = function (id, d, options) {
|
|
11
|
+
var _a;
|
|
11
12
|
if (options === void 0) { options = {}; }
|
|
12
|
-
var link = (0, genLinkOrText_1.genLinkOrText)(d
|
|
13
|
+
var link = (0, genLinkOrText_1.genLinkOrText)(d, undefined, {
|
|
14
|
+
SELF_MANAGED_BASE_CONFIGS: (_a = options.theme) === null || _a === void 0 ? void 0 : _a.SELF_MANAGED_BASE_CONFIGS,
|
|
15
|
+
}).link;
|
|
13
16
|
var showOptions = options.showOptions;
|
|
14
17
|
switch (true) {
|
|
15
18
|
case !options.display:
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "oolib",
|
|
3
|
-
"version": "2.227.
|
|
3
|
+
"version": "2.227.10",
|
|
4
4
|
"description": " OKE Component Library",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -95,6 +95,7 @@
|
|
|
95
95
|
"@lexical/react": "^0.13.1",
|
|
96
96
|
"@lexical/table": "^0.13.1",
|
|
97
97
|
"@material/material-color-utilities": "^0.3.0",
|
|
98
|
+
"@okf/ootils": "^1.22.0",
|
|
98
99
|
"@phosphor-icons/react": "^2.1.10",
|
|
99
100
|
"@react-hook/resize-observer": "^1.2.6",
|
|
100
101
|
"babel-polyfill": "^6.26.0",
|