@pequity/squirrel 8.3.1 → 8.3.2
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.
- package/dist/cjs/index.js +69 -18
- package/dist/cjs/p-steps.js +0 -2
- package/dist/es/chunks/p-dropdown-select.js +2 -2
- package/dist/es/index.js +102 -51
- package/dist/es/p-dropdown-select.js +1 -1
- package/dist/es/p-steps.js +1 -4
- package/dist/squirrel/components/index.d.ts +2 -1
- package/dist/squirrel/components/p-steps/p-steps.types.d.ts +5 -0
- package/dist/squirrel/components/p-steps/p-steps.vue.d.ts +14 -15
- package/dist/squirrel.css +74 -74
- package/package.json +5 -5
- package/squirrel/components/index.ts +2 -0
- package/squirrel/components/p-steps/__snapshots__/{p-steps.spec.js.snap → p-steps.spec.ts.snap} +5 -5
- package/squirrel/components/p-steps/p-steps.spec.ts +203 -0
- package/squirrel/components/p-steps/p-steps.stories.js +32 -4
- package/squirrel/components/p-steps/p-steps.types.ts +5 -0
- package/squirrel/components/p-steps/p-steps.vue +30 -21
- package/dist/cjs/chunks/p-steps.js +0 -55
- package/dist/es/chunks/p-steps.js +0 -56
- package/squirrel/components/p-steps/p-steps.spec.js +0 -126
package/dist/squirrel.css
CHANGED
|
@@ -1,11 +1,12 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
.shimmer[data-v-3d77f34f] {
|
|
2
|
+
transform: translateX(-100%);
|
|
3
|
+
animation: shimmer-3d77f34f 1.4s infinite;
|
|
4
4
|
}
|
|
5
|
-
|
|
6
|
-
|
|
5
|
+
@keyframes shimmer-3d77f34f {
|
|
6
|
+
100% {
|
|
7
|
+
transform: translateX(100%);
|
|
7
8
|
}
|
|
8
|
-
div[id^=popper_].dropdown {
|
|
9
|
+
}div[id^=popper_].dropdown {
|
|
9
10
|
|
|
10
11
|
outline: 2px solid transparent;
|
|
11
12
|
|
|
@@ -145,6 +146,51 @@ div[id^=popper_].dropdown .v-popper__inner .dropdown-menu .dropdown-divider {
|
|
|
145
146
|
|
|
146
147
|
opacity: 1
|
|
147
148
|
}
|
|
149
|
+
.enter[data-v-0e51ff56] {
|
|
150
|
+
background-image: url("data:image/svg+xml,%3csvg%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20clip-path='url(%23clip0_1627_786)'%3e%3crect%20width='24'%20height='24'%20rx='5'%20fill='%23ECF1FF'/%3e%3cpath%20d='M19.17%201.03744e-05H4.83C4.19619%20-0.00130459%203.56834%200.122398%202.98239%200.364037C2.39645%200.605676%201.86392%200.960506%201.41528%201.40822C0.966641%201.85592%200.610708%202.38772%200.367855%202.97316C0.125002%203.55861%20-1.36406e-06%204.1862%200%204.82001L0%2019.17C0%2020.451%200.508874%2021.6795%201.41467%2022.5853C2.32048%2023.4911%203.549%2024%204.83%2024H19.17C20.4502%2023.9974%2021.6772%2023.4876%2022.5824%2022.5824C23.4876%2021.6772%2023.9974%2020.4502%2024%2019.17V4.82001C23.9974%203.54075%2023.4873%202.31479%2022.5818%201.41115C21.6763%200.507508%2020.4493%207.63258e-06%2019.17%201.03744e-05ZM22%2019.17C22%2019.9206%2021.7018%2020.6404%2021.1711%2021.1711C20.6404%2021.7018%2019.9206%2022%2019.17%2022H4.83C4.07944%2022%203.35962%2021.7018%202.82889%2021.1711C2.29816%2020.6404%202%2019.9206%202%2019.17V4.82001C2.00265%204.07118%202.30197%203.35393%202.83242%202.82536C3.36286%202.29679%204.08117%202.00001%204.83%202.00001H19.17C19.9188%202.00001%2020.6371%202.29679%2021.1676%202.82536C21.698%203.35393%2021.9974%204.07118%2022%204.82001V19.17Z'%20fill='%234750EB'/%3e%3cpath%20d='M17.5%207.5C17.2348%207.5%2016.9804%207.60536%2016.7929%207.79289C16.6054%207.98043%2016.5%208.23478%2016.5%208.5V11.25C16.5%2011.3163%2016.4737%2011.3799%2016.4268%2011.4268C16.3799%2011.4737%2016.3163%2011.5%2016.25%2011.5H10.75C10.6837%2011.5%2010.6201%2011.4737%2010.5732%2011.4268C10.5263%2011.3799%2010.5%2011.3163%2010.5%2011.25V9.5C10.5012%209.30138%2010.4431%209.10691%2010.3333%208.94139C10.2235%208.77587%2010.0669%208.6468%209.88348%208.57063C9.70004%208.49446%209.49807%208.47465%209.30332%208.51372C9.10857%208.55279%208.92987%208.64897%208.79%208.79L5.79%2011.79C5.60375%2011.9774%205.49921%2012.2308%205.49921%2012.495C5.49921%2012.7592%205.60375%2013.0126%205.79%2013.2L8.79%2016.2C8.88261%2016.2945%208.99306%2016.3697%209.11493%2016.4212C9.23681%2016.4727%209.36769%2016.4995%209.5%2016.5C9.76522%2016.5%2010.0196%2016.3946%2010.2071%2016.2071C10.3946%2016.0196%2010.5%2015.7652%2010.5%2015.5V13.75C10.5%2013.6837%2010.5263%2013.6201%2010.5732%2013.5732C10.6201%2013.5263%2010.6837%2013.5%2010.75%2013.5H16.5C17.0304%2013.5%2017.5391%2013.2893%2017.9142%2012.9142C18.2893%2012.5391%2018.5%2012.0304%2018.5%2011.5V8.5C18.5%208.23478%2018.3946%207.98043%2018.2071%207.79289C18.0196%207.60536%2017.7652%207.5%2017.5%207.5Z'%20fill='%234750EB'/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_1627_786'%3e%3crect%20width='24'%20height='24'%20rx='5'%20fill='white'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
|
|
151
|
+
}
|
|
152
|
+
|
|
153
|
+
.x-black-icon[data-v-2002dcc8] {
|
|
154
|
+
background-image: url("data:image/svg+xml,%3csvg%20width='12'%20height='12'%20viewBox='0%200%2012%2012'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='Remove'%20clip-path='url(%23clip0_3453_5756)'%3e%3cpath%20id='Vector'%20d='M0.219996%2010.72C0.149851%2010.7893%200.0941591%2010.8718%200.0561487%2010.9628C0.0181382%2011.0537%20-0.00143433%2011.1514%20-0.00143433%2011.25C-0.00143433%2011.3486%200.0181382%2011.4462%200.0561487%2011.5372C0.0941591%2011.6281%200.149851%2011.7107%200.219996%2011.78C0.360622%2011.9204%200.551246%2011.9993%200.749996%2011.9993C0.948747%2011.9993%201.13937%2011.9204%201.28%2011.78L5.91%207.14997C5.92166%207.13787%205.93564%207.12825%205.9511%207.12168C5.96656%207.1151%205.98319%207.11172%206%207.11172C6.0168%207.11172%206.03343%207.1151%206.04889%207.12168C6.06436%207.12825%206.07834%207.13787%206.09%207.14997L10.72%2011.78C10.8606%2011.9204%2011.0512%2011.9993%2011.25%2011.9993C11.4487%2011.9993%2011.6394%2011.9204%2011.78%2011.78C11.8501%2011.7107%2011.9058%2011.6281%2011.9438%2011.5372C11.9819%2011.4462%2012.0014%2011.3486%2012.0014%2011.25C12.0014%2011.1514%2011.9819%2011.0537%2011.9438%2010.9628C11.9058%2010.8718%2011.8501%2010.7893%2011.78%2010.72L7.15%206.08997C7.1379%206.07831%207.12828%206.06433%207.1217%206.04886C7.11513%206.0334%207.11174%206.01677%207.11174%205.99997C7.11174%205.98317%207.11513%205.96654%207.1217%205.95107C7.12828%205.93561%207.1379%205.92163%207.15%205.90997L11.78%201.27997C11.9125%201.13779%2011.9846%200.949747%2011.9812%200.755446C11.9777%200.561145%2011.899%200.37576%2011.7616%200.238347C11.6242%200.100934%2011.4388%200.0222218%2011.2445%200.0187936C11.0502%200.0153654%2010.8622%200.0874886%2010.72%200.219969L6.09%204.84997C6.07834%204.86207%206.06436%204.87169%206.04889%204.87826C6.03343%204.88483%206.0168%204.88822%206%204.88822C5.98319%204.88822%205.96656%204.88483%205.9511%204.87826C5.93564%204.87169%205.92166%204.86207%205.91%204.84997L1.28%200.219969C1.13782%200.0874886%200.949775%200.0153654%200.755474%200.0187936C0.561173%200.0222218%200.375787%200.100934%200.238374%200.238347C0.100961%200.37576%200.0222494%200.561145%200.0188212%200.755446C0.015393%200.949747%200.0875162%201.13779%200.219996%201.27997L4.85%205.90997C4.86209%205.92163%204.87172%205.93561%204.87829%205.95107C4.88486%205.96654%204.88825%205.98317%204.88825%205.99997C4.88825%206.01677%204.88486%206.0334%204.87829%206.04886C4.87172%206.06433%204.86209%206.07831%204.85%206.08997L0.219996%2010.72Z'%20fill='%231A123B'%20/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_3453_5756'%3e%3crect%20width='12'%20height='12'%20fill='white'%20/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
|
|
155
|
+
}
|
|
156
|
+
.x-white-icon[data-v-2002dcc8] {
|
|
157
|
+
background-image: url("data:image/svg+xml,%3csvg%20width='12'%20height='12'%20viewBox='0%200%2012%2012'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='Remove'%20clip-path='url(%23clip0_3453_5756)'%3e%3cpath%20id='Vector'%20d='M0.219996%2010.72C0.149851%2010.7893%200.0941591%2010.8718%200.0561487%2010.9628C0.0181382%2011.0537%20-0.00143433%2011.1514%20-0.00143433%2011.25C-0.00143433%2011.3486%200.0181382%2011.4462%200.0561487%2011.5372C0.0941591%2011.6281%200.149851%2011.7107%200.219996%2011.78C0.360622%2011.9204%200.551246%2011.9993%200.749996%2011.9993C0.948747%2011.9993%201.13937%2011.9204%201.28%2011.78L5.91%207.14997C5.92166%207.13787%205.93564%207.12825%205.9511%207.12168C5.96656%207.1151%205.98319%207.11172%206%207.11172C6.0168%207.11172%206.03343%207.1151%206.04889%207.12168C6.06436%207.12825%206.07834%207.13787%206.09%207.14997L10.72%2011.78C10.8606%2011.9204%2011.0512%2011.9993%2011.25%2011.9993C11.4487%2011.9993%2011.6394%2011.9204%2011.78%2011.78C11.8501%2011.7107%2011.9058%2011.6281%2011.9438%2011.5372C11.9819%2011.4462%2012.0014%2011.3486%2012.0014%2011.25C12.0014%2011.1514%2011.9819%2011.0537%2011.9438%2010.9628C11.9058%2010.8718%2011.8501%2010.7893%2011.78%2010.72L7.15%206.08997C7.1379%206.07831%207.12828%206.06433%207.1217%206.04886C7.11513%206.0334%207.11174%206.01677%207.11174%205.99997C7.11174%205.98317%207.11513%205.96654%207.1217%205.95107C7.12828%205.93561%207.1379%205.92163%207.15%205.90997L11.78%201.27997C11.9125%201.13779%2011.9846%200.949747%2011.9812%200.755446C11.9777%200.561145%2011.899%200.37576%2011.7616%200.238347C11.6242%200.100934%2011.4388%200.0222218%2011.2445%200.0187936C11.0502%200.0153654%2010.8622%200.0874886%2010.72%200.219969L6.09%204.84997C6.07834%204.86207%206.06436%204.87169%206.04889%204.87826C6.03343%204.88483%206.0168%204.88822%206%204.88822C5.98319%204.88822%205.96656%204.88483%205.9511%204.87826C5.93564%204.87169%205.92166%204.86207%205.91%204.84997L1.28%200.219969C1.13782%200.0874886%200.949775%200.0153654%200.755474%200.0187936C0.561173%200.0222218%200.375787%200.100934%200.238374%200.238347C0.100961%200.37576%200.0222494%200.561145%200.0188212%200.755446C0.015393%200.949747%200.0875162%201.13779%200.219996%201.27997L4.85%205.90997C4.86209%205.92163%204.87172%205.93561%204.87829%205.95107C4.88486%205.96654%204.88825%205.98317%204.88825%205.99997C4.88825%206.01677%204.88486%206.0334%204.87829%206.04886C4.87172%206.06433%204.86209%206.07831%204.85%206.08997L0.219996%2010.72Z'%20fill='%23FFFFFF'%20/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_3453_5756'%3e%3crect%20width='12'%20height='12'%20fill='white'%20/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
|
|
158
|
+
}
|
|
159
|
+
.filter[data-v-84864117] {
|
|
160
|
+
background: url("data:image/svg+xml,%3csvg%20width='20'%20height='20'%20viewBox='0%200%2020%2020'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M15.5%206.73H4.5C4.36739%206.73%204.24021%206.67732%204.14645%206.58355C4.05268%206.48978%204%206.3626%204%206.23C4%206.09739%204.05268%205.97021%204.14645%205.87644C4.24021%205.78267%204.36739%205.73%204.5%205.73H15.5C15.6326%205.73%2015.7598%205.78267%2015.8536%205.87644C15.9473%205.97021%2016%206.09739%2016%206.23C16%206.3626%2015.9473%206.48978%2015.8536%206.58355C15.7598%206.67732%2015.6326%206.73%2015.5%206.73Z'%20fill='%23424E6E'/%3e%3cpath%20d='M14.33%209.245H5.67C5.53739%209.245%205.41021%209.19232%205.31644%209.09855C5.22268%209.00478%205.17%208.8776%205.17%208.745C5.17%208.61239%205.22268%208.48521%205.31644%208.39144C5.41021%208.29767%205.53739%208.245%205.67%208.245H14.33C14.4626%208.245%2014.5898%208.29767%2014.6836%208.39144C14.7773%208.48521%2014.83%208.61239%2014.83%208.745C14.83%208.8776%2014.7773%209.00478%2014.6836%209.09855C14.5898%209.19232%2014.4626%209.245%2014.33%209.245Z'%20fill='%23424E6E'/%3e%3cpath%20d='M11.605%2014.27H8.395C8.2624%2014.27%208.13522%2014.2173%208.04145%2014.1235C7.94768%2014.0298%207.895%2013.9026%207.895%2013.77C7.895%2013.6374%207.94768%2013.5102%208.04145%2013.4164C8.13522%2013.3227%208.2624%2013.27%208.395%2013.27H11.605C11.7376%2013.27%2011.8648%2013.3227%2011.9586%2013.4164C12.0523%2013.5102%2012.105%2013.6374%2012.105%2013.77C12.105%2013.9026%2012.0523%2014.0298%2011.9586%2014.1235C11.8648%2014.2173%2011.7376%2014.27%2011.605%2014.27Z'%20fill='%23424E6E'/%3e%3cpath%20d='M13.155%2011.755H6.845C6.71239%2011.755%206.58522%2011.7023%206.49145%2011.6085C6.39768%2011.5148%206.345%2011.3876%206.345%2011.255C6.345%2011.1224%206.39768%2010.9952%206.49145%2010.9014C6.58522%2010.8077%206.71239%2010.755%206.845%2010.755H13.155C13.2876%2010.755%2013.4148%2010.8077%2013.5086%2010.9014C13.6023%2010.9952%2013.655%2011.1224%2013.655%2011.255C13.655%2011.3876%2013.6023%2011.5148%2013.5086%2011.6085C13.4148%2011.7023%2013.2876%2011.755%2013.155%2011.755Z'%20fill='%23424E6E'/%3e%3c/svg%3e") no-repeat;
|
|
161
|
+
}
|
|
162
|
+
.filter[data-v-84864117]:hover {
|
|
163
|
+
background: url("data:image/svg+xml,%3csvg%20width='20'%20height='20'%20viewBox='0%200%2020%2020'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3crect%20width='20'%20height='20'%20rx='4'%20fill='black'%20fill-opacity='0.05'/%3e%3cpath%20d='M15.5%206.73001H4.5C4.36739%206.73001%204.24021%206.67733%204.14645%206.58356C4.05268%206.4898%204%206.36262%204%206.23001C4%206.0974%204.05268%205.97023%204.14645%205.87646C4.24021%205.78269%204.36739%205.73001%204.5%205.73001H15.5C15.6326%205.73001%2015.7598%205.78269%2015.8536%205.87646C15.9473%205.97023%2016%206.0974%2016%206.23001C16%206.36262%2015.9473%206.4898%2015.8536%206.58356C15.7598%206.67733%2015.6326%206.73001%2015.5%206.73001Z'%20fill='%23424E6E'/%3e%3cpath%20d='M14.33%209.24503H5.67C5.53739%209.24503%205.41021%209.19235%205.31644%209.09858C5.22268%209.00481%205.17%208.87763%205.17%208.74503C5.17%208.61242%205.22268%208.48524%205.31644%208.39147C5.41021%208.2977%205.53739%208.24503%205.67%208.24503H14.33C14.4626%208.24503%2014.5898%208.2977%2014.6836%208.39147C14.7773%208.48524%2014.83%208.61242%2014.83%208.74503C14.83%208.87763%2014.7773%209.00481%2014.6836%209.09858C14.5898%209.19235%2014.4626%209.24503%2014.33%209.24503Z'%20fill='%23424E6E'/%3e%3cpath%20d='M11.605%2014.27H8.395C8.2624%2014.27%208.13522%2014.2173%208.04145%2014.1236C7.94768%2014.0298%207.895%2013.9026%207.895%2013.77C7.895%2013.6374%207.94768%2013.5102%208.04145%2013.4165C8.13522%2013.3227%208.2624%2013.27%208.395%2013.27H11.605C11.7376%2013.27%2011.8648%2013.3227%2011.9586%2013.4165C12.0523%2013.5102%2012.105%2013.6374%2012.105%2013.77C12.105%2013.9026%2012.0523%2014.0298%2011.9586%2014.1236C11.8648%2014.2173%2011.7376%2014.27%2011.605%2014.27Z'%20fill='%23424E6E'/%3e%3cpath%20d='M13.155%2011.755H6.845C6.71239%2011.755%206.58522%2011.7023%206.49145%2011.6086C6.39768%2011.5148%206.345%2011.3876%206.345%2011.255C6.345%2011.1224%206.39768%2010.9952%206.49145%2010.9015C6.58522%2010.8077%206.71239%2010.755%206.845%2010.755H13.155C13.2876%2010.755%2013.4148%2010.8077%2013.5086%2010.9015C13.6023%2010.9952%2013.655%2011.1224%2013.655%2011.255C13.655%2011.3876%2013.6023%2011.5148%2013.5086%2011.6086C13.4148%2011.7023%2013.2876%2011.755%2013.155%2011.755Z'%20fill='%23424E6E'/%3e%3c/svg%3e") no-repeat;
|
|
164
|
+
}
|
|
165
|
+
.filter.active[data-v-84864117] {
|
|
166
|
+
background: url("data:image/svg+xml,%3csvg%20width='20'%20height='20'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M10%2014L4%205V3h16v2l-6%209v6l-4%202z'%20fill='%230F45AF'%20/%3e%3c/svg%3e") no-repeat;
|
|
167
|
+
}
|
|
168
|
+
.filter.active[data-v-84864117]:hover {
|
|
169
|
+
background: url("data:image/svg+xml,%3csvg%20width='20'%20height='20'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3crect%20width='24'%20height='24'%20rx='4'%20fill='black'%20fill-opacity='0.05'/%3e%3cpath%20d='M10%2014L4%205V3h16v2l-6%209v6l-4%202z'%20fill='%230F45AF'%20/%3e%3c/svg%3e") no-repeat;
|
|
170
|
+
}
|
|
171
|
+
.shadow-inner-toggle[data-v-c544a8a9]::after {
|
|
172
|
+
box-shadow:
|
|
173
|
+
rgba(0, 0, 0, 0.3) 0px 1px 2px 0px,
|
|
174
|
+
rgba(0, 0, 0, 0.05) 0px 0px 1px 0px inset;
|
|
175
|
+
}
|
|
176
|
+
.td-shadow-right[data-v-c9978e26] {
|
|
177
|
+
box-shadow: -1px 1px 5px 4px rgba(0, 0, 0, 0.15);
|
|
178
|
+
clip-path: inset(0px -12px 0px 0px);
|
|
179
|
+
}
|
|
180
|
+
.td-shadow-left[data-v-c9978e26] {
|
|
181
|
+
box-shadow: -2px 1px 8px rgba(0, 0, 0, 0.15);
|
|
182
|
+
clip-path: inset(0px 0px 0px -12px);
|
|
183
|
+
}
|
|
184
|
+
.td-col-fixed-border-b[data-v-c9978e26]::after {
|
|
185
|
+
position: absolute;
|
|
186
|
+
bottom: 0px;
|
|
187
|
+
left: 0px;
|
|
188
|
+
height: 1px;
|
|
189
|
+
width: 100%;
|
|
190
|
+
background-color: rgb(var(--color-p-gray-30));
|
|
191
|
+
--tw-content: "";
|
|
192
|
+
content: var(--tw-content);
|
|
193
|
+
}
|
|
148
194
|
input[type='checkbox'][data-v-81cd6154]:checked {
|
|
149
195
|
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3E%3C/svg%3E");
|
|
150
196
|
}
|
|
@@ -263,38 +309,6 @@ from {
|
|
|
263
309
|
to {
|
|
264
310
|
opacity: 0;
|
|
265
311
|
}
|
|
266
|
-
}
|
|
267
|
-
.enter[data-v-0e51ff56] {
|
|
268
|
-
background-image: url("data:image/svg+xml,%3csvg%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20clip-path='url(%23clip0_1627_786)'%3e%3crect%20width='24'%20height='24'%20rx='5'%20fill='%23ECF1FF'/%3e%3cpath%20d='M19.17%201.03744e-05H4.83C4.19619%20-0.00130459%203.56834%200.122398%202.98239%200.364037C2.39645%200.605676%201.86392%200.960506%201.41528%201.40822C0.966641%201.85592%200.610708%202.38772%200.367855%202.97316C0.125002%203.55861%20-1.36406e-06%204.1862%200%204.82001L0%2019.17C0%2020.451%200.508874%2021.6795%201.41467%2022.5853C2.32048%2023.4911%203.549%2024%204.83%2024H19.17C20.4502%2023.9974%2021.6772%2023.4876%2022.5824%2022.5824C23.4876%2021.6772%2023.9974%2020.4502%2024%2019.17V4.82001C23.9974%203.54075%2023.4873%202.31479%2022.5818%201.41115C21.6763%200.507508%2020.4493%207.63258e-06%2019.17%201.03744e-05ZM22%2019.17C22%2019.9206%2021.7018%2020.6404%2021.1711%2021.1711C20.6404%2021.7018%2019.9206%2022%2019.17%2022H4.83C4.07944%2022%203.35962%2021.7018%202.82889%2021.1711C2.29816%2020.6404%202%2019.9206%202%2019.17V4.82001C2.00265%204.07118%202.30197%203.35393%202.83242%202.82536C3.36286%202.29679%204.08117%202.00001%204.83%202.00001H19.17C19.9188%202.00001%2020.6371%202.29679%2021.1676%202.82536C21.698%203.35393%2021.9974%204.07118%2022%204.82001V19.17Z'%20fill='%234750EB'/%3e%3cpath%20d='M17.5%207.5C17.2348%207.5%2016.9804%207.60536%2016.7929%207.79289C16.6054%207.98043%2016.5%208.23478%2016.5%208.5V11.25C16.5%2011.3163%2016.4737%2011.3799%2016.4268%2011.4268C16.3799%2011.4737%2016.3163%2011.5%2016.25%2011.5H10.75C10.6837%2011.5%2010.6201%2011.4737%2010.5732%2011.4268C10.5263%2011.3799%2010.5%2011.3163%2010.5%2011.25V9.5C10.5012%209.30138%2010.4431%209.10691%2010.3333%208.94139C10.2235%208.77587%2010.0669%208.6468%209.88348%208.57063C9.70004%208.49446%209.49807%208.47465%209.30332%208.51372C9.10857%208.55279%208.92987%208.64897%208.79%208.79L5.79%2011.79C5.60375%2011.9774%205.49921%2012.2308%205.49921%2012.495C5.49921%2012.7592%205.60375%2013.0126%205.79%2013.2L8.79%2016.2C8.88261%2016.2945%208.99306%2016.3697%209.11493%2016.4212C9.23681%2016.4727%209.36769%2016.4995%209.5%2016.5C9.76522%2016.5%2010.0196%2016.3946%2010.2071%2016.2071C10.3946%2016.0196%2010.5%2015.7652%2010.5%2015.5V13.75C10.5%2013.6837%2010.5263%2013.6201%2010.5732%2013.5732C10.6201%2013.5263%2010.6837%2013.5%2010.75%2013.5H16.5C17.0304%2013.5%2017.5391%2013.2893%2017.9142%2012.9142C18.2893%2012.5391%2018.5%2012.0304%2018.5%2011.5V8.5C18.5%208.23478%2018.3946%207.98043%2018.2071%207.79289C18.0196%207.60536%2017.7652%207.5%2017.5%207.5Z'%20fill='%234750EB'/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_1627_786'%3e%3crect%20width='24'%20height='24'%20rx='5'%20fill='white'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e");
|
|
269
|
-
}
|
|
270
|
-
.fadeInDown[data-v-9ad56d4f] {
|
|
271
|
-
animation-duration: 0.4s;
|
|
272
|
-
animation-fill-mode: both;
|
|
273
|
-
animation-name: fadeInDown-9ad56d4f;
|
|
274
|
-
}
|
|
275
|
-
@keyframes fadeInDown-9ad56d4f {
|
|
276
|
-
0% {
|
|
277
|
-
opacity: 0;
|
|
278
|
-
transform: translate3d(0, -100%, 0);
|
|
279
|
-
}
|
|
280
|
-
100% {
|
|
281
|
-
opacity: 1;
|
|
282
|
-
transform: none;
|
|
283
|
-
}
|
|
284
|
-
}
|
|
285
|
-
.fadeOutUp[data-v-9ad56d4f] {
|
|
286
|
-
animation-duration: 0.25s;
|
|
287
|
-
animation-fill-mode: both;
|
|
288
|
-
animation-name: fadeOutUp-9ad56d4f;
|
|
289
|
-
}
|
|
290
|
-
@keyframes fadeOutUp-9ad56d4f {
|
|
291
|
-
0% {
|
|
292
|
-
opacity: 1;
|
|
293
|
-
}
|
|
294
|
-
100% {
|
|
295
|
-
opacity: 0;
|
|
296
|
-
transform: translate3d(0, -100%, 0);
|
|
297
|
-
}
|
|
298
312
|
}.pm[data-v-a511ac01] {
|
|
299
313
|
width: calc(100% - 32px);
|
|
300
314
|
min-width: 110px;
|
|
@@ -356,49 +370,35 @@ from {
|
|
|
356
370
|
to {
|
|
357
371
|
opacity: 0;
|
|
358
372
|
}
|
|
359
|
-
}.
|
|
360
|
-
|
|
361
|
-
animation:
|
|
362
|
-
|
|
363
|
-
@keyframes shimmer-3d77f34f {
|
|
364
|
-
100% {
|
|
365
|
-
transform: translateX(100%);
|
|
366
|
-
}
|
|
367
|
-
}.filter[data-v-84864117] {
|
|
368
|
-
background: url("data:image/svg+xml,%3csvg%20width='20'%20height='20'%20viewBox='0%200%2020%2020'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M15.5%206.73H4.5C4.36739%206.73%204.24021%206.67732%204.14645%206.58355C4.05268%206.48978%204%206.3626%204%206.23C4%206.09739%204.05268%205.97021%204.14645%205.87644C4.24021%205.78267%204.36739%205.73%204.5%205.73H15.5C15.6326%205.73%2015.7598%205.78267%2015.8536%205.87644C15.9473%205.97021%2016%206.09739%2016%206.23C16%206.3626%2015.9473%206.48978%2015.8536%206.58355C15.7598%206.67732%2015.6326%206.73%2015.5%206.73Z'%20fill='%23424E6E'/%3e%3cpath%20d='M14.33%209.245H5.67C5.53739%209.245%205.41021%209.19232%205.31644%209.09855C5.22268%209.00478%205.17%208.8776%205.17%208.745C5.17%208.61239%205.22268%208.48521%205.31644%208.39144C5.41021%208.29767%205.53739%208.245%205.67%208.245H14.33C14.4626%208.245%2014.5898%208.29767%2014.6836%208.39144C14.7773%208.48521%2014.83%208.61239%2014.83%208.745C14.83%208.8776%2014.7773%209.00478%2014.6836%209.09855C14.5898%209.19232%2014.4626%209.245%2014.33%209.245Z'%20fill='%23424E6E'/%3e%3cpath%20d='M11.605%2014.27H8.395C8.2624%2014.27%208.13522%2014.2173%208.04145%2014.1235C7.94768%2014.0298%207.895%2013.9026%207.895%2013.77C7.895%2013.6374%207.94768%2013.5102%208.04145%2013.4164C8.13522%2013.3227%208.2624%2013.27%208.395%2013.27H11.605C11.7376%2013.27%2011.8648%2013.3227%2011.9586%2013.4164C12.0523%2013.5102%2012.105%2013.6374%2012.105%2013.77C12.105%2013.9026%2012.0523%2014.0298%2011.9586%2014.1235C11.8648%2014.2173%2011.7376%2014.27%2011.605%2014.27Z'%20fill='%23424E6E'/%3e%3cpath%20d='M13.155%2011.755H6.845C6.71239%2011.755%206.58522%2011.7023%206.49145%2011.6085C6.39768%2011.5148%206.345%2011.3876%206.345%2011.255C6.345%2011.1224%206.39768%2010.9952%206.49145%2010.9014C6.58522%2010.8077%206.71239%2010.755%206.845%2010.755H13.155C13.2876%2010.755%2013.4148%2010.8077%2013.5086%2010.9014C13.6023%2010.9952%2013.655%2011.1224%2013.655%2011.255C13.655%2011.3876%2013.6023%2011.5148%2013.5086%2011.6085C13.4148%2011.7023%2013.2876%2011.755%2013.155%2011.755Z'%20fill='%23424E6E'/%3e%3c/svg%3e") no-repeat;
|
|
373
|
+
}.fadeInDown[data-v-9ad56d4f] {
|
|
374
|
+
animation-duration: 0.4s;
|
|
375
|
+
animation-fill-mode: both;
|
|
376
|
+
animation-name: fadeInDown-9ad56d4f;
|
|
369
377
|
}
|
|
370
|
-
|
|
371
|
-
|
|
378
|
+
@keyframes fadeInDown-9ad56d4f {
|
|
379
|
+
0% {
|
|
380
|
+
opacity: 0;
|
|
381
|
+
transform: translate3d(0, -100%, 0);
|
|
372
382
|
}
|
|
373
|
-
|
|
374
|
-
|
|
383
|
+
100% {
|
|
384
|
+
opacity: 1;
|
|
385
|
+
transform: none;
|
|
375
386
|
}
|
|
376
|
-
.filter.active[data-v-84864117]:hover {
|
|
377
|
-
background: url("data:image/svg+xml,%3csvg%20width='20'%20height='20'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3crect%20width='24'%20height='24'%20rx='4'%20fill='black'%20fill-opacity='0.05'/%3e%3cpath%20d='M10%2014L4%205V3h16v2l-6%209v6l-4%202z'%20fill='%230F45AF'%20/%3e%3c/svg%3e") no-repeat;
|
|
378
|
-
}.td-shadow-right[data-v-c9978e26] {
|
|
379
|
-
box-shadow: -1px 1px 5px 4px rgba(0, 0, 0, 0.15);
|
|
380
|
-
clip-path: inset(0px -12px 0px 0px);
|
|
381
387
|
}
|
|
382
|
-
.
|
|
383
|
-
|
|
384
|
-
|
|
388
|
+
.fadeOutUp[data-v-9ad56d4f] {
|
|
389
|
+
animation-duration: 0.25s;
|
|
390
|
+
animation-fill-mode: both;
|
|
391
|
+
animation-name: fadeOutUp-9ad56d4f;
|
|
385
392
|
}
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
left: 0px;
|
|
390
|
-
height: 1px;
|
|
391
|
-
width: 100%;
|
|
392
|
-
background-color: rgb(var(--color-p-gray-30));
|
|
393
|
-
--tw-content: "";
|
|
394
|
-
content: var(--tw-content);
|
|
393
|
+
@keyframes fadeOutUp-9ad56d4f {
|
|
394
|
+
0% {
|
|
395
|
+
opacity: 1;
|
|
395
396
|
}
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
rgba(0, 0, 0, 0.05) 0px 0px 1px 0px inset;
|
|
397
|
+
100% {
|
|
398
|
+
opacity: 0;
|
|
399
|
+
transform: translate3d(0, -100%, 0);
|
|
400
400
|
}
|
|
401
|
-
.resize-observer[data-v-b329ee4c]{position:absolute;top:0;left:0;z-index:-1;width:100%;height:100%;border:none;background-color:transparent;pointer-events:none;display:block;overflow:hidden;opacity:0}.resize-observer[data-v-b329ee4c] object{display:block;position:absolute;top:0;left:0;height:100%;width:100%;overflow:hidden;pointer-events:none;z-index:-1}.v-popper__popper{z-index:10000;top:0;left:0;outline:none}.v-popper__popper.v-popper__popper--hidden{visibility:hidden;opacity:0;transition:opacity .15s,visibility .15s;pointer-events:none}.v-popper__popper.v-popper__popper--shown{visibility:visible;opacity:1;transition:opacity .15s}.v-popper__popper.v-popper__popper--skip-transition,.v-popper__popper.v-popper__popper--skip-transition>.v-popper__wrapper{transition:none!important}.v-popper__backdrop{position:absolute;top:0;left:0;width:100%;height:100%;display:none}.v-popper__inner{position:relative;box-sizing:border-box;overflow-y:auto}.v-popper__inner>div{position:relative;z-index:1;max-width:inherit;max-height:inherit}.v-popper__arrow-container{position:absolute;width:10px;height:10px}.v-popper__popper--arrow-overflow .v-popper__arrow-container,.v-popper__popper--no-positioning .v-popper__arrow-container{display:none}.v-popper__arrow-inner,.v-popper__arrow-outer{border-style:solid;position:absolute;top:0;left:0;width:0;height:0}.v-popper__arrow-inner{visibility:hidden;border-width:7px}.v-popper__arrow-outer{border-width:6px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner{left:-2px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-outer,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{left:-1px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-outer{border-bottom-width:0;border-left-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner{top:-2px}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-container{top:0}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{border-top-width:0;border-left-color:transparent!important;border-right-color:transparent!important;border-top-color:transparent!important}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner{top:-4px}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{top:-6px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner{top:-2px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-outer,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{top:-1px}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{border-left-width:0;border-left-color:transparent!important;border-top-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner{left:-4px}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{left:-6px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-container{right:-10px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-outer{border-right-width:0;border-top-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner{left:-2px}.v-popper--theme-tooltip .v-popper__inner{background:rgba(0,0,0,.8);color:#fff;border-radius:6px;padding:7px 12px 6px}.v-popper--theme-tooltip .v-popper__arrow-outer{border-color:#000c}.v-popper--theme-dropdown .v-popper__inner{background:#fff;color:#000;border-radius:6px;border:1px solid #ddd;box-shadow:0 6px 30px #0000001a}.v-popper--theme-dropdown .v-popper__arrow-inner{visibility:visible;border-color:#fff}.v-popper--theme-dropdown .v-popper__arrow-outer{border-color:#ddd}/* sass-plugin-1:/Users/maronato/Developer/vue-toastification/src/scss/index.scss */.Vue-Toastification__container {
|
|
401
|
+
}.resize-observer[data-v-b329ee4c]{position:absolute;top:0;left:0;z-index:-1;width:100%;height:100%;border:none;background-color:transparent;pointer-events:none;display:block;overflow:hidden;opacity:0}.resize-observer[data-v-b329ee4c] object{display:block;position:absolute;top:0;left:0;height:100%;width:100%;overflow:hidden;pointer-events:none;z-index:-1}.v-popper__popper{z-index:10000;top:0;left:0;outline:none}.v-popper__popper.v-popper__popper--hidden{visibility:hidden;opacity:0;transition:opacity .15s,visibility .15s;pointer-events:none}.v-popper__popper.v-popper__popper--shown{visibility:visible;opacity:1;transition:opacity .15s}.v-popper__popper.v-popper__popper--skip-transition,.v-popper__popper.v-popper__popper--skip-transition>.v-popper__wrapper{transition:none!important}.v-popper__backdrop{position:absolute;top:0;left:0;width:100%;height:100%;display:none}.v-popper__inner{position:relative;box-sizing:border-box;overflow-y:auto}.v-popper__inner>div{position:relative;z-index:1;max-width:inherit;max-height:inherit}.v-popper__arrow-container{position:absolute;width:10px;height:10px}.v-popper__popper--arrow-overflow .v-popper__arrow-container,.v-popper__popper--no-positioning .v-popper__arrow-container{display:none}.v-popper__arrow-inner,.v-popper__arrow-outer{border-style:solid;position:absolute;top:0;left:0;width:0;height:0}.v-popper__arrow-inner{visibility:hidden;border-width:7px}.v-popper__arrow-outer{border-width:6px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner{left:-2px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-outer,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{left:-1px}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-outer{border-bottom-width:0;border-left-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=top] .v-popper__arrow-inner{top:-2px}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-container{top:0}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{border-top-width:0;border-left-color:transparent!important;border-right-color:transparent!important;border-top-color:transparent!important}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-inner{top:-4px}.v-popper__popper[data-popper-placement^=bottom] .v-popper__arrow-outer{top:-6px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner{top:-2px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-outer,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{top:-1px}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{border-left-width:0;border-left-color:transparent!important;border-top-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-inner{left:-4px}.v-popper__popper[data-popper-placement^=right] .v-popper__arrow-outer{left:-6px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-container{right:-10px}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner,.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-outer{border-right-width:0;border-top-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important}.v-popper__popper[data-popper-placement^=left] .v-popper__arrow-inner{left:-2px}.v-popper--theme-tooltip .v-popper__inner{background:rgba(0,0,0,.8);color:#fff;border-radius:6px;padding:7px 12px 6px}.v-popper--theme-tooltip .v-popper__arrow-outer{border-color:#000c}.v-popper--theme-dropdown .v-popper__inner{background:#fff;color:#000;border-radius:6px;border:1px solid #ddd;box-shadow:0 6px 30px #0000001a}.v-popper--theme-dropdown .v-popper__arrow-inner{visibility:visible;border-color:#fff}.v-popper--theme-dropdown .v-popper__arrow-outer{border-color:#ddd}/* sass-plugin-1:/Users/maronato/Developer/vue-toastification/src/scss/index.scss */.Vue-Toastification__container {
|
|
402
402
|
z-index: 9999;
|
|
403
403
|
position: fixed;
|
|
404
404
|
padding: 4px;
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pequity/squirrel",
|
|
3
3
|
"description": "Squirrel component library",
|
|
4
|
-
"version": "8.3.
|
|
4
|
+
"version": "8.3.2",
|
|
5
5
|
"packageManager": "pnpm@10.6.4",
|
|
6
6
|
"type": "module",
|
|
7
7
|
"scripts": {
|
|
@@ -65,12 +65,12 @@
|
|
|
65
65
|
"@storybook/theming": "^8.6.14",
|
|
66
66
|
"@storybook/vue3": "^8.6.14",
|
|
67
67
|
"@storybook/vue3-vite": "^8.6.14",
|
|
68
|
-
"@tanstack/vue-virtual": "3.13.
|
|
68
|
+
"@tanstack/vue-virtual": "3.13.9",
|
|
69
69
|
"@types/jsdom": "^21.1.7",
|
|
70
70
|
"@types/lodash-es": "^4.17.12",
|
|
71
|
-
"@types/node": "^22.15.
|
|
71
|
+
"@types/node": "^22.15.21",
|
|
72
72
|
"@vitejs/plugin-vue": "^5.2.4",
|
|
73
|
-
"@vitest/coverage-v8": "^3.1.
|
|
73
|
+
"@vitest/coverage-v8": "^3.1.4",
|
|
74
74
|
"@vue/compiler-sfc": "3.5.14",
|
|
75
75
|
"@vue/test-utils": "^2.4.6",
|
|
76
76
|
"@vuepic/vue-datepicker": "11.0.2",
|
|
@@ -97,7 +97,7 @@
|
|
|
97
97
|
"tailwindcss": "^3.4.17",
|
|
98
98
|
"typescript": "5.8.3",
|
|
99
99
|
"vite": "^6.3.5",
|
|
100
|
-
"vitest": "^3.1.
|
|
100
|
+
"vitest": "^3.1.4",
|
|
101
101
|
"vue": "3.5.14",
|
|
102
102
|
"vue-currency-input": "3.2.1",
|
|
103
103
|
"vue-router": "4.5.1",
|
|
@@ -37,6 +37,7 @@ import PSelectList from '@squirrel/components/p-select-list/p-select-list.vue';
|
|
|
37
37
|
import { useSelectList } from '@squirrel/components/p-select-list/useSelectList';
|
|
38
38
|
import PSelectPill from '@squirrel/components/p-select-pill/p-select-pill.vue';
|
|
39
39
|
import PSkeletonLoader from '@squirrel/components/p-skeleton-loader/p-skeleton-loader.vue';
|
|
40
|
+
import type { StepItem } from '@squirrel/components/p-steps/p-steps.types';
|
|
40
41
|
import PSteps from '@squirrel/components/p-steps/p-steps.vue';
|
|
41
42
|
import {
|
|
42
43
|
colsInjectionKey,
|
|
@@ -122,6 +123,7 @@ export {
|
|
|
122
123
|
SORTING_TYPES,
|
|
123
124
|
SortingType,
|
|
124
125
|
SortingTypeWithoutNoSorting,
|
|
126
|
+
StepItem,
|
|
125
127
|
TableCol,
|
|
126
128
|
ThAttrs,
|
|
127
129
|
usePLoading,
|
package/squirrel/components/p-steps/__snapshots__/{p-steps.spec.js.snap → p-steps.spec.ts.snap}
RENAMED
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
|
|
2
2
|
|
|
3
|
-
exports[`PSteps.vue > renders correctly 1`] = `
|
|
3
|
+
exports[`PSteps.vue > render tests > renders correctly 1`] = `
|
|
4
4
|
"<div class="flex items-center gap-2">
|
|
5
|
-
<div class="text-nowrap rounded-full border px-4 py-1 text-sm font-semibold border
|
|
5
|
+
<div class="text-nowrap rounded-full border px-4 py-1 text-sm font-semibold border-p-gray-30 text-p-gray-30">First</div>
|
|
6
6
|
<div class="flex items-center">
|
|
7
|
-
<iconify-icon icon="material-symbols:arrow-right-alt-rounded" class="text-p-
|
|
7
|
+
<iconify-icon icon="material-symbols:arrow-right-alt-rounded" class="text-p-gray-30"></iconify-icon>
|
|
8
8
|
</div>
|
|
9
|
-
<div class="text-nowrap rounded-full border px-4 py-1 text-sm font-semibold border
|
|
9
|
+
<div class="text-nowrap rounded-full border px-4 py-1 text-sm font-semibold border-p-gray-30 text-p-gray-30">Second</div>
|
|
10
10
|
<div class="flex items-center">
|
|
11
11
|
<iconify-icon icon="material-symbols:arrow-right-alt-rounded" class="text-p-gray-30"></iconify-icon>
|
|
12
12
|
</div>
|
|
13
|
-
<div class="text-nowrap rounded-full border px-4 py-1 text-sm font-semibold border
|
|
13
|
+
<div class="text-nowrap rounded-full border px-4 py-1 text-sm font-semibold border-p-gray-30 text-p-gray-30">Third</div>
|
|
14
14
|
<!--v-if-->
|
|
15
15
|
</div>"
|
|
16
16
|
`;
|
|
@@ -0,0 +1,203 @@
|
|
|
1
|
+
import PSteps from '@squirrel/components/p-steps/p-steps.vue';
|
|
2
|
+
import { createWrapperFor } from '@tests/vitest.helpers';
|
|
3
|
+
import { type VueWrapper } from '@vue/test-utils';
|
|
4
|
+
|
|
5
|
+
const createSteps = () => [
|
|
6
|
+
{ value: 'first', text: 'First' },
|
|
7
|
+
{ value: 'second', text: 'Second' },
|
|
8
|
+
{ value: 'third', text: 'Third' },
|
|
9
|
+
];
|
|
10
|
+
|
|
11
|
+
const createWrapper = (props = {}) => {
|
|
12
|
+
return createWrapperFor(PSteps, {
|
|
13
|
+
props: {
|
|
14
|
+
steps: createSteps(),
|
|
15
|
+
activeStep: null,
|
|
16
|
+
clickable: false,
|
|
17
|
+
...props,
|
|
18
|
+
},
|
|
19
|
+
});
|
|
20
|
+
};
|
|
21
|
+
|
|
22
|
+
describe('PSteps.vue', () => {
|
|
23
|
+
describe('render tests', () => {
|
|
24
|
+
it('renders correctly', () => {
|
|
25
|
+
const wrapper = createWrapper();
|
|
26
|
+
|
|
27
|
+
expect(wrapper.html()).toMatchSnapshot();
|
|
28
|
+
});
|
|
29
|
+
|
|
30
|
+
it('renders the correct number of steps', () => {
|
|
31
|
+
const wrapper = createWrapper({
|
|
32
|
+
steps: createSteps(),
|
|
33
|
+
activeStep: 'second',
|
|
34
|
+
});
|
|
35
|
+
|
|
36
|
+
const stepElements = wrapper.findAll('.rounded-full.border');
|
|
37
|
+
expect(stepElements.length).toBe(createSteps().length);
|
|
38
|
+
});
|
|
39
|
+
|
|
40
|
+
it('applies correct classes for current step', () => {
|
|
41
|
+
const wrapper = createWrapper({
|
|
42
|
+
activeStep: 'second',
|
|
43
|
+
});
|
|
44
|
+
|
|
45
|
+
const stepElements = wrapper.findAll('.rounded-full.border');
|
|
46
|
+
|
|
47
|
+
// First step should be completed (blue text)
|
|
48
|
+
expect(stepElements[0].classes()).toContain('text-nowrap');
|
|
49
|
+
expect(stepElements[0].classes()).toContain('text-p-blue-50');
|
|
50
|
+
expect(stepElements[0].classes()).toContain('border-p-blue-50');
|
|
51
|
+
|
|
52
|
+
// Second step should be current (blue background)
|
|
53
|
+
expect(stepElements[1].classes()).toContain('text-nowrap');
|
|
54
|
+
expect(stepElements[1].classes()).toContain('bg-p-blue-50');
|
|
55
|
+
expect(stepElements[1].classes()).toContain('text-surface');
|
|
56
|
+
expect(stepElements[1].classes()).toContain('border-p-blue-50');
|
|
57
|
+
|
|
58
|
+
// Third step should be upcoming (gray)
|
|
59
|
+
expect(stepElements[2].classes()).toContain('text-nowrap');
|
|
60
|
+
expect(stepElements[2].classes()).toContain('text-p-gray-30');
|
|
61
|
+
expect(stepElements[2].classes()).toContain('border-p-gray-30');
|
|
62
|
+
});
|
|
63
|
+
|
|
64
|
+
it('displays step titles', () => {
|
|
65
|
+
const wrapper = createWrapper({
|
|
66
|
+
steps: [
|
|
67
|
+
{ value: 'step1', text: 'Custom Step 1' },
|
|
68
|
+
{ value: 'step2', text: 'Custom Step 2' },
|
|
69
|
+
{ value: 'step3', text: 'Custom Step 3' },
|
|
70
|
+
],
|
|
71
|
+
activeStep: 'step2',
|
|
72
|
+
});
|
|
73
|
+
|
|
74
|
+
const stepElements = wrapper.findAll('.rounded-full.border');
|
|
75
|
+
expect(stepElements[0].text()).toBe('Custom Step 1');
|
|
76
|
+
expect(stepElements[1].text()).toBe('Custom Step 2');
|
|
77
|
+
expect(stepElements[2].text()).toBe('Custom Step 3');
|
|
78
|
+
});
|
|
79
|
+
|
|
80
|
+
it('displays step titles in startCase when the text is missing', () => {
|
|
81
|
+
const wrapper = createWrapper({
|
|
82
|
+
steps: [{ value: 'customStep1' }, { value: 'customStep2' }, { value: 'customStep3' }],
|
|
83
|
+
activeStep: 'customStep2',
|
|
84
|
+
});
|
|
85
|
+
|
|
86
|
+
const stepElements = wrapper.findAll('.rounded-full.border');
|
|
87
|
+
|
|
88
|
+
expect(stepElements[0].text()).toBe('Custom Step 1');
|
|
89
|
+
expect(stepElements[1].text()).toBe('Custom Step 2');
|
|
90
|
+
expect(stepElements[2].text()).toBe('Custom Step 3');
|
|
91
|
+
});
|
|
92
|
+
|
|
93
|
+
it('renders the correct number of arrows between steps', () => {
|
|
94
|
+
const wrapper = createWrapper({
|
|
95
|
+
steps: [
|
|
96
|
+
{ value: 1, text: '1' },
|
|
97
|
+
{ value: 2, text: '2' },
|
|
98
|
+
{ value: 3, text: '3' },
|
|
99
|
+
{ value: 4, text: '4' },
|
|
100
|
+
],
|
|
101
|
+
activeStep: 'second',
|
|
102
|
+
});
|
|
103
|
+
|
|
104
|
+
// There should be 3 arrows for 4 steps
|
|
105
|
+
const arrowElements = wrapper.findAll('[icon="material-symbols:arrow-right-alt-rounded"]');
|
|
106
|
+
expect(arrowElements.length).toBe(3);
|
|
107
|
+
});
|
|
108
|
+
|
|
109
|
+
it('applies the correct classes to arrows based on current step', () => {
|
|
110
|
+
const wrapper = createWrapper({
|
|
111
|
+
steps: [
|
|
112
|
+
{ value: 1, text: '1' },
|
|
113
|
+
{ value: 2, text: '2' },
|
|
114
|
+
{ value: 3, text: '3' },
|
|
115
|
+
{ value: 4, text: '4' },
|
|
116
|
+
],
|
|
117
|
+
activeStep: 2,
|
|
118
|
+
});
|
|
119
|
+
|
|
120
|
+
const arrowElements = wrapper.findAll('[icon="material-symbols:arrow-right-alt-rounded"]');
|
|
121
|
+
|
|
122
|
+
expect(arrowElements.length).toBe(3);
|
|
123
|
+
|
|
124
|
+
// Arrow between first and second step should be colored
|
|
125
|
+
expect(arrowElements[0].classes()).toContain('text-p-blue-50');
|
|
126
|
+
|
|
127
|
+
// Arrow after current step should be gray
|
|
128
|
+
expect(arrowElements[1].classes()).toContain('text-p-gray-30');
|
|
129
|
+
expect(arrowElements[2].classes()).toContain('text-p-gray-30');
|
|
130
|
+
});
|
|
131
|
+
|
|
132
|
+
it('sets cursor-pointer when clickable is true', async () => {
|
|
133
|
+
const wrapper = createWrapper({ activeStep: 'first', clickable: true });
|
|
134
|
+
|
|
135
|
+
const stepElements = wrapper.findAll('.rounded-full.border');
|
|
136
|
+
|
|
137
|
+
stepElements.forEach((stepElement: VueWrapper) => {
|
|
138
|
+
expect(stepElement.classes()).toContain('cursor-pointer');
|
|
139
|
+
});
|
|
140
|
+
});
|
|
141
|
+
|
|
142
|
+
it('sets cursor-pointer clickable steps only', async () => {
|
|
143
|
+
const wrapper = createWrapper({
|
|
144
|
+
steps: [
|
|
145
|
+
{ value: 1, text: '1', disabled: false },
|
|
146
|
+
{ value: 2, text: '2', disabled: true },
|
|
147
|
+
{ value: 3, text: '3', disabled: false },
|
|
148
|
+
],
|
|
149
|
+
activeStep: 1,
|
|
150
|
+
clickable: true,
|
|
151
|
+
});
|
|
152
|
+
const stepElements = wrapper.findAll('.rounded-full.border');
|
|
153
|
+
|
|
154
|
+
// First step should be clickable
|
|
155
|
+
expect(stepElements[0].classes()).toContain('cursor-pointer');
|
|
156
|
+
|
|
157
|
+
// Second step should not be clickable
|
|
158
|
+
expect(stepElements[1].classes()).not.toContain('cursor-pointer');
|
|
159
|
+
|
|
160
|
+
// Third step should be clickable
|
|
161
|
+
expect(stepElements[2].classes()).toContain('cursor-pointer');
|
|
162
|
+
});
|
|
163
|
+
|
|
164
|
+
it('does not set cursor-pointer when item disabled is true', async () => {
|
|
165
|
+
const wrapper = createWrapper({
|
|
166
|
+
steps: [
|
|
167
|
+
{ value: 1, text: '1', disabled: true },
|
|
168
|
+
{ value: 2, text: '2', disabled: true },
|
|
169
|
+
],
|
|
170
|
+
activeStep: 1,
|
|
171
|
+
clickable: true,
|
|
172
|
+
});
|
|
173
|
+
|
|
174
|
+
const stepElements = wrapper.findAll('.rounded-full.border');
|
|
175
|
+
|
|
176
|
+
stepElements.forEach((stepElement: VueWrapper) => {
|
|
177
|
+
expect(stepElement.classes()).not.toContain('cursor-pointer');
|
|
178
|
+
});
|
|
179
|
+
});
|
|
180
|
+
|
|
181
|
+
it('emits click:step when a step is clicked', async () => {
|
|
182
|
+
const wrapper = createWrapper({ activeStep: 'first', clickable: true });
|
|
183
|
+
|
|
184
|
+
const stepElements = wrapper.findAll('.rounded-full.border');
|
|
185
|
+
|
|
186
|
+
await stepElements[1].trigger('click');
|
|
187
|
+
|
|
188
|
+
expect(wrapper.emitted()['click:step'][0]).toEqual([{ text: 'Second', value: 'second' }, 1]);
|
|
189
|
+
});
|
|
190
|
+
|
|
191
|
+
it('updates the active step when activeStep changes', async () => {
|
|
192
|
+
const wrapper = createWrapper({ activeStep: 'first' });
|
|
193
|
+
|
|
194
|
+
const getStepElements = () => wrapper.findAll('.rounded-full.border');
|
|
195
|
+
|
|
196
|
+
expect(getStepElements()[0].classes()).toContain('bg-p-blue-50');
|
|
197
|
+
|
|
198
|
+
await wrapper.setProps({ activeStep: 'second' });
|
|
199
|
+
|
|
200
|
+
expect(getStepElements()[1].classes()).toContain('bg-p-blue-50');
|
|
201
|
+
});
|
|
202
|
+
});
|
|
203
|
+
});
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import PSteps from '@squirrel/components/p-steps/p-steps.vue';
|
|
2
|
+
import { ref } from 'vue';
|
|
2
3
|
|
|
3
4
|
export default {
|
|
4
5
|
title: 'Components/PSteps',
|
|
@@ -22,10 +23,37 @@ export const Default = {
|
|
|
22
23
|
template: `<PSteps v-bind="args" />`,
|
|
23
24
|
}),
|
|
24
25
|
args: {
|
|
25
|
-
steps: [
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
26
|
+
steps: [
|
|
27
|
+
{ value: 'stepOne', text: 'Step One' },
|
|
28
|
+
{ value: 'stepTwo', text: 'Step Two' },
|
|
29
|
+
{ value: 'stepThree', text: 'Step Three' },
|
|
30
|
+
{ value: 'stepFour', text: 'Step Four' },
|
|
31
|
+
],
|
|
32
|
+
activeStep: 'stepTwo',
|
|
33
|
+
},
|
|
34
|
+
};
|
|
35
|
+
|
|
36
|
+
export const Clickable = {
|
|
37
|
+
render: (args) => ({
|
|
38
|
+
components: { PSteps },
|
|
39
|
+
setup() {
|
|
40
|
+
const activeStep = ref('stepTwo');
|
|
41
|
+
|
|
42
|
+
const setActiveStep = (step) => {
|
|
43
|
+
activeStep.value = String(step.value);
|
|
44
|
+
};
|
|
45
|
+
|
|
46
|
+
return { args, activeStep, setActiveStep };
|
|
29
47
|
},
|
|
48
|
+
template: `<PSteps v-bind="args" :active-step="activeStep" @click:step="setActiveStep" />`,
|
|
49
|
+
}),
|
|
50
|
+
args: {
|
|
51
|
+
steps: [
|
|
52
|
+
{ value: 'stepOne', text: 'Step One' },
|
|
53
|
+
{ value: 'stepTwo', text: 'Step Two' },
|
|
54
|
+
{ value: 'stepThree', text: 'Step Three' },
|
|
55
|
+
{ value: 'stepFour', text: 'Step Four' },
|
|
56
|
+
],
|
|
57
|
+
clickable: true,
|
|
30
58
|
},
|
|
31
59
|
};
|