glints-aries 4.0.252 → 4.0.253
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.
|
@@ -4,4 +4,4 @@ import { Blue, Neutral } from '../utilities/colors';
|
|
|
4
4
|
import { space16, space4, space8 } from '../utilities/spacing';
|
|
5
5
|
|
|
6
6
|
// we need to use global style here because popover is created outside the root element for react app
|
|
7
|
-
export var StyledPopover = createGlobalStyle([".Polaris-Popover{max-width:calc(100vw - ", ");margin:0.3125rem 2px ", ";box-shadow:0px ", " 20px rgba(71,71,71,0.2),0px 3px 6px -3px rgba(71,71,71,0.08);border-radius:", ";backface-visibility:hidden;will-change:left,top;}.Polaris-Popover__PopoverOverlay{opacity:0;transition:opacity 100ms ease,transform 100ms ease;transform:translateY(-0.3125rem);}.Polaris-Popover__PopoverOverlay--entering{opacity:1;transform:translateY(0);}.Polaris-Popover__PopoverOverlay--open{opacity:1;transform:none;}.Polaris-Popover__PopoverOverlay--exiting{opacity:1;transform:translateY(0);transition-duration:0ms;}.Polaris-Popover--measuring:not(.Polaris-Popover__PopoverOverlay--exiting){opacity:0;transform:translateY(-0.3125rem);}.Polaris-Popover--fullWidth{margin:0.3125rem auto 0 auto;width:100
|
|
7
|
+
export var StyledPopover = createGlobalStyle([".Polaris-Popover{max-width:calc(100vw - ", ");margin:0.3125rem 2px ", ";box-shadow:0px ", " 20px rgba(71,71,71,0.2),0px 3px 6px -3px rgba(71,71,71,0.08);border-radius:", ";backface-visibility:hidden;will-change:left,top;}.Polaris-Popover__PopoverOverlay{opacity:0;transition:opacity 100ms ease,transform 100ms ease;transform:translateY(-0.3125rem);}.Polaris-Popover__PopoverOverlay--entering{opacity:1;transform:translateY(0);}.Polaris-Popover__PopoverOverlay--open{opacity:1;transform:none;}.Polaris-Popover__PopoverOverlay--exiting{opacity:1;transform:translateY(0);transition-duration:0ms;}.Polaris-Popover--measuring:not(.Polaris-Popover__PopoverOverlay--exiting){opacity:0;transform:translateY(-0.3125rem);}.Polaris-Popover--fullWidth{margin:0.3125rem auto 0 auto;width:100%;&.Polaris-Popover--fitContent{width:fit-content;}}.Polaris-Popover--fullWidth .Polaris-Popover__Content{max-width:none;}.Polaris-Popover--positionedAbove{margin:", " 2px 0.3125rem;}.Polaris-Popover--positionedAbove.Polaris-Popover--fullWidth{margin:0 auto 0.3125rem auto;}.Polaris-Popover__Wrapper{position:relative;overflow:hidden;background-color:", ";border-radius:", ";outline:1px solid transparent;}.Polaris-Popover__Content{position:relative;display:flex;flex-direction:column;border-radius:1px;max-width:25rem;max-height:31.25rem;}.Polaris-Popover__Content:focus{outline:none;}.Polaris-Popover__Content--fullHeight{max-height:none;}.Polaris-Popover__Content--fluidContent{max-height:none;max-width:none;}.Polaris-Popover__Pane{flex:1 1;max-width:100%;}.Polaris-Popover__Pane + .Polaris-Popover__Pane{border-top:1px solid ", ";}.Polaris-Popover__Pane:focus{outline:none;}.Polaris-Popover__Pane--fixed{overflow:visible;flex:0 0 auto;}.Polaris-Popover__Pane--captureOverscroll{overscroll-behavior:contain;}.Polaris-Popover__Section{padding:", ";color:", ";}.Polaris-Popover__Section + .Polaris-Popover__Section{border-top:1px solid #e1e3e5;}.Polaris-Popover__FocusTracker{position:absolute !important;top:0;width:0.0625rem !important;height:0.0625rem !important;margin:0 !important;padding:0 !important;overflow:hidden !important;clip-path:inset(50%) !important;border:0 !important;white-space:nowrap !important;}@media print{.Polaris-Popover__PopoverOverlay--hideOnPrint{display:none !important;}}.Polaris-PositionedOverlay{position:absolute;z-index:400;}.Polaris-PositionedOverlay--fixed{position:fixed;}.Polaris-PositionedOverlay--calculating{visibility:hidden;}.Polaris-PositionedOverlay--preventInteraction{pointer-events:none;}.Polaris-Scrollable{position:relative;max-height:none;overflow-x:hidden;overflow-y:hidden;:focus{outline:0.125rem solid ", ";outline-offset:0.125rem;}}.Polaris-Scrollable--horizontal{overflow-x:auto;}.Polaris-Scrollable--vertical{overflow-y:auto;}"], space8, space4, space8, borderRadius8, space4, Neutral.B100, borderRadius8, Neutral.B85, space16, Neutral.B40, Blue.S54);
|
|
@@ -23,6 +23,8 @@ export interface SelectProps {
|
|
|
23
23
|
value: string;
|
|
24
24
|
}): void;
|
|
25
25
|
options?: Option[];
|
|
26
|
+
/** sets whether OptionList will follow content's width */
|
|
27
|
+
optionListFitContent?: boolean;
|
|
26
28
|
placeholder?: string;
|
|
27
29
|
prefix?: React.ReactNode;
|
|
28
30
|
/** sets whether Select is searchable */
|
|
@@ -38,5 +40,5 @@ export interface SelectProps {
|
|
|
38
40
|
/** sets z-index override for option list dropdown. z-index default to 400 */
|
|
39
41
|
zIndexOverride?: number;
|
|
40
42
|
}
|
|
41
|
-
export declare const Select: ({ allowMultiple, disabled, hasError, helpText, label, loadingOptions, onClose, onRemoveTag, onSelect, options, placeholder,
|
|
43
|
+
export declare const Select: ({ allowMultiple, disabled, hasError, helpText, label, listHeight, loadingOptions, onClose, onRemoveTag, onSelect, optionListFitContent, options, placeholder, prefix, searchable, searchableProps, scrollable, sections, selectedValues, width, zIndexOverride, }: SelectProps) => JSX.Element;
|
|
42
44
|
export {};
|
|
@@ -15,15 +15,17 @@ export var Select = function Select(_ref) {
|
|
|
15
15
|
hasError = _ref$hasError === void 0 ? false : _ref$hasError,
|
|
16
16
|
helpText = _ref.helpText,
|
|
17
17
|
label = _ref.label,
|
|
18
|
+
listHeight = _ref.listHeight,
|
|
18
19
|
_ref$loadingOptions = _ref.loadingOptions,
|
|
19
20
|
loadingOptions = _ref$loadingOptions === void 0 ? false : _ref$loadingOptions,
|
|
20
21
|
onClose = _ref.onClose,
|
|
21
22
|
onRemoveTag = _ref.onRemoveTag,
|
|
22
23
|
onSelect = _ref.onSelect,
|
|
24
|
+
_ref$optionListFitCon = _ref.optionListFitContent,
|
|
25
|
+
optionListFitContent = _ref$optionListFitCon === void 0 ? false : _ref$optionListFitCon,
|
|
23
26
|
_ref$options = _ref.options,
|
|
24
27
|
options = _ref$options === void 0 ? [] : _ref$options,
|
|
25
28
|
placeholder = _ref.placeholder,
|
|
26
|
-
listHeight = _ref.listHeight,
|
|
27
29
|
prefix = _ref.prefix,
|
|
28
30
|
_ref$searchable = _ref.searchable,
|
|
29
31
|
searchable = _ref$searchable === void 0 ? false : _ref$searchable,
|
|
@@ -145,8 +147,10 @@ export var Select = function Select(_ref) {
|
|
|
145
147
|
onClose: handleClose,
|
|
146
148
|
autofocusTarget: "none",
|
|
147
149
|
preventFocusOnClose: true,
|
|
150
|
+
preferredAlignment: "left",
|
|
148
151
|
preferredPosition: "below",
|
|
149
152
|
fullWidth: true,
|
|
153
|
+
fitContent: optionListFitContent,
|
|
150
154
|
zIndexOverride: zIndexOverride
|
|
151
155
|
}, !disabled && /*#__PURE__*/React.createElement(Popover.Pane, {
|
|
152
156
|
height: optionListHeight
|
|
@@ -7,5 +7,5 @@ var _borderRadius = require("../utilities/borderRadius");
|
|
|
7
7
|
var _colors = require("../utilities/colors");
|
|
8
8
|
var _spacing = require("../utilities/spacing");
|
|
9
9
|
// we need to use global style here because popover is created outside the root element for react app
|
|
10
|
-
var StyledPopover = (0, _styledComponents.createGlobalStyle)([".Polaris-Popover{max-width:calc(100vw - ", ");margin:0.3125rem 2px ", ";box-shadow:0px ", " 20px rgba(71,71,71,0.2),0px 3px 6px -3px rgba(71,71,71,0.08);border-radius:", ";backface-visibility:hidden;will-change:left,top;}.Polaris-Popover__PopoverOverlay{opacity:0;transition:opacity 100ms ease,transform 100ms ease;transform:translateY(-0.3125rem);}.Polaris-Popover__PopoverOverlay--entering{opacity:1;transform:translateY(0);}.Polaris-Popover__PopoverOverlay--open{opacity:1;transform:none;}.Polaris-Popover__PopoverOverlay--exiting{opacity:1;transform:translateY(0);transition-duration:0ms;}.Polaris-Popover--measuring:not(.Polaris-Popover__PopoverOverlay--exiting){opacity:0;transform:translateY(-0.3125rem);}.Polaris-Popover--fullWidth{margin:0.3125rem auto 0 auto;width:100
|
|
10
|
+
var StyledPopover = (0, _styledComponents.createGlobalStyle)([".Polaris-Popover{max-width:calc(100vw - ", ");margin:0.3125rem 2px ", ";box-shadow:0px ", " 20px rgba(71,71,71,0.2),0px 3px 6px -3px rgba(71,71,71,0.08);border-radius:", ";backface-visibility:hidden;will-change:left,top;}.Polaris-Popover__PopoverOverlay{opacity:0;transition:opacity 100ms ease,transform 100ms ease;transform:translateY(-0.3125rem);}.Polaris-Popover__PopoverOverlay--entering{opacity:1;transform:translateY(0);}.Polaris-Popover__PopoverOverlay--open{opacity:1;transform:none;}.Polaris-Popover__PopoverOverlay--exiting{opacity:1;transform:translateY(0);transition-duration:0ms;}.Polaris-Popover--measuring:not(.Polaris-Popover__PopoverOverlay--exiting){opacity:0;transform:translateY(-0.3125rem);}.Polaris-Popover--fullWidth{margin:0.3125rem auto 0 auto;width:100%;&.Polaris-Popover--fitContent{width:fit-content;}}.Polaris-Popover--fullWidth .Polaris-Popover__Content{max-width:none;}.Polaris-Popover--positionedAbove{margin:", " 2px 0.3125rem;}.Polaris-Popover--positionedAbove.Polaris-Popover--fullWidth{margin:0 auto 0.3125rem auto;}.Polaris-Popover__Wrapper{position:relative;overflow:hidden;background-color:", ";border-radius:", ";outline:1px solid transparent;}.Polaris-Popover__Content{position:relative;display:flex;flex-direction:column;border-radius:1px;max-width:25rem;max-height:31.25rem;}.Polaris-Popover__Content:focus{outline:none;}.Polaris-Popover__Content--fullHeight{max-height:none;}.Polaris-Popover__Content--fluidContent{max-height:none;max-width:none;}.Polaris-Popover__Pane{flex:1 1;max-width:100%;}.Polaris-Popover__Pane + .Polaris-Popover__Pane{border-top:1px solid ", ";}.Polaris-Popover__Pane:focus{outline:none;}.Polaris-Popover__Pane--fixed{overflow:visible;flex:0 0 auto;}.Polaris-Popover__Pane--captureOverscroll{overscroll-behavior:contain;}.Polaris-Popover__Section{padding:", ";color:", ";}.Polaris-Popover__Section + .Polaris-Popover__Section{border-top:1px solid #e1e3e5;}.Polaris-Popover__FocusTracker{position:absolute !important;top:0;width:0.0625rem !important;height:0.0625rem !important;margin:0 !important;padding:0 !important;overflow:hidden !important;clip-path:inset(50%) !important;border:0 !important;white-space:nowrap !important;}@media print{.Polaris-Popover__PopoverOverlay--hideOnPrint{display:none !important;}}.Polaris-PositionedOverlay{position:absolute;z-index:400;}.Polaris-PositionedOverlay--fixed{position:fixed;}.Polaris-PositionedOverlay--calculating{visibility:hidden;}.Polaris-PositionedOverlay--preventInteraction{pointer-events:none;}.Polaris-Scrollable{position:relative;max-height:none;overflow-x:hidden;overflow-y:hidden;:focus{outline:0.125rem solid ", ";outline-offset:0.125rem;}}.Polaris-Scrollable--horizontal{overflow-x:auto;}.Polaris-Scrollable--vertical{overflow-y:auto;}"], _spacing.space8, _spacing.space4, _spacing.space8, _borderRadius.borderRadius8, _spacing.space4, _colors.Neutral.B100, _borderRadius.borderRadius8, _colors.Neutral.B85, _spacing.space16, _colors.Neutral.B40, _colors.Blue.S54);
|
|
11
11
|
exports.StyledPopover = StyledPopover;
|
|
@@ -23,6 +23,8 @@ export interface SelectProps {
|
|
|
23
23
|
value: string;
|
|
24
24
|
}): void;
|
|
25
25
|
options?: Option[];
|
|
26
|
+
/** sets whether OptionList will follow content's width */
|
|
27
|
+
optionListFitContent?: boolean;
|
|
26
28
|
placeholder?: string;
|
|
27
29
|
prefix?: React.ReactNode;
|
|
28
30
|
/** sets whether Select is searchable */
|
|
@@ -38,5 +40,5 @@ export interface SelectProps {
|
|
|
38
40
|
/** sets z-index override for option list dropdown. z-index default to 400 */
|
|
39
41
|
zIndexOverride?: number;
|
|
40
42
|
}
|
|
41
|
-
export declare const Select: ({ allowMultiple, disabled, hasError, helpText, label, loadingOptions, onClose, onRemoveTag, onSelect, options, placeholder,
|
|
43
|
+
export declare const Select: ({ allowMultiple, disabled, hasError, helpText, label, listHeight, loadingOptions, onClose, onRemoveTag, onSelect, optionListFitContent, options, placeholder, prefix, searchable, searchableProps, scrollable, sections, selectedValues, width, zIndexOverride, }: SelectProps) => JSX.Element;
|
|
42
44
|
export {};
|
|
@@ -21,15 +21,17 @@ var Select = function Select(_ref) {
|
|
|
21
21
|
hasError = _ref$hasError === void 0 ? false : _ref$hasError,
|
|
22
22
|
helpText = _ref.helpText,
|
|
23
23
|
label = _ref.label,
|
|
24
|
+
listHeight = _ref.listHeight,
|
|
24
25
|
_ref$loadingOptions = _ref.loadingOptions,
|
|
25
26
|
loadingOptions = _ref$loadingOptions === void 0 ? false : _ref$loadingOptions,
|
|
26
27
|
onClose = _ref.onClose,
|
|
27
28
|
onRemoveTag = _ref.onRemoveTag,
|
|
28
29
|
onSelect = _ref.onSelect,
|
|
30
|
+
_ref$optionListFitCon = _ref.optionListFitContent,
|
|
31
|
+
optionListFitContent = _ref$optionListFitCon === void 0 ? false : _ref$optionListFitCon,
|
|
29
32
|
_ref$options = _ref.options,
|
|
30
33
|
options = _ref$options === void 0 ? [] : _ref$options,
|
|
31
34
|
placeholder = _ref.placeholder,
|
|
32
|
-
listHeight = _ref.listHeight,
|
|
33
35
|
prefix = _ref.prefix,
|
|
34
36
|
_ref$searchable = _ref.searchable,
|
|
35
37
|
searchable = _ref$searchable === void 0 ? false : _ref$searchable,
|
|
@@ -151,8 +153,10 @@ var Select = function Select(_ref) {
|
|
|
151
153
|
onClose: handleClose,
|
|
152
154
|
autofocusTarget: "none",
|
|
153
155
|
preventFocusOnClose: true,
|
|
156
|
+
preferredAlignment: "left",
|
|
154
157
|
preferredPosition: "below",
|
|
155
158
|
fullWidth: true,
|
|
159
|
+
fitContent: optionListFitContent,
|
|
156
160
|
zIndexOverride: zIndexOverride
|
|
157
161
|
}, !disabled && /*#__PURE__*/_react["default"].createElement(_Popover.Popover.Pane, {
|
|
158
162
|
height: optionListHeight
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "glints-aries",
|
|
3
|
-
"version": "4.0.
|
|
3
|
+
"version": "4.0.253",
|
|
4
4
|
"description": "Glints ui-kit for frontend",
|
|
5
5
|
"main": "./lib/index.js",
|
|
6
6
|
"module": "./es/index.js",
|
|
@@ -133,7 +133,7 @@
|
|
|
133
133
|
"classnames": "^2.2.6",
|
|
134
134
|
"downshift": "^6.1.3",
|
|
135
135
|
"moment": "^2.24.0",
|
|
136
|
-
"polaris-glints": "^15.
|
|
136
|
+
"polaris-glints": "^15.12.0",
|
|
137
137
|
"react-id-generator": "^3.0.1",
|
|
138
138
|
"styled-system": "^5.1.5"
|
|
139
139
|
},
|