@ledgerhq/react-ui 0.14.10-nightly.0 → 0.14.10-nightly.2
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/Chart/Chart.stories.js.map +1 -1
- package/lib/cjs/components/Tag/index.js.map +1 -1
- package/lib/cjs/components/layout/List/VerticalTimeline/TimelineIndicator.js.map +1 -1
- package/lib/cjs/components/layout/List/VerticalTimeline/TimelineItem.js.map +1 -1
- package/lib/cjs/components/layout/List/VerticalTimeline/index.js.map +1 -1
- package/lib/cjs/styles/theme.js +8 -8
- package/lib/cjs/styles/theme.js.map +2 -2
- package/lib/components/layout/List/VerticalTimeline/index.d.ts +1 -1
- package/lib/styles/theme.js +8 -8
- package/lib/styles/theme.js.map +1 -1
- package/package.json +6 -5
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/components/Chart/Chart.stories.tsx"],
|
|
4
|
-
"sourcesContent": ["import React from \"react\";\nimport styled, { useTheme } from \"styled-components\";\n\nimport Chart from \"./index\";\nimport type { Props as ChartPreviewProps } from \"./index\";\nimport Flex from \"../layout/Flex\";\nimport Button from \"../cta/Button\";\nimport type { Item } from \"./types\";\n\nfunction getRandomChartDate() {\n const fromTime = new Date(\"2020-09-01T01:57:45.271Z\");\n const toTime = new Date(\"2021-02-12T01:57:45.271Z\");\n return new Date(fromTime.getTime() + Math.random() * (toTime.getTime() - fromTime.getTime()));\n}\n\nfunction getRandomChartValue() {\n const min = 1_000;\n const max = 2_500_000;\n return Math.floor(Math.random() * (max - min) + min);\n}\n\nconst generateData = () => {\n return new Array(50)\n .fill({})\n .map(() => ({ value: getRandomChartValue(), date: getRandomChartDate() } as Item)
|
|
4
|
+
"sourcesContent": ["import React from \"react\";\nimport styled, { useTheme } from \"styled-components\";\n\nimport Chart from \"./index\";\nimport type { Props as ChartPreviewProps } from \"./index\";\nimport Flex from \"../layout/Flex\";\nimport Button from \"../cta/Button\";\nimport type { Item } from \"./types\";\n\nfunction getRandomChartDate() {\n const fromTime = new Date(\"2020-09-01T01:57:45.271Z\");\n const toTime = new Date(\"2021-02-12T01:57:45.271Z\");\n return new Date(fromTime.getTime() + Math.random() * (toTime.getTime() - fromTime.getTime()));\n}\n\nfunction getRandomChartValue() {\n const min = 1_000;\n const max = 2_500_000;\n return Math.floor(Math.random() * (max - min) + min);\n}\n\nconst generateData = () => {\n return new Array(50)\n .fill({})\n .map(() => ({ value: getRandomChartValue(), date: getRandomChartDate() }) as Item)\n .sort((a, b) => new Date(a.date).getTime() - new Date(b.date).getTime());\n};\n\nexport default {\n title: \"Charts/Chart\",\n component: Chart,\n argTypes: {\n data: {\n control: false,\n description:\n \"Date is the only accepted type on the x-axis. On the y-axis, number and string are accepted.\",\n },\n color: {\n type: \"string\",\n control: \"color\",\n defaultValue: \"#0EBDCD\",\n description:\n \"This property defines the color of the stroke and the color used to created the gradient. This property any color format.\",\n },\n valueKey: {\n control: false,\n description:\n \"This optional property is useful to override the key in charge of storing the value used on the x-axis.\",\n },\n variant: {\n type: \"enum\",\n defaultValue: \"default\",\n description:\n \"The small variant is used to display a gridless, tickerless chart. The default one is a full chart that allows more controls and optimisations.\",\n options: [\"default\", \"small\"],\n control: false,\n },\n timeOptions: {\n type: \"object\",\n description:\n \"This optional property is only used by the default variant to know how to format ticker on the x-axis. See https://www.chartjs.org/docs/latest/axes/cartesian/time.html#time-units.\",\n control: { type: \"object\" },\n defaultValue: { unit: \"month\", displayFormats: { month: \"MMM.\" } },\n },\n },\n parameters: {\n docs: {\n description: {\n component:\n \"This component chart componnet has two variants, the default and the small one. The small one is like a preview, it has no controls and allow less optimisations. The default one is a component that displays grid, axis, tickers and allow lot of customisation.\",\n },\n },\n },\n};\n\nexport const Default = ({ data: _, ...args }: ChartPreviewProps): JSX.Element => {\n const [data, setData] = React.useState(generateData());\n\n const handleClick = () => setData(generateData());\n\n return (\n <Flex alignItems=\"flex-start\" flexDirection=\"column\" rowGap=\"1.5rem\">\n <Flex\n style={\n args.variant === \"default\"\n ? { position: \"relative\", width: \"100%\", aspectRatio: \"2 / 1\" }\n : {}\n }\n >\n <Chart {...args} data={data} />\n </Flex>\n <Button variant=\"main\" outline onClick={handleClick}>\n Generate new data\n </Button>\n </Flex>\n );\n};\n\nconst CardChart = styled.div`\n position: relative;\n width: 221px;\n height: 86px;\n`;\n\nexport const Small = (args: ChartPreviewProps): JSX.Element => {\n const theme = useTheme();\n const [data, setData] = React.useState(generateData());\n\n const handleClick = () => setData(generateData());\n\n return (\n <Flex alignItems=\"flex-start\" flexDirection=\"column\" rowGap=\"1rem\">\n <Flex flexWrap=\"wrap\" rowGap=\"1.5rem\" columnGap=\"2rem\">\n <CardChart>\n <Chart id=\"static\" variant=\"small\" color={theme.colors.primary.c100} data={data} />\n </CardChart>\n <CardChart>\n <Chart id=\"dynamic\" variant=\"small\" color={args.color} data={data} />\n </CardChart>\n </Flex>\n <Button variant=\"main\" outline onClick={handleClick}>\n Generate new data\n </Button>\n </Flex>\n );\n};\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAClB,+BAAiC;AAEjC,mBAAkB;AAElB,kBAAiB;AACjB,oBAAmB;AAGnB,SAAS,qBAAqB;AAC5B,QAAM,WAAW,oBAAI,KAAK,0BAA0B;AACpD,QAAM,SAAS,oBAAI,KAAK,0BAA0B;AAClD,SAAO,IAAI,KAAK,SAAS,QAAQ,IAAI,KAAK,OAAO,KAAK,OAAO,QAAQ,IAAI,SAAS,QAAQ,EAAE;AAC9F;AAEA,SAAS,sBAAsB;AAC7B,QAAM,MAAM;AACZ,QAAM,MAAM;AACZ,SAAO,KAAK,MAAM,KAAK,OAAO,KAAK,MAAM,OAAO,GAAG;AACrD;AAEA,MAAM,eAAe,MAAM;AACzB,SAAO,IAAI,MAAM,EAAE,EAChB,KAAK,CAAC,CAAC,EACP,IAAI,OAAO,EAAE,OAAO,oBAAoB,GAAG,MAAM,mBAAmB,EAAE,EAAU,EAChF,KAAK,CAAC,GAAG,MAAM,IAAI,KAAK,EAAE,IAAI,EAAE,QAAQ,IAAI,IAAI,KAAK,EAAE,IAAI,EAAE,QAAQ,CAAC;AAC3E;AAEA,IAAO,wBAAQ;AAAA,EACb,OAAO;AAAA,EACP,WAAW,aAAAA;AAAA,EACX,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,aACE;AAAA,IACJ;AAAA,IACA,OAAO;AAAA,MACL,MAAM;AAAA,MACN,SAAS;AAAA,MACT,cAAc;AAAA,MACd,aACE;AAAA,IACJ;AAAA,IACA,UAAU;AAAA,MACR,SAAS;AAAA,MACT,aACE;AAAA,IACJ;AAAA,IACA,SAAS;AAAA,MACP,MAAM;AAAA,MACN,cAAc;AAAA,MACd,aACE;AAAA,MACF,SAAS,CAAC,WAAW,OAAO;AAAA,MAC5B,SAAS;AAAA,IACX;AAAA,IACA,aAAa;AAAA,MACX,MAAM;AAAA,MACN,aACE;AAAA,MACF,SAAS,EAAE,MAAM,SAAS;AAAA,MAC1B,cAAc,EAAE,MAAM,SAAS,gBAAgB,EAAE,OAAO,OAAO,EAAE;AAAA,IACnE;AAAA,EACF;AAAA,EACA,YAAY;AAAA,IACV,MAAM;AAAA,MACJ,aAAa;AAAA,QACX,WACE;AAAA,MACJ;AAAA,IACF;AAAA,EACF;AACF;AAEO,MAAM,UAAU,CAAC,EAAE,MAAM,GAAG,GAAG,KAAK,MAAsC;AAC/E,QAAM,CAAC,MAAM,OAAO,IAAI,aAAAC,QAAM,SAAS,aAAa,CAAC;AAErD,QAAM,cAAc,MAAM,QAAQ,aAAa,CAAC;AAEhD,SACE,6BAAAA,QAAA,cAAC,YAAAC,SAAA,EAAK,YAAW,cAAa,eAAc,UAAS,QAAO,YAC1D,6BAAAD,QAAA;AAAA,IAAC,YAAAC;AAAA,IAAA;AAAA,MACC,OACE,KAAK,YAAY,YACb,EAAE,UAAU,YAAY,OAAO,QAAQ,aAAa,QAAQ,IAC5D,CAAC;AAAA;AAAA,IAGP,6BAAAD,QAAA,cAAC,aAAAD,SAAA,EAAO,GAAG,MAAM,MAAY;AAAA,EAC/B,GACA,6BAAAC,QAAA,cAAC,cAAAE,SAAA,EAAO,SAAQ,QAAO,SAAO,MAAC,SAAS,eAAa,mBAErD,CACF;AAEJ;AAEA,MAAM,YAAY,yBAAAC,QAAO;AAAA;AAAA;AAAA;AAAA;AAMlB,MAAM,QAAQ,CAAC,SAAyC;AAC7D,QAAM,YAAQ,mCAAS;AACvB,QAAM,CAAC,MAAM,OAAO,IAAI,aAAAH,QAAM,SAAS,aAAa,CAAC;AAErD,QAAM,cAAc,MAAM,QAAQ,aAAa,CAAC;AAEhD,SACE,6BAAAA,QAAA,cAAC,YAAAC,SAAA,EAAK,YAAW,cAAa,eAAc,UAAS,QAAO,UAC1D,6BAAAD,QAAA,cAAC,YAAAC,SAAA,EAAK,UAAS,QAAO,QAAO,UAAS,WAAU,UAC9C,6BAAAD,QAAA,cAAC,iBACC,6BAAAA,QAAA,cAAC,aAAAD,SAAA,EAAM,IAAG,UAAS,SAAQ,SAAQ,OAAO,MAAM,OAAO,QAAQ,MAAM,MAAY,CACnF,GACA,6BAAAC,QAAA,cAAC,iBACC,6BAAAA,QAAA,cAAC,aAAAD,SAAA,EAAM,IAAG,WAAU,SAAQ,SAAQ,OAAO,KAAK,OAAO,MAAY,CACrE,CACF,GACA,6BAAAC,QAAA,cAAC,cAAAE,SAAA,EAAO,SAAQ,QAAO,SAAO,MAAC,SAAS,eAAa,mBAErD,CACF;AAEJ;",
|
|
6
6
|
"names": ["Chart", "React", "Flex", "Button", "styled"]
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/components/Tag/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import React from \"react\";\nimport { TextVariants } from \"
|
|
4
|
+
"sourcesContent": ["import React from \"react\";\nimport { TextVariants } from \"../../styles/theme\";\nimport { border, BorderProps } from \"styled-system\";\nimport Text, { TextProps } from \"../asorted/Text\";\nimport baseStyled, { BaseStyledProps } from \"../styled\";\n\nexport type Size = \"large\" | \"medium\" | \"small\";\nexport type Type = \"plain\" | \"opacity\" | \"outlined\" | \"outlinedOpacity\";\n\nexport type TagProps = BaseStyledProps &\n React.HTMLAttributes<HTMLDivElement> &\n BorderProps &\n React.PropsWithChildren<{\n /**\n * Changes the appearance based on the active state.\n */\n active?: boolean;\n /**\n * Tag style.\n */\n type?: Type;\n /**\n * Size of the tag, affects the padding and the casing (uppercase for small and medium)\n */\n size?: Size;\n /**\n * Props passed to the text component, overriding props set internally by Tag component\n */\n textProps?: TextProps;\n\n disabled?: boolean;\n }>;\n\nfunction getColor({ type, active, disabled }: TagProps) {\n switch (type) {\n case \"plain\":\n if (disabled) return active ? \"neutral.c00\" : \"neutral.c70\";\n return active ? \"neutral.c00\" : \"primary.c90\";\n default:\n return disabled ? \"neutral.c70\" : \"primary.c90\";\n }\n}\n\nfunction getBgColor({ type, active, disabled }: TagProps) {\n switch (type) {\n case \"plain\":\n return active ? (disabled ? \"neutral.c70\" : \"primary.c90\") : undefined;\n case \"opacity\":\n return active ? (disabled ? \"neutral.c30\" : \"primary.c20\") : undefined;\n default:\n return;\n }\n}\n\nfunction getBorderColor({ type, active, disabled }: TagProps) {\n if (!active) return;\n switch (type) {\n case \"outlined\":\n return disabled ? \"neutral.c70\" : \"primary.c90\";\n case \"outlinedOpacity\":\n return disabled ? \"neutral.c40\" : \"primary.c40\";\n }\n}\n\nfunction getPadding({ size }: TagProps) {\n switch (size) {\n case \"small\":\n return \"3px 5px\";\n case \"medium\":\n return \"6px 8px\";\n case \"large\":\n default:\n return \"9px 10px 10px\";\n }\n}\n\nfunction getTextProps({ size }: TagProps): {\n variant: TextVariants;\n fontWeight?: string;\n uppercase?: boolean;\n} {\n switch (size) {\n case \"small\":\n case \"medium\":\n return {\n variant: \"tiny\",\n fontWeight: \"semiBold\",\n };\n case \"large\":\n default:\n return {\n variant: \"extraSmall\",\n fontWeight: \"semiBold\",\n };\n }\n}\n\nconst TagContainer = baseStyled.div.attrs<TagProps, TagProps>(props => ({\n backgroundColor: props.bg || props.backgroundColor || getBgColor(props),\n color: props.color || getColor(props),\n borderColor: getBorderColor(props),\n}))`\n display: inline-flex;\n justify-content: center;\n border: 1px solid transparent;\n border-radius: ${p => `${p.theme.radii[1]}px`};\n padding: ${p => getPadding(p)};\n ${border}\n`;\n\nexport default function Tag({\n children,\n textProps,\n size = \"large\",\n ...props\n}: TagProps): JSX.Element {\n const textColor = getColor(props);\n const baseTextProps = getTextProps({ size, ...props });\n return (\n <TagContainer size={size} {...props}>\n <Text {...baseTextProps} color={textColor} {...(textProps ? textProps : {})}>\n {children}\n </Text>\n </TagContainer>\n );\n}\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAElB,2BAAoC;AACpC,kBAAgC;AAChC,oBAA4C;AA6B5C,SAAS,SAAS,EAAE,MAAM,QAAQ,SAAS,GAAa;AACtD,UAAQ,MAAM;AAAA,IACZ,KAAK;AACH,UAAI;AAAU,eAAO,SAAS,gBAAgB;AAC9C,aAAO,SAAS,gBAAgB;AAAA,IAClC;AACE,aAAO,WAAW,gBAAgB;AAAA,EACtC;AACF;AAEA,SAAS,WAAW,EAAE,MAAM,QAAQ,SAAS,GAAa;AACxD,UAAQ,MAAM;AAAA,IACZ,KAAK;AACH,aAAO,SAAU,WAAW,gBAAgB,gBAAiB;AAAA,IAC/D,KAAK;AACH,aAAO,SAAU,WAAW,gBAAgB,gBAAiB;AAAA,IAC/D;AACE;AAAA,EACJ;AACF;AAEA,SAAS,eAAe,EAAE,MAAM,QAAQ,SAAS,GAAa;AAC5D,MAAI,CAAC;AAAQ;AACb,UAAQ,MAAM;AAAA,IACZ,KAAK;AACH,aAAO,WAAW,gBAAgB;AAAA,IACpC,KAAK;AACH,aAAO,WAAW,gBAAgB;AAAA,EACtC;AACF;AAEA,SAAS,WAAW,EAAE,KAAK,GAAa;AACtC,UAAQ,MAAM;AAAA,IACZ,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AAAA,IACL;AACE,aAAO;AAAA,EACX;AACF;AAEA,SAAS,aAAa,EAAE,KAAK,GAI3B;AACA,UAAQ,MAAM;AAAA,IACZ,KAAK;AAAA,IACL,KAAK;AACH,aAAO;AAAA,QACL,SAAS;AAAA,QACT,YAAY;AAAA,MACd;AAAA,IACF,KAAK;AAAA,IACL;AACE,aAAO;AAAA,QACL,SAAS;AAAA,QACT,YAAY;AAAA,MACd;AAAA,EACJ;AACF;AAEA,MAAM,eAAe,cAAAA,QAAW,IAAI,MAA0B,YAAU;AAAA,EACtE,iBAAiB,MAAM,MAAM,MAAM,mBAAmB,WAAW,KAAK;AAAA,EACtE,OAAO,MAAM,SAAS,SAAS,KAAK;AAAA,EACpC,aAAa,eAAe,KAAK;AACnC,EAAE;AAAA;AAAA;AAAA;AAAA,mBAIiB,OAAK,GAAG,EAAE,MAAM,MAAM,CAAC,CAAC,IAAI;AAAA,aAClC,OAAK,WAAW,CAAC,CAAC;AAAA,IAC3B,2BAAM;AAAA;AAGK,SAAR,IAAqB;AAAA,EAC1B;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,GAAG;AACL,GAA0B;AACxB,QAAM,YAAY,SAAS,KAAK;AAChC,QAAM,gBAAgB,aAAa,EAAE,MAAM,GAAG,MAAM,CAAC;AACrD,SACE,6BAAAC,QAAA,cAAC,gBAAa,MAAa,GAAG,SAC5B,6BAAAA,QAAA,cAAC,YAAAC,SAAA,EAAM,GAAG,eAAe,OAAO,WAAY,GAAI,YAAY,YAAY,CAAC,KACtE,QACH,CACF;AAEJ;",
|
|
6
6
|
"names": ["baseStyled", "React", "Text"]
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../src/components/layout/List/VerticalTimeline/TimelineIndicator.tsx"],
|
|
4
|
-
"sourcesContent": ["import React from \"react\";\nimport CircledCheckSolidMedium from \"@ledgerhq/icons-ui/reactLegacy/CircledCheckSolidMedium\";\nimport styled, { useTheme } from \"styled-components\";\n\nimport Flex, { FlexBoxProps as FlexProps } from \"../../Flex\";\nimport { ItemStatus } from \"./index\";\nimport { Theme } from \"
|
|
4
|
+
"sourcesContent": ["import React from \"react\";\nimport CircledCheckSolidMedium from \"@ledgerhq/icons-ui/reactLegacy/CircledCheckSolidMedium\";\nimport styled, { useTheme } from \"styled-components\";\n\nimport Flex, { FlexBoxProps as FlexProps } from \"../../Flex\";\nimport { ItemStatus } from \"./index\";\nimport { Theme } from \"../../../../styles/theme\";\n\nconst linesWidth = 2;\n\nconst BottomSegment = styled(Flex)<{ status: ItemStatus; hidden?: boolean }>`\n flex: 1;\n border-left-width: ${p => (p.hidden ? 0 : linesWidth)}px;\n border-right-width: 0;\n border-style: dashed;\n border-color: ${p =>\n p.status === \"completed\" ? p.theme.colors.primary.c80 : p.theme.colors.neutral.c40};\n background: ${p => p.status === \"completed\" && p.theme.colors.primary.c80};\n`;\n\nconst getIconBackground = (theme: Theme, status: ItemStatus, isLastItem?: boolean) => {\n if (isLastItem) {\n if (status === \"inactive\") return theme.colors.success.c10;\n return \"transparent\";\n } else if (status === \"active\") {\n return theme.colors.neutral.c40;\n } else {\n return \"transparent\";\n }\n};\n\nconst getIconBorder = (theme: Theme, status: ItemStatus, isLastItem?: boolean) => {\n if (isLastItem) {\n return theme.colors.success.c70;\n } else if (status === \"inactive\") {\n return theme.colors.neutral.c40;\n }\n return theme.colors.primary.c80;\n};\n\nconst CenterCircle = styled(Flex)<{ status: ItemStatus; isLastItem?: boolean }>`\n border-radius: 9999px;\n width: 100%;\n background: ${p => getIconBackground(p.theme, p.status, p.isLastItem)};\n border: 2px solid ${p => getIconBorder(p.theme, p.status, p.isLastItem)};\n align-items: center;\n justify-content: center;\n position: relative;\n`;\n\nconst IconWrapper = styled(Flex)`\n height: 16px;\n width: 16px;\n`;\n\nexport type Props = FlexProps & {\n status: \"inactive\" | \"active\" | \"completed\";\n isFirstItem?: boolean;\n isLastItem?: boolean;\n};\n\nconst topSegmentDefaultHeight = 23;\n\nconst Container = styled(Flex)`\n flex-direction: column;\n align-items: center;\n margin-bottom: ${-topSegmentDefaultHeight}px;\n padding-top: ${topSegmentDefaultHeight}px;\n`;\n\nfunction TimelineIndicator({ status, isLastItem, ...props }: Props) {\n const { colors } = useTheme();\n\n return (\n <Container {...props}>\n <IconWrapper>\n <CenterCircle status={status} isLastItem={isLastItem}>\n {status === \"completed\" && (\n <Flex position=\"absolute\">\n <CircledCheckSolidMedium\n color={isLastItem ? colors.success.c70 : colors.primary.c80}\n size={20}\n />\n </Flex>\n )}\n </CenterCircle>\n </IconWrapper>\n {isLastItem ? null : <BottomSegment status={status} />}\n </Container>\n );\n}\n\nexport default React.memo(TimelineIndicator);\n\nTimelineIndicator.topSegmentDefaultHeight = topSegmentDefaultHeight;\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAClB,qCAAoC;AACpC,+BAAiC;AAEjC,kBAAgD;AAIhD,MAAM,aAAa;AAEnB,MAAM,oBAAgB,yBAAAA,SAAO,YAAAC,OAAI;AAAA;AAAA,uBAEV,OAAM,EAAE,SAAS,IAAI,UAAW;AAAA;AAAA;AAAA,kBAGrC,OACd,EAAE,WAAW,cAAc,EAAE,MAAM,OAAO,QAAQ,MAAM,EAAE,MAAM,OAAO,QAAQ,GAAG;AAAA,gBACtE,OAAK,EAAE,WAAW,eAAe,EAAE,MAAM,OAAO,QAAQ,GAAG;AAAA;AAG3E,MAAM,oBAAoB,CAAC,OAAc,QAAoB,eAAyB;AACpF,MAAI,YAAY;AACd,QAAI,WAAW;AAAY,aAAO,MAAM,OAAO,QAAQ;AACvD,WAAO;AAAA,EACT,WAAW,WAAW,UAAU;AAC9B,WAAO,MAAM,OAAO,QAAQ;AAAA,EAC9B,OAAO;AACL,WAAO;AAAA,EACT;AACF;AAEA,MAAM,gBAAgB,CAAC,OAAc,QAAoB,eAAyB;AAChF,MAAI,YAAY;AACd,WAAO,MAAM,OAAO,QAAQ;AAAA,EAC9B,WAAW,WAAW,YAAY;AAChC,WAAO,MAAM,OAAO,QAAQ;AAAA,EAC9B;AACA,SAAO,MAAM,OAAO,QAAQ;AAC9B;AAEA,MAAM,mBAAe,yBAAAD,SAAO,YAAAC,OAAI;AAAA;AAAA;AAAA,gBAGhB,OAAK,kBAAkB,EAAE,OAAO,EAAE,QAAQ,EAAE,UAAU,CAAC;AAAA,sBACjD,OAAK,cAAc,EAAE,OAAO,EAAE,QAAQ,EAAE,UAAU,CAAC;AAAA;AAAA;AAAA;AAAA;AAMzE,MAAM,kBAAc,yBAAAD,SAAO,YAAAC,OAAI;AAAA;AAAA;AAAA;AAW/B,MAAM,0BAA0B;AAEhC,MAAM,gBAAY,yBAAAD,SAAO,YAAAC,OAAI;AAAA;AAAA;AAAA,mBAGV,CAAC,uBAAuB;AAAA,iBAC1B,uBAAuB;AAAA;AAGxC,SAAS,kBAAkB,EAAE,QAAQ,YAAY,GAAG,MAAM,GAAU;AAClE,QAAM,EAAE,OAAO,QAAI,mCAAS;AAE5B,SACE,6BAAAC,QAAA,cAAC,aAAW,GAAG,SACb,6BAAAA,QAAA,cAAC,mBACC,6BAAAA,QAAA,cAAC,gBAAa,QAAgB,cAC3B,WAAW,eACV,6BAAAA,QAAA,cAAC,YAAAD,SAAA,EAAK,UAAS,cACb,6BAAAC,QAAA;AAAA,IAAC,+BAAAC;AAAA,IAAA;AAAA,MACC,OAAO,aAAa,OAAO,QAAQ,MAAM,OAAO,QAAQ;AAAA,MACxD,MAAM;AAAA;AAAA,EACR,CACF,CAEJ,CACF,GACC,aAAa,OAAO,6BAAAD,QAAA,cAAC,iBAAc,QAAgB,CACtD;AAEJ;AAEA,IAAO,4BAAQ,aAAAA,QAAM,KAAK,iBAAiB;AAE3C,kBAAkB,0BAA0B;",
|
|
6
6
|
"names": ["styled", "Flex", "React", "CircledCheckSolidMedium"]
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../src/components/layout/List/VerticalTimeline/TimelineItem.tsx"],
|
|
4
|
-
"sourcesContent": ["import React from \"react\";\n\nimport { Theme } from \"
|
|
4
|
+
"sourcesContent": ["import React from \"react\";\n\nimport { Theme } from \"../../../../styles/theme\";\nimport styled, { useTheme } from \"styled-components\";\n\nimport { Item, ItemStatus } from \".\";\nimport { Flex, Box } from \"../..\";\nimport { Text } from \"../../..\";\nimport Tag from \"../../../Tag\";\n\nimport TimelineIndicator from \"./TimelineIndicator\";\n\nexport type Props = {\n item: Item;\n isFirstItem?: boolean;\n isLastItem?: boolean;\n onClick?: () => void;\n};\n\nconst getContainerBackground = (theme: Theme, status: ItemStatus) => {\n if (status === \"completed\") {\n return \"transparent\";\n } else if (status === \"active\") {\n return theme.colors.neutral.c20;\n }\n return \"transparent\";\n};\n\nconst getContainerBorder = (theme: Theme, status: ItemStatus, isLastItem?: boolean) => {\n if (status === \"completed\") {\n return \"transparent\";\n } else if (isLastItem && status === \"active\") {\n return theme.colors.success.c50;\n } else if (status === \"active\") {\n return theme.colors.neutral.c40;\n }\n return \"transparent\";\n};\n\nconst Container = styled(Flex)<{ status: ItemStatus; isLastItem?: boolean }>`\n flex: 1;\n border-radius: ${p => p.theme.radii[2]}px;\n background: ${p => getContainerBackground(p.theme, p.status)};\n border: 1px solid ${p => getContainerBorder(p.theme, p.status, p.isLastItem)};\n padding: 20px 16px;\n`;\n\nconst TimelineIndicatorContentHeader = styled(Flex)`\n justify-content: space-between;\n align-items: center;\n`;\n\nfunction TimelineItem({ item, isFirstItem, isLastItem, onClick }: Props) {\n const { colors } = useTheme();\n\n return (\n <Flex flexDirection=\"row\" onClick={onClick} flex={1}>\n <TimelineIndicator\n status={item.status}\n isFirstItem={isFirstItem}\n isLastItem={isLastItem}\n mr={4}\n />\n <Container status={item.status} isLastItem={isLastItem} mb={4} flexDirection=\"column\">\n <TimelineIndicatorContentHeader height=\"20px\">\n <Text\n variant=\"body\"\n fontWeight={item.status === \"active\" ? \"semiBold\" : \"medium\"}\n color={\n item.status !== \"inactive\" && isLastItem\n ? \"success.c70\"\n : item.status === \"active\"\n ? \"primary.c80\"\n : \"neutral.c70\"\n }\n >\n {item.title}\n </Text>\n {item?.estimatedTime && item.status === \"active\" && (\n <Tag\n size=\"small\"\n type=\"opacity\"\n active\n disabled\n textProps={{ color: colors.neutral.c100 }}\n >{`${item.estimatedTime / 60} min`}</Tag>\n )}\n </TimelineIndicatorContentHeader>\n {item.renderBody && item.status === \"active\" && (\n <Box position=\"relative\" pt={6}>\n {item.renderBody(item.status === \"active\")}\n </Box>\n )}\n </Container>\n </Flex>\n );\n}\n\nexport default React.memo(TimelineItem);\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAGlB,+BAAiC;AAGjC,IAAAA,YAA0B;AAC1B,IAAAA,YAAqB;AACrB,iBAAgB;AAEhB,+BAA8B;AAS9B,MAAM,yBAAyB,CAAC,OAAc,WAAuB;AACnE,MAAI,WAAW,aAAa;AAC1B,WAAO;AAAA,EACT,WAAW,WAAW,UAAU;AAC9B,WAAO,MAAM,OAAO,QAAQ;AAAA,EAC9B;AACA,SAAO;AACT;AAEA,MAAM,qBAAqB,CAAC,OAAc,QAAoB,eAAyB;AACrF,MAAI,WAAW,aAAa;AAC1B,WAAO;AAAA,EACT,WAAW,cAAc,WAAW,UAAU;AAC5C,WAAO,MAAM,OAAO,QAAQ;AAAA,EAC9B,WAAW,WAAW,UAAU;AAC9B,WAAO,MAAM,OAAO,QAAQ;AAAA,EAC9B;AACA,SAAO;AACT;AAEA,MAAM,gBAAY,yBAAAC,SAAO,cAAI;AAAA;AAAA,mBAEV,OAAK,EAAE,MAAM,MAAM,CAAC,CAAC;AAAA,gBACxB,OAAK,uBAAuB,EAAE,OAAO,EAAE,MAAM,CAAC;AAAA,sBACxC,OAAK,mBAAmB,EAAE,OAAO,EAAE,QAAQ,EAAE,UAAU,CAAC;AAAA;AAAA;AAI9E,MAAM,qCAAiC,yBAAAA,SAAO,cAAI;AAAA;AAAA;AAAA;AAKlD,SAAS,aAAa,EAAE,MAAM,aAAa,YAAY,QAAQ,GAAU;AACvE,QAAM,EAAE,OAAO,QAAI,mCAAS;AAE5B,SACE,6BAAAC,QAAA,cAAC,kBAAK,eAAc,OAAM,SAAkB,MAAM,KAChD,6BAAAA,QAAA;AAAA,IAAC,yBAAAC;AAAA,IAAA;AAAA,MACC,QAAQ,KAAK;AAAA,MACb;AAAA,MACA;AAAA,MACA,IAAI;AAAA;AAAA,EACN,GACA,6BAAAD,QAAA,cAAC,aAAU,QAAQ,KAAK,QAAQ,YAAwB,IAAI,GAAG,eAAc,YAC3E,6BAAAA,QAAA,cAAC,kCAA+B,QAAO,UACrC,6BAAAA,QAAA;AAAA,IAAC;AAAA;AAAA,MACC,SAAQ;AAAA,MACR,YAAY,KAAK,WAAW,WAAW,aAAa;AAAA,MACpD,OACE,KAAK,WAAW,cAAc,aAC1B,gBACA,KAAK,WAAW,WAChB,gBACA;AAAA;AAAA,IAGL,KAAK;AAAA,EACR,IACC,6BAAM,kBAAiB,KAAK,WAAW,YACtC,6BAAAA,QAAA;AAAA,IAAC,WAAAE;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,MAAK;AAAA,MACL,QAAM;AAAA,MACN,UAAQ;AAAA,MACR,WAAW,EAAE,OAAO,OAAO,QAAQ,KAAK;AAAA;AAAA,IACxC,GAAG,KAAK,gBAAgB,EAAE;AAAA,EAAO,CAEvC,GACC,KAAK,cAAc,KAAK,WAAW,YAClC,6BAAAF,QAAA,cAAC,iBAAI,UAAS,YAAW,IAAI,KAC1B,KAAK,WAAW,KAAK,WAAW,QAAQ,CAC3C,CAEJ,CACF;AAEJ;AAEA,IAAO,uBAAQ,aAAAA,QAAM,KAAK,YAAY;",
|
|
6
6
|
"names": ["import__", "styled", "React", "TimelineIndicator", "Tag"]
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../src/components/layout/List/VerticalTimeline/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import React, { ReactNode } from \"react\";\n\nimport TimelineItem from \"./TimelineItem\";\nimport { Flex } from \"../..\";\nimport Text, { TextProps } from \"../../../asorted/Text\";\nimport { BaseStyledProps } from \"
|
|
4
|
+
"sourcesContent": ["import React, { ReactNode } from \"react\";\n\nimport TimelineItem from \"./TimelineItem\";\nimport { Flex } from \"../..\";\nimport Text, { TextProps } from \"../../../asorted/Text\";\nimport { BaseStyledProps } from \"../../../styled\";\n\nexport type ItemStatus = \"inactive\" | \"active\" | \"completed\";\n\nexport type Item = {\n status: ItemStatus;\n title: string;\n renderBody?: (isDisplayed?: boolean) => ReactNode;\n estimatedTime?: number;\n};\n\nexport type Props = BaseStyledProps & {\n steps?: Item[];\n onClickIndex?: (index: number) => void;\n};\n\nexport default function VerticalTimeline({ steps, onClickIndex, ...props }: Props) {\n return (\n <Flex {...props} flexDirection=\"column\" flex={1}>\n {steps?.map((step, index) => (\n <TimelineItem\n key={index}\n item={step}\n isFirstItem={index === 0}\n isLastItem={index === steps.length - 1}\n onClick={onClickIndex ? () => onClickIndex(index) : undefined}\n />\n ))}\n </Flex>\n );\n}\n\nconst SubtitleText: React.FC<TextProps> = props => (\n <Text variant=\"body\" fontWeight=\"semiBold\" color=\"neutral.c100\" mb={3} {...props} />\n);\n\nconst BodyText: React.FC<TextProps> = props => (\n <Text variant=\"bodyLineHeight\" fontWeight=\"medium\" color=\"neutral.c80\" {...props} />\n);\n\nVerticalTimeline.BodyText = BodyText;\nVerticalTimeline.SubtitleText = SubtitleText;\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAiC;AAEjC,0BAAyB;AACzB,eAAqB;AACrB,kBAAgC;AAiBjB,SAAR,iBAAkC,EAAE,OAAO,cAAc,GAAG,MAAM,GAAU;AACjF,SACE,6BAAAA,QAAA,cAAC,iBAAM,GAAG,OAAO,eAAc,UAAS,MAAM,KAC3C,+BAAO,IAAI,CAAC,MAAM,UACjB,6BAAAA,QAAA;AAAA,IAAC,oBAAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL,MAAM;AAAA,MACN,aAAa,UAAU;AAAA,MACvB,YAAY,UAAU,MAAM,SAAS;AAAA,MACrC,SAAS,eAAe,MAAM,aAAa,KAAK,IAAI;AAAA;AAAA,EACtD,EAEJ;AAEJ;AAEA,MAAM,eAAoC,WACxC,6BAAAD,QAAA,cAAC,YAAAE,SAAA,EAAK,SAAQ,QAAO,YAAW,YAAW,OAAM,gBAAe,IAAI,GAAI,GAAG,OAAO;AAGpF,MAAM,WAAgC,WACpC,6BAAAF,QAAA,cAAC,YAAAE,SAAA,EAAK,SAAQ,kBAAiB,YAAW,UAAS,OAAM,eAAe,GAAG,OAAO;AAGpF,iBAAiB,WAAW;AAC5B,iBAAiB,eAAe;",
|
|
6
6
|
"names": ["React", "TimelineItem", "Text"]
|
|
7
7
|
}
|
package/lib/cjs/styles/theme.js
CHANGED
|
@@ -184,17 +184,17 @@ const fadeInUp = import_styled_components.keyframes`
|
|
|
184
184
|
`;
|
|
185
185
|
const animations = {
|
|
186
186
|
fadeIn: () => import_styled_components.css`
|
|
187
|
-
|
|
188
|
-
|
|
187
|
+
${fadeIn} ${animationDuration} ${easings.outQuadratic} forwards
|
|
188
|
+
`,
|
|
189
189
|
fadeOut: () => import_styled_components.css`
|
|
190
|
-
|
|
191
|
-
|
|
190
|
+
${fadeOut} ${animationDuration} ${easings.outQuadratic} forwards
|
|
191
|
+
`,
|
|
192
192
|
fadeInGrowX: () => import_styled_components.css`
|
|
193
|
-
|
|
194
|
-
|
|
193
|
+
${fadeInGrowX} 0.6s ${easings.outQuadratic} forwards
|
|
194
|
+
`,
|
|
195
195
|
fadeInUp: () => import_styled_components.css`
|
|
196
|
-
|
|
197
|
-
|
|
196
|
+
${fadeInUp} ${animationDuration} ${easings.outQuadratic} forwards
|
|
197
|
+
`
|
|
198
198
|
};
|
|
199
199
|
const overflow = {
|
|
200
200
|
x: import_styled_components.css`
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/styles/theme.ts"],
|
|
4
|
-
"sourcesContent": ["import { keyframes, css, Font } from \"styled-components\";\nimport { palettes, ColorPalette } from \"@ledgerhq/ui-shared\";\n\nexport type screensBreakpoints = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"xxl\";\n\nexport const breakpoints = {\n sm: \"640px\",\n md: \"768px\",\n lg: \"1024px\",\n xl: \"1280px\",\n xxl: \"1536px\",\n} as Record<screensBreakpoints, string>;\n\nexport const space = [\n /* space indexes:\n 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21 */\n 0, 2, 4, 8, 10, 12, 16, 20, 24, 28, 32, 36, 40, 44, 48, 52, 56, 60, 64, 68, 72, 76,\n];\n\nexport type TextVariants =\n | \"h1\"\n | \"h1Inter\"\n | \"h2\"\n | \"h2Inter\"\n | \"h3\"\n | \"h3Inter\"\n | \"h4\"\n | \"h4Inter\"\n | \"h5\"\n | \"h5Inter\"\n | \"large\"\n | \"largeLineHeight\"\n | \"body\"\n | \"bodyLineHeight\"\n | \"paragraph\"\n | \"paragraphLineHeight\"\n | \"small\"\n | \"extraSmall\"\n | \"tiny\"\n | \"micro\"\n | \"subtitle\";\n\nexport type ThemeScale<Type, Aliases extends string> = Array<Type> & Record<Aliases, Type>;\n\nexport const fontSizes = [8, 10, 11, 12, 13, 14, 16, 20, 24, 28, 32, 36] as ThemeScale<\n number,\n TextVariants\n>;\n\n[\n fontSizes.micro,\n fontSizes.tiny,\n fontSizes.extraSmall,\n fontSizes.small,\n fontSizes.paragraph,\n fontSizes.body,\n fontSizes.large,\n fontSizes.h5,\n fontSizes.h4,\n fontSizes.h3,\n fontSizes.h2,\n fontSizes.h1,\n] = fontSizes;\nfontSizes.largeLineHeight = fontSizes.large;\nfontSizes.bodyLineHeight = fontSizes.body;\nfontSizes.paragraphLineHeight = fontSizes.paragraph;\nfontSizes.subtitle = fontSizes.extraSmall;\nfontSizes.h1Inter = fontSizes.h1;\nfontSizes.h2Inter = fontSizes.h2;\nfontSizes.h3Inter = fontSizes.h3;\nfontSizes.h4Inter = fontSizes.h4;\nfontSizes.h5Inter = fontSizes.h5;\n\nconst fontWeights = {\n extraLight: \"100\",\n light: \"300\",\n regular: \"400\",\n medium: \"500\",\n semiBold: \"600\",\n bold: \"700\",\n extraBold: \"800\",\n};\n\nexport const radii = [0, 4, 8, 12, 16, 20];\nexport const shadows = [\"0 4px 8px 0 rgba(0, 0, 0, 0.03)\"];\nexport const zIndexes = [-1, 0, 1, 9, 10, 90, 100, 900, 1000];\n\n// Those fonts are now defined in global.css, this is just a mapping for styled-system\nexport const fontFamilies = {\n Inter: {\n ExtraLight: {\n weight: 100,\n style: \"normal\",\n },\n Light: {\n weight: 300,\n style: \"normal\",\n },\n Regular: {\n weight: 400,\n style: \"normal\",\n },\n Medium: {\n weight: 500,\n style: \"normal\",\n },\n SemiBold: {\n weight: 600,\n style: \"normal\",\n },\n Bold: {\n weight: 700,\n style: \"normal\",\n },\n ExtraBold: {\n weight: 800,\n style: \"normal\",\n },\n },\n Alpha: {\n Medium: {\n weight: 500,\n style: \"normal\",\n },\n },\n};\n\nconst animationDuration = \"0.33s\";\nconst easings = {\n outQuadratic: \"cubic-bezier(0.25, 0.46, 0.45, 0.94)\",\n};\n\nconst transition = (\n properties = [\"all\"],\n duration = animationDuration,\n easing = easings.outQuadratic,\n) => css`\n transition-property: ${properties.join(\",\")};\n transition-duration: ${duration};\n transition-timing-function: ${easing};\n`;\n\nconst fadeIn = keyframes`\n 0% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n `;\nconst fadeOut = keyframes`\n 0% {\n opacity: 1;\n }\n 100% {\n opacity: 0;\n }\n `;\nconst fadeInGrowX = keyframes`\n 0% {\n opacity: 0;\n transform: scaleX(0);\n }\n 100% {\n opacity: 1;\n transform: scaleX(1);\n }\n`;\nconst fadeInUp = keyframes`\n 0% {\n opacity: 0;\n transform: translateY(66%);\n }\n 100% {\n opacity: 1;\n transform: translateY(0%);\n }\n `;\nconst animations = {\n fadeIn: ()
|
|
5
|
-
"mappings": "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
|
|
4
|
+
"sourcesContent": ["import { keyframes, css, Font } from \"styled-components\";\nimport { palettes, ColorPalette } from \"@ledgerhq/ui-shared\";\n\nexport type screensBreakpoints = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"xxl\";\n\nexport const breakpoints = {\n sm: \"640px\",\n md: \"768px\",\n lg: \"1024px\",\n xl: \"1280px\",\n xxl: \"1536px\",\n} as Record<screensBreakpoints, string>;\n\nexport const space = [\n /* space indexes:\n 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21 */\n 0, 2, 4, 8, 10, 12, 16, 20, 24, 28, 32, 36, 40, 44, 48, 52, 56, 60, 64, 68, 72, 76,\n];\n\nexport type TextVariants =\n | \"h1\"\n | \"h1Inter\"\n | \"h2\"\n | \"h2Inter\"\n | \"h3\"\n | \"h3Inter\"\n | \"h4\"\n | \"h4Inter\"\n | \"h5\"\n | \"h5Inter\"\n | \"large\"\n | \"largeLineHeight\"\n | \"body\"\n | \"bodyLineHeight\"\n | \"paragraph\"\n | \"paragraphLineHeight\"\n | \"small\"\n | \"extraSmall\"\n | \"tiny\"\n | \"micro\"\n | \"subtitle\";\n\nexport type ThemeScale<Type, Aliases extends string> = Array<Type> & Record<Aliases, Type>;\n\nexport const fontSizes = [8, 10, 11, 12, 13, 14, 16, 20, 24, 28, 32, 36] as ThemeScale<\n number,\n TextVariants\n>;\n\n[\n fontSizes.micro,\n fontSizes.tiny,\n fontSizes.extraSmall,\n fontSizes.small,\n fontSizes.paragraph,\n fontSizes.body,\n fontSizes.large,\n fontSizes.h5,\n fontSizes.h4,\n fontSizes.h3,\n fontSizes.h2,\n fontSizes.h1,\n] = fontSizes;\nfontSizes.largeLineHeight = fontSizes.large;\nfontSizes.bodyLineHeight = fontSizes.body;\nfontSizes.paragraphLineHeight = fontSizes.paragraph;\nfontSizes.subtitle = fontSizes.extraSmall;\nfontSizes.h1Inter = fontSizes.h1;\nfontSizes.h2Inter = fontSizes.h2;\nfontSizes.h3Inter = fontSizes.h3;\nfontSizes.h4Inter = fontSizes.h4;\nfontSizes.h5Inter = fontSizes.h5;\n\nconst fontWeights = {\n extraLight: \"100\",\n light: \"300\",\n regular: \"400\",\n medium: \"500\",\n semiBold: \"600\",\n bold: \"700\",\n extraBold: \"800\",\n};\n\nexport const radii = [0, 4, 8, 12, 16, 20];\nexport const shadows = [\"0 4px 8px 0 rgba(0, 0, 0, 0.03)\"];\nexport const zIndexes = [-1, 0, 1, 9, 10, 90, 100, 900, 1000];\n\n// Those fonts are now defined in global.css, this is just a mapping for styled-system\nexport const fontFamilies = {\n Inter: {\n ExtraLight: {\n weight: 100,\n style: \"normal\",\n },\n Light: {\n weight: 300,\n style: \"normal\",\n },\n Regular: {\n weight: 400,\n style: \"normal\",\n },\n Medium: {\n weight: 500,\n style: \"normal\",\n },\n SemiBold: {\n weight: 600,\n style: \"normal\",\n },\n Bold: {\n weight: 700,\n style: \"normal\",\n },\n ExtraBold: {\n weight: 800,\n style: \"normal\",\n },\n },\n Alpha: {\n Medium: {\n weight: 500,\n style: \"normal\",\n },\n },\n};\n\nconst animationDuration = \"0.33s\";\nconst easings = {\n outQuadratic: \"cubic-bezier(0.25, 0.46, 0.45, 0.94)\",\n};\n\nconst transition = (\n properties = [\"all\"],\n duration = animationDuration,\n easing = easings.outQuadratic,\n) => css`\n transition-property: ${properties.join(\",\")};\n transition-duration: ${duration};\n transition-timing-function: ${easing};\n`;\n\nconst fadeIn = keyframes`\n 0% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n `;\nconst fadeOut = keyframes`\n 0% {\n opacity: 1;\n }\n 100% {\n opacity: 0;\n }\n `;\nconst fadeInGrowX = keyframes`\n 0% {\n opacity: 0;\n transform: scaleX(0);\n }\n 100% {\n opacity: 1;\n transform: scaleX(1);\n }\n`;\nconst fadeInUp = keyframes`\n 0% {\n opacity: 0;\n transform: translateY(66%);\n }\n 100% {\n opacity: 1;\n transform: translateY(0%);\n }\n `;\nconst animations = {\n fadeIn: () => css`\n ${fadeIn} ${animationDuration} ${easings.outQuadratic} forwards\n `,\n fadeOut: () => css`\n ${fadeOut} ${animationDuration} ${easings.outQuadratic} forwards\n `,\n fadeInGrowX: () => css`\n ${fadeInGrowX} 0.6s ${easings.outQuadratic} forwards\n `,\n fadeInUp: () => css`\n ${fadeInUp} ${animationDuration} ${easings.outQuadratic} forwards\n `,\n};\nconst overflow = {\n x: css`\n overflow-y: hidden;\n overflow-x: scroll;\n will-change: transform;\n &:hover {\n --track-color: ${p => p.theme.colors.neutral.c30};\n }\n `,\n y: css`\n overflow-x: hidden;\n overflow-y: scroll;\n will-change: transform;\n &:hover {\n --track-color: ${p => p.theme.colors.neutral.c30};\n }\n `,\n yAuto: css`\n overflow-x: hidden;\n overflow-y: auto;\n will-change: transform;\n &:hover {\n --track-color: ${p => p.theme.colors.neutral.c30};\n }\n `,\n xy: css`\n overflow: scroll;\n will-change: transform;\n &:hover {\n --track-color: ${p => p.theme.colors.neutral.c30};\n }\n `,\n trackSize: 12,\n};\n\ninterface DefaultTheme {\n theme: \"dark\" | \"light\";\n animations: typeof animations;\n transition: typeof transition;\n overflow: typeof overflow;\n sizes: {\n topBarHeight: number;\n sideBarWidth: number;\n drawer: {\n side: {\n big: {\n width: number;\n };\n small: {\n width: number;\n };\n };\n popin: {\n min: {\n height: number;\n width: number;\n };\n max: {\n height: number;\n width: number;\n };\n };\n };\n };\n radii: number[];\n fontFamilies: Record<string, Record<string, Font>>;\n fontSizes: number[];\n space: number[];\n shadows: string[];\n colors: ColorPalette & {\n /**\n * @deprecated Do not use the .palette prefix anymore!\n */\n palette: ColorPalette;\n };\n fontWeights: Record<string, string>;\n breakpoints: Record<screensBreakpoints, string>;\n zIndexes: number[];\n}\n\nconst theme: DefaultTheme = {\n theme: \"light\",\n sizes: {\n drawer: {\n side: {\n big: {\n width: 580,\n },\n small: {\n width: 420,\n },\n },\n popin: {\n min: {\n height: 158,\n width: 462,\n },\n max: {\n height: 522,\n width: 622,\n },\n },\n },\n topBarHeight: 58,\n sideBarWidth: 230,\n },\n radii,\n fontFamilies,\n fontSizes,\n fontWeights,\n space,\n shadows,\n colors: {\n palette: palettes.light,\n ...palettes.light,\n },\n animations,\n overflow,\n transition,\n zIndexes,\n breakpoints,\n};\n\nexport default theme;\nexport type Theme = DefaultTheme;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React, { ReactNode } from "react";
|
|
2
2
|
import { TextProps } from "../../../asorted/Text";
|
|
3
|
-
import { BaseStyledProps } from "
|
|
3
|
+
import { BaseStyledProps } from "../../../styled";
|
|
4
4
|
export type ItemStatus = "inactive" | "active" | "completed";
|
|
5
5
|
export type Item = {
|
|
6
6
|
status: ItemStatus;
|
package/lib/styles/theme.js
CHANGED
|
@@ -134,17 +134,17 @@ const fadeInUp = keyframes `
|
|
|
134
134
|
`;
|
|
135
135
|
const animations = {
|
|
136
136
|
fadeIn: () => css `
|
|
137
|
-
|
|
138
|
-
|
|
137
|
+
${fadeIn} ${animationDuration} ${easings.outQuadratic} forwards
|
|
138
|
+
`,
|
|
139
139
|
fadeOut: () => css `
|
|
140
|
-
|
|
141
|
-
|
|
140
|
+
${fadeOut} ${animationDuration} ${easings.outQuadratic} forwards
|
|
141
|
+
`,
|
|
142
142
|
fadeInGrowX: () => css `
|
|
143
|
-
|
|
144
|
-
|
|
143
|
+
${fadeInGrowX} 0.6s ${easings.outQuadratic} forwards
|
|
144
|
+
`,
|
|
145
145
|
fadeInUp: () => css `
|
|
146
|
-
|
|
147
|
-
|
|
146
|
+
${fadeInUp} ${animationDuration} ${easings.outQuadratic} forwards
|
|
147
|
+
`,
|
|
148
148
|
};
|
|
149
149
|
const overflow = {
|
|
150
150
|
x: css `
|
package/lib/styles/theme.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme.js","sourceRoot":"","sources":["../../src/styles/theme.ts"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"theme.js","sourceRoot":"","sources":["../../src/styles/theme.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ledgerhq/react-ui",
|
|
3
|
-
"version": "0.14.10-nightly.
|
|
3
|
+
"version": "0.14.10-nightly.2",
|
|
4
4
|
"description": "Ledger Live - Desktop UI",
|
|
5
5
|
"author": "Ledger Live Team <team-live@ledger.fr>",
|
|
6
6
|
"repository": {
|
|
@@ -68,7 +68,7 @@
|
|
|
68
68
|
"react-transition-group": "^4.4.2",
|
|
69
69
|
"react-window": "^1.8.6",
|
|
70
70
|
"styled-system": "^5.1.5",
|
|
71
|
-
"@ledgerhq/crypto-icons-ui": "^0.
|
|
71
|
+
"@ledgerhq/crypto-icons-ui": "^0.6.0-nightly.2",
|
|
72
72
|
"@ledgerhq/icons-ui": "^0.6.2-nightly.0",
|
|
73
73
|
"@ledgerhq/ui-shared": "^0.2.1"
|
|
74
74
|
},
|
|
@@ -88,7 +88,7 @@
|
|
|
88
88
|
"@types/color": "^3.0.2",
|
|
89
89
|
"@types/hoist-non-react-statics": "^3.3.1",
|
|
90
90
|
"@types/react": "~18.2.21",
|
|
91
|
-
"@types/react-dom": "^
|
|
91
|
+
"@types/react-dom": "^18.2.13",
|
|
92
92
|
"@types/react-is": "^17.0.3",
|
|
93
93
|
"@types/react-transition-group": "^4.4.2",
|
|
94
94
|
"@types/react-window": "^1.8.5",
|
|
@@ -97,7 +97,7 @@
|
|
|
97
97
|
"babel-loader": "^8.0.0",
|
|
98
98
|
"csstype": "^3.0.11",
|
|
99
99
|
"esbuild": "^0.19.0",
|
|
100
|
-
"eslint-plugin-react": "^7.
|
|
100
|
+
"eslint-plugin-react": "^7.33.2",
|
|
101
101
|
"eslint-plugin-react-hooks": "^4.6.0",
|
|
102
102
|
"fs-extra": "^10.0.1",
|
|
103
103
|
"react": "^18.2.0",
|
|
@@ -135,6 +135,7 @@
|
|
|
135
135
|
"lint:fix": "pnpm lint --fix",
|
|
136
136
|
"lint:css": "stylelint './src/**/*.{js,jsx,ts,tsx}' --fix",
|
|
137
137
|
"typecheck": "tsc --p . --noEmit",
|
|
138
|
-
"test": "pnpm -w -F ui test:react"
|
|
138
|
+
"test": "pnpm -w -F ui test:react",
|
|
139
|
+
"unimported": "unimported"
|
|
139
140
|
}
|
|
140
141
|
}
|