@transferwise/components 46.43.0 → 46.44.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/build/index.js +56 -50
- package/build/index.js.map +1 -1
- package/build/index.mjs +56 -50
- package/build/index.mjs.map +1 -1
- package/build/main.css +9 -2
- package/build/styles/carousel/Carousel.css +9 -2
- package/build/styles/main.css +9 -2
- package/build/types/carousel/Carousel.d.ts +1 -0
- package/build/types/carousel/Carousel.d.ts.map +1 -1
- package/build/types/checkboxButton/CheckboxButton.d.ts.map +1 -1
- package/build/types/field/Field.d.ts +2 -1
- package/build/types/field/Field.d.ts.map +1 -1
- package/build/types/inlineAlert/InlineAlert.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/carousel/Carousel.css +9 -2
- package/src/carousel/Carousel.less +10 -1
- package/src/carousel/Carousel.story.tsx +1 -0
- package/src/carousel/Carousel.tsx +2 -0
- package/src/checkbox/Checkbox.spec.tsx +13 -0
- package/src/checkbox/Checkbox.story.tsx +13 -0
- package/src/checkboxButton/CheckboxButton.tsx +12 -4
- package/src/field/Field.tsx +11 -5
- package/src/inlineAlert/InlineAlert.spec.tsx +7 -0
- package/src/inlineAlert/InlineAlert.tsx +9 -3
- package/src/main.css +9 -2
package/build/index.js
CHANGED
|
@@ -2174,6 +2174,7 @@ const Carousel = ({
|
|
|
2174
2174
|
}
|
|
2175
2175
|
},
|
|
2176
2176
|
href: card.href,
|
|
2177
|
+
target: card.hrefTarget,
|
|
2177
2178
|
rel: "noreferrer",
|
|
2178
2179
|
onKeyDown: event => handleOnKeyDown(event, index),
|
|
2179
2180
|
children: cardContent
|
|
@@ -2256,28 +2257,62 @@ const Card = /*#__PURE__*/React.forwardRef(function Card({
|
|
|
2256
2257
|
});
|
|
2257
2258
|
});
|
|
2258
2259
|
|
|
2259
|
-
const
|
|
2260
|
+
const FieldLabelIdContext = /*#__PURE__*/React.createContext(undefined);
|
|
2261
|
+
const FieldLabelIdContextProvider = FieldLabelIdContext.Provider;
|
|
2262
|
+
const InputIdContext = /*#__PURE__*/React.createContext(undefined);
|
|
2263
|
+
const InputIdContextProvider = InputIdContext.Provider;
|
|
2264
|
+
const InputDescribedByContext = /*#__PURE__*/React.createContext(undefined);
|
|
2265
|
+
const InputDescribedByProvider = InputDescribedByContext.Provider;
|
|
2266
|
+
const InputInvalidContext = /*#__PURE__*/React.createContext(undefined);
|
|
2267
|
+
const InputInvalidProvider = InputInvalidContext.Provider;
|
|
2268
|
+
function useInputAttributes({
|
|
2269
|
+
nonLabelable
|
|
2270
|
+
} = {}) {
|
|
2271
|
+
const labelId = React.useContext(FieldLabelIdContext);
|
|
2272
|
+
return {
|
|
2273
|
+
id: React.useContext(InputIdContext),
|
|
2274
|
+
'aria-labelledby': nonLabelable ? labelId : undefined,
|
|
2275
|
+
'aria-describedby': React.useContext(InputDescribedByContext),
|
|
2276
|
+
'aria-invalid': React.useContext(InputInvalidContext)
|
|
2277
|
+
};
|
|
2278
|
+
}
|
|
2279
|
+
function withInputAttributes(Component, args) {
|
|
2280
|
+
function ComponentWithInputAttributes(props) {
|
|
2281
|
+
return /*#__PURE__*/jsxRuntime.jsx(Component, {
|
|
2282
|
+
inputAttributes: useInputAttributes(args),
|
|
2283
|
+
...props
|
|
2284
|
+
});
|
|
2285
|
+
}
|
|
2286
|
+
ComponentWithInputAttributes.displayName = `withInputAttributes(${Component.displayName || Component.name || 'Component'})`;
|
|
2287
|
+
return ComponentWithInputAttributes;
|
|
2288
|
+
}
|
|
2289
|
+
|
|
2290
|
+
const CheckboxButton = /*#__PURE__*/React.forwardRef(function CheckboxButton({
|
|
2260
2291
|
checked,
|
|
2261
2292
|
className,
|
|
2262
2293
|
disabled,
|
|
2263
2294
|
onChange,
|
|
2264
2295
|
...rest
|
|
2265
|
-
}, reference)
|
|
2266
|
-
|
|
2267
|
-
|
|
2268
|
-
|
|
2269
|
-
|
|
2270
|
-
|
|
2271
|
-
|
|
2272
|
-
|
|
2273
|
-
|
|
2274
|
-
|
|
2275
|
-
|
|
2276
|
-
|
|
2277
|
-
|
|
2278
|
-
|
|
2279
|
-
|
|
2280
|
-
|
|
2296
|
+
}, reference) {
|
|
2297
|
+
const inputAttributes = useInputAttributes();
|
|
2298
|
+
return /*#__PURE__*/jsxRuntime.jsxs("span", {
|
|
2299
|
+
className: classNames__default.default('np-checkbox-button', className, disabled && 'disabled'),
|
|
2300
|
+
children: [/*#__PURE__*/jsxRuntime.jsx("input", {
|
|
2301
|
+
...inputAttributes,
|
|
2302
|
+
...rest,
|
|
2303
|
+
ref: reference,
|
|
2304
|
+
type: "checkbox",
|
|
2305
|
+
disabled: disabled,
|
|
2306
|
+
checked: checked,
|
|
2307
|
+
onChange: onChange
|
|
2308
|
+
}), /*#__PURE__*/jsxRuntime.jsx("span", {
|
|
2309
|
+
className: "tw-checkbox-button",
|
|
2310
|
+
children: /*#__PURE__*/jsxRuntime.jsx("span", {
|
|
2311
|
+
className: "tw-checkbox-check"
|
|
2312
|
+
})
|
|
2313
|
+
})]
|
|
2314
|
+
});
|
|
2315
|
+
});
|
|
2281
2316
|
|
|
2282
2317
|
function Checkbox({
|
|
2283
2318
|
id,
|
|
@@ -3078,36 +3113,6 @@ const isMonthAndYearFormat = dateString => validDateString(dateString) && dateSt
|
|
|
3078
3113
|
const MDY = new Set(['en-US']);
|
|
3079
3114
|
const YMD = new Set(['hu', 'hu-HU', 'zh-HK', 'zh-CN', 'ja', 'ja-JP']);
|
|
3080
3115
|
|
|
3081
|
-
const FieldLabelIdContext = /*#__PURE__*/React.createContext(undefined);
|
|
3082
|
-
const FieldLabelIdContextProvider = FieldLabelIdContext.Provider;
|
|
3083
|
-
const InputIdContext = /*#__PURE__*/React.createContext(undefined);
|
|
3084
|
-
const InputIdContextProvider = InputIdContext.Provider;
|
|
3085
|
-
const InputDescribedByContext = /*#__PURE__*/React.createContext(undefined);
|
|
3086
|
-
const InputDescribedByProvider = InputDescribedByContext.Provider;
|
|
3087
|
-
const InputInvalidContext = /*#__PURE__*/React.createContext(undefined);
|
|
3088
|
-
const InputInvalidProvider = InputInvalidContext.Provider;
|
|
3089
|
-
function useInputAttributes({
|
|
3090
|
-
nonLabelable
|
|
3091
|
-
} = {}) {
|
|
3092
|
-
const labelId = React.useContext(FieldLabelIdContext);
|
|
3093
|
-
return {
|
|
3094
|
-
id: React.useContext(InputIdContext),
|
|
3095
|
-
'aria-labelledby': nonLabelable ? labelId : undefined,
|
|
3096
|
-
'aria-describedby': React.useContext(InputDescribedByContext),
|
|
3097
|
-
'aria-invalid': React.useContext(InputInvalidContext)
|
|
3098
|
-
};
|
|
3099
|
-
}
|
|
3100
|
-
function withInputAttributes(Component, args) {
|
|
3101
|
-
function ComponentWithInputAttributes(props) {
|
|
3102
|
-
return /*#__PURE__*/jsxRuntime.jsx(Component, {
|
|
3103
|
-
inputAttributes: useInputAttributes(args),
|
|
3104
|
-
...props
|
|
3105
|
-
});
|
|
3106
|
-
}
|
|
3107
|
-
ComponentWithInputAttributes.displayName = `withInputAttributes(${Component.displayName || Component.name || 'Component'})`;
|
|
3108
|
-
return ComponentWithInputAttributes;
|
|
3109
|
-
}
|
|
3110
|
-
|
|
3111
3116
|
var messages$9 = reactIntl.defineMessages({
|
|
3112
3117
|
monthLabel: {
|
|
3113
3118
|
id: "neptune.DateInput.month.label"
|
|
@@ -4860,6 +4865,7 @@ const Emphasis = ({
|
|
|
4860
4865
|
}) : null;
|
|
4861
4866
|
};
|
|
4862
4867
|
|
|
4868
|
+
const iconTypes = new Set([exports.Sentiment.NEGATIVE, exports.Sentiment.ERROR, exports.Sentiment.POSITIVE, exports.Sentiment.SUCCESS, exports.Sentiment.WARNING]);
|
|
4863
4869
|
function InlineAlert({
|
|
4864
4870
|
id,
|
|
4865
4871
|
type = 'neutral',
|
|
@@ -4870,7 +4876,7 @@ function InlineAlert({
|
|
|
4870
4876
|
role: "alert",
|
|
4871
4877
|
id: id,
|
|
4872
4878
|
className: classNames__default.default('alert alert-detach', `alert-${type === exports.Sentiment.NEGATIVE || type === exports.Sentiment.ERROR ? 'danger' : type}`, className),
|
|
4873
|
-
children: [
|
|
4879
|
+
children: [iconTypes.has(type) && /*#__PURE__*/jsxRuntime.jsx(StatusIcon, {
|
|
4874
4880
|
sentiment: type,
|
|
4875
4881
|
size: exports.Size.SMALL
|
|
4876
4882
|
}), /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
@@ -4925,11 +4931,11 @@ const Field = ({
|
|
|
4925
4931
|
'has-error': hasError,
|
|
4926
4932
|
'has-info': sentiment === exports.Sentiment.NEUTRAL
|
|
4927
4933
|
}, className),
|
|
4928
|
-
children: [/*#__PURE__*/jsxRuntime.jsxs(Label, {
|
|
4934
|
+
children: [label != null ? /*#__PURE__*/jsxRuntime.jsxs(Label, {
|
|
4929
4935
|
id: labelId,
|
|
4930
4936
|
htmlFor: inputId,
|
|
4931
4937
|
children: [label, children]
|
|
4932
|
-
}), message && /*#__PURE__*/jsxRuntime.jsx(InlineAlert, {
|
|
4938
|
+
}) : children, message && /*#__PURE__*/jsxRuntime.jsx(InlineAlert, {
|
|
4933
4939
|
type: sentiment,
|
|
4934
4940
|
id: descriptionId,
|
|
4935
4941
|
children: message
|