@7shifts/sous-chef 3.44.17 → 3.45.1
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/index.css +195 -158
- package/dist/index.d.ts +1 -0
- package/dist/index.js +38 -16
- package/dist/index.js.map +1 -1
- package/dist/index.modern.js +38 -16
- package/dist/index.modern.js.map +1 -1
- package/dist/lists/Accordion/AccordionContext.d.ts +7 -0
- package/dist/typography/Text/Text.d.ts +3 -1
- package/package.json +1 -1
package/dist/index.modern.js
CHANGED
|
@@ -5830,7 +5830,7 @@ var LINK_TARGET = {
|
|
|
5830
5830
|
BLANK: '_blank'
|
|
5831
5831
|
};
|
|
5832
5832
|
|
|
5833
|
-
var styles$8 = {"link
|
|
5833
|
+
var styles$8 = {"link":"_36SZq"};
|
|
5834
5834
|
|
|
5835
5835
|
var _excluded$2q = ["href", "target", "theme", "onClick", "children"];
|
|
5836
5836
|
var Link = function Link(_ref) {
|
|
@@ -5998,18 +5998,28 @@ var useModalContext = function useModalContext() {
|
|
|
5998
5998
|
return context || {};
|
|
5999
5999
|
};
|
|
6000
6000
|
|
|
6001
|
+
var AccordionContext = createContext({
|
|
6002
|
+
isAccordionMounted: false
|
|
6003
|
+
});
|
|
6004
|
+
var useAccordionContext = function useAccordionContext() {
|
|
6005
|
+
var context = useContext(AccordionContext);
|
|
6006
|
+
return context || {};
|
|
6007
|
+
};
|
|
6008
|
+
|
|
6001
6009
|
var useBackgroundColor = function useBackgroundColor() {
|
|
6002
6010
|
var _useModalContext = useModalContext(),
|
|
6003
6011
|
isInsideModal = _useModalContext.isModalMounted;
|
|
6012
|
+
var _useAccordionContext = useAccordionContext(),
|
|
6013
|
+
isInsideAccordion = _useAccordionContext.isAccordionMounted;
|
|
6004
6014
|
var _useState = useState(COLORS.white),
|
|
6005
6015
|
backgroundColor = _useState[0],
|
|
6006
6016
|
setBackgroundColor = _useState[1];
|
|
6007
6017
|
useLayoutEffect(function () {
|
|
6008
|
-
if (!isInsideModal) {
|
|
6018
|
+
if (!isInsideModal && !isInsideAccordion) {
|
|
6009
6019
|
var bodyStyles = window.getComputedStyle(document.body);
|
|
6010
6020
|
setBackgroundColor(bodyStyles.getPropertyValue('background-color'));
|
|
6011
6021
|
}
|
|
6012
|
-
}, [isInsideModal]);
|
|
6022
|
+
}, [isInsideModal, isInsideAccordion]);
|
|
6013
6023
|
return backgroundColor;
|
|
6014
6024
|
};
|
|
6015
6025
|
|
|
@@ -7118,7 +7128,7 @@ var ALIGNMENTS = {
|
|
|
7118
7128
|
|
|
7119
7129
|
var styles$p = {"text":"_32amZ","text__body":"_ayJRy","text__caption":"_3g1gi","text__insight":"_20Phg","text--bold":"_A0AyZ","text--italic":"_3jayQ","text--underline":"_GOcFw","text--monospace":"_3TfGK","text--align-left":"_b8gto","text--align-right":"_ecyH1","text--align-center":"_xBgXc","text--align-justify":"_280D5"};
|
|
7120
7130
|
|
|
7121
|
-
var _excluded$2v = ["children", "as", "emphasis", "alignment", "color", "testId"];
|
|
7131
|
+
var _excluded$2v = ["children", "as", "emphasis", "alignment", "color", "testId", "textWrap"];
|
|
7122
7132
|
var Text = function Text(_ref) {
|
|
7123
7133
|
var _classnames;
|
|
7124
7134
|
var children = _ref.children,
|
|
@@ -7128,11 +7138,13 @@ var Text = function Text(_ref) {
|
|
|
7128
7138
|
alignment = _ref.alignment,
|
|
7129
7139
|
color = _ref.color,
|
|
7130
7140
|
testId = _ref.testId,
|
|
7141
|
+
textWrap = _ref.textWrap,
|
|
7131
7142
|
positionProps = _objectWithoutPropertiesLoose(_ref, _excluded$2v);
|
|
7132
7143
|
var positionStyles = usePositionStyles(positionProps);
|
|
7133
7144
|
var elementProps = {
|
|
7134
7145
|
style: _extends({
|
|
7135
|
-
color: getColor(color)
|
|
7146
|
+
color: getColor(color),
|
|
7147
|
+
textWrap: textWrap
|
|
7136
7148
|
}, positionStyles),
|
|
7137
7149
|
className: classnames(styles$p['text'], (_classnames = {}, _classnames[styles$p['text--bold']] = emphasis === null || emphasis === void 0 ? void 0 : emphasis.includes(FONT_EMPHASIS.BOLD), _classnames[styles$p['text--italic']] = emphasis === null || emphasis === void 0 ? void 0 : emphasis.includes(FONT_EMPHASIS.ITALIC), _classnames[styles$p['text--underline']] = emphasis === null || emphasis === void 0 ? void 0 : emphasis.includes(FONT_EMPHASIS.UNDERLINE), _classnames[styles$p['text--monospace']] = emphasis === null || emphasis === void 0 ? void 0 : emphasis.includes(FONT_EMPHASIS.MONOSPACE), _classnames[styles$p['text--align-left']] = alignment === ALIGNMENTS.LEFT, _classnames[styles$p['text--align-right']] = alignment === ALIGNMENTS.RIGHT, _classnames[styles$p['text--align-center']] = alignment === ALIGNMENTS.CENTER, _classnames[styles$p['text--align-justify']] = alignment === ALIGNMENTS.JUSTIFY, _classnames[styles$p['text__body']] = as === TEXT_TYPES.BODY, _classnames[styles$p['text__insight']] = as === TEXT_TYPES.INSIGHT, _classnames[styles$p['text__caption']] = as === TEXT_TYPES.CAPTION, _classnames)),
|
|
7138
7150
|
'data-testid': testId
|
|
@@ -7199,15 +7211,20 @@ var DropdownListItem = function DropdownListItem(_ref) {
|
|
|
7199
7211
|
};
|
|
7200
7212
|
var childrenContainer = React__default.createElement("div", {
|
|
7201
7213
|
className: styles$o['dropdown-list-item__container']
|
|
7202
|
-
}, prefix
|
|
7214
|
+
}, prefix && React__default.createElement("div", {
|
|
7215
|
+
className: styles$o['dropdown-list-item__prefix']
|
|
7216
|
+
}, prefix), React__default.createElement("div", {
|
|
7203
7217
|
className: styles$o['dropdown-list-item__content']
|
|
7204
7218
|
}, React__default.createElement(Stack, {
|
|
7205
7219
|
space: 4,
|
|
7206
7220
|
flex: [1]
|
|
7207
7221
|
}, children, caption && React__default.createElement(Text, {
|
|
7208
7222
|
as: "caption",
|
|
7209
|
-
color: getCaptionColor()
|
|
7210
|
-
|
|
7223
|
+
color: getCaptionColor(),
|
|
7224
|
+
textWrap: "wrap"
|
|
7225
|
+
}, caption))), suffix && React__default.createElement("div", {
|
|
7226
|
+
className: styles$o['dropdown-list-item__suffix']
|
|
7227
|
+
}, suffix));
|
|
7211
7228
|
var linkItem = href && (reloadDocument ? React__default.createElement("a", {
|
|
7212
7229
|
href: href,
|
|
7213
7230
|
className: styles$o['dropdown-list-item__link'],
|
|
@@ -7399,7 +7416,7 @@ var CalloutCard = function CalloutCard(_ref) {
|
|
|
7399
7416
|
className: styles$r['callout-card__header']
|
|
7400
7417
|
}, React__default.createElement(Text, {
|
|
7401
7418
|
as: "body",
|
|
7402
|
-
color: "
|
|
7419
|
+
color: "blackberry-400"
|
|
7403
7420
|
}, header)), React__default.createElement(Text, {
|
|
7404
7421
|
as: "h2"
|
|
7405
7422
|
}, title), React__default.createElement(Text, {
|
|
@@ -9099,7 +9116,11 @@ var Accordion = function Accordion(props) {
|
|
|
9099
9116
|
if (items.length < 1) {
|
|
9100
9117
|
return null;
|
|
9101
9118
|
}
|
|
9102
|
-
return React__default.createElement(
|
|
9119
|
+
return React__default.createElement(AccordionContext.Provider, {
|
|
9120
|
+
value: {
|
|
9121
|
+
isAccordionMounted: true
|
|
9122
|
+
}
|
|
9123
|
+
}, React__default.createElement("div", {
|
|
9103
9124
|
className: styles$Q['accordion']
|
|
9104
9125
|
}, items.map(function (item, index) {
|
|
9105
9126
|
var id = item.id || index.toString();
|
|
@@ -9111,7 +9132,7 @@ var Accordion = function Accordion(props) {
|
|
|
9111
9132
|
isOpen: id == activeId,
|
|
9112
9133
|
handleAccordionItemOpen: handleAccordionItemOpen
|
|
9113
9134
|
});
|
|
9114
|
-
}));
|
|
9135
|
+
})));
|
|
9115
9136
|
};
|
|
9116
9137
|
|
|
9117
9138
|
var useSelectFieldControllers = function useSelectFieldControllers(_ref) {
|
|
@@ -9244,16 +9265,16 @@ var getSelectStyles = function getSelectStyles(_ref) {
|
|
|
9244
9265
|
flex: '1',
|
|
9245
9266
|
fontFamily: FONT_FAMILY,
|
|
9246
9267
|
minWidth: '110px',
|
|
9247
|
-
position: 'initial'
|
|
9248
|
-
borderRadius: '4px'
|
|
9268
|
+
position: 'initial'
|
|
9249
9269
|
});
|
|
9250
9270
|
},
|
|
9251
9271
|
control: function control(base, state) {
|
|
9252
9272
|
return Object.assign({}, base, {
|
|
9253
9273
|
backgroundColor: state.isDisabled ? COLORS['grey-100'] : COLORS['white'],
|
|
9254
|
-
borderColor: state.isFocused ? COLORS['
|
|
9274
|
+
borderColor: state.isFocused ? COLORS['blackberry-400'] : borderColor,
|
|
9255
9275
|
color: state.isDisabled ? COLORS['grey-400'] : COLORS['grey-500'],
|
|
9256
|
-
|
|
9276
|
+
borderRadius: 'var(--border-radius-400)',
|
|
9277
|
+
boxShadow: state.isFocused ? "0 0 8px " + COLORS['blackberry-300'] : 'none',
|
|
9257
9278
|
'&:hover': 'none',
|
|
9258
9279
|
fontSize: '14px',
|
|
9259
9280
|
cursor: 'pointer',
|
|
@@ -9350,6 +9371,7 @@ var getSelectStyles = function getSelectStyles(_ref) {
|
|
|
9350
9371
|
},
|
|
9351
9372
|
menu: function menu(base) {
|
|
9352
9373
|
return _extends({}, base, {
|
|
9374
|
+
borderRadius: 0,
|
|
9353
9375
|
zIndex: getZIndex('dropdown')
|
|
9354
9376
|
});
|
|
9355
9377
|
},
|
|
@@ -13082,7 +13104,7 @@ var EmptyStateContainerInline = function EmptyStateContainerInline(_ref) {
|
|
|
13082
13104
|
space: 8
|
|
13083
13105
|
}, header && React__default.createElement(Text, {
|
|
13084
13106
|
as: "h4",
|
|
13085
|
-
color: isPaywall ? 'eggplant-500' : '
|
|
13107
|
+
color: isPaywall ? 'eggplant-500' : 'blackberry-400'
|
|
13086
13108
|
}, header), React__default.createElement(Text, {
|
|
13087
13109
|
as: "h1"
|
|
13088
13110
|
}, title)), React__default.createElement("div", {
|