@ledgerhq/react-ui 0.15.0-windows-certificate.0 → 0.15.1-next.0
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/lib/cjs/components/form/BaseInput/index.js +2 -1
- package/lib/cjs/components/form/BaseInput/index.js.map +2 -2
- package/lib/cjs/components/layout/List/NumberedList/NumberedList.stories.js +129 -0
- package/lib/cjs/components/layout/List/NumberedList/NumberedList.stories.js.map +7 -0
- package/lib/cjs/components/layout/List/NumberedList/index.js +69 -0
- package/lib/cjs/components/layout/List/NumberedList/index.js.map +7 -0
- package/lib/cjs/components/layout/index.js +2 -0
- package/lib/cjs/components/layout/index.js.map +2 -2
- package/lib/components/form/BaseInput/index.js +3 -2
- package/lib/components/form/BaseInput/index.js.map +1 -1
- package/lib/components/layout/List/NumberedList/index.d.ts +11 -0
- package/lib/components/layout/List/NumberedList/index.js +27 -0
- package/lib/components/layout/List/NumberedList/index.js.map +1 -0
- package/lib/components/layout/index.d.ts +1 -0
- package/lib/components/layout/index.js +1 -0
- package/lib/components/layout/index.js.map +1 -1
- package/package.json +3 -3
|
@@ -139,6 +139,7 @@ const ClearableButtonUnstyled = (0, import_styled_components.default)(import_But
|
|
|
139
139
|
`;
|
|
140
140
|
const IDENTITY = (_) => _;
|
|
141
141
|
function Input(props, ref) {
|
|
142
|
+
const { colors } = (0, import_styled_components.useTheme)();
|
|
142
143
|
const {
|
|
143
144
|
value,
|
|
144
145
|
disabled,
|
|
@@ -188,7 +189,7 @@ function Input(props, ref) {
|
|
|
188
189
|
htmlInputProps.onBlur && htmlInputProps.onBlur(event);
|
|
189
190
|
}
|
|
190
191
|
}
|
|
191
|
-
), clearable && inputValue && /* @__PURE__ */ import_react.default.createElement(import_Flex.default, { alignItems: "center", mr: 7 }, /* @__PURE__ */ import_react.default.createElement(ClearableButtonUnstyled, { onClick: handleClear }, /* @__PURE__ */ import_react.default.createElement(import_CircledCrossSolidMedium.default, { size: 18, color:
|
|
192
|
+
), clearable && inputValue && /* @__PURE__ */ import_react.default.createElement(import_Flex.default, { alignItems: "center", mr: 7 }, /* @__PURE__ */ import_react.default.createElement(ClearableButtonUnstyled, { onClick: handleClear }, /* @__PURE__ */ import_react.default.createElement(import_CircledCrossSolidMedium.default, { size: 18, color: colors.neutral.c50 }))), typeof renderRight === "function" ? renderRight(props) : renderRight);
|
|
192
193
|
if (unwrapped) {
|
|
193
194
|
return /* @__PURE__ */ import_react.default.createElement(import_Flex.default, { alignItems: "stretch", style: { height: "100%" } }, inner);
|
|
194
195
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/components/form/BaseInput/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import styled, { css } from \"styled-components\";\nimport { typography, TypographyProps } from \"styled-system\";\nimport React, { InputHTMLAttributes, useState, useMemo, useCallback } from \"react\";\nimport CircledCrossSolidMedium from \"@ledgerhq/icons-ui/reactLegacy/CircledCrossSolidMedium\";\nimport FlexBox from \"../../layout/Flex\";\nimport Text from \"../../asorted/Text\";\nimport { rgba } from \"../../../styles/helpers\";\nimport { ButtonUnstyled } from \"../../cta/Button\";\n\ntype ValueType = HTMLInputElement[\"value\"];\n\nexport type CommonProps = InputHTMLAttributes<HTMLInputElement> &\n TypographyProps & {\n disabled?: boolean;\n error?: React.ReactNode;\n warning?: React.ReactNode;\n info?: React.ReactNode;\n };\n\nexport type InputProps<T = ValueType> = Omit<CommonProps, \"value\" | \"onChange\"> & {\n value: T;\n onChange?: (value: T) => void;\n onChangeEvent?: InputHTMLAttributes<HTMLInputElement>[\"onChange\"];\n renderLeft?: ((props: InputProps<T>) => React.ReactNode) | React.ReactNode;\n renderRight?: ((props: InputProps<T>) => React.ReactNode) | React.ReactNode;\n unwrapped?: boolean;\n containerProps?: InputContainerProps;\n clearable?: boolean;\n /**\n * A function can be provided to serialize a value of any type to a string.\n *\n * This can be useful to wrap the `<BaseInput />` component (which expects a string)\n * and create higher-level components that will automatically perform the input/output\n * conversion to other types.\n *\n * *A serializer function should always be used in conjunction with a deserializer function.*\n */\n serialize?: (value: T) => ValueType;\n /**\n * A deserializer can be provided to convert the html input value from a string to any other type.\n *\n * *A deserializer function should always be used in conjunction with a serializer function.*\n */\n deserialize?: (value: ValueType) => T;\n};\n\nexport type InputContainerProps = React.ComponentProps<typeof InputContainer>;\nexport const InputContainer = styled.div<Partial<CommonProps> & { focus?: boolean }>`\n display: flex;\n height: 48px;\n border: ${p => `1px solid ${p.theme.colors.neutral.c40}`};\n border-radius: 24px;\n transition: all 0.2s ease;\n color: ${p => p.theme.colors.neutral.c100};\n\n ${p =>\n p.focus &&\n !p.error &&\n !p.warning &&\n css`\n border: 1px solid ${p.theme.colors.primary.c80};\n box-shadow: 0 0 0 4px ${rgba(p.theme.colors.primary.c60, 0.4)};\n `};\n\n ${p =>\n p.error &&\n !p.disabled &&\n css`\n border: 1px solid ${p.theme.colors.error.c50};\n `};\n\n ${p =>\n !p.error &&\n p.warning &&\n !p.disabled &&\n css`\n border: 1px solid ${p.theme.colors.warning.c40};\n `};\n\n ${p =>\n !p.error &&\n !p.warning &&\n !p.disabled &&\n css`\n &:hover {\n border: ${!p.disabled && `1px solid ${p.theme.colors.primary.c80}`};\n }\n `};\n\n ${p =>\n p.disabled &&\n css`\n color: ${p.theme.colors.neutral.c60};\n background: ${p => p.theme.colors.neutral.c20};\n `};\n`;\n\nexport const BaseInput = styled.input.attrs<\n Partial<CommonProps> & { focus?: boolean } & TypographyProps\n>({\n fontSize: \"paragraph\",\n fontWeight: \"medium\",\n})<Partial<CommonProps> & { focus?: boolean } & TypographyProps>`\n height: 100%;\n width: 100%;\n border: 0;\n caret-color: ${p => (p.error ? p.theme.colors.error.c50 : p.theme.colors.primary.c80)};\n background: none;\n outline: none;\n cursor: ${p => (p.disabled ? \"not-allowed\" : \"text\")};\n flex-shrink: 1;\n padding-left: 20px;\n padding-right: 20px;\n &::placeholder {\n color: ${p => (p.disabled ? p.theme.colors.neutral.c50 : p.theme.colors.neutral.c70)};\n }\n\n /* stylelint-disable property-no-vendor-prefix */\n\n /* Hide type=number arrow for Chrome, Safari, Edge, Opera */\n &::-webkit-outer-spin-button,\n ::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n }\n\n /* Hide type=number arrow for Firefox */\n &[type=\"number\"] {\n -moz-appearance: textfield;\n }\n /* stylelint-enable property-no-vendor-prefix */\n\n ${typography}\n`;\n\nexport const InputErrorContainer = styled(Text)`\n color: ${p => p.theme.colors.error.c50};\n margin-left: 12px;\n`;\nexport const InputWarningContainer = styled(Text)`\n color: ${p => p.theme.colors.warning.c40};\n margin-left: 12px;\n`;\nexport const InputInfoContainer = styled(Text)`\n color: ${p => p.theme.colors.neutral.c60};\n margin-left: 12px;\n`;\n\nexport const InputRenderLeftContainer = styled(FlexBox).attrs(() => ({\n alignItems: \"center\",\n pl: \"16px\",\n}))``;\n\nexport const InputRenderRightContainer = styled(FlexBox).attrs(() => ({\n alignItems: \"center\",\n pr: \"16px\",\n}))``;\n\nexport const ClearableButtonUnstyled = styled(ButtonUnstyled)`\n display: flex;\n`;\n\n// Yes, this is dirty. If you can figure out a better way please change the code :).\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst IDENTITY = (_: any): any => _;\n\nfunction Input<T = ValueType>(\n props: InputProps<T>,\n ref?: React.ForwardedRef<HTMLInputElement>,\n): JSX.Element {\n const {\n value,\n disabled,\n error,\n warning,\n info,\n onChange,\n onChangeEvent,\n renderLeft,\n renderRight,\n unwrapped,\n containerProps,\n serialize = IDENTITY,\n deserialize = IDENTITY,\n clearable,\n ...htmlInputProps\n } = props;\n const [focus, setFocus] = useState(false);\n const inputValue = useMemo(() => serialize(value), [serialize, value]);\n\n const handleChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>) => {\n onChange && onChange(deserialize(e.target.value));\n onChangeEvent && onChangeEvent(e);\n },\n [onChange, onChangeEvent, deserialize],\n );\n\n const handleClear = useCallback(() => {\n onChange && onChange(deserialize(\"\"));\n }, [onChange, deserialize]);\n\n const inner = (\n <>\n {typeof renderLeft === \"function\" ? renderLeft(props) : renderLeft}\n <BaseInput\n ref={ref}\n {...htmlInputProps}\n disabled={disabled}\n error={error}\n warning={warning}\n info={info}\n onChange={handleChange}\n value={inputValue}\n onFocus={(event: React.FocusEvent<HTMLInputElement>) => {\n setFocus(true);\n htmlInputProps.onFocus && htmlInputProps.onFocus(event);\n }}\n onBlur={(event: React.FocusEvent<HTMLInputElement>) => {\n setFocus(false);\n htmlInputProps.onBlur && htmlInputProps.onBlur(event);\n }}\n />\n {clearable && inputValue && (\n <FlexBox alignItems={\"center\"} mr={7}>\n <ClearableButtonUnstyled onClick={handleClear}>\n <CircledCrossSolidMedium size={18} color={
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,+
|
|
4
|
+
"sourcesContent": ["import styled, { css, useTheme } from \"styled-components\";\nimport { typography, TypographyProps } from \"styled-system\";\nimport React, { InputHTMLAttributes, useState, useMemo, useCallback } from \"react\";\nimport CircledCrossSolidMedium from \"@ledgerhq/icons-ui/reactLegacy/CircledCrossSolidMedium\";\nimport FlexBox from \"../../layout/Flex\";\nimport Text from \"../../asorted/Text\";\nimport { rgba } from \"../../../styles/helpers\";\nimport { ButtonUnstyled } from \"../../cta/Button\";\n\ntype ValueType = HTMLInputElement[\"value\"];\n\nexport type CommonProps = InputHTMLAttributes<HTMLInputElement> &\n TypographyProps & {\n disabled?: boolean;\n error?: React.ReactNode;\n warning?: React.ReactNode;\n info?: React.ReactNode;\n };\n\nexport type InputProps<T = ValueType> = Omit<CommonProps, \"value\" | \"onChange\"> & {\n value: T;\n onChange?: (value: T) => void;\n onChangeEvent?: InputHTMLAttributes<HTMLInputElement>[\"onChange\"];\n renderLeft?: ((props: InputProps<T>) => React.ReactNode) | React.ReactNode;\n renderRight?: ((props: InputProps<T>) => React.ReactNode) | React.ReactNode;\n unwrapped?: boolean;\n containerProps?: InputContainerProps;\n clearable?: boolean;\n /**\n * A function can be provided to serialize a value of any type to a string.\n *\n * This can be useful to wrap the `<BaseInput />` component (which expects a string)\n * and create higher-level components that will automatically perform the input/output\n * conversion to other types.\n *\n * *A serializer function should always be used in conjunction with a deserializer function.*\n */\n serialize?: (value: T) => ValueType;\n /**\n * A deserializer can be provided to convert the html input value from a string to any other type.\n *\n * *A deserializer function should always be used in conjunction with a serializer function.*\n */\n deserialize?: (value: ValueType) => T;\n};\n\nexport type InputContainerProps = React.ComponentProps<typeof InputContainer>;\nexport const InputContainer = styled.div<Partial<CommonProps> & { focus?: boolean }>`\n display: flex;\n height: 48px;\n border: ${p => `1px solid ${p.theme.colors.neutral.c40}`};\n border-radius: 24px;\n transition: all 0.2s ease;\n color: ${p => p.theme.colors.neutral.c100};\n\n ${p =>\n p.focus &&\n !p.error &&\n !p.warning &&\n css`\n border: 1px solid ${p.theme.colors.primary.c80};\n box-shadow: 0 0 0 4px ${rgba(p.theme.colors.primary.c60, 0.4)};\n `};\n\n ${p =>\n p.error &&\n !p.disabled &&\n css`\n border: 1px solid ${p.theme.colors.error.c50};\n `};\n\n ${p =>\n !p.error &&\n p.warning &&\n !p.disabled &&\n css`\n border: 1px solid ${p.theme.colors.warning.c40};\n `};\n\n ${p =>\n !p.error &&\n !p.warning &&\n !p.disabled &&\n css`\n &:hover {\n border: ${!p.disabled && `1px solid ${p.theme.colors.primary.c80}`};\n }\n `};\n\n ${p =>\n p.disabled &&\n css`\n color: ${p.theme.colors.neutral.c60};\n background: ${p => p.theme.colors.neutral.c20};\n `};\n`;\n\nexport const BaseInput = styled.input.attrs<\n Partial<CommonProps> & { focus?: boolean } & TypographyProps\n>({\n fontSize: \"paragraph\",\n fontWeight: \"medium\",\n})<Partial<CommonProps> & { focus?: boolean } & TypographyProps>`\n height: 100%;\n width: 100%;\n border: 0;\n caret-color: ${p => (p.error ? p.theme.colors.error.c50 : p.theme.colors.primary.c80)};\n background: none;\n outline: none;\n cursor: ${p => (p.disabled ? \"not-allowed\" : \"text\")};\n flex-shrink: 1;\n padding-left: 20px;\n padding-right: 20px;\n &::placeholder {\n color: ${p => (p.disabled ? p.theme.colors.neutral.c50 : p.theme.colors.neutral.c70)};\n }\n\n /* stylelint-disable property-no-vendor-prefix */\n\n /* Hide type=number arrow for Chrome, Safari, Edge, Opera */\n &::-webkit-outer-spin-button,\n ::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n }\n\n /* Hide type=number arrow for Firefox */\n &[type=\"number\"] {\n -moz-appearance: textfield;\n }\n /* stylelint-enable property-no-vendor-prefix */\n\n ${typography}\n`;\n\nexport const InputErrorContainer = styled(Text)`\n color: ${p => p.theme.colors.error.c50};\n margin-left: 12px;\n`;\nexport const InputWarningContainer = styled(Text)`\n color: ${p => p.theme.colors.warning.c40};\n margin-left: 12px;\n`;\nexport const InputInfoContainer = styled(Text)`\n color: ${p => p.theme.colors.neutral.c60};\n margin-left: 12px;\n`;\n\nexport const InputRenderLeftContainer = styled(FlexBox).attrs(() => ({\n alignItems: \"center\",\n pl: \"16px\",\n}))``;\n\nexport const InputRenderRightContainer = styled(FlexBox).attrs(() => ({\n alignItems: \"center\",\n pr: \"16px\",\n}))``;\n\nexport const ClearableButtonUnstyled = styled(ButtonUnstyled)`\n display: flex;\n`;\n\n// Yes, this is dirty. If you can figure out a better way please change the code :).\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst IDENTITY = (_: any): any => _;\n\nfunction Input<T = ValueType>(\n props: InputProps<T>,\n ref?: React.ForwardedRef<HTMLInputElement>,\n): JSX.Element {\n const { colors } = useTheme();\n const {\n value,\n disabled,\n error,\n warning,\n info,\n onChange,\n onChangeEvent,\n renderLeft,\n renderRight,\n unwrapped,\n containerProps,\n serialize = IDENTITY,\n deserialize = IDENTITY,\n clearable,\n ...htmlInputProps\n } = props;\n const [focus, setFocus] = useState(false);\n const inputValue = useMemo(() => serialize(value), [serialize, value]);\n\n const handleChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>) => {\n onChange && onChange(deserialize(e.target.value));\n onChangeEvent && onChangeEvent(e);\n },\n [onChange, onChangeEvent, deserialize],\n );\n\n const handleClear = useCallback(() => {\n onChange && onChange(deserialize(\"\"));\n }, [onChange, deserialize]);\n\n const inner = (\n <>\n {typeof renderLeft === \"function\" ? renderLeft(props) : renderLeft}\n <BaseInput\n ref={ref}\n {...htmlInputProps}\n disabled={disabled}\n error={error}\n warning={warning}\n info={info}\n onChange={handleChange}\n value={inputValue}\n onFocus={(event: React.FocusEvent<HTMLInputElement>) => {\n setFocus(true);\n htmlInputProps.onFocus && htmlInputProps.onFocus(event);\n }}\n onBlur={(event: React.FocusEvent<HTMLInputElement>) => {\n setFocus(false);\n htmlInputProps.onBlur && htmlInputProps.onBlur(event);\n }}\n />\n {clearable && inputValue && (\n <FlexBox alignItems={\"center\"} mr={7}>\n <ClearableButtonUnstyled onClick={handleClear}>\n <CircledCrossSolidMedium size={18} color={colors.neutral.c50} />\n </ClearableButtonUnstyled>\n </FlexBox>\n )}\n {typeof renderRight === \"function\" ? renderRight(props) : renderRight}\n </>\n );\n\n if (unwrapped) {\n return (\n <FlexBox alignItems=\"stretch\" style={{ height: \"100%\" }}>\n {inner}\n </FlexBox>\n );\n }\n\n return (\n <div>\n <InputContainer\n disabled={disabled}\n focus={focus}\n error={error}\n warning={warning}\n {...containerProps}\n >\n {inner}\n </InputContainer>\n {(error || warning || info) && !disabled && (\n <FlexBox flexDirection=\"column\" rowGap={2} mt={2}>\n {error ? (\n <InputErrorContainer variant=\"small\">{error}</InputErrorContainer>\n ) : warning ? (\n <InputWarningContainer variant=\"small\">{warning}</InputWarningContainer>\n ) : info ? (\n <InputInfoContainer variant=\"small\">{info}</InputInfoContainer>\n ) : null}\n </FlexBox>\n )}\n </div>\n );\n}\n\nexport default React.forwardRef(Input) as <T>(\n props: InputProps<T> & { ref?: React.ForwardedRef<HTMLInputElement> },\n) => ReturnType<typeof Input>;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["styled", "p", "Text", "FlexBox", "React", "CircledCrossSolidMedium"]
|
|
7
7
|
}
|
|
@@ -0,0 +1,129 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
var NumberedList_stories_exports = {};
|
|
30
|
+
__export(NumberedList_stories_exports, {
|
|
31
|
+
Default: () => Default,
|
|
32
|
+
default: () => NumberedList_stories_default
|
|
33
|
+
});
|
|
34
|
+
module.exports = __toCommonJS(NumberedList_stories_exports);
|
|
35
|
+
var import_react = __toESM(require("react"));
|
|
36
|
+
var import_Flex = __toESM(require("../../Flex"));
|
|
37
|
+
var import_asorted = require("../../../asorted");
|
|
38
|
+
var import__ = __toESM(require("."));
|
|
39
|
+
var import_styled_components = require("styled-components");
|
|
40
|
+
const description = `
|
|
41
|
+
### A NumberedList List
|
|
42
|
+
|
|
43
|
+
This components accepts an Array of object like this:
|
|
44
|
+
## Usage
|
|
45
|
+
|
|
46
|
+
\`\`\`js
|
|
47
|
+
|
|
48
|
+
const steps = [
|
|
49
|
+
{
|
|
50
|
+
/**
|
|
51
|
+
* title is the title of the step
|
|
52
|
+
*/
|
|
53
|
+
title: string;
|
|
54
|
+
},
|
|
55
|
+
];
|
|
56
|
+
|
|
57
|
+
<NumberedList steps={steps} />
|
|
58
|
+
\`\`\`
|
|
59
|
+
`;
|
|
60
|
+
var NumberedList_stories_default = {
|
|
61
|
+
title: "Layout/List/NumberedList",
|
|
62
|
+
argTypes: {
|
|
63
|
+
steps: {
|
|
64
|
+
control: "disabled"
|
|
65
|
+
}
|
|
66
|
+
},
|
|
67
|
+
parameters: {
|
|
68
|
+
docs: {
|
|
69
|
+
description: {
|
|
70
|
+
component: description
|
|
71
|
+
}
|
|
72
|
+
}
|
|
73
|
+
}
|
|
74
|
+
};
|
|
75
|
+
const defaultItems = [
|
|
76
|
+
{
|
|
77
|
+
element: "General information"
|
|
78
|
+
},
|
|
79
|
+
{
|
|
80
|
+
element: /* @__PURE__ */ import_react.default.createElement(import_asorted.Text, { fontSize: 14, variant: "body", color: "error.c40", ml: "12px", fontWeight: "500" }, "General information")
|
|
81
|
+
},
|
|
82
|
+
{
|
|
83
|
+
element: "General information"
|
|
84
|
+
},
|
|
85
|
+
{
|
|
86
|
+
element: /* @__PURE__ */ import_react.default.createElement(import_asorted.Text, { fontSize: 14, variant: "body", color: "primary.c80", ml: "12px", fontWeight: "500" }, "General information")
|
|
87
|
+
},
|
|
88
|
+
{
|
|
89
|
+
element: "General information"
|
|
90
|
+
}
|
|
91
|
+
];
|
|
92
|
+
const defaultItemsWithNothing = [
|
|
93
|
+
{
|
|
94
|
+
element: "General information"
|
|
95
|
+
},
|
|
96
|
+
{
|
|
97
|
+
element: "General information"
|
|
98
|
+
},
|
|
99
|
+
{
|
|
100
|
+
element: /* @__PURE__ */ import_react.default.createElement(import_asorted.Text, { fontSize: 14, variant: "body", color: "error.c50", ml: "12px", fontWeight: "500" }, "General information")
|
|
101
|
+
}
|
|
102
|
+
];
|
|
103
|
+
const Template = () => {
|
|
104
|
+
const { colors } = (0, import_styled_components.useTheme)();
|
|
105
|
+
return /* @__PURE__ */ import_react.default.createElement(
|
|
106
|
+
import_Flex.default,
|
|
107
|
+
{
|
|
108
|
+
flexDirection: "column",
|
|
109
|
+
height: 500,
|
|
110
|
+
rowGap: "40px",
|
|
111
|
+
alignItems: "center",
|
|
112
|
+
justifyContent: "center",
|
|
113
|
+
bg: "neutral.c30"
|
|
114
|
+
},
|
|
115
|
+
/* @__PURE__ */ import_react.default.createElement(import__.default, { steps: defaultItems }),
|
|
116
|
+
/* @__PURE__ */ import_react.default.createElement(import_asorted.Divider, { my: 1, text: "Customized List" }),
|
|
117
|
+
/* @__PURE__ */ import_react.default.createElement(
|
|
118
|
+
import__.default,
|
|
119
|
+
{
|
|
120
|
+
steps: defaultItemsWithNothing,
|
|
121
|
+
bgIndexColor: colors.success.c60,
|
|
122
|
+
indexColor: colors.constant.black,
|
|
123
|
+
textColor: "primary.c60"
|
|
124
|
+
}
|
|
125
|
+
)
|
|
126
|
+
);
|
|
127
|
+
};
|
|
128
|
+
const Default = Template.bind({});
|
|
129
|
+
//# sourceMappingURL=NumberedList.stories.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../../src/components/layout/List/NumberedList/NumberedList.stories.tsx"],
|
|
4
|
+
"sourcesContent": ["import React from \"react\";\nimport Flex from \"../../Flex\";\nimport { Text, Divider } from \"../../../asorted\";\nimport type { Item } from \".\";\nimport NumberedList from \".\";\nimport { useTheme } from \"styled-components\";\nconst description = `\n### A NumberedList List\n\nThis components accepts an Array of object like this:\n## Usage\n\n\\`\\`\\`js\n\nconst steps = [\n {\n /**\n * title is the title of the step\n */\n title: string;\n },\n ];\n\n<NumberedList steps={steps} />\n\\`\\`\\`\n`;\n\nexport default {\n title: \"Layout/List/NumberedList\",\n argTypes: {\n steps: {\n control: \"disabled\",\n },\n },\n parameters: {\n docs: {\n description: {\n component: description,\n },\n },\n },\n};\n\nconst defaultItems: Item[] = [\n {\n element: \"General information\",\n },\n {\n element: (\n <Text fontSize={14} variant=\"body\" color={\"error.c40\"} ml=\"12px\" fontWeight=\"500\">\n {\"General information\"}\n </Text>\n ),\n },\n {\n element: \"General information\",\n },\n {\n element: (\n <Text fontSize={14} variant=\"body\" color={\"primary.c80\"} ml=\"12px\" fontWeight=\"500\">\n {\"General information\"}\n </Text>\n ),\n },\n {\n element: \"General information\",\n },\n];\n\nconst defaultItemsWithNothing: Item[] = [\n {\n element: \"General information\",\n },\n {\n element: \"General information\",\n },\n {\n element: (\n <Text fontSize={14} variant=\"body\" color={\"error.c50\"} ml=\"12px\" fontWeight=\"500\">\n {\"General information\"}\n </Text>\n ),\n },\n];\n\nconst Template = () => {\n const { colors } = useTheme();\n return (\n <Flex\n flexDirection=\"column\"\n height={500}\n rowGap=\"40px\"\n alignItems=\"center\"\n justifyContent=\"center\"\n bg=\"neutral.c30\"\n >\n <NumberedList steps={defaultItems} />\n <Divider my={1} text=\"Customized List\" />\n <NumberedList\n steps={defaultItemsWithNothing}\n bgIndexColor={colors.success.c60}\n indexColor={colors.constant.black}\n textColor={\"primary.c60\"}\n />\n </Flex>\n );\n};\n\nexport const Default = Template.bind({});\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAClB,kBAAiB;AACjB,qBAA8B;AAE9B,eAAyB;AACzB,+BAAyB;AACzB,MAAM,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAqBpB,IAAO,+BAAQ;AAAA,EACb,OAAO;AAAA,EACP,UAAU;AAAA,IACR,OAAO;AAAA,MACL,SAAS;AAAA,IACX;AAAA,EACF;AAAA,EACA,YAAY;AAAA,IACV,MAAM;AAAA,MACJ,aAAa;AAAA,QACX,WAAW;AAAA,MACb;AAAA,IACF;AAAA,EACF;AACF;AAEA,MAAM,eAAuB;AAAA,EAC3B;AAAA,IACE,SAAS;AAAA,EACX;AAAA,EACA;AAAA,IACE,SACE,6BAAAA,QAAA,cAAC,uBAAK,UAAU,IAAI,SAAQ,QAAO,OAAO,aAAa,IAAG,QAAO,YAAW,SACzE,qBACH;AAAA,EAEJ;AAAA,EACA;AAAA,IACE,SAAS;AAAA,EACX;AAAA,EACA;AAAA,IACE,SACE,6BAAAA,QAAA,cAAC,uBAAK,UAAU,IAAI,SAAQ,QAAO,OAAO,eAAe,IAAG,QAAO,YAAW,SAC3E,qBACH;AAAA,EAEJ;AAAA,EACA;AAAA,IACE,SAAS;AAAA,EACX;AACF;AAEA,MAAM,0BAAkC;AAAA,EACtC;AAAA,IACE,SAAS;AAAA,EACX;AAAA,EACA;AAAA,IACE,SAAS;AAAA,EACX;AAAA,EACA;AAAA,IACE,SACE,6BAAAA,QAAA,cAAC,uBAAK,UAAU,IAAI,SAAQ,QAAO,OAAO,aAAa,IAAG,QAAO,YAAW,SACzE,qBACH;AAAA,EAEJ;AACF;AAEA,MAAM,WAAW,MAAM;AACrB,QAAM,EAAE,OAAO,QAAI,mCAAS;AAC5B,SACE,6BAAAA,QAAA;AAAA,IAAC,YAAAC;AAAA,IAAA;AAAA,MACC,eAAc;AAAA,MACd,QAAQ;AAAA,MACR,QAAO;AAAA,MACP,YAAW;AAAA,MACX,gBAAe;AAAA,MACf,IAAG;AAAA;AAAA,IAEH,6BAAAD,QAAA,cAAC,SAAAE,SAAA,EAAa,OAAO,cAAc;AAAA,IACnC,6BAAAF,QAAA,cAAC,0BAAQ,IAAI,GAAG,MAAK,mBAAkB;AAAA,IACvC,6BAAAA,QAAA;AAAA,MAAC,SAAAE;AAAA,MAAA;AAAA,QACC,OAAO;AAAA,QACP,cAAc,OAAO,QAAQ;AAAA,QAC7B,YAAY,OAAO,SAAS;AAAA,QAC5B,WAAW;AAAA;AAAA,IACb;AAAA,EACF;AAEJ;AAEO,MAAM,UAAU,SAAS,KAAK,CAAC,CAAC;",
|
|
6
|
+
"names": ["React", "Flex", "NumberedList"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
var NumberedList_exports = {};
|
|
30
|
+
__export(NumberedList_exports, {
|
|
31
|
+
default: () => NumberedList
|
|
32
|
+
});
|
|
33
|
+
module.exports = __toCommonJS(NumberedList_exports);
|
|
34
|
+
var import_react = __toESM(require("react"));
|
|
35
|
+
var import_styled_components = __toESM(require("styled-components"));
|
|
36
|
+
var import_Flex = __toESM(require("../../Flex"));
|
|
37
|
+
var import_Text = __toESM(require("../../../asorted/Text"));
|
|
38
|
+
var import_helpers = require("../../../../styles/helpers");
|
|
39
|
+
function NumberedList({ steps, bgIndexColor, indexColor, textColor }) {
|
|
40
|
+
const { colors } = (0, import_styled_components.useTheme)();
|
|
41
|
+
const backgroundIndexColor = bgIndexColor ?? colors.primary.c80;
|
|
42
|
+
const indexTextColor = indexColor ?? colors.neutral.c00;
|
|
43
|
+
const mainTextColor = textColor ?? (0, import_helpers.rgba)(colors.neutral.c100, 0.7);
|
|
44
|
+
return /* @__PURE__ */ import_react.default.createElement(import_Flex.default, { flexDirection: "column", rowGap: "14px" }, steps == null ? void 0 : steps.map((step, index) => /* @__PURE__ */ import_react.default.createElement(import_Flex.default, { key: index, flexDirection: "row", alignItems: "center" }, NumberItem(index + 1, backgroundIndexColor, indexTextColor), typeof step.element === "string" ? /* @__PURE__ */ import_react.default.createElement(
|
|
45
|
+
import_Text.default,
|
|
46
|
+
{
|
|
47
|
+
key: index,
|
|
48
|
+
fontSize: 14,
|
|
49
|
+
variant: "body",
|
|
50
|
+
color: mainTextColor,
|
|
51
|
+
ml: "12px",
|
|
52
|
+
fontWeight: "500",
|
|
53
|
+
flex: 1
|
|
54
|
+
},
|
|
55
|
+
step.element
|
|
56
|
+
) : step.element)));
|
|
57
|
+
}
|
|
58
|
+
const NumberItem = (index, bgColor, color) => {
|
|
59
|
+
return /* @__PURE__ */ import_react.default.createElement(StyledNumberItem, { bgColor }, /* @__PURE__ */ import_react.default.createElement(import_Text.default, { color, fontWeight: "900", fontSize: "11px" }, index));
|
|
60
|
+
};
|
|
61
|
+
const StyledNumberItem = (0, import_styled_components.default)(import_Flex.default)`
|
|
62
|
+
border-radius: 50%;
|
|
63
|
+
background-color: ${(p) => p.bgColor};
|
|
64
|
+
align-items: center;
|
|
65
|
+
justify-content: center;
|
|
66
|
+
height: 16px;
|
|
67
|
+
width: 16px;
|
|
68
|
+
`;
|
|
69
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../../src/components/layout/List/NumberedList/index.tsx"],
|
|
4
|
+
"sourcesContent": ["import React from \"react\";\nimport styled, { useTheme } from \"styled-components\";\nimport Flex from \"../../Flex\";\nimport Text from \"../../../asorted/Text\";\nimport { rgba } from \"../../../../styles/helpers\";\n\nexport type Item = {\n element: React.ReactNode | string;\n};\n\nexport type Props = {\n steps: Item[];\n bgIndexColor?: string;\n indexColor?: string;\n textColor?: string;\n};\n\nexport default function NumberedList({ steps, bgIndexColor, indexColor, textColor }: Props) {\n const { colors } = useTheme();\n const backgroundIndexColor = bgIndexColor ?? colors.primary.c80;\n const indexTextColor = indexColor ?? colors.neutral.c00;\n const mainTextColor = textColor ?? rgba(colors.neutral.c100, 0.7);\n return (\n <Flex flexDirection=\"column\" rowGap={\"14px\"}>\n {steps?.map((step, index) => (\n <Flex key={index} flexDirection=\"row\" alignItems=\"center\">\n {NumberItem(index + 1, backgroundIndexColor, indexTextColor)}\n\n {typeof step.element === \"string\" ? (\n <Text\n key={index}\n fontSize={14}\n variant=\"body\"\n color={mainTextColor}\n ml=\"12px\"\n fontWeight=\"500\"\n flex={1}\n >\n {step.element}\n </Text>\n ) : (\n step.element\n )}\n </Flex>\n ))}\n </Flex>\n );\n}\n\nconst NumberItem = (index: number, bgColor: string, color: string) => {\n return (\n <StyledNumberItem bgColor={bgColor}>\n <Text color={color} fontWeight=\"900\" fontSize={\"11px\"}>\n {index}\n </Text>\n </StyledNumberItem>\n );\n};\n\nconst StyledNumberItem = styled(Flex)<{ bgColor: string }>`\n border-radius: 50%;\n background-color: ${p => p.bgColor};\n align-items: center;\n justify-content: center;\n height: 16px;\n width: 16px;\n`;\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAClB,+BAAiC;AACjC,kBAAiB;AACjB,kBAAiB;AACjB,qBAAqB;AAaN,SAAR,aAA8B,EAAE,OAAO,cAAc,YAAY,UAAU,GAAU;AAC1F,QAAM,EAAE,OAAO,QAAI,mCAAS;AAC5B,QAAM,uBAAuB,gBAAgB,OAAO,QAAQ;AAC5D,QAAM,iBAAiB,cAAc,OAAO,QAAQ;AACpD,QAAM,gBAAgB,iBAAa,qBAAK,OAAO,QAAQ,MAAM,GAAG;AAChE,SACE,6BAAAA,QAAA,cAAC,YAAAC,SAAA,EAAK,eAAc,UAAS,QAAQ,UAClC,+BAAO,IAAI,CAAC,MAAM,UACjB,6BAAAD,QAAA,cAAC,YAAAC,SAAA,EAAK,KAAK,OAAO,eAAc,OAAM,YAAW,YAC9C,WAAW,QAAQ,GAAG,sBAAsB,cAAc,GAE1D,OAAO,KAAK,YAAY,WACvB,6BAAAD,QAAA;AAAA,IAAC,YAAAE;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,UAAU;AAAA,MACV,SAAQ;AAAA,MACR,OAAO;AAAA,MACP,IAAG;AAAA,MACH,YAAW;AAAA,MACX,MAAM;AAAA;AAAA,IAEL,KAAK;AAAA,EACR,IAEA,KAAK,OAET,EAEJ;AAEJ;AAEA,MAAM,aAAa,CAAC,OAAe,SAAiB,UAAkB;AACpE,SACE,6BAAAF,QAAA,cAAC,oBAAiB,WAChB,6BAAAA,QAAA,cAAC,YAAAE,SAAA,EAAK,OAAc,YAAW,OAAM,UAAU,UAC5C,KACH,CACF;AAEJ;AAEA,MAAM,uBAAmB,yBAAAC,SAAO,YAAAF,OAAI;AAAA;AAAA,sBAEd,OAAK,EAAE,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;",
|
|
6
|
+
"names": ["React", "Flex", "Text", "styled"]
|
|
7
|
+
}
|
|
@@ -33,6 +33,7 @@ __export(layout_exports, {
|
|
|
33
33
|
Drawer: () => import_Drawer.default,
|
|
34
34
|
Flex: () => import_Flex.default,
|
|
35
35
|
Grid: () => import_Grid.default,
|
|
36
|
+
NumberedList: () => import_NumberedList.default,
|
|
36
37
|
Popin: () => import_Popin.default,
|
|
37
38
|
Side: () => import_Side.default,
|
|
38
39
|
VerticalTimeline: () => import_VerticalTimeline.default
|
|
@@ -46,4 +47,5 @@ var import_Side = __toESM(require("./Side"));
|
|
|
46
47
|
var import_Drawer = __toESM(require("./Drawer"));
|
|
47
48
|
var import_Carousel = __toESM(require("./Carousel"));
|
|
48
49
|
var import_VerticalTimeline = __toESM(require("./List/VerticalTimeline"));
|
|
50
|
+
var import_NumberedList = __toESM(require("./List/NumberedList"));
|
|
49
51
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/components/layout/index.ts"],
|
|
4
|
-
"sourcesContent": ["export { default as Flex } from \"./Flex\";\nexport { default as Box } from \"./Box\";\nexport { default as Grid } from \"./Grid\";\nexport { default as Popin } from \"./Popin\";\nexport { default as Side } from \"./Side\";\nexport { default as Drawer } from \"./Drawer\";\nexport { default as Carousel } from \"./Carousel\";\nexport { default as VerticalTimeline } from \"./List/VerticalTimeline\";\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAAgC;AAChC,iBAA+B;AAC/B,kBAAgC;AAChC,mBAAiC;AACjC,kBAAgC;AAChC,oBAAkC;AAClC,sBAAoC;AACpC,8BAA4C;",
|
|
4
|
+
"sourcesContent": ["export { default as Flex } from \"./Flex\";\nexport { default as Box } from \"./Box\";\nexport { default as Grid } from \"./Grid\";\nexport { default as Popin } from \"./Popin\";\nexport { default as Side } from \"./Side\";\nexport { default as Drawer } from \"./Drawer\";\nexport { default as Carousel } from \"./Carousel\";\nexport { default as VerticalTimeline } from \"./List/VerticalTimeline\";\nexport { default as NumberedList } from \"./List/NumberedList\";\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAAgC;AAChC,iBAA+B;AAC/B,kBAAgC;AAChC,mBAAiC;AACjC,kBAAgC;AAChC,oBAAkC;AAClC,sBAAoC;AACpC,8BAA4C;AAC5C,0BAAwC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -9,7 +9,7 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
9
9
|
}
|
|
10
10
|
return t;
|
|
11
11
|
};
|
|
12
|
-
import styled, { css } from "styled-components";
|
|
12
|
+
import styled, { css, useTheme } from "styled-components";
|
|
13
13
|
import { typography } from "styled-system";
|
|
14
14
|
import React, { useState, useMemo, useCallback } from "react";
|
|
15
15
|
import CircledCrossSolidMedium from "@ledgerhq/icons-ui/reactLegacy/CircledCrossSolidMedium";
|
|
@@ -123,6 +123,7 @@ export const ClearableButtonUnstyled = styled(ButtonUnstyled) `
|
|
|
123
123
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
124
124
|
const IDENTITY = (_) => _;
|
|
125
125
|
function Input(props, ref) {
|
|
126
|
+
const { colors } = useTheme();
|
|
126
127
|
const { value, disabled, error, warning, info, onChange, onChangeEvent, renderLeft, renderRight, unwrapped, containerProps, serialize = IDENTITY, deserialize = IDENTITY, clearable } = props, htmlInputProps = __rest(props, ["value", "disabled", "error", "warning", "info", "onChange", "onChangeEvent", "renderLeft", "renderRight", "unwrapped", "containerProps", "serialize", "deserialize", "clearable"]);
|
|
127
128
|
const [focus, setFocus] = useState(false);
|
|
128
129
|
const inputValue = useMemo(() => serialize(value), [serialize, value]);
|
|
@@ -144,7 +145,7 @@ function Input(props, ref) {
|
|
|
144
145
|
} })),
|
|
145
146
|
clearable && inputValue && (React.createElement(FlexBox, { alignItems: "center", mr: 7 },
|
|
146
147
|
React.createElement(ClearableButtonUnstyled, { onClick: handleClear },
|
|
147
|
-
React.createElement(CircledCrossSolidMedium, { size: 18, color:
|
|
148
|
+
React.createElement(CircledCrossSolidMedium, { size: 18, color: colors.neutral.c50 })))),
|
|
148
149
|
typeof renderRight === "function" ? renderRight(props) : renderRight));
|
|
149
150
|
if (unwrapped) {
|
|
150
151
|
return (React.createElement(FlexBox, { alignItems: "stretch", style: { height: "100%" } }, inner));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/form/BaseInput/index.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/form/BaseInput/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
export type Item = {
|
|
3
|
+
element: React.ReactNode | string;
|
|
4
|
+
};
|
|
5
|
+
export type Props = {
|
|
6
|
+
steps: Item[];
|
|
7
|
+
bgIndexColor?: string;
|
|
8
|
+
indexColor?: string;
|
|
9
|
+
textColor?: string;
|
|
10
|
+
};
|
|
11
|
+
export default function NumberedList({ steps, bgIndexColor, indexColor, textColor }: Props): React.JSX.Element;
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import styled, { useTheme } from "styled-components";
|
|
3
|
+
import Flex from "../../Flex";
|
|
4
|
+
import Text from "../../../asorted/Text";
|
|
5
|
+
import { rgba } from "../../../../styles/helpers";
|
|
6
|
+
export default function NumberedList({ steps, bgIndexColor, indexColor, textColor }) {
|
|
7
|
+
const { colors } = useTheme();
|
|
8
|
+
const backgroundIndexColor = bgIndexColor !== null && bgIndexColor !== void 0 ? bgIndexColor : colors.primary.c80;
|
|
9
|
+
const indexTextColor = indexColor !== null && indexColor !== void 0 ? indexColor : colors.neutral.c00;
|
|
10
|
+
const mainTextColor = textColor !== null && textColor !== void 0 ? textColor : rgba(colors.neutral.c100, 0.7);
|
|
11
|
+
return (React.createElement(Flex, { flexDirection: "column", rowGap: "14px" }, steps === null || steps === void 0 ? void 0 : steps.map((step, index) => (React.createElement(Flex, { key: index, flexDirection: "row", alignItems: "center" },
|
|
12
|
+
NumberItem(index + 1, backgroundIndexColor, indexTextColor),
|
|
13
|
+
typeof step.element === "string" ? (React.createElement(Text, { key: index, fontSize: 14, variant: "body", color: mainTextColor, ml: "12px", fontWeight: "500", flex: 1 }, step.element)) : (step.element))))));
|
|
14
|
+
}
|
|
15
|
+
const NumberItem = (index, bgColor, color) => {
|
|
16
|
+
return (React.createElement(StyledNumberItem, { bgColor: bgColor },
|
|
17
|
+
React.createElement(Text, { color: color, fontWeight: "900", fontSize: "11px" }, index)));
|
|
18
|
+
};
|
|
19
|
+
const StyledNumberItem = styled(Flex) `
|
|
20
|
+
border-radius: 50%;
|
|
21
|
+
background-color: ${p => p.bgColor};
|
|
22
|
+
align-items: center;
|
|
23
|
+
justify-content: center;
|
|
24
|
+
height: 16px;
|
|
25
|
+
width: 16px;
|
|
26
|
+
`;
|
|
27
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/layout/List/NumberedList/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,EAAE,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,IAAI,MAAM,YAAY,CAAC;AAC9B,OAAO,IAAI,MAAM,uBAAuB,CAAC;AACzC,OAAO,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;AAalD,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,SAAS,EAAS;IACxF,MAAM,EAAE,MAAM,EAAE,GAAG,QAAQ,EAAE,CAAC;IAC9B,MAAM,oBAAoB,GAAG,YAAY,aAAZ,YAAY,cAAZ,YAAY,GAAI,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC;IAChE,MAAM,cAAc,GAAG,UAAU,aAAV,UAAU,cAAV,UAAU,GAAI,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC;IACxD,MAAM,aAAa,GAAG,SAAS,aAAT,SAAS,cAAT,SAAS,GAAI,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;IAClE,OAAO,CACL,oBAAC,IAAI,IAAC,aAAa,EAAC,QAAQ,EAAC,MAAM,EAAE,MAAM,IACxC,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CAC3B,oBAAC,IAAI,IAAC,GAAG,EAAE,KAAK,EAAE,aAAa,EAAC,KAAK,EAAC,UAAU,EAAC,QAAQ;QACtD,UAAU,CAAC,KAAK,GAAG,CAAC,EAAE,oBAAoB,EAAE,cAAc,CAAC;QAE3D,OAAO,IAAI,CAAC,OAAO,KAAK,QAAQ,CAAC,CAAC,CAAC,CAClC,oBAAC,IAAI,IACH,GAAG,EAAE,KAAK,EACV,QAAQ,EAAE,EAAE,EACZ,OAAO,EAAC,MAAM,EACd,KAAK,EAAE,aAAa,EACpB,EAAE,EAAC,MAAM,EACT,UAAU,EAAC,KAAK,EAChB,IAAI,EAAE,CAAC,IAEN,IAAI,CAAC,OAAO,CACR,CACR,CAAC,CAAC,CAAC,CACF,IAAI,CAAC,OAAO,CACb,CACI,CACR,CAAC,CACG,CACR,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,GAAG,CAAC,KAAa,EAAE,OAAe,EAAE,KAAa,EAAE,EAAE;IACnE,OAAO,CACL,oBAAC,gBAAgB,IAAC,OAAO,EAAE,OAAO;QAChC,oBAAC,IAAI,IAAC,KAAK,EAAE,KAAK,EAAE,UAAU,EAAC,KAAK,EAAC,QAAQ,EAAE,MAAM,IAClD,KAAK,CACD,CACU,CACpB,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,gBAAgB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAqB;;sBAEpC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO;;;;;CAKnC,CAAC"}
|
|
@@ -6,3 +6,4 @@ export { default as Side } from "./Side";
|
|
|
6
6
|
export { default as Drawer } from "./Drawer";
|
|
7
7
|
export { default as Carousel } from "./Carousel";
|
|
8
8
|
export { default as VerticalTimeline } from "./List/VerticalTimeline";
|
|
9
|
+
export { default as NumberedList } from "./List/NumberedList";
|
|
@@ -6,4 +6,5 @@ export { default as Side } from "./Side";
|
|
|
6
6
|
export { default as Drawer } from "./Drawer";
|
|
7
7
|
export { default as Carousel } from "./Carousel";
|
|
8
8
|
export { default as VerticalTimeline } from "./List/VerticalTimeline";
|
|
9
|
+
export { default as NumberedList } from "./List/NumberedList";
|
|
9
10
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/layout/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,EAAE,OAAO,IAAI,GAAG,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC;AAC7C,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,yBAAyB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/layout/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,EAAE,OAAO,IAAI,GAAG,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC;AAC7C,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AACtE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,qBAAqB,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ledgerhq/react-ui",
|
|
3
|
-
"version": "0.15.
|
|
3
|
+
"version": "0.15.1-next.0",
|
|
4
4
|
"description": "Ledger Live - Desktop UI",
|
|
5
5
|
"author": "Ledger Live Team <team-live@ledger.fr>",
|
|
6
6
|
"repository": {
|
|
@@ -66,8 +66,8 @@
|
|
|
66
66
|
"react-transition-group": "^4.4.2",
|
|
67
67
|
"react-window": "^1.8.6",
|
|
68
68
|
"styled-system": "^5.1.5",
|
|
69
|
-
"@ledgerhq/crypto-icons-ui": "^1.2.0
|
|
70
|
-
"@ledgerhq/icons-ui": "^0.7.0
|
|
69
|
+
"@ledgerhq/crypto-icons-ui": "^1.2.0",
|
|
70
|
+
"@ledgerhq/icons-ui": "^0.7.0",
|
|
71
71
|
"@ledgerhq/ui-shared": "^0.2.1"
|
|
72
72
|
},
|
|
73
73
|
"peerDependencies": {
|