@orangesk/orange-design-system 2.1.0 → 3.0.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.
Files changed (117) hide show
  1. package/build/components/Accordion/style.css +1 -1
  2. package/build/components/Accordion/style.css.map +1 -1
  3. package/build/components/BlockAction/style.css +1 -1
  4. package/build/components/BlockAction/style.css.map +1 -1
  5. package/build/components/Card/style.css +1 -1
  6. package/build/components/Card/style.css.map +1 -1
  7. package/build/components/Carousel/style.css +1 -1
  8. package/build/components/Carousel/style.css.map +1 -1
  9. package/build/components/CarouselHero/style.css +1 -1
  10. package/build/components/CarouselHero/style.css.map +1 -1
  11. package/build/components/CarouselPromotions/style.css +1 -1
  12. package/build/components/CarouselPromotions/style.css.map +1 -1
  13. package/build/components/Cover/style.css +1 -1
  14. package/build/components/Cover/style.css.map +1 -1
  15. package/build/components/Dropdown/style.css +1 -1
  16. package/build/components/Dropdown/style.css.map +1 -1
  17. package/build/components/FeatureAccordion/style.css +1 -1
  18. package/build/components/FeatureAccordion/style.css.map +1 -1
  19. package/build/components/Footer/style.css +1 -1
  20. package/build/components/Footer/style.css.map +1 -1
  21. package/build/components/Icon/style.css +1 -1
  22. package/build/components/Icon/style.css.map +1 -1
  23. package/build/components/IconList/style.css +1 -1
  24. package/build/components/IconList/style.css.map +1 -1
  25. package/build/components/Link/style.css +1 -1
  26. package/build/components/Link/style.css.map +1 -1
  27. package/build/components/Megamenu/style.css +1 -1
  28. package/build/components/Megamenu/style.css.map +1 -1
  29. package/build/components/PromoBanner/style.css +1 -1
  30. package/build/components/PromoBanner/style.css.map +1 -1
  31. package/build/components/Tile/style.css +1 -1
  32. package/build/components/Tile/style.css.map +1 -1
  33. package/build/components/Timeline/style.css +2 -0
  34. package/build/components/Timeline/style.css.map +1 -0
  35. package/build/components/Tooltip/style.css +1 -1
  36. package/build/components/Tooltip/style.css.map +1 -1
  37. package/build/components/index.js +1 -1
  38. package/build/components/index.js.map +1 -1
  39. package/build/components/tsconfig.tsbuildinfo +1 -1
  40. package/build/components/types/index.d.ts +30 -2
  41. package/build/components/types/src/components/FeatureAccordion/FeatureAccordion.d.ts +3 -0
  42. package/build/components/types/src/components/FeatureAccordion/FeatureAccordion.static.d.ts +0 -3
  43. package/build/components/types/src/components/FeatureAccordion/FeatureAccordionItem.d.ts +2 -1
  44. package/build/components/types/src/components/Timeline/Timeline.d.ts +13 -0
  45. package/build/components/types/src/components/Timeline/index.d.ts +2 -0
  46. package/build/components/types/src/components/index.d.ts +2 -1
  47. package/build/images/card-device-example.png +0 -0
  48. package/build/lib/base.css +1 -1
  49. package/build/lib/base.css.map +1 -1
  50. package/build/lib/components.css +1 -1
  51. package/build/lib/components.css.map +1 -1
  52. package/build/lib/footer.css +1 -1
  53. package/build/lib/footer.css.map +1 -1
  54. package/build/lib/footer.js +1 -1
  55. package/build/lib/footer.js.map +1 -1
  56. package/build/lib/megamenu.css +1 -1
  57. package/build/lib/megamenu.css.map +1 -1
  58. package/build/lib/megamenu.js +1 -1
  59. package/build/lib/megamenu.js.map +1 -1
  60. package/build/lib/scripts.js +1 -1
  61. package/build/lib/scripts.js.map +1 -1
  62. package/build/lib/style.css +1 -1
  63. package/build/lib/style.css.map +1 -1
  64. package/build/search-index.json +10 -6
  65. package/build/sprite.svg +1 -1
  66. package/package.json +21 -21
  67. package/src/assets/icons/pictogram-communication--dark.svg +4 -0
  68. package/src/assets/icons/pictogram-communication.svg +4 -0
  69. package/src/assets/icons/pictogram-coverage--dark.svg +5 -0
  70. package/src/assets/icons/pictogram-coverage.svg +5 -0
  71. package/src/assets/icons/pictogram-credit--dark.svg +7 -0
  72. package/src/assets/icons/pictogram-credit.svg +6 -0
  73. package/src/assets/icons/pictogram-disney--dark.svg +5 -14
  74. package/src/assets/icons/pictogram-disney.svg +5 -9
  75. package/src/assets/icons/pictogram-modem--dark.svg +9 -0
  76. package/src/assets/icons/pictogram-modem.svg +9 -0
  77. package/src/assets/icons/pictogram-speed--dark.svg +7 -0
  78. package/src/assets/icons/pictogram-speed.svg +7 -0
  79. package/src/assets/icons/pictogram-sunset--dark.svg +10 -0
  80. package/src/assets/icons/pictogram-sunset.svg +10 -0
  81. package/src/assets/icons/pictogram-tariffs--dark.svg +4 -8
  82. package/src/assets/icons/pictogram-tariffs.svg +4 -8
  83. package/src/assets/icons/pictogram-wallet--dark.svg +6 -0
  84. package/src/assets/icons/pictogram-wallet.svg +6 -0
  85. package/src/components/Accordion/styles/mixins.scss +2 -4
  86. package/src/components/BlockAction/styles/mixins.scss +1 -1
  87. package/src/components/BlockAction/styles/style.scss +1 -1
  88. package/src/components/BlockAction/tests/BlockAction.styles.unit.test.jsx +18 -0
  89. package/src/components/Card/styles/mixins.scss +4 -0
  90. package/src/components/Card/styles/style.scss +1 -0
  91. package/src/components/Carousel/Carousel.tsx +6 -3
  92. package/src/components/CarouselHero/styles/mixins.scss +1 -3
  93. package/src/components/CarouselPromotions/styles/mixins.scss +2 -2
  94. package/src/components/Cover/styles/mixins.scss +2 -0
  95. package/src/components/FeatureAccordion/FeatureAccordion.static.ts +3 -71
  96. package/src/components/FeatureAccordion/FeatureAccordion.tsx +23 -59
  97. package/src/components/FeatureAccordion/FeatureAccordionItem.tsx +9 -14
  98. package/src/components/FeatureAccordion/styles/mixins.scss +67 -23
  99. package/src/components/FeatureAccordion/tests/FeatureAccordion.unit.test.jsx +9 -0
  100. package/src/components/Forms/File/styles/style.scss +1 -1
  101. package/src/components/Forms/styles/mixins.scss +1 -1
  102. package/src/components/Icon/styles/mixins.scss +4 -4
  103. package/src/components/IconList/styles/mixins.scss +2 -1
  104. package/src/components/Link/styles/style.scss +4 -1
  105. package/src/components/PromoBanner/styles/mixins.scss +2 -0
  106. package/src/components/Tile/styles/mixins.scss +25 -7
  107. package/src/components/Tile/styles/style.scss +5 -1
  108. package/src/components/Timeline/Timeline.tsx +60 -0
  109. package/src/components/Timeline/index.ts +2 -0
  110. package/src/components/Timeline/styles/config.scss +25 -0
  111. package/src/components/Timeline/styles/mixins.scss +102 -0
  112. package/src/components/Timeline/styles/style.scss +60 -0
  113. package/src/components/Timeline/tests/Timeline.conformance.test.jsx +29 -0
  114. package/src/components/Timeline/tests/Timeline.unit.test.jsx +89 -0
  115. package/src/components/index.ts +2 -0
  116. package/src/styles/tokens/base.scss +0 -16
  117. package/src/styles/typography/mixins.scss +13 -2
package/build/components/Tooltip/style.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["style.scss"],"names":[],"mappings":"AAWA,kBACE,SAME,aAAc,CAJd,SAAU,CADV,iBAAkB,CAGlB,uBAA+B,CAD/B,+BAAkC,CAElC,YAEF,CACA,qBACE,eACF,CACA,qCACE,sBACF,CACA,uCACE,oBACF,CACA,wCACE,mBACF,CACA,sCACE,qBACF,CACA,oBACE,SACF,CACA,iBAIE,6CAA8C,CAC9C,6CAA8C,CAC9C,sBAAwB,CALxB,oBAAqB,CACrB,kBAAmB,CACnB,eAIF,CACA,+CACE,eACF,CACA,gBACE,aACF,CACA,uBAME,2BAA4B,CAD5B,6CAA8C,CAE9C,6CAA8C,CAN9C,UAAW,CACX,aAAc,CAEd,cAAgB,CAIhB,uBAAwB,CALxB,aAMF,CACA,6CACE,qBACF,CACA,+CACE,mBACF,CACA,gDACE,kBACF,CACA,8CACE,oBACF,CACA,oDAEE,6BAA8B,CAD9B,4BAEF,CACA,uDACE,+BAAgC,CAChC,8BACF,CACA,qDACE,+BAAgC,CAChC,6BACF,CACA,sDAEE,8BAA+B,CAD/B,4BAEF,CACA,cAIE,kBAAmB,CAFnB,mBAAoB,CADpB,iBAAkB,CAElB,oBAEF,CACA,oBAGE,2FAA6F,CAD7F,mCAAqC,CADrC,yBAGF,CACA,4BAGE,2FAA6F,CAD7F,mCAAqC,CADrC,yBAGF,CACA,wCAGE,eAAgB,CADhB,mCAAqC,CADrC,yBAGF,CACA,qBACE,UAAW,CAKX,2BAA4B,CAF5B,aAAe,CAFf,iBAAkB,CAClB,YAAc,CAEd,0BAEF,CACA,oFACE,6BACF,CACF","file":"style.css","sourcesContent":["/*\n * Add space between trigger and tooltip.\n*/\n/*\n * Arrow size MUST be a rem-based value. It's used in Pythagoras theorem\n * to find the hypotenuse size and sass math exponential functions do not handle units.\n * Therefore, the rem unit is added manually at the end of the calculation.\n*/\n/**\n * Resets margin-bottom of the last child to zero\n */\n@layer components {\n .tooltip {\n position: absolute;\n opacity: 0;\n transition: opacity 200ms ease-out;\n transform: translate3d(0, 0, 0);\n z-index: 1000;\n display: block;\n }\n .tooltip > *:last-child {\n margin-bottom: 0;\n }\n .tooltip[data-popper-placement^=top] {\n padding-bottom: 1.25rem;\n }\n .tooltip[data-popper-placement^=right] {\n padding-left: 1.25rem;\n }\n .tooltip[data-popper-placement^=bottom] {\n padding-top: 1.25rem;\n }\n .tooltip[data-popper-placement^=left] {\n padding-right: 1.25rem;\n }\n .tooltip.is-visible {\n opacity: 1;\n }\n .tooltip__dialog {\n display: inline-block;\n max-width: 18.75rem;\n padding: 1.25rem;\n background-color: var(--color-surface-primary);\n border: 2px solid var(--color-border-contrast);\n border-radius: 0.3125rem;\n }\n .tooltip__dialog > :not([class*=mb-]):last-child {\n margin-bottom: 0;\n }\n .tooltip__arrow {\n display: block;\n }\n .tooltip__arrow::before {\n content: \"\";\n display: block;\n width: 0.875rem;\n height: 0.875rem;\n background-color: var(--color-surface-primary);\n background-clip: padding-box;\n border: 2px solid var(--color-border-contrast);\n transform: rotate(45deg);\n }\n [data-popper-placement^=top] .tooltip__arrow {\n bottom: 0.9406407832rem;\n }\n [data-popper-placement^=right] .tooltip__arrow {\n left: 0.9406407832rem;\n }\n [data-popper-placement^=bottom] .tooltip__arrow {\n top: 0.9406407832rem;\n }\n [data-popper-placement^=left] .tooltip__arrow {\n right: 0.9406407832rem;\n }\n [data-popper-placement^=top] .tooltip__arrow:before {\n border-top-color: transparent;\n border-left-color: transparent;\n }\n [data-popper-placement^=bottom] .tooltip__arrow:before {\n border-bottom-color: transparent;\n border-right-color: transparent;\n }\n [data-popper-placement^=left] .tooltip__arrow:before {\n border-bottom-color: transparent;\n border-left-color: transparent;\n }\n [data-popper-placement^=right] .tooltip__arrow:before {\n border-top-color: transparent;\n border-right-color: transparent;\n }\n .info-tooltip {\n position: relative;\n display: inline-flex;\n vertical-align: -0.1em;\n border-radius: 100%;\n }\n .info-tooltip:focus {\n outline-width: 0 !important;\n outline-color: transparent !important;\n box-shadow: 0 0 0 2px var(--color-background-primary), 0 0 0 4px var(--color-border-contrast);\n }\n .info-tooltip:focus-visible {\n outline-width: 0 !important;\n outline-color: transparent !important;\n box-shadow: 0 0 0 2px var(--color-background-primary), 0 0 0 4px var(--color-border-contrast);\n }\n .info-tooltip:focus:not(:focus-visible) {\n outline-width: 0 !important;\n outline-color: transparent !important;\n box-shadow: none;\n }\n .info-tooltip::before {\n content: \"\";\n position: absolute;\n top: -0.625rem;\n left: -0.625rem;\n width: calc(100% + 1.25rem);\n height: calc(100% + 1.25rem);\n }\n .info-tooltip.is-active .info-tooltip__icon, .info-tooltip:focus .info-tooltip__icon {\n color: var(--color-icon-brand);\n }\n}"]}
1
+ {"version":3,"sources":["style.scss"],"names":[],"mappings":"AAWA,kBACE,SAME,aAAc,CAJd,SAAU,CADV,iBAAkB,CAGlB,uBAA+B,CAD/B,+BAAkC,CAElC,YAEF,CACA,qBACE,eACF,CACA,qCACE,sBACF,CACA,uCACE,oBACF,CACA,wCACE,mBACF,CACA,sCACE,qBACF,CACA,oBACE,SACF,CACA,iBAIE,6CAA8C,CAC9C,6CAA8C,CAC9C,sBAAwB,CALxB,oBAAqB,CACrB,kBAAmB,CACnB,eAIF,CACA,+CACE,eACF,CACA,gBACE,aACF,CACA,uBAME,2BAA4B,CAD5B,6CAA8C,CAE9C,6CAA8C,CAN9C,UAAW,CACX,aAAc,CAEd,cAAgB,CAIhB,uBAAwB,CALxB,aAMF,CACA,6CACE,qBACF,CACA,+CACE,mBACF,CACA,gDACE,kBACF,CACA,8CACE,oBACF,CACA,oDAEE,6BAA8B,CAD9B,4BAEF,CACA,uDACE,+BAAgC,CAChC,8BACF,CACA,qDACE,+BAAgC,CAChC,6BACF,CACA,sDAEE,8BAA+B,CAD/B,4BAEF,CACA,cAIE,kBAAmB,CAFnB,mBAAoB,CADpB,iBAAkB,CAElB,oBAEF,CACA,4BAGE,2FAA6F,CAD7F,mCAAqC,CADrC,yBAGF,CACA,wCAGE,eAAgB,CADhB,mCAAqC,CADrC,yBAGF,CACA,qBACE,UAAW,CAKX,2BAA4B,CAF5B,aAAe,CAFf,iBAAkB,CAClB,YAAc,CAEd,0BAEF,CACA,oFACE,6BACF,CACF","file":"style.css","sourcesContent":["/*\n * Add space between trigger and tooltip.\n*/\n/*\n * Arrow size MUST be a rem-based value. It's used in Pythagoras theorem\n * to find the hypotenuse size and sass math exponential functions do not handle units.\n * Therefore, the rem unit is added manually at the end of the calculation.\n*/\n/**\n * Resets margin-bottom of the last child to zero\n */\n@layer components {\n .tooltip {\n position: absolute;\n opacity: 0;\n transition: opacity 200ms ease-out;\n transform: translate3d(0, 0, 0);\n z-index: 1000;\n display: block;\n }\n .tooltip > *:last-child {\n margin-bottom: 0;\n }\n .tooltip[data-popper-placement^=top] {\n padding-bottom: 1.25rem;\n }\n .tooltip[data-popper-placement^=right] {\n padding-left: 1.25rem;\n }\n .tooltip[data-popper-placement^=bottom] {\n padding-top: 1.25rem;\n }\n .tooltip[data-popper-placement^=left] {\n padding-right: 1.25rem;\n }\n .tooltip.is-visible {\n opacity: 1;\n }\n .tooltip__dialog {\n display: inline-block;\n max-width: 18.75rem;\n padding: 1.25rem;\n background-color: var(--color-surface-primary);\n border: 2px solid var(--color-border-contrast);\n border-radius: 0.3125rem;\n }\n .tooltip__dialog > :not([class*=mb-]):last-child {\n margin-bottom: 0;\n }\n .tooltip__arrow {\n display: block;\n }\n .tooltip__arrow::before {\n content: \"\";\n display: block;\n width: 0.875rem;\n height: 0.875rem;\n background-color: var(--color-surface-primary);\n background-clip: padding-box;\n border: 2px solid var(--color-border-contrast);\n transform: rotate(45deg);\n }\n [data-popper-placement^=top] .tooltip__arrow {\n bottom: 0.9406407832rem;\n }\n [data-popper-placement^=right] .tooltip__arrow {\n left: 0.9406407832rem;\n }\n [data-popper-placement^=bottom] .tooltip__arrow {\n top: 0.9406407832rem;\n }\n [data-popper-placement^=left] .tooltip__arrow {\n right: 0.9406407832rem;\n }\n [data-popper-placement^=top] .tooltip__arrow:before {\n border-top-color: transparent;\n border-left-color: transparent;\n }\n [data-popper-placement^=bottom] .tooltip__arrow:before {\n border-bottom-color: transparent;\n border-right-color: transparent;\n }\n [data-popper-placement^=left] .tooltip__arrow:before {\n border-bottom-color: transparent;\n border-left-color: transparent;\n }\n [data-popper-placement^=right] .tooltip__arrow:before {\n border-top-color: transparent;\n border-right-color: transparent;\n }\n .info-tooltip {\n position: relative;\n display: inline-flex;\n vertical-align: -0.1em;\n border-radius: 100%;\n }\n .info-tooltip:focus-visible {\n outline-width: 0 !important;\n outline-color: transparent !important;\n box-shadow: 0 0 0 2px var(--color-background-primary), 0 0 0 4px var(--color-border-contrast);\n }\n .info-tooltip:focus:not(:focus-visible) {\n outline-width: 0 !important;\n outline-color: transparent !important;\n box-shadow: none;\n }\n .info-tooltip::before {\n content: \"\";\n position: absolute;\n top: -0.625rem;\n left: -0.625rem;\n width: calc(100% + 1.25rem);\n height: calc(100% + 1.25rem);\n }\n .info-tooltip.is-active .info-tooltip__icon, .info-tooltip:focus .info-tooltip__icon {\n color: var(--color-icon-brand);\n }\n}"]}