spoko-design-system 0.9.6 → 1.0.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 (180) hide show
  1. package/.astro/content.d.ts +1 -1
  2. package/.astro/data-store.json +1 -1
  3. package/.astro/settings.json +4 -4
  4. package/.astro/types.d.ts +2 -1
  5. package/.claude/settings.local.json +11 -1
  6. package/.github/dependabot.yml +11 -11
  7. package/.github/todo.yml +3 -3
  8. package/.github/workflows/deploy.yml +39 -39
  9. package/.github/workflows/release.yml +64 -0
  10. package/.releaserc.json +93 -0
  11. package/.stackblitzrc +5 -5
  12. package/.vscode/extensions.json +4 -5
  13. package/.vscode/launch.json +11 -11
  14. package/.vscode/settings.json +1 -5
  15. package/CHANGELOG.md +20 -0
  16. package/CONTRIBUTING.md +183 -0
  17. package/LICENSE +21 -21
  18. package/README.md +132 -116
  19. package/astro.config.mjs +84 -86
  20. package/dev-dist/sw.js +91 -91
  21. package/dev-dist/workbox-c676b6d3.js +3391 -3391
  22. package/icon.config.ts +340 -310
  23. package/index.ts +70 -70
  24. package/package.json +19 -11
  25. package/public/arrow-bottom.svg +7 -7
  26. package/public/fonts/lg.svg +53 -53
  27. package/public/fonts/vwhead-bold-demo.html +549 -549
  28. package/public/fonts/vwhead-regular-demo.html +549 -549
  29. package/public/fonts/vwtext-bold-demo.html +549 -549
  30. package/public/fonts/vwtext-regular-demo.html +549 -549
  31. package/public/github.svg +3 -3
  32. package/public/grid_dot.svg +4 -4
  33. package/public/linkedin.svg +44 -44
  34. package/public/make-scrollable-code-focusable.js +3 -3
  35. package/public/pagefind.yml +3 -3
  36. package/public/polo.blue.svg +29 -29
  37. package/public/spoko.space.svg +71 -71
  38. package/public/twitter.svg +46 -46
  39. package/renovate.json +6 -6
  40. package/sandbox.config.json +11 -11
  41. package/src/MyComponent.astro +8 -8
  42. package/src/components/Badge.vue +19 -19
  43. package/src/components/Badges.vue +21 -21
  44. package/src/components/Breadcrumbs.vue +94 -94
  45. package/src/components/Button.vue +101 -101
  46. package/src/components/ButtonCopy.astro +183 -183
  47. package/src/components/ButtonCopy.vue +36 -36
  48. package/src/components/Card.astro +27 -27
  49. package/src/components/Carousel.astro +26 -26
  50. package/src/components/Category/CategoriesCarousel.astro +100 -101
  51. package/src/components/Category/CategoryDetails.astro +168 -169
  52. package/src/components/Category/CategoryLink.vue +28 -28
  53. package/src/components/Category/CategorySidebarToggler.vue +9 -9
  54. package/src/components/Category/CategoryTile.astro +37 -37
  55. package/src/components/Category/CategoryViewToggler.astro +89 -89
  56. package/src/components/Category/SubCategoryLink.vue +19 -19
  57. package/src/components/Copyright.astro +12 -12
  58. package/src/components/Date.astro +7 -7
  59. package/src/components/Faq.astro +32 -33
  60. package/src/components/FaqItem.astro +80 -80
  61. package/src/components/FeaturesList.vue +37 -37
  62. package/src/components/FuckRussia.vue +62 -62
  63. package/src/components/HandDrive.astro +55 -29
  64. package/src/components/Header/Header.astro +210 -210
  65. package/src/components/Header/SkipToContent.astro +1 -1
  66. package/src/components/Headline.vue +107 -87
  67. package/src/components/Image.astro +30 -30
  68. package/src/components/LeftSidebar.astro +53 -53
  69. package/src/components/MainColors.vue +22 -22
  70. package/src/components/MainInput.vue +15 -15
  71. package/src/components/Modal.astro +27 -27
  72. package/src/components/PageContent.astro +5 -5
  73. package/src/components/PartNumber.vue +27 -27
  74. package/src/components/Post/PostCategories.astro +41 -41
  75. package/src/components/Post/PostCategories.vue +30 -30
  76. package/src/components/PostHeader.astro +103 -103
  77. package/src/components/PrCode.vue +141 -141
  78. package/src/components/Product/ProductButton.vue +18 -18
  79. package/src/components/Product/ProductCarousel.astro +35 -35
  80. package/src/components/Product/ProductEngineType.vue +42 -42
  81. package/src/components/Product/ProductImage.astro +40 -40
  82. package/src/components/Product/ProductLink.astro +96 -101
  83. package/src/components/Product/ProductLink.vue +59 -59
  84. package/src/components/Product/ProductLinkInfo.astro +37 -37
  85. package/src/components/Product/ProductNumber.astro +60 -60
  86. package/src/components/ProductCarousel.astro +38 -38
  87. package/src/components/ProductCodes.vue +39 -39
  88. package/src/components/ProductDetailName.vue +52 -52
  89. package/src/components/ProductDetailsList.vue +216 -216
  90. package/src/components/ProductTile.astro +47 -48
  91. package/src/components/Quote.vue +23 -23
  92. package/src/components/ReloadPrompt.astro +50 -50
  93. package/src/components/SlimBanner.vue +72 -72
  94. package/src/components/Table.vue +32 -32
  95. package/src/components/TableOfContents.astro +15 -15
  96. package/src/components/Translations.vue +23 -23
  97. package/src/components/flags/FlagPL.vue +3 -3
  98. package/src/components/flags/FlagUA.vue +2 -2
  99. package/src/components/{Layout → layout}/CallToAction.astro +52 -52
  100. package/src/components/{Layout → layout}/Container.astro +7 -7
  101. package/src/components/{Layout → layout}/Header.astro +80 -80
  102. package/src/config.ts +56 -56
  103. package/src/design.config.ts +98 -98
  104. package/src/env.d.ts +6 -6
  105. package/src/layouts/Layout.astro +58 -61
  106. package/src/layouts/MainLayout.astro +78 -81
  107. package/src/layouts/partials/FooterCommon.astro +4 -4
  108. package/src/layouts/partials/HeadCommon.astro +44 -44
  109. package/src/layouts/partials/HeadSEO.astro +41 -41
  110. package/src/pages/components/badges.mdx +57 -57
  111. package/src/pages/components/breadcrumbs.mdx +139 -139
  112. package/src/pages/components/buttons.mdx +359 -360
  113. package/src/pages/components/card.mdx +294 -294
  114. package/src/pages/components/carousel.mdx +62 -62
  115. package/src/pages/components/copyright.mdx +42 -42
  116. package/src/pages/components/details-list.mdx +115 -115
  117. package/src/pages/components/features-list.mdx +37 -37
  118. package/src/pages/components/flags.mdx +49 -49
  119. package/src/pages/components/fuck-russia.mdx +39 -39
  120. package/src/pages/components/hand-drive.mdx +78 -38
  121. package/src/pages/components/headline.mdx +137 -137
  122. package/src/pages/components/icons.astro +135 -135
  123. package/src/pages/components/image.mdx +513 -513
  124. package/src/pages/components/input.mdx +367 -367
  125. package/src/pages/components/jumbotron.mdx +359 -359
  126. package/src/pages/components/modal.mdx +64 -64
  127. package/src/pages/components/post-header.mdx +64 -64
  128. package/src/pages/components/pr-code.mdx +65 -65
  129. package/src/pages/components/product-number.mdx +58 -58
  130. package/src/pages/components/product-tile.mdx +51 -51
  131. package/src/pages/components/quote.mdx +33 -33
  132. package/src/pages/components/slimbanner.mdx +35 -35
  133. package/src/pages/components/table.mdx +108 -108
  134. package/src/pages/core/colors.mdx +10 -10
  135. package/src/pages/core/grid.mdx +89 -89
  136. package/src/pages/core/introduction.mdx +77 -77
  137. package/src/pages/core/shadows.astro +20 -20
  138. package/src/pages/core/typography.astro +49 -49
  139. package/src/pages/index.astro +264 -133
  140. package/src/pages/patterns/introduction.mdx +60 -60
  141. package/src/pwa.ts +12 -12
  142. package/src/styles/_variables.scss +70 -70
  143. package/src/styles/base/base.css +184 -184
  144. package/src/styles/base/grid.css +92 -92
  145. package/src/styles/base/typography.css +70 -70
  146. package/src/styles/content.css +73 -73
  147. package/src/styles/main.css +7 -7
  148. package/src/types/Product.ts +31 -31
  149. package/src/types/astro.d.ts +3 -3
  150. package/src/utils/category/getMainCategoryList.ts +8 -17
  151. package/src/utils/product/getPriceFormatted.ts +12 -15
  152. package/src/utils/product/getProductChecklist.ts +16 -17
  153. package/src/utils/product/useFormatProductNumber.ts +41 -41
  154. package/src/utils/seo/getShorterDescription.ts +14 -14
  155. package/src/utils/text/formatDate.ts +5 -5
  156. package/src/utils/text/formatLocaleNumber.ts +5 -6
  157. package/src/utils/text/formatPad.ts +12 -12
  158. package/src/utils/text/getNumberFormatted.ts +33 -33
  159. package/src/utils/text/getTranslatedLink.ts +5 -5
  160. package/src/utils/text.ts +19 -19
  161. package/tailwind.config.cjs +8 -8
  162. package/tsconfig.json +28 -28
  163. package/uno-config/index.ts +262 -268
  164. package/uno-config/theme/breakpoints.ts +9 -9
  165. package/uno-config/theme/colors.ts +64 -64
  166. package/uno-config/theme/dimensions.ts +17 -17
  167. package/uno-config/theme/effects.ts +14 -14
  168. package/uno-config/theme/grid.ts +10 -10
  169. package/uno-config/theme/index.ts +28 -28
  170. package/uno-config/theme/shortcuts/buttons.ts +53 -53
  171. package/uno-config/theme/shortcuts/components.ts +123 -123
  172. package/uno-config/theme/shortcuts/index.ts +20 -20
  173. package/uno-config/theme/shortcuts/layout.ts +74 -74
  174. package/uno-config/theme/typography.ts +29 -29
  175. package/uno.config.ts +2 -2
  176. package/.astro/icon.d.ts +0 -11909
  177. package/astro-i18next.config.mjs +0 -18
  178. package/astro-i18next.config.ts +0 -11
  179. package/public/locales/en/translation.json +0 -13
  180. package/public/locales/pl/translation.json +0 -13
@@ -1,139 +1,139 @@
1
- ---
2
- title: "Breadcrumbs"
3
- layout: "../../layouts/MainLayout.astro"
4
-
5
-
6
- ---
7
- import Breadcrumbs from '../../components/Breadcrumbs.vue'
8
-
9
- # Breadcrumbs
10
-
11
- Breadcrumbs component with BreadcrumbList Microdata.
12
-
13
- Structured Data for Breadcrumbs that produce a Rich Snippet (in this case breadcrumbs) in search results that are clickable, too!
14
-
15
- #
16
-
17
- https://schema.org/BreadcrumbList
18
-
19
- https://schema.org/ListItem
20
-
21
-
22
-
23
- ## Show back
24
-
25
- <div class="component-preview">
26
- <Breadcrumbs
27
- breadcrumbs={ [ {"name": "Level1", "path": "#level2"}, {"name": "Level 2", "path": "#level2"}, {"name": "Level 3", "path": "#level3"} ] }
28
- product-number="6R0XXXXXX"
29
- class="py-1 order-0 px-1 max-w-full flex bg-white"
30
- show-back
31
- text-back="Back"
32
- />
33
- </div>
34
-
35
- ```js
36
- <Breadcrumbs
37
- breadcrumbs={
38
- [
39
- {"name": "Level1", "path": "level1"},
40
- {"name": "Level 2", "path": "level2"},
41
- {"name": "Level 3", "path": "level3"}
42
- ]
43
- }
44
- product-number="6R0XXXXXX"
45
- class="py-1 order-0 px-1 max-w-full flex bg-white"
46
- show-back
47
- text-back="Back"
48
- />
49
- ```
50
-
51
-
52
- ## Show home
53
-
54
- <div class="component-preview">
55
- <Breadcrumbs
56
- breadcrumbs={ [ {"name": "Level1", "path": "#level2"}, {"name": "Level 2", "path": "#level2"}, {"name": "Level 3", "path": "#level3"} ] }
57
- product-number="6R0XXXXXX"
58
- class="py-1 order-0 px-1 max-w-full flex bg-white"
59
- show-home
60
- />
61
- </div>
62
-
63
- ```js
64
- <Breadcrumbs
65
- breadcrumbs={
66
- [
67
- {"name": "Level1", "path": "level 1"},
68
- {"name": "Level 2", "path": "level2"},
69
- {"name": "Level 3", "path": "level3"}
70
- ]
71
- }
72
- product-number="6R0XXXXXX"
73
- class="py-1 order-0 px-1 max-w-full flex bg-white"
74
- show-home
75
- />
76
- ```
77
-
78
-
79
- ## Simply
80
-
81
- <div class="component-preview">
82
- <Breadcrumbs
83
- breadcrumbs={ [ {"name": "Level1", "path": "#level2"}, {"name": "Level 2", "path": "#level2"}, {"name": "Level 3", "path": "#level3"} ] }
84
- product-number="6R0XXXXXX"
85
- class="py-1 order-0 px-1 max-w-full flex bg-white"
86
- />
87
- </div>
88
-
89
- ```js
90
- <Breadcrumbs
91
- breadcrumbs={
92
- [
93
- {"name": "Level1", "path": "level 1"},
94
- {"name": "Level 2", "path": "level2"},
95
- {"name": "Level 3", "path": "level3"}
96
- ]
97
- }
98
- product-number="6R0XXXXXX"
99
- class="py-1 order-0 px-1 max-w-full flex bg-white"
100
- show-back
101
- text-back="Back"
102
- />
103
- ```
104
-
105
-
106
- ### Schema support:
107
- - https://developers.google.com/search/docs/appearance/structured-data/breadcrumb?hl=en
108
-
109
- #### Example
110
- - https://validator.schema.org/?hl=en-US#url=https%3A%2F%2Fcatalog.polo.blue%2FN10733102%2F
111
-
112
-
113
- | @type | BreadcrumbList |
114
- | ---------------- | --------------------------------------------------------------------------------- |
115
- | **itemListElement** | |
116
- | **@type** | ListItem |
117
- | **name** | Electrical, Lighting, Telematics |
118
- | **position** | 1 |
119
- | **item** | |
120
- | **@type** | Thing |
121
- | **@id** | https://catalog.polo.blue/electrical-lighting-telematics/ |
122
- | **itemListElement** | |
123
- | **@type** | ListItem |
124
- | **name** | Exterior Lighting |
125
- | **position** | 2 |
126
- | **item** | |
127
- | **@type** | Thing |
128
- | **@id** | https://catalog.polo.blue/electrical-lighting-telematics/exterior-lighting/ |
129
- | **itemListElement** | |
130
- | **@type** | ListItem |
131
- | **name** | Bulbs |
132
- | **position** | 3 |
133
- | **item** | |
134
- | **@type** | Thing |
135
- | **@id** | https://catalog.polo.blue/electrical-lighting-telematics/exterior-lighting/bulbs/ |
136
- | **itemListElement** | |
137
- | **@type** | ListItem |
138
- | **name** | Bulb carrier with bulb; silver lens |
139
- | **position** | 4 |
1
+ ---
2
+ title: "Breadcrumbs"
3
+ layout: "../../layouts/MainLayout.astro"
4
+
5
+
6
+ ---
7
+ import Breadcrumbs from '../../components/Breadcrumbs.vue'
8
+
9
+ # Breadcrumbs
10
+
11
+ Breadcrumbs component with BreadcrumbList Microdata.
12
+
13
+ Structured Data for Breadcrumbs that produce a Rich Snippet (in this case breadcrumbs) in search results that are clickable, too!
14
+
15
+ #
16
+
17
+ https://schema.org/BreadcrumbList
18
+
19
+ https://schema.org/ListItem
20
+
21
+
22
+
23
+ ## Show back
24
+
25
+ <div class="component-preview">
26
+ <Breadcrumbs
27
+ breadcrumbs={ [ {"name": "Level1", "path": "#level2"}, {"name": "Level 2", "path": "#level2"}, {"name": "Level 3", "path": "#level3"} ] }
28
+ product-number="6R0XXXXXX"
29
+ class="py-1 order-0 px-1 max-w-full flex bg-white"
30
+ show-back
31
+ text-back="Back"
32
+ />
33
+ </div>
34
+
35
+ ```js
36
+ <Breadcrumbs
37
+ breadcrumbs={
38
+ [
39
+ {"name": "Level1", "path": "level1"},
40
+ {"name": "Level 2", "path": "level2"},
41
+ {"name": "Level 3", "path": "level3"}
42
+ ]
43
+ }
44
+ product-number="6R0XXXXXX"
45
+ class="py-1 order-0 px-1 max-w-full flex bg-white"
46
+ show-back
47
+ text-back="Back"
48
+ />
49
+ ```
50
+
51
+
52
+ ## Show home
53
+
54
+ <div class="component-preview">
55
+ <Breadcrumbs
56
+ breadcrumbs={ [ {"name": "Level1", "path": "#level2"}, {"name": "Level 2", "path": "#level2"}, {"name": "Level 3", "path": "#level3"} ] }
57
+ product-number="6R0XXXXXX"
58
+ class="py-1 order-0 px-1 max-w-full flex bg-white"
59
+ show-home
60
+ />
61
+ </div>
62
+
63
+ ```js
64
+ <Breadcrumbs
65
+ breadcrumbs={
66
+ [
67
+ {"name": "Level1", "path": "level 1"},
68
+ {"name": "Level 2", "path": "level2"},
69
+ {"name": "Level 3", "path": "level3"}
70
+ ]
71
+ }
72
+ product-number="6R0XXXXXX"
73
+ class="py-1 order-0 px-1 max-w-full flex bg-white"
74
+ show-home
75
+ />
76
+ ```
77
+
78
+
79
+ ## Simply
80
+
81
+ <div class="component-preview">
82
+ <Breadcrumbs
83
+ breadcrumbs={ [ {"name": "Level1", "path": "#level2"}, {"name": "Level 2", "path": "#level2"}, {"name": "Level 3", "path": "#level3"} ] }
84
+ product-number="6R0XXXXXX"
85
+ class="py-1 order-0 px-1 max-w-full flex bg-white"
86
+ />
87
+ </div>
88
+
89
+ ```js
90
+ <Breadcrumbs
91
+ breadcrumbs={
92
+ [
93
+ {"name": "Level1", "path": "level 1"},
94
+ {"name": "Level 2", "path": "level2"},
95
+ {"name": "Level 3", "path": "level3"}
96
+ ]
97
+ }
98
+ product-number="6R0XXXXXX"
99
+ class="py-1 order-0 px-1 max-w-full flex bg-white"
100
+ show-back
101
+ text-back="Back"
102
+ />
103
+ ```
104
+
105
+
106
+ ### Schema support:
107
+ - https://developers.google.com/search/docs/appearance/structured-data/breadcrumb?hl=en
108
+
109
+ #### Example
110
+ - https://validator.schema.org/?hl=en-US#url=https%3A%2F%2Fcatalog.polo.blue%2FN10733102%2F
111
+
112
+
113
+ | @type | BreadcrumbList |
114
+ | ---------------- | --------------------------------------------------------------------------------- |
115
+ | **itemListElement** | |
116
+ | **@type** | ListItem |
117
+ | **name** | Electrical, Lighting, Telematics |
118
+ | **position** | 1 |
119
+ | **item** | |
120
+ | **@type** | Thing |
121
+ | **@id** | https://catalog.polo.blue/electrical-lighting-telematics/ |
122
+ | **itemListElement** | |
123
+ | **@type** | ListItem |
124
+ | **name** | Exterior Lighting |
125
+ | **position** | 2 |
126
+ | **item** | |
127
+ | **@type** | Thing |
128
+ | **@id** | https://catalog.polo.blue/electrical-lighting-telematics/exterior-lighting/ |
129
+ | **itemListElement** | |
130
+ | **@type** | ListItem |
131
+ | **name** | Bulbs |
132
+ | **position** | 3 |
133
+ | **item** | |
134
+ | **@type** | Thing |
135
+ | **@id** | https://catalog.polo.blue/electrical-lighting-telematics/exterior-lighting/bulbs/ |
136
+ | **itemListElement** | |
137
+ | **@type** | ListItem |
138
+ | **name** | Bulb carrier with bulb; silver lens |
139
+ | **position** | 4 |