tide-design-system 2.2.15 → 2.3.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 (50) hide show
  1. package/.storybook/preview.ts +8 -1
  2. package/dist/css/main.css +0 -6
  3. package/dist/css/reset.css +1 -1
  4. package/dist/css/utilities-base.css +541 -0
  5. package/dist/css/utilities-responsive.css +2717 -0
  6. package/dist/css/utilities.css +2 -442
  7. package/dist/css/variables.css +1 -1
  8. package/dist/style.css +1 -1
  9. package/dist/tide-design-system.cjs +2 -2
  10. package/dist/tide-design-system.esm.d.ts +16 -99
  11. package/dist/tide-design-system.esm.js +1177 -1169
  12. package/dist/utilities/storybook.ts +12 -3
  13. package/dist/utilities/validation.ts +5 -1
  14. package/index.ts +3 -18
  15. package/package.json +1 -1
  16. package/src/assets/css/main.css +0 -6
  17. package/src/assets/css/reset.css +1 -1
  18. package/src/assets/css/utilities-base.css +541 -0
  19. package/src/assets/css/utilities-responsive.css +2717 -0
  20. package/src/assets/css/utilities.css +2 -442
  21. package/src/assets/css/variables.css +1 -1
  22. package/src/components/TideImage.vue +7 -1
  23. package/src/components/TideInputCheckbox.vue +3 -5
  24. package/src/components/TideInputRadio.vue +18 -5
  25. package/src/components/TideInputText.vue +50 -50
  26. package/src/components/TideInputTextarea.vue +17 -22
  27. package/src/components/TidePopover.vue +8 -3
  28. package/src/contexts/sandbox/AppSandbox.vue +3 -1
  29. package/src/docs/integration-partial.md +0 -7
  30. package/src/stories/TideInputRadio.stories.ts +9 -0
  31. package/src/types/Styles.ts +5 -0
  32. package/src/utilities/storybook.ts +12 -3
  33. package/src/utilities/validation.ts +5 -1
  34. package/dist/css/dynamic-buttons.css +0 -346
  35. package/dist/css/dynamic-utilities.css +0 -152
  36. package/dist/css/utilities-lg.css +0 -444
  37. package/dist/css/utilities-md.css +0 -444
  38. package/dist/css/utilities-sm.css +0 -444
  39. package/dist/css/utilities-xl.css +0 -444
  40. package/src/assets/css/dynamic-buttons.css +0 -346
  41. package/src/assets/css/dynamic-utilities.css +0 -152
  42. package/src/assets/css/utilities-lg.css +0 -444
  43. package/src/assets/css/utilities-md.css +0 -444
  44. package/src/assets/css/utilities-sm.css +0 -444
  45. package/src/assets/css/utilities-xl.css +0 -444
  46. package/src/types/Detail.ts +0 -4
  47. package/src/types/FacetRange.ts +0 -84
  48. package/src/types/ListingMedia.ts +0 -43
  49. package/src/types/Raw.ts +0 -5
  50. package/src/types/RealmConfig.ts +0 -14
@@ -712,7 +712,7 @@ export declare const ALERT: {
712
712
 
713
713
  export declare type Alert = (typeof ALERT)[keyof typeof ALERT];
714
714
 
715
- declare const BADGE_COLOR: {
715
+ export declare const BADGE_COLOR: {
716
716
  readonly BLACK: "black";
717
717
  readonly BLUE: "blue";
718
718
  readonly GREEN: "green";
@@ -725,6 +725,11 @@ declare const BADGE_COLOR: {
725
725
  readonly YELLOW: "yellow";
726
726
  };
727
727
 
728
+ export declare const BADGE_COLOR_DETAILS: Record<BadgeColor, {
729
+ borderColor: string;
730
+ iconColor: string;
731
+ }>;
732
+
728
733
  export declare const BADGE_TRUSTED: {
729
734
  readonly YEARS_10: "10";
730
735
  readonly YEARS_15: "15";
@@ -778,6 +783,7 @@ declare const CSS_2: {
778
783
  readonly ALIGN: {
779
784
  readonly X: {
780
785
  readonly CENTER: "tide-text-center";
786
+ readonly JUSTIFY: "tide-text-justify";
781
787
  readonly LEFT: "tide-text-left";
782
788
  readonly RIGHT: "tide-text-right";
783
789
  };
@@ -1243,6 +1249,10 @@ declare const CSS_2: {
1243
1249
  readonly SNAP_ALIGN: {
1244
1250
  readonly START: "tide-scroll-snap-start";
1245
1251
  };
1252
+ readonly STRIKETHROUGH: {
1253
+ readonly OFF: "tide-strikethrough-none";
1254
+ readonly ON: "tide-strikethrough";
1255
+ };
1246
1256
  readonly TEXT_TRANSFORM: {
1247
1257
  readonly LOWER: "tide-text-transform-lower";
1248
1258
  readonly NONE: "tide-text-transform-none";
@@ -1279,11 +1289,6 @@ declare const CSS_2: {
1279
1289
  };
1280
1290
  export { CSS_2 as CSS }
1281
1291
 
1282
- export declare type Detail = {
1283
- label: string;
1284
- value: string;
1285
- };
1286
-
1287
1292
  export declare const ELEMENT: {
1288
1293
  readonly BUTTON: "button";
1289
1294
  readonly LINK: "a";
@@ -1300,18 +1305,6 @@ export declare const ELEMENT_TEXT_AS_ICON: {
1300
1305
 
1301
1306
  export declare type ElementTextAsIcon = (typeof ELEMENT_TEXT_AS_ICON)[keyof typeof ELEMENT_TEXT_AS_ICON];
1302
1307
 
1303
- declare const FACET_COMPONENT_ID_RANGE: {
1304
- readonly GROSS_WEIGHT: "grossWeight";
1305
- readonly LENGTH: "vehicleLength";
1306
- readonly MILEAGE: "mileage";
1307
- readonly PRICE: "price";
1308
- readonly SLEEPING_CAPACITY: "sleepingCapacity";
1309
- readonly SLIDEOUTS: "slideouts";
1310
- readonly YEAR: "vehicleYear";
1311
- };
1312
-
1313
- export declare type FacetComponentIdRange = (typeof FACET_COMPONENT_ID_RANGE)[keyof typeof FACET_COMPONENT_ID_RANGE];
1314
-
1315
1308
  export declare type Field = SelectField | TextField | TextareaField | CheckboxField;
1316
1309
 
1317
1310
  export declare const FORMAT: {
@@ -1526,13 +1519,6 @@ export declare const ICON_REALM: {
1526
1519
  };
1527
1520
  };
1528
1521
 
1529
- declare type ImageSlide = {
1530
- imageUrl: string;
1531
- type: ImageSlideType;
1532
- };
1533
-
1534
- export declare type ImageSlideType = (typeof MEDIA_SLIDE_TYPES.IMAGE)[keyof typeof MEDIA_SLIDE_TYPES.IMAGE];
1535
-
1536
1522
  export declare type Input = SelectInput | TextInput | TextareaInput | CheckboxInput;
1537
1523
 
1538
1524
  export declare type Link = {
@@ -1541,8 +1527,6 @@ export declare type Link = {
1541
1527
  isNewTab?: boolean;
1542
1528
  };
1543
1529
 
1544
- export declare type ListingMedia = ImageSlide | VideoSlide | VrSlide;
1545
-
1546
1530
  export declare const MEDIA: {
1547
1531
  SM: number;
1548
1532
  MD: number;
@@ -1552,21 +1536,6 @@ export declare const MEDIA: {
1552
1536
 
1553
1537
  export declare type Media = (typeof MEDIA)[keyof typeof MEDIA];
1554
1538
 
1555
- /**
1556
- * These slides are used in both the inline detail page photo slider
1557
- * and the fullscreen media gallery.
1558
- */
1559
- export declare const MEDIA_SLIDE_TYPES: {
1560
- readonly IMAGE: {
1561
- readonly FLOORPLAN: "floorplan";
1562
- readonly IMAGE: "image";
1563
- };
1564
- readonly VIDEO: "video";
1565
- readonly VR: "vr";
1566
- };
1567
-
1568
- export declare type MediaSlideType = (typeof MEDIA_SLIDE_TYPES.IMAGE)[keyof typeof MEDIA_SLIDE_TYPES.IMAGE] | typeof MEDIA_SLIDE_TYPES.VIDEO | typeof MEDIA_SLIDE_TYPES.VR;
1569
-
1570
1539
  export declare const OBJECT_FIT: {
1571
1540
  readonly CONTAIN: "contain";
1572
1541
  readonly COVER: "cover";
@@ -1678,22 +1647,21 @@ declare type Props_20 = {
1678
1647
 
1679
1648
  declare type Props_21 = {
1680
1649
  checked?: boolean;
1681
- dataTrack?: string;
1682
1650
  disabled?: boolean;
1683
1651
  indeterminate?: boolean;
1684
1652
  inputId?: string;
1685
1653
  label: string;
1686
1654
  name: string;
1687
- number?: number | undefined;
1655
+ number?: number;
1688
1656
  };
1689
1657
 
1690
1658
  declare type Props_22 = {
1691
1659
  checked?: boolean;
1692
- dataTrack?: string;
1693
1660
  disabled?: boolean;
1694
1661
  inputId?: string;
1695
1662
  label: string;
1696
1663
  name: string;
1664
+ number?: number;
1697
1665
  };
1698
1666
 
1699
1667
  declare interface Props_23 extends SelectField {
@@ -1703,7 +1671,6 @@ declare interface Props_23 extends SelectField {
1703
1671
 
1704
1672
  declare type Props_24 = {
1705
1673
  autocomplete?: boolean;
1706
- dataTrack?: string;
1707
1674
  disabled?: boolean;
1708
1675
  error?: ValidationError;
1709
1676
  hasClear?: boolean;
@@ -1724,7 +1691,6 @@ declare type Props_24 = {
1724
1691
  };
1725
1692
 
1726
1693
  declare type Props_25 = {
1727
- dataTrack?: string;
1728
1694
  error?: ValidationError;
1729
1695
  inputId?: string;
1730
1696
  label?: string;
@@ -1828,17 +1794,6 @@ declare type Props_9 = {
1828
1794
  tabs: Tab[];
1829
1795
  };
1830
1796
 
1831
- export declare type RangeData = {
1832
- min: number | null;
1833
- max: number | null;
1834
- };
1835
-
1836
- export declare type Raw = {
1837
- [key: string]: {
1838
- raw: number | string | string[];
1839
- };
1840
- };
1841
-
1842
1797
  export declare const REALM: {
1843
1798
  readonly AERO: "aero";
1844
1799
  readonly ATV: "atv";
@@ -1853,19 +1808,6 @@ export declare const REALM: {
1853
1808
 
1854
1809
  export declare type Realm = (typeof REALM)[RealmKey];
1855
1810
 
1856
- export declare type RealmConfig = {
1857
- cdn: {
1858
- domain: string;
1859
- version: string;
1860
- };
1861
- id: Realm;
1862
- label: {
1863
- plural: string;
1864
- singular: string;
1865
- singularWithArticle: string;
1866
- };
1867
- };
1868
-
1869
1811
  declare type RealmIcon = {
1870
1812
  [RealmKey in RealmKeysWithIcons]: (typeof ICON_REALM)[RealmKey][keyof (typeof ICON_REALM)[RealmKey]];
1871
1813
  }[RealmKeysWithIcons];
@@ -2311,7 +2253,6 @@ label: string | number;
2311
2253
 
2312
2254
  export declare const TideInputCheckbox: DefineComponent<__VLS_WithDefaults_19<__VLS_TypePropsToOption_21<Props_21>, {
2313
2255
  checked: boolean;
2314
- dataTrack: string;
2315
2256
  disabled: boolean;
2316
2257
  indeterminate: boolean;
2317
2258
  inputId: undefined;
@@ -2320,7 +2261,6 @@ name: undefined;
2320
2261
  number: undefined;
2321
2262
  }>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<__VLS_WithDefaults_19<__VLS_TypePropsToOption_21<Props_21>, {
2322
2263
  checked: boolean;
2323
- dataTrack: string;
2324
2264
  disabled: boolean;
2325
2265
  indeterminate: boolean;
2326
2266
  inputId: undefined;
@@ -2332,7 +2272,6 @@ number: number;
2332
2272
  label: string;
2333
2273
  disabled: boolean;
2334
2274
  checked: boolean;
2335
- dataTrack: string;
2336
2275
  indeterminate: boolean;
2337
2276
  inputId: string;
2338
2277
  name: string;
@@ -2340,21 +2279,21 @@ name: string;
2340
2279
 
2341
2280
  export declare const TideInputRadio: DefineComponent<__VLS_WithDefaults_20<__VLS_TypePropsToOption_22<Props_22>, {
2342
2281
  checked: boolean;
2343
- dataTrack: string;
2344
2282
  disabled: boolean;
2345
2283
  inputId: undefined;
2346
2284
  label: undefined;
2285
+ number: undefined;
2347
2286
  }>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<__VLS_WithDefaults_20<__VLS_TypePropsToOption_22<Props_22>, {
2348
2287
  checked: boolean;
2349
- dataTrack: string;
2350
2288
  disabled: boolean;
2351
2289
  inputId: undefined;
2352
2290
  label: undefined;
2291
+ number: undefined;
2353
2292
  }>>>, {
2293
+ number: number;
2354
2294
  label: string;
2355
2295
  disabled: boolean;
2356
2296
  checked: boolean;
2357
- dataTrack: string;
2358
2297
  inputId: string;
2359
2298
  }, {}>;
2360
2299
 
@@ -2389,7 +2328,6 @@ supportingText: string;
2389
2328
 
2390
2329
  export declare const TideInputText: DefineComponent<__VLS_WithDefaults_22<__VLS_TypePropsToOption_24<Props_24>, {
2391
2330
  autocomplete: boolean;
2392
- dataTrack: string;
2393
2331
  disabled: boolean;
2394
2332
  error: boolean;
2395
2333
  hasClear: boolean;
@@ -2413,7 +2351,6 @@ updateValue: (newValue: string) => void;
2413
2351
  value: Ref<string | undefined>;
2414
2352
  }, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<__VLS_WithDefaults_22<__VLS_TypePropsToOption_24<Props_24>, {
2415
2353
  autocomplete: boolean;
2416
- dataTrack: string;
2417
2354
  disabled: boolean;
2418
2355
  error: boolean;
2419
2356
  hasClear: boolean;
@@ -2438,7 +2375,6 @@ required: boolean;
2438
2375
  prefix: string;
2439
2376
  disabled: boolean;
2440
2377
  iconLeading: Icon;
2441
- dataTrack: string;
2442
2378
  inputId: string;
2443
2379
  value: string;
2444
2380
  maxlength: number;
@@ -2452,7 +2388,6 @@ transformValue: FormValueTransformer;
2452
2388
  }, {}>;
2453
2389
 
2454
2390
  export declare const TideInputTextarea: DefineComponent<__VLS_WithDefaults_23<__VLS_TypePropsToOption_25<Props_25>, {
2455
- dataTrack: string;
2456
2391
  error: boolean;
2457
2392
  inputId: undefined;
2458
2393
  label: undefined;
@@ -2468,7 +2403,6 @@ error: Ref<ValidationError>;
2468
2403
  required: boolean;
2469
2404
  value: Ref<string | undefined>;
2470
2405
  }, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, VNodeProps & AllowedComponentProps & ComponentCustomProps, Readonly<ExtractPropTypes<__VLS_WithDefaults_23<__VLS_TypePropsToOption_25<Props_25>, {
2471
- dataTrack: string;
2472
2406
  error: boolean;
2473
2407
  inputId: undefined;
2474
2408
  label: undefined;
@@ -2483,7 +2417,6 @@ value: undefined;
2483
2417
  label: string;
2484
2418
  error: ValidationError;
2485
2419
  required: boolean;
2486
- dataTrack: string;
2487
2420
  inputId: string;
2488
2421
  name: string;
2489
2422
  value: string;
@@ -2635,20 +2568,4 @@ export declare const VALIDATOR: {
2635
2568
 
2636
2569
  export declare type Validator = (value: string) => ValidationResult;
2637
2570
 
2638
- declare type VideoSlide = {
2639
- imageUrl: string;
2640
- type: VideoSlideType;
2641
- videoUrl: string;
2642
- };
2643
-
2644
- export declare type VideoSlideType = typeof MEDIA_SLIDE_TYPES.VIDEO;
2645
-
2646
- declare type VrSlide = {
2647
- imageUrl: string;
2648
- type: VrSlideType;
2649
- vrUrl: string;
2650
- };
2651
-
2652
- export declare type VrSlideType = typeof MEDIA_SLIDE_TYPES.VR;
2653
-
2654
2571
  export { }