tide-design-system 2.5.3 → 2.5.6-with-logos.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.
Files changed (40) hide show
  1. package/.storybook/main.ts +2 -0
  2. package/README.md +1 -0
  3. package/dist/css/variables.css +11 -2
  4. package/dist/style.css +1 -1
  5. package/dist/tide-design-system.cjs +2 -2
  6. package/dist/tide-design-system.esm.d.ts +55 -40
  7. package/dist/tide-design-system.esm.js +516 -469
  8. package/dist/utilities/realm.ts +17 -0
  9. package/dist/utilities/storybook.ts +2 -2
  10. package/docs/upgrading.md +37 -0
  11. package/index.ts +4 -0
  12. package/package.json +1 -1
  13. package/src/assets/css/variables.css +11 -2
  14. package/src/assets/svg/branding/logo/logo-aero.svg +4 -0
  15. package/src/assets/svg/branding/logo/logo-atv.svg +6 -0
  16. package/src/assets/svg/branding/logo/logo-boatmart.svg +4 -0
  17. package/src/assets/svg/branding/logo/logo-cycle.svg +4 -0
  18. package/src/assets/svg/branding/logo/logo-equipment.svg +4 -0
  19. package/src/assets/svg/branding/logo/logo-pwc.svg +4 -0
  20. package/src/assets/svg/branding/logo/logo-rv.svg +6 -0
  21. package/src/assets/svg/branding/logo/logo-snow.svg +4 -0
  22. package/src/assets/svg/branding/logo/logo-truck.svg +5 -0
  23. package/src/assets/svg/branding/mark/mark-aero.svg +3 -0
  24. package/src/assets/svg/branding/mark/mark-atv.svg +4 -0
  25. package/src/assets/svg/branding/mark/mark-boatmart.svg +3 -0
  26. package/src/assets/svg/branding/mark/mark-cycle.svg +3 -0
  27. package/src/assets/svg/branding/mark/mark-equipment.svg +3 -0
  28. package/src/assets/svg/branding/mark/mark-pwc.svg +3 -0
  29. package/src/assets/svg/branding/mark/mark-rv.svg +4 -0
  30. package/src/assets/svg/branding/mark/mark-snow.svg +3 -0
  31. package/src/assets/svg/branding/mark/mark-truck.svg +4 -0
  32. package/src/components/TideButtonSave.vue +100 -0
  33. package/src/components/TideIcon.vue +8 -6
  34. package/src/components/TideRealmLogo.vue +154 -0
  35. package/src/stories/TideButtonSave.stories.ts +62 -0
  36. package/src/stories/TideRealmLogo.stories.ts +93 -0
  37. package/src/types/RealmLogo.ts +23 -0
  38. package/src/utilities/realm.ts +17 -0
  39. package/src/utilities/storybook.ts +2 -2
  40. package/tests/TideRealmLogo.spec.ts +58 -0
@@ -30,6 +30,7 @@ const config: StorybookConfig = {
30
30
  '../src/stories/TideButton.stories.ts',
31
31
  '../src/stories/TideButtonIcon.stories.ts',
32
32
  '../src/stories/TideButtonPagination.stories.ts',
33
+ '../src/stories/TideButtonSave.stories.ts',
33
34
  '../src/stories/TideButtonSegmented.stories.ts',
34
35
  '../src/stories/TideCard.stories.ts',
35
36
  '../src/stories/TideCarousel.stories.ts',
@@ -52,6 +53,7 @@ const config: StorybookConfig = {
52
53
  '../src/stories/TideModal.stories.ts',
53
54
  '../src/stories/TidePopover.stories.ts',
54
55
  '../src/stories/TideRating.stories.ts',
56
+ '../src/stories/TideRealmLogo.stories.ts',
55
57
  '../src/stories/TideSheet.stories.ts',
56
58
  '../src/stories/TideSwitch.stories.ts',
57
59
  '../src/stories/TideTabs.stories.ts',
package/README.md CHANGED
@@ -18,6 +18,7 @@ TIDE (*T*rader *I*nteractive *D*esign and *E*ngineering) is a design system crea
18
18
  - [Figma Token Cheatsheet](./docs/token-cheatsheet.md): Remember how to implement Figma tokens from code
19
19
  - [Configuration](./docs/configuation.md): Globally set config values for your project for custom behaviors.
20
20
  - [Layout Grid Utility](./docs/grid-layout.md): Lightweight CSS Grid for consistent page alignment.
21
+ - [Forms and inputs](./docs/forms.md): Guide to using Tide Forms and Input Components.
21
22
 
22
23
  ## Glossary
23
24
  - **TIDE**: the design system itself - a series of conceptual, agreed-upon standards and guidelines meant to emphasize a consistent, scalable user experience across the suite of Trader Interactive websites
@@ -11,8 +11,17 @@
11
11
  --tide-font-28: 1.75rem;
12
12
  --tide-font-32: 2rem;
13
13
 
14
- /* Animation */
15
- --tide-animate: 300ms ease-in-out;
14
+ /* Motion */
15
+ --tide-duration-75: 75ms;
16
+ --tide-duration-150: 150ms;
17
+ --tide-duration-300: 300ms;
18
+ --tide-duration-600: 600ms;
19
+
20
+ --tide-easing-ease: ease;
21
+ --tide-easing-ease-out: ease-out;
22
+ --tide-easing-linear: linear;
23
+
24
+ --tide-animate: var(--tide-duration-300) var(--tide-easing-ease);
16
25
 
17
26
  /* Spacing */
18
27
  --tide-spacing-0: 0rem;