cetec-design-system 2.2.2-next.0 → 2.3.7
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/{cetec-preset-CcvrY8wh.js → cetec-preset-CZJA5UR0.js} +1696 -1331
- package/dist/cetec-preset-CZJA5UR0.js.map +1 -0
- package/dist/index.js +12655 -9360
- package/dist/index.js.map +1 -1
- package/dist/panda.buildinfo.json +461 -365
- package/dist/playroom-static.css +68887 -180258
- package/dist/preset.js +1 -1
- package/dist/specs/recipes.json +126 -25
- package/dist/styles.css +1315 -642
- package/dist/types/index.d.ts +3001 -273
- package/dist/types/preset.d.ts +15 -0
- package/package.json +6 -1
- package/src/recipes/autocomplete.ts +266 -0
- package/src/recipes/calendar.ts +92 -0
- package/src/recipes/chip.ts +6 -0
- package/src/recipes/dateMenus.ts +40 -0
- package/src/recipes/dateTimeMenus.ts +43 -0
- package/src/recipes/menu.ts +13 -1
- package/src/recipes/modal.ts +1 -1
- package/src/recipes/recipes-slot.ts +7 -2
- package/src/recipes/segmentedFields.ts +192 -0
- package/src/recipes/segmentedInputs.ts +106 -0
- package/src/recipes/text.ts +32 -28
- package/src/recipes/timeMenus.ts +110 -0
- package/src/styles/primitives/zIndex.ts +1 -0
- package/src/styles/semantics/colors.ts +44 -0
- package/src/styles/semantics/zIndex.ts +2 -0
- package/src/styles/utilities/conditions.ts +1 -0
- package/src/styles/utilities/transitions.ts +2 -1
- package/src/utils/dsChain.ts +113 -0
- package/src/utils/dsComponent.ts +44 -0
- package/src/utils/dsPart.ts +41 -0
- package/src/utils/splitProps.ts +15 -0
- package/dist/cetec-preset-CcvrY8wh.js.map +0 -1
- package/src/recipes/datePicker.ts +0 -230
- package/src/recipes/timePicker.ts +0 -206
package/dist/preset.js
CHANGED
package/dist/specs/recipes.json
CHANGED
|
@@ -692,6 +692,26 @@
|
|
|
692
692
|
"<Toggle />"
|
|
693
693
|
]
|
|
694
694
|
},
|
|
695
|
+
{
|
|
696
|
+
"name": "autocomplete",
|
|
697
|
+
"variants": {
|
|
698
|
+
"size": [
|
|
699
|
+
"sm",
|
|
700
|
+
"md",
|
|
701
|
+
"lg",
|
|
702
|
+
"xl"
|
|
703
|
+
]
|
|
704
|
+
},
|
|
705
|
+
"defaultVariants": {
|
|
706
|
+
"size": "md"
|
|
707
|
+
},
|
|
708
|
+
"functionExamples": [
|
|
709
|
+
"autocomplete({ size: 'sm' })"
|
|
710
|
+
],
|
|
711
|
+
"jsxExamples": [
|
|
712
|
+
"<Autocomplete size=\"sm\" />"
|
|
713
|
+
]
|
|
714
|
+
},
|
|
695
715
|
{
|
|
696
716
|
"name": "avatar",
|
|
697
717
|
"variants": {
|
|
@@ -827,6 +847,25 @@
|
|
|
827
847
|
"<Button variant=\"standard\" size=\"sm\" before={true} after={true} />"
|
|
828
848
|
]
|
|
829
849
|
},
|
|
850
|
+
{
|
|
851
|
+
"name": "calendar",
|
|
852
|
+
"variants": {
|
|
853
|
+
"type": [
|
|
854
|
+
"days",
|
|
855
|
+
"months",
|
|
856
|
+
"years"
|
|
857
|
+
]
|
|
858
|
+
},
|
|
859
|
+
"defaultVariants": {
|
|
860
|
+
"type": "days"
|
|
861
|
+
},
|
|
862
|
+
"functionExamples": [
|
|
863
|
+
"calendar({ type: 'days' })"
|
|
864
|
+
],
|
|
865
|
+
"jsxExamples": [
|
|
866
|
+
"<Calendar type=\"days\" />"
|
|
867
|
+
]
|
|
868
|
+
},
|
|
830
869
|
{
|
|
831
870
|
"name": "checkbox",
|
|
832
871
|
"variants": {},
|
|
@@ -876,23 +915,25 @@
|
|
|
876
915
|
]
|
|
877
916
|
},
|
|
878
917
|
{
|
|
879
|
-
"name": "
|
|
880
|
-
"variants": {
|
|
881
|
-
|
|
882
|
-
|
|
883
|
-
|
|
884
|
-
|
|
885
|
-
|
|
886
|
-
|
|
887
|
-
|
|
888
|
-
|
|
889
|
-
|
|
890
|
-
|
|
918
|
+
"name": "dateMenus",
|
|
919
|
+
"variants": {},
|
|
920
|
+
"defaultVariants": {},
|
|
921
|
+
"functionExamples": [
|
|
922
|
+
"dateMenus()"
|
|
923
|
+
],
|
|
924
|
+
"jsxExamples": [
|
|
925
|
+
"<DateMenus />"
|
|
926
|
+
]
|
|
927
|
+
},
|
|
928
|
+
{
|
|
929
|
+
"name": "dateTimeMenus",
|
|
930
|
+
"variants": {},
|
|
931
|
+
"defaultVariants": {},
|
|
891
932
|
"functionExamples": [
|
|
892
|
-
"
|
|
933
|
+
"dateTimeMenus()"
|
|
893
934
|
],
|
|
894
935
|
"jsxExamples": [
|
|
895
|
-
"<
|
|
936
|
+
"<DateTimeMenus />"
|
|
896
937
|
]
|
|
897
938
|
},
|
|
898
939
|
{
|
|
@@ -1112,6 +1153,71 @@
|
|
|
1112
1153
|
"<Radio />"
|
|
1113
1154
|
]
|
|
1114
1155
|
},
|
|
1156
|
+
{
|
|
1157
|
+
"name": "segmentedFields",
|
|
1158
|
+
"variants": {
|
|
1159
|
+
"size": [
|
|
1160
|
+
"sm",
|
|
1161
|
+
"md",
|
|
1162
|
+
"lg",
|
|
1163
|
+
"xl"
|
|
1164
|
+
],
|
|
1165
|
+
"field": [
|
|
1166
|
+
"date",
|
|
1167
|
+
"time",
|
|
1168
|
+
"dateTime"
|
|
1169
|
+
],
|
|
1170
|
+
"range": [
|
|
1171
|
+
"date",
|
|
1172
|
+
"time"
|
|
1173
|
+
],
|
|
1174
|
+
"before": [
|
|
1175
|
+
"true"
|
|
1176
|
+
],
|
|
1177
|
+
"after": [
|
|
1178
|
+
"true"
|
|
1179
|
+
]
|
|
1180
|
+
},
|
|
1181
|
+
"defaultVariants": {
|
|
1182
|
+
"size": "md"
|
|
1183
|
+
},
|
|
1184
|
+
"functionExamples": [
|
|
1185
|
+
"segmentedFields({ size: 'sm' })",
|
|
1186
|
+
"segmentedFields({ field: 'date' })",
|
|
1187
|
+
"segmentedFields({ range: 'date' })",
|
|
1188
|
+
"segmentedFields({ before: true })",
|
|
1189
|
+
"segmentedFields({ after: true })",
|
|
1190
|
+
"segmentedFields({ size: 'sm', field: 'date', range: 'date', before: true, after: true })"
|
|
1191
|
+
],
|
|
1192
|
+
"jsxExamples": [
|
|
1193
|
+
"<SegmentedFields size=\"sm\" />",
|
|
1194
|
+
"<SegmentedFields field=\"date\" />",
|
|
1195
|
+
"<SegmentedFields range=\"date\" />",
|
|
1196
|
+
"<SegmentedFields before={true} />",
|
|
1197
|
+
"<SegmentedFields after={true} />",
|
|
1198
|
+
"<SegmentedFields size=\"sm\" field=\"date\" range=\"date\" before={true} after={true} />"
|
|
1199
|
+
]
|
|
1200
|
+
},
|
|
1201
|
+
{
|
|
1202
|
+
"name": "segmentedInputs",
|
|
1203
|
+
"variants": {
|
|
1204
|
+
"size": [
|
|
1205
|
+
"sm",
|
|
1206
|
+
"md",
|
|
1207
|
+
"lg",
|
|
1208
|
+
"xl"
|
|
1209
|
+
]
|
|
1210
|
+
},
|
|
1211
|
+
"defaultVariants": {
|
|
1212
|
+
"size": "md"
|
|
1213
|
+
},
|
|
1214
|
+
"functionExamples": [
|
|
1215
|
+
"segmentedInputs({ size: 'sm' })"
|
|
1216
|
+
],
|
|
1217
|
+
"jsxExamples": [
|
|
1218
|
+
"<SegmentedInputs size=\"sm\" />"
|
|
1219
|
+
]
|
|
1220
|
+
},
|
|
1115
1221
|
{
|
|
1116
1222
|
"name": "select",
|
|
1117
1223
|
"variants": {
|
|
@@ -1183,23 +1289,18 @@
|
|
|
1183
1289
|
]
|
|
1184
1290
|
},
|
|
1185
1291
|
{
|
|
1186
|
-
"name": "
|
|
1292
|
+
"name": "timeMenus",
|
|
1187
1293
|
"variants": {
|
|
1188
|
-
"
|
|
1189
|
-
"
|
|
1190
|
-
"md",
|
|
1191
|
-
"lg",
|
|
1192
|
-
"xl"
|
|
1294
|
+
"stretch": [
|
|
1295
|
+
"true"
|
|
1193
1296
|
]
|
|
1194
1297
|
},
|
|
1195
|
-
"defaultVariants": {
|
|
1196
|
-
"size": "md"
|
|
1197
|
-
},
|
|
1298
|
+
"defaultVariants": {},
|
|
1198
1299
|
"functionExamples": [
|
|
1199
|
-
"
|
|
1300
|
+
"timeMenus({ stretch: true })"
|
|
1200
1301
|
],
|
|
1201
1302
|
"jsxExamples": [
|
|
1202
|
-
"<
|
|
1303
|
+
"<TimeMenus stretch={true} />"
|
|
1203
1304
|
]
|
|
1204
1305
|
},
|
|
1205
1306
|
{
|