1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
Nidhi Kumari 0efd00b755
UX Multichain: Added product tour component (#18571)
* adding product tour component

* updated control for prevIcon

* updated app-header and product tour

* updated css

* updated message strings

* updated tests

* removed console statement

* added selector for product tour

* updated test

* updated test

* updated state with steps

* Update ui/components/multichain/product-tour-popover/product-tour-popover.js

Co-authored-by: Garrett Bear <gwhisten@gmail.com>

* Update ui/components/multichain/product-tour-popover/product-tour-popover.js

Co-authored-by: Garrett Bear <gwhisten@gmail.com>

* Update ui/components/multichain/product-tour-popover/product-tour-popover.js

Co-authored-by: Garrett Bear <gwhisten@gmail.com>

* Update ui/components/multichain/product-tour-popover/product-tour-popover.js

Co-authored-by: Garrett Bear <gwhisten@gmail.com>

* Update ui/components/multichain/product-tour-popover/product-tour-popover.js

Co-authored-by: Garrett Bear <gwhisten@gmail.com>

* Update ui/components/multichain/product-tour-popover/product-tour-popover.js

Co-authored-by: Garrett Bear <gwhisten@gmail.com>

* Update ui/components/multichain/product-tour-popover/product-tour-popover.js

Co-authored-by: Garrett Bear <gwhisten@gmail.com>

* Update ui/components/multichain/product-tour-popover/product-tour-popover.js

Co-authored-by: Garrett Bear <gwhisten@gmail.com>

* Update ui/components/multichain/product-tour-popover/product-tour-popover.js

Co-authored-by: Garrett Bear <gwhisten@gmail.com>

* Update ui/components/multichain/product-tour-popover/product-tour-popover.scss

Co-authored-by: Garrett Bear <gwhisten@gmail.com>

* fixed lint errors

* updated lint error

* added changes for rtl support

* added changes for rtl support

* fixed lint errors

* Some suggestions (#18676)

* updated messages and indentation

* fixed popup close on my final step

* updated rtl classname condition

---------

Co-authored-by: Garrett Bear <gwhisten@gmail.com>
Co-authored-by: George Marshall <george.marshall@consensys.net>
2023-04-21 20:58:18 +05:30
..

Component Library

This folder contains design system components that are built 1:1 with the Figma DS Components UI kit and should be used where possible in all UI feature work.

Architecture

All components are built on top of the Box component and accept all Box component props

Layout

component-library components accept all utility props for layout

import { Text } from '../../component-library'

<Text marginBottom={4}>This text has a margin-bottom of 16px</Text>

Polymorphic as prop

component-library components accept a polymorphic as prop to change the root html element of a component

import { Text } from '../../component-library'

<ul>
<Text as="li">This renders as list item html element</Text>
</ul>

TypeScript

We are currently in the process of migrating all component-library components to TypeScript. Feel free to contribute by creating a PR against one of these issues

Support

If internal folks have any questions please reach out the design system team via the internal slack channel #metamask-design-system 💁

DS components figma file (internal)