@shohojdhara/atomix 0.4.3 → 0.4.5

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 (45) hide show
  1. package/dist/atomix.css +26 -5
  2. package/dist/atomix.css.map +1 -1
  3. package/dist/atomix.min.css +1 -1
  4. package/dist/atomix.min.css.map +1 -1
  5. package/dist/charts.js +4 -16
  6. package/dist/charts.js.map +1 -1
  7. package/dist/core.d.ts +4 -4
  8. package/dist/core.js +14 -26
  9. package/dist/core.js.map +1 -1
  10. package/dist/forms.js +4 -16
  11. package/dist/forms.js.map +1 -1
  12. package/dist/heavy.js +9 -21
  13. package/dist/heavy.js.map +1 -1
  14. package/dist/index.d.ts +40 -16
  15. package/dist/index.esm.js +307 -341
  16. package/dist/index.esm.js.map +1 -1
  17. package/dist/index.js +337 -357
  18. package/dist/index.js.map +1 -1
  19. package/dist/index.min.js +1 -1
  20. package/dist/index.min.js.map +1 -1
  21. package/package.json +1 -1
  22. package/src/components/AtomixGlass/AtomixGlass.tsx +2 -15
  23. package/src/components/AtomixGlass/AtomixGlassContainer.tsx +3 -8
  24. package/src/components/Breadcrumb/Breadcrumb.tsx +5 -5
  25. package/src/components/Breadcrumb/BreadcrumbCompound.test.tsx +2 -2
  26. package/src/components/Button/Button.tsx +6 -6
  27. package/src/components/Card/Card.tsx +3 -3
  28. package/src/components/Dropdown/Dropdown.tsx +5 -3
  29. package/src/components/Footer/Footer.tsx +124 -166
  30. package/src/components/Footer/FooterLink.tsx +16 -19
  31. package/src/components/Footer/FooterSection.tsx +40 -39
  32. package/src/components/Footer/FooterSocialLink.tsx +59 -58
  33. package/src/components/Footer/README.md +1 -1
  34. package/src/components/Hero/Hero.tsx +72 -142
  35. package/src/components/Navigation/Menu/MegaMenu.tsx +17 -12
  36. package/src/components/Navigation/Menu/Menu.tsx +49 -24
  37. package/src/components/Navigation/Nav/NavItem.tsx +5 -3
  38. package/src/components/Navigation/SideMenu/SideMenu.tsx +2 -2
  39. package/src/components/Navigation/SideMenu/SideMenuItem.tsx +4 -4
  40. package/src/components/Slider/Slider.tsx +7 -4
  41. package/src/lib/composables/useFooter.ts +117 -20
  42. package/src/lib/composables/useSlider.ts +3 -1
  43. package/src/lib/types/components.ts +44 -12
  44. package/src/styles/06-components/_components.atomix-glass.scss +39 -5
  45. package/src/components/AtomixGlass/__snapshots__/AtomixGlass.test.tsx.snap +0 -222
@@ -1,222 +0,0 @@
1
- // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
2
-
3
- exports[`AtomixGlass Visual Regression > matches snapshot with default props 1`] = `
4
- <div>
5
- <div
6
- class="c-atomix-glass"
7
- style="--atomix-glass-radius: 16px; --atomix-glass-transform: translate(0px, 0px) scale(1); --atomix-glass-position: absolute; --atomix-glass-top: 0px; --atomix-glass-left: 0px; --atomix-glass-width: 100%; --atomix-glass-height: 100%; --atomix-glass-border-width: var(--atomix-spacing-0-5, 0.09375rem); --atomix-glass-blend-mode: overlay; --atomix-glass-border-gradient-1: linear-gradient(135deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.08399999999999999) 33%, rgba(255, 255, 255, 0.27999999999999997) 66%, rgba(255, 255, 255, 0) 100%); --atomix-glass-border-gradient-2: linear-gradient(135deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.22399999999999998) 33%, rgba(255, 255, 255, 0.42) 66%, rgba(255, 255, 255, 0) 100%); --atomix-glass-hover-1-opacity: 0; --atomix-glass-hover-1-gradient: radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 50%); --atomix-glass-hover-2-opacity: 0; --atomix-glass-hover-2-gradient: radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 80%); --atomix-glass-hover-3-opacity: 0; --atomix-glass-hover-3-gradient: radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%); --atomix-glass-base-opacity: 0; --atomix-glass-base-gradient: rgba(255, 255, 255, 0.1); --atomix-glass-overlay-opacity: 0; --atomix-glass-overlay-gradient: rgba(255, 255, 255, 0.05);"
8
- >
9
- <div
10
- class="c-atomix-glass__container "
11
- style="transform: translate(0px, 0px) scale(1); --atomix-glass-container-width: 270; --atomix-glass-container-height: 69; --atomix-glass-container-padding: 0 0; --atomix-glass-container-radius: 16px; --atomix-glass-container-backdrop: blur(1.2100000000000002px) saturate(160%) contrast(1.4) brightness(0.9); --atomix-glass-container-shadow: 0 0 20px rgba(0, 0, 0, 0.15) inset, 0 4px 8px rgba(0, 0, 0, 0.08) inset; --atomix-glass-container-shadow-opacity: 1; --atomix-glass-container-bg: none; --atomix-glass-container-text-shadow: 0px 2px 12px rgba(0, 0, 0, 0.4); --atomix-glass-container-box-shadow: 0px 12px 40px rgba(0, 0, 0, 0.25); transition-duration: 0s !important; animation-duration: 0s !important; transition-delay: 0s;"
12
- >
13
- <div
14
- class="c-atomix-glass__inner"
15
- style="box-shadow: var(--atomix-glass-container-box-shadow);"
16
- >
17
- <div
18
- class="c-atomix-glass__filter"
19
- style="z-index: 1; position: absolute; inset: 0;"
20
- >
21
- <svg
22
- aria-hidden="true"
23
- style="position: absolute; width: 100%; height: 100%; inset: 0;"
24
- >
25
- <defs>
26
- <radialgradient
27
- cx="50%"
28
- cy="50%"
29
- id="atomix-glass-filter-14-edge-mask"
30
- r="50%"
31
- >
32
- <stop
33
- offset="0%"
34
- stop-color="black"
35
- stop-opacity="0"
36
- />
37
- <stop
38
- offset="75%"
39
- stop-color="black"
40
- stop-opacity="0"
41
- />
42
- <stop
43
- offset="100%"
44
- stop-color="white"
45
- stop-opacity="1"
46
- />
47
- </radialgradient>
48
- <filter
49
- color-interpolation-filters="sRGB"
50
- height="170%"
51
- id="atomix-glass-filter-14"
52
- width="170%"
53
- x="-35%"
54
- y="-35%"
55
- >
56
- <feimage
57
- height="100%"
58
- href="data:image/jpeg;base64,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cUAUAkEkziomgGgkoxZGgxZFQFQlYnQHRdPfj/10KCSCKESCNiVkViPSLpD0h6I0Q0I0A2IoBWBIJIBKBIJoJIJ2R2J0JWBUJ0JUB0XTv479dFZDYiglYigkhEgjZFQjRFQjRFQjQigFYigHYigmgEgmglYlYnQlQlYlQHQlQnQ9P/kf1yVkNiNCNkNiVENiNiViNEViNkVCVgKCViViViSCViSCVgdCViVCViVCdgVCVCdD1D+U/XBWQ2I0I2Q2JUQ2I0JWQ0I2JUQ2JUI2JUI2J0JWJWJWA2R0BWJ0I2JUJ2BUJUJ0P//EABkQAQEBAQEBAAAAAAAAAAAAAAECABEDEP/aAAgBAQABAgB1atWrVq1atWrVq1atWrVq1atWrVq1atWrVq+OrVq1atWrVq1atWrVq1atWrVq1atWrVq1atXxVppppppdWrVq1atWrVq1NNNNNNNNNNNPVWmmmmms6tWrVq1atWpppppppppppppp6q0000uc51atWrVq1ammmmmmmmmmmmmt1Vpppc5znVq1atWrVqaaaaaaaaaaaaaeqtNLnOc51atWrVq1ammmmmmmmmmmmmnqrS5znOc6tWrVq16222mmmmmmlVppp6tKuc5znOrVq1a9TbbbbTTTTTSq000qtLnOc5zq1atWrW0222200000qqqtKqrnOc5zq1atTbbbbbbbbTTTSqqqqqq5znOc6tTTTbbbbbbbbTTTSqqqqrlVznOctNNNtttttttttNNNNKqqqrqznKqrTTTTbbbbbbbbbTTTSqqqqrqznOc5aaaabbbbbbbbbaaaaVVVVVdWc5znVq1NNttttttttttNNKqqqqudWc5znVq16tbbbbbbbbbbTTSqqqq5XVnOc6tWrVrb1tttttttttNNKqqqqrWrK5VWmmm2230bbbbbbaaaXOc5zlVa1KuVVppptttt9G22222mmlzlVznK6tWVVWmmmm2222222222mlznOc5znLWppVVWmmm22222229bTWrOc5znOcq1qaaVpWmm222222229erVqznOc5znKtatStK0rTbTTbbbberXr1as5znOc5aVpppppWlabaabbbb1ta9WrVnOc5znU0rTTTTTTTTTbTTbbbTWvVq1as5znOdTTStNNNNNNNNNtNNtttN6tWvVq1ZznOrU00rTTTTTTTTTTTTTbTWvVq1atWrOc6tTTTStNNNNNNNNNNtNNtNa9WrVq1Z1Z1NNNNNK1q1NNNNNNNNNNNtNatWrVq1atWrU00000rWrVq1atWrVq1alaaa1atWrVq1NNNammmmla1atWrVq1aterVq16tWrVnVqa1NK1qaaaVX/xAAWEAADAAAAAAAAAAAAAAAAAAAhgJD/2gAIAQEAAz8AaExf/8QAGhEBAQEBAQEBAAAAAAAAAAAAAQISEQADEP/aAAgBAgEBAgDx48ePHjx48ePHjx48ePHjx48ePHjx48ePHj86IiIiIiInjx48ePHjx48IiIiIj0oooooooooRERER73ve60UUUUUUVrWiiiiiihERERER73ve97ooooorRWiiiiihKERERER73ve973RRRRWtFFFFFFCIiIiIiPe973ve60UUVrRRRRRRQiIlCIiI973ve973pRRWiiiiiiiiiiiiiiihEe973ve973RRWtFFFFFFFFFFFFFFFFFFa13ve973WitaKKKKKKKKKKKKKKKKKK1rWtd1rutFa1oooooooooooosssooorWta1rWta1rRRRRRRRRRRZZZZZZZZZWta1rWta1rRRRRRRRRZZZZZZZZZZZZe9a1rWta1rWitaKLLLLLLLLLLLLLLLLL3rWta1rWtFbLLLLLLLLLLLLLLLLLLLL3vWta1rWita1ssssssss+hZZZZZZZZe961rWta0Vre97LLLLLLLLLLLPoWWWWWXrWta1oorWta3ssss+hZZZZ9Cyyyyyyyyiita1orWta1ve9llllllllllllllllFFa0VorWta1ve9llllllllllllllllllFFFaK1rWta1rWiyyyyyyyyyyyyiiiiiiitFFa1rWta1oosoosssssoooosoooorRRRWta1rWta0UUUUUWUUUUUUUUUUUVoooorWta1rWtaKKKKKKmiiiiiiiiiiiiiiitd73ve61oSiiipoqaKKKKKKKKKK0UUUVrve973vREREZoSihEooooorRRRRWtd73ve9EREREREoSiiiiitFllllla73ve9ERERERESiiiiiitH0PoWWWWVrXe96IiIiMoiJRRRRRRWjwlFFllllFFd6IiIiIlCUUUUUUUUUePHjx48ePCIiIiIiIiUUUUUUUUUUUePHjx48ePHjx48ePHjx48IiUUUUUUJRRRX//xAAWEQADAAAAAAAAAAAAAAAAAAABYJD/2gAIAQIBAz8AtEV7/8QAFxEBAQEBAAAAAAAAAAAAAAAAAAECEP/aAAgBAwEBAgCtNNNNNNNNNNNNNNNNNNNNNNNNNNNNNcrTTTTTTTTTTTTTTTTTTTTTTTTTTTTTXKrTTTTTTTU000000000000000000001FVpppppqampqaaaaaaaaaaaaaaaaaaaa5Vaaaaampqampqammmmmmmmmmmlaaaaaaiq0001NTU1NTU1NTTTTTTTTTTSqqtNNNcqtNNSyzU1LNTU1NTTTTTTTTTSqqq001ytNLLLLNTU1NTU1NTbbbTTTTTSqqq001ytNLLLLLNTU1NTU3NttttNNNNNKqq001KrSyyyyyzU1NTU3Nzc02220000qqqqrSqqyyyyyzU1NTU3Nzc3NttttNNNKqqqqqqssssss1NTU3Nzc3NzbbbbTTTSqqqqqqrLLLLLNTU1Nzc3Nzc22220000qqqqqqqqssss1NTU3Nzc3NzbbbbbTTSqqqqqqqqqqzU1NTc3Nzc3Nzbc22000qqqqqqqqqqqtTU3Nzc3Nzc3NtzbTTSqqqqrKqqqqqtNNzc23Nzc3Nzc3NTU1KqqqrKqqqqqtNNNNttzc3Nzc3NzU1NLLLLLKqqqqqqqq0022223Nzc3NzU1NSyyyyyyqqqqqqqrTTbbbbc3Nzc3NTU1LLLLLLKsqqqqqqrTTTTbbbc3Nzc1NTUsssssssqqqqqqrTTTTTbbbTc3NTU1NTUsssssqqqqqqqq0000222023NTU1NTUsssssqqqqqqqq000000003NTU1NTU1LLLLLNKrTSqqqqtNNNNNNtNNTU1NSzUssss00qq0qqqqrTTTTTTTTTU1NTUs1LLLNNNKrTTTSqqq00000000001NTU1LNTU0000qtNNNKqqqtNNNNNNNNTU1NTUs1NNNNNKss1NNNK00qtK0000001NNTU0s000000qq000001NKrStNNNNK1NNNNStNNNNNKqtNNNNNNNK0000000rU0000rTTTTTSq00000rTTTTTTTTTTTTTTTTStNNNNKr/xAAUEQEAAAAAAAAAAAAAAAAAAACg/9oACAEDAQM/AAAf/9k="
59
- id="atomix-glass-filter-14-image"
60
- preserveAspectRatio="xMidYMid slice"
61
- result="DISPLACEMENT_MAP"
62
- width="100%"
63
- x="0"
64
- y="0"
65
- />
66
- <fecolormatrix
67
- in="DISPLACEMENT_MAP"
68
- result="EDGE_INTENSITY"
69
- type="matrix"
70
- values="0.3 0.3 0.3 0 0
71
- 0.3 0.3 0.3 0 0
72
- 0.3 0.3 0.3 0 0
73
- 0 0 0 1 0"
74
- />
75
- <fecomponenttransfer
76
- in="EDGE_INTENSITY"
77
- result="EDGE_MASK"
78
- >
79
- <fefunca
80
- tableValues="0 0.125 1"
81
- type="discrete"
82
- />
83
- </fecomponenttransfer>
84
- <feoffset
85
- dx="0"
86
- dy="0"
87
- in="SourceGraphic"
88
- result="CENTER_ORIGINAL"
89
- />
90
- <fedisplacementmap
91
- in="SourceGraphic"
92
- in2="DISPLACEMENT_MAP"
93
- result="RED_DISPLACED"
94
- scale="-20"
95
- xChannelSelector="R"
96
- yChannelSelector="B"
97
- />
98
- <fecolormatrix
99
- in="RED_DISPLACED"
100
- result="RED_CHANNEL"
101
- type="matrix"
102
- values="1 0 0 0 0
103
- 0 0 0 0 0
104
- 0 0 0 0 0
105
- 0 0 0 1 0"
106
- />
107
- <fedisplacementmap
108
- in="SourceGraphic"
109
- in2="DISPLACEMENT_MAP"
110
- result="GREEN_DISPLACED"
111
- scale="-21"
112
- xChannelSelector="R"
113
- yChannelSelector="B"
114
- />
115
- <fecolormatrix
116
- in="GREEN_DISPLACED"
117
- result="GREEN_CHANNEL"
118
- type="matrix"
119
- values="0 0 0 0 0
120
- 0 1 0 0 0
121
- 0 0 0 0 0
122
- 0 0 0 1 0"
123
- />
124
- <fedisplacementmap
125
- in="SourceGraphic"
126
- in2="DISPLACEMENT_MAP"
127
- result="BLUE_DISPLACED"
128
- scale="-21.5"
129
- xChannelSelector="R"
130
- yChannelSelector="B"
131
- />
132
- <fecolormatrix
133
- in="BLUE_DISPLACED"
134
- result="BLUE_CHANNEL"
135
- type="matrix"
136
- values="0 0 0 0 0
137
- 0 0 0 0 0
138
- 0 0 1 0 0
139
- 0 0 0 1 0"
140
- />
141
- <feblend
142
- in="GREEN_CHANNEL"
143
- in2="BLUE_CHANNEL"
144
- mode="screen"
145
- result="GB_COMBINED"
146
- />
147
- <feblend
148
- in="RED_CHANNEL"
149
- in2="GB_COMBINED"
150
- mode="screen"
151
- result="RGB_COMBINED"
152
- />
153
- <fegaussianblur
154
- in="RGB_COMBINED"
155
- result="ABERRATED_BLURRED"
156
- stdDeviation="0.125"
157
- />
158
- <fecomposite
159
- in="ABERRATED_BLURRED"
160
- in2="EDGE_MASK"
161
- operator="in"
162
- result="EDGE_ABERRATION"
163
- />
164
- <fecomponenttransfer
165
- in="EDGE_MASK"
166
- result="INVERTED_MASK"
167
- >
168
- <fefunca
169
- tableValues="1 0"
170
- type="table"
171
- />
172
- </fecomponenttransfer>
173
- <fecomposite
174
- in="CENTER_ORIGINAL"
175
- in2="INVERTED_MASK"
176
- operator="in"
177
- result="CENTER_CLEAN"
178
- />
179
- <fecomposite
180
- in="EDGE_ABERRATION"
181
- in2="CENTER_CLEAN"
182
- operator="over"
183
- />
184
- </filter>
185
- </defs>
186
- </svg>
187
- <div
188
- class="c-atomix-glass__filter-overlay"
189
- style="filter: url(#atomix-glass-filter-14); border-radius: var(--atomix-glass-container-radius); transition-duration: 0s !important; animation-duration: 0s !important; transition-delay: 0s;"
190
- />
191
- <div
192
- class="c-atomix-glass__filter-shadow"
193
- style="box-shadow: var(--atomix-glass-container-shadow); border-radius: var(--atomix-glass-container-radius);"
194
- />
195
- </div>
196
- <div
197
- class="c-atomix-glass__content"
198
- style="position: relative; text-shadow: var(--atomix-glass-container-text-shadow); z-index: 100;"
199
- >
200
- <div>
201
- Default Glass
202
- </div>
203
- </div>
204
- </div>
205
- </div>
206
- <div
207
- class="c-atomix-glass__background-layer c-atomix-glass__background-layer--dark c-atomix-glass__background-layer--hidden"
208
- style="position: absolute; top: 0px; left: 0px; height: 100%; width: 100%; border-radius: 16px; transform: translate(0px, 0px) scale(1);"
209
- />
210
- <div
211
- class="c-atomix-glass__background-layer c-atomix-glass__background-layer--black c-atomix-glass__background-layer--hidden"
212
- style="position: absolute; top: 0px; left: 0px; height: 100%; width: 100%; border-radius: 16px; transform: translate(0px, 0px) scale(1);"
213
- />
214
- <span
215
- class="c-atomix-glass__border-1"
216
- />
217
- <span
218
- class="c-atomix-glass__border-2"
219
- />
220
- </div>
221
- </div>
222
- `;