tide-design-system 2.2.15 → 2.3.0

package/dist/utilities/storybook.ts

@@ -103,12 +103,21 @@ export const disabledArgType = {
 
 export const isProduction = process.env.NODE_ENV === 'production';
 
-export const doSomething = () => {
-  alert('Did something.');
+export const doSomething = (message: string = 'Did something.') => {
+  const doSomethingAlert = document.getElementById('do-something-alert');
+
+  if (!doSomethingAlert) return;
+
+  doSomethingAlert.innerHTML = message;
+  doSomethingAlert.style.opacity = '1';
+
+  setTimeout(() => {
+    doSomethingAlert.style.opacity = '0';
+  }, 1000);
 };
 
 export const doSomethingElse = () => {
-  alert('Did something else.');
+  doSomething('Did something else.');
 };
 
 // Flatten a nested constant into a simple constant.

package/dist/utilities/validation.ts

@@ -1,11 +1,15 @@
 import { priceToNumber } from '@/utilities/format';
 
-import type { RangeData } from '@/types/FacetRange';
 import type { StringInput } from '@/types/Form';
 import type { SelectOption } from '@/types/Select';
 import type { ValidationError, ValidationLength, ValidationResult, Validator } from '@/types/Validation';
 import type { Ref } from 'vue';
 
+type RangeData = {
+  min: number | null;
+  max: number | null;
+};
+
 export const errorMessageDefault = 'Please enter a valid value.';
 
 export const noError = {

package/index.ts

@@ -32,14 +32,13 @@ import TideSeoLinks from '@/components/TideSeoLinks.vue';
 import TideSheet from '@/components/TideSheet.vue';
 import TideSwitch from '@/components/TideSwitch.vue';
 import { ALERT } from '@/types/Alert';
-import { BADGE_TRUSTED } from '@/types/Badge';
+import { BADGE_COLOR, BADGE_COLOR_DETAILS, BADGE_TRUSTED } from '@/types/Badge';
 import { BREAKPOINT, MEDIA } from '@/types/Breakpoint';
 import { TYPE_CARD } from '@/types/Card';
 import { ELEMENT, ELEMENT_TEXT_AS_ICON } from '@/types/Element';
 import { FORMAT, FORMAT_REGEX } from '@/types/Formatted';
 import { ICON, ICON_REALM } from '@/types/Icon';
 import { OBJECT_FIT } from '@/types/Image';
-import { MEDIA_SLIDE_TYPES } from '@/types/ListingMedia';
 import { ORIENTATION } from '@/types/Orientation';
 import { PRIORITY } from '@/types/Priority';
 import { REALM } from '@/types/Realm';
@@ -54,9 +53,7 @@ import type { BadgeTrustedYears } from '@/types/Badge';
 import type { BreadCrumb } from '@/types/BreadCrumb';
 import type { Breakpoint, Media } from '@/types/Breakpoint';
 import type { CardType } from '@/types/Card';
-import type { Detail } from '@/types/Detail';
 import type { Element, ElementTextAsIcon } from '@/types/Element';
-import type { FacetComponentIdRange, RangeData } from '@/types/FacetRange';
 import type {
   BooleanField,
   BooleanValue,
@@ -84,12 +81,9 @@ import type { Formatted } from '@/types/Formatted';
 import type { Icon } from '@/types/Icon';
 import type { ObjectFit } from '@/types/Image';
 import type { Link } from '@/types/Link';
-import type { ImageSlideType, ListingMedia, MediaSlideType, VideoSlideType, VrSlideType } from '@/types/ListingMedia';
 import type { Orientation } from '@/types/Orientation';
 import type { Priority } from '@/types/Priority';
-import type { Raw } from '@/types/Raw';
 import type { Realm } from '@/types/Realm';
-import type { RealmConfig } from '@/types/RealmConfig';
 import type { SelectOption, SelectOptionGroup } from '@/types/Select';
 import type { Size, SizeButton } from '@/types/Size';
 import type { Source } from '@/types/Source';
@@ -111,29 +105,21 @@ export type {
   CardType,
   CheckboxField,
   CheckboxInput,
-  Detail,
   Element,
   ElementTextAsIcon,
-  FacetComponentIdRange,
   Field,
   FormValueTransformer,
   Formatted,
   GenericField,
   GenericInput,
   Icon,
-  ImageSlideType,
   Input,
   Link,
-  ListingMedia,
   Media,
-  MediaSlideType,
   ObjectFit,
   Orientation,
   Priority,
-  RangeData,
-  Raw,
   Realm,
-  RealmConfig,
   SelectField,
   SelectInput,
   SelectOptionGroup,
@@ -155,12 +141,12 @@ export type {
   ValidationLength,
   ValidationResult,
   Validator,
-  VideoSlideType,
-  VrSlideType,
 };
 
 export {
   ALERT,
+  BADGE_COLOR,
+  BADGE_COLOR_DETAILS,
   BADGE_TRUSTED,
   BREAKPOINT,
   CSS,
@@ -171,7 +157,6 @@ export {
   ICON,
   ICON_REALM,
   MEDIA,
-  MEDIA_SLIDE_TYPES,
   OBJECT_FIT,
   ORIENTATION,
   PRIORITY,

package/package.json

@@ -61,7 +61,7 @@
   "main": "dist/tide-design-system.cjs",
   "module": "dist/tide-design-system.esm.js",
   "types": "dist/tide-design-system.esm.d.ts",
-  "version": "2.2.15",
+  "version": "2.3.0",
   "dependencies": {
     "@floating-ui/vue": "^1.1.6"
   }

package/src/assets/css/main.css

@@ -2,10 +2,4 @@
 @import './reset.css';
 @import './variables.css';
 @import './utilities.css';
-@import './utilities-sm.css';
-@import './utilities-md.css';
-@import './utilities-lg.css';
-@import './utilities-xl.css';
-@import './dynamic-buttons.css';
-@import './dynamic-utilities.css';
 @import './grid-layout.css';

package/src/assets/css/reset.css

@@ -78,7 +78,7 @@ button:disabled {
 
 /* cross-browser normalization */
 input::placeholder {
-  color: var(--tide-gray); /* TODO: replace with an accessible light text color from design system */
+  color: var(--tide-gray-700);
   opacity: 1;
 }