@veracity/vui 1.8.0-redesign.0 → 1.8.1

package/dist/esm/badge/theme.js

@@ -1,133 +0,0 @@
-const baseStyle = {};
-const defaultProps = {
-    size: 'md',
-    variant: 'subtleSandstone'
-};
-const parts = ['container', 'icon', 'text'];
-const sizes = {
-    xs: {
-        container: {
-            borderRadius: 'lg',
-            fontSize: 'sm',
-            h: 20,
-            spaceX: 4
-        },
-        icon: {
-            size: 'xs'
-        }
-    },
-    sm: {
-        container: {
-            fontSize: 'sm',
-            h: 24,
-            spaceX: 4
-        },
-        icon: {
-            size: 'xs'
-        }
-    },
-    md: {
-        container: {
-            fontSize: 'sm',
-            h: 32,
-            spaceX: 6
-        },
-        icon: {
-            size: 'sm'
-        }
-    },
-    lg: {
-        container: {
-            fontSize: 'md',
-            h: 40,
-            spaceX: 8
-        },
-        icon: {
-            size: 'md'
-        }
-    }
-};
-const variants = {
-    subtleSandstone: {
-        container: {
-            bg: 'sandstone.95',
-            color: 'sandstone.20',
-            borderColor: 'transparent'
-        }
-    },
-    subtleEarth: {
-        container: {
-            bg: 'earth.95',
-            color: 'earth.20'
-        }
-    },
-    subtleBlue: {
-        container: {
-            bg: 'skyBlue.95',
-            color: 'seaBlue.28'
-        }
-    },
-    subtleBlue2: {
-        container: {
-            bg: 'skyBlue.95',
-            color: 'skyBlue.20'
-        }
-    },
-    subtleRed: {
-        container: {
-            bg: 'energyRed.95',
-            color: 'energyRed.45'
-        }
-    },
-    subtleYellow: {
-        container: {
-            bg: 'sunflower.85',
-            color: 'sunflower.20'
-        }
-    },
-    subtleGreen: {
-        container: {
-            bg: 'landGreen.95',
-            color: 'landGreen.30'
-        }
-    },
-    /** solids next */
-    solidBlue: {
-        container: {
-            bg: 'skyBlue.65',
-            color: 'skyBlue.20'
-        }
-    },
-    solidDarkBlue: {
-        container: {
-            bg: 'darkBlue.18',
-            borderColor: 'darkBlue.18',
-            color: 'white'
-        }
-    },
-    solidRed: {
-        container: {
-            bg: 'energyRed.45',
-            color: 'white'
-        }
-    },
-    solidYellow: {
-        container: {
-            bg: 'sunflower.65',
-            color: 'sunflower.20'
-        }
-    },
-    solidGreen: {
-        container: {
-            bg: 'landGreen.35',
-            color: 'white'
-        }
-    }
-};
-export default {
-    baseStyle,
-    defaultProps,
-    parts,
-    sizes,
-    variants
-};

package/dist/esm/onedesign-tokens/dist/js/es6/rem/button.d.ts

@@ -1,85 +0,0 @@
-/**
- * Do not edit directly
- * Generated on Thu, 17 Feb 2022 11:35:15 GMT
- */
-export const buttonSizeLargeFontSize: "1.125rem";
-export const buttonSizeLargeLineHeight: "1.75rem";
-export const buttonSizeLargePadding: "0.5rem 1rem";
-export const buttonSizeMediumFontSize: "1rem";
-export const buttonSizeMediumLineHeight: "1.5rem";
-export const buttonSizeMediumPadding: "0.25rem calc(0.25rem * 3)";
-export const buttonSizeSmallFontSize: "0.875rem";
-export const buttonSizeSmallLineHeight: "1.25rem";
-export const buttonSizeSmallPadding: "calc(0.25rem / 2) 0.5rem";
-export const buttonSizeDefaultFontSize: "1rem";
-export const buttonSizeDefaultLineHeight: "1.5rem";
-export const buttonSizeDefaultPadding: "0.25rem calc(0.25rem * 3)";
-export const buttonTypePrimaryDefaultBorderColorDark: "hsla(0, 0%, 0%, 0)";
-export const buttonTypePrimaryDefaultBorderColorLight: "hsla(0, 0%, 0%, 0)";
-export const buttonTypePrimaryDefaultBackgroundColorDark: "hsla(218, 100%, 28%, 1)";
-export const buttonTypePrimaryDefaultBackgroundColorLight: "hsla(139, 100%, 78%, 1)";
-export const buttonTypePrimaryDefaultTextColorDark: "hsla(40, 3%, 100%, 1)";
-export const buttonTypePrimaryDefaultTextColorLight: "hsla(223, 67%, 18%, 1)";
-export const buttonTypePrimaryHoverBorderColorDark: "hsla(0, 0%, 0%, 0)";
-export const buttonTypePrimaryHoverBorderColorLight: "hsla(0, 0%, 0%, 0)";
-export const buttonTypePrimaryHoverBackgroundColorDark: "hsla(218, 100%, 20%, 1)";
-export const buttonTypePrimaryHoverBackgroundColorLight: "hsla(139, 100%, 70%, 1)";
-export const buttonTypePrimaryHoverTextColorDark: "hsla(40, 3%, 100%, 1)";
-export const buttonTypePrimaryHoverTextColorLight: "hsla(223, 67%, 18%, 1)";
-export const buttonTypePrimaryActiveBorderColorDark: "hsla(0, 0%, 0%, 0)";
-export const buttonTypePrimaryActiveBorderColorLight: "hsla(0, 0%, 0%, 0)";
-export const buttonTypePrimaryActiveBackgroundColorDark: "hsla(218, 100%, 35%, 1)";
-export const buttonTypePrimaryActiveBackgroundColorLight: "hsla(139, 100%, 85%, 1)";
-export const buttonTypePrimaryActiveTextColorDark: "hsla(40, 3%, 100%, 1)";
-export const buttonTypePrimaryActiveTextColorLight: "hsla(223, 67%, 18%, 1)";
-export const buttonTypePrimaryFocusOutline: "0.25rem solid hsla(196, 100%, 43%, 1)";
-export const buttonTypeSecondaryDefaultBorderColorDark: "hsla(218, 100%, 28%, 1)";
-export const buttonTypeSecondaryDefaultBorderColorLight: "hsla(139, 100%, 78%, 1)";
-export const buttonTypeSecondaryDefaultBackgroundColorDark: "hsla(0, 0%, 0%, 0)";
-export const buttonTypeSecondaryDefaultBackgroundColorLight: "hsla(0, 0%, 0%, 0)";
-export const buttonTypeSecondaryDefaultTextColorDark: "hsla(218, 100%, 28%, 1)";
-export const buttonTypeSecondaryDefaultTextColorLight: "hsla(139, 100%, 78%, 1)";
-export const buttonTypeSecondaryHoverBorderColorDark: "hsla(218, 100%, 28%, 1)";
-export const buttonTypeSecondaryHoverBorderColorLight: "hsla(139, 100%, 78%, 1)";
-export const buttonTypeSecondaryHoverBackgroundColorDark: "hsla(196, 74%, 90%, 1)";
-export const buttonTypeSecondaryHoverBackgroundColorLight: "hsla(218, 100%, 25%, 1)";
-export const buttonTypeSecondaryHoverTextColorDark: "hsla(218, 100%, 28%, 1)";
-export const buttonTypeSecondaryHoverTextColorLight: "hsla(139, 100%, 78%, 1)";
-export const buttonTypeSecondaryActiveBorderColorDark: "hsla(218, 100%, 28%, 1)";
-export const buttonTypeSecondaryActiveBorderColorLight: "hsla(139, 100%, 78%, 1)";
-export const buttonTypeSecondaryActiveBackgroundColorDark: "hsla(196, 74%, 95%, 1)";
-export const buttonTypeSecondaryActiveBackgroundColorLight: "hsla(218, 100%, 35%, 1)";
-export const buttonTypeSecondaryActiveTextColorDark: "hsla(218, 100%, 28%, 1)";
-export const buttonTypeSecondaryActiveTextColorLight: "hsla(139, 100%, 78%, 1)";
-export const buttonTypeSecondaryFocusOutline: "0.25rem solid hsla(196, 100%, 43%, 1)";
-export const buttonTypeTertiaryDefaultBorderColorDark: "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryDefaultBorderColorLight: "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryDefaultBackgroundColorDark: "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryDefaultBackgroundColorLight: "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryDefaultTextColorDark: "hsla(218, 100%, 28%, 1)";
-export const buttonTypeTertiaryDefaultTextColorLight: "hsla(139, 100%, 78%, 1)";
-export const buttonTypeTertiaryHoverBorderColorDark: "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryHoverBorderColorLight: "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryHoverBackgroundColorDark: "hsla(196, 74%, 90%, 1)";
-export const buttonTypeTertiaryHoverBackgroundColorLight: "hsla(218, 100%, 25%, 1)";
-export const buttonTypeTertiaryHoverTextColorDark: "hsla(218, 100%, 28%, 1)";
-export const buttonTypeTertiaryHoverTextColorLight: "hsla(139, 100%, 78%, 1)";
-export const buttonTypeTertiaryActiveBorderColorDark: "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryActiveBorderColorLight: "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryActiveBackgroundColorDark: "hsla(196, 74%, 95%, 1)";
-export const buttonTypeTertiaryActiveBackgroundColorLight: "hsla(218, 100%, 35%, 1)";
-export const buttonTypeTertiaryActiveTextColorDark: "hsla(218, 100%, 28%, 1)";
-export const buttonTypeTertiaryActiveTextColorLight: "hsla(139, 100%, 78%, 1)";
-export const buttonTypeTertiaryFocusOutline: "0.25rem solid hsla(196, 100%, 43%, 1)";
-export const buttonDisabledCursor: "default";
-export const buttonDisabledOpacity: "50%";
-export const buttonBorderStyle: "solid";
-export const buttonBorderWidth: "calc(0.125rem / 2)";
-export const buttonFontFamily: "'Avenir Next', Arial, sans-serif";
-export const buttonFontSize: "1rem";
-export const buttonLineHeight: "1.5rem";
-export const buttonFontWeight: "500";
-export const buttonPadding: "calc(0.25rem * 1.5) calc(0.25rem * 3)";
-export const buttonTransition: "all 0.15s ease-in-out";
-export const buttonCursor: "pointer";
-//# sourceMappingURL=button.d.ts.map

package/dist/esm/onedesign-tokens/dist/js/es6/rem/button.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../../../../../../src/onedesign-tokens/dist/js/es6/rem/button.js"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,iDAAkD;AAClD,kDAAmD;AACnD,mDAAoD;AACpD,8CAA+C;AAC/C,kDAAmD;AACnD,kEAAmE;AACnE,iDAAkD;AAClD,kDAAmD;AACnD,gEAAiE;AACjE,+CAAgD;AAChD,mDAAoD;AACpD,mEAAoE;AACpE,2EAA4E;AAC5E,4EAA6E;AAC7E,oFAAqF;AACrF,qFAAsF;AACtF,4EAA6E;AAC7E,8EAA+E;AAC/E,yEAA0E;AAC1E,0EAA2E;AAC3E,kFAAmF;AACnF,mFAAoF;AACpF,0EAA2E;AAC3E,4EAA6E;AAC7E,0EAA2E;AAC3E,2EAA4E;AAC5E,mFAAoF;AACpF,oFAAqF;AACrF,2EAA4E;AAC5E,6EAA8E;AAC9E,oFAAqF;AACrF,kFAAmF;AACnF,mFAAoF;AACpF,iFAAkF;AAClF,kFAAmF;AACnF,gFAAiF;AACjF,iFAAkF;AAClF,gFAAiF;AACjF,iFAAkF;AAClF,mFAAoF;AACpF,qFAAsF;AACtF,8EAA+E;AAC/E,+EAAgF;AAChF,iFAAkF;AAClF,kFAAmF;AACnF,oFAAqF;AACrF,sFAAuF;AACvF,+EAAgF;AAChF,gFAAiF;AACjF,sFAAuF;AACvF,4EAA6E;AAC7E,6EAA8E;AAC9E,gFAAiF;AACjF,iFAAkF;AAClF,+EAAgF;AAChF,gFAAiF;AACjF,0EAA2E;AAC3E,2EAA4E;AAC5E,kFAAmF;AACnF,oFAAqF;AACrF,6EAA8E;AAC9E,8EAA+E;AAC/E,2EAA4E;AAC5E,4EAA6E;AAC7E,mFAAoF;AACpF,qFAAsF;AACtF,8EAA+E;AAC/E,+EAAgF;AAChF,qFAAsF;AACtF,6CAA8C;AAC9C,0CAA2C;AAC3C,wCAAyC;AACzC,qDAAsD;AACtD,kEAAmE;AACnE,oCAAqC;AACrC,wCAAyC;AACzC,qCAAsC;AACtC,oEAAqE;AACrE,uDAAwD;AACxD,qCAAsC"}

package/dist/esm/onedesign-tokens/dist/js/es6/rem/button.js

@@ -1,84 +0,0 @@
-/**
- * Do not edit directly
- * Generated on Thu, 17 Feb 2022 11:35:15 GMT
- */
-export const buttonSizeLargeFontSize = "1.125rem";
-export const buttonSizeLargeLineHeight = "1.75rem";
-export const buttonSizeLargePadding = "0.5rem 1rem";
-export const buttonSizeMediumFontSize = "1rem";
-export const buttonSizeMediumLineHeight = "1.5rem";
-export const buttonSizeMediumPadding = "0.25rem calc(0.25rem * 3)";
-export const buttonSizeSmallFontSize = "0.875rem";
-export const buttonSizeSmallLineHeight = "1.25rem";
-export const buttonSizeSmallPadding = "calc(0.25rem / 2) 0.5rem";
-export const buttonSizeDefaultFontSize = "1rem";
-export const buttonSizeDefaultLineHeight = "1.5rem";
-export const buttonSizeDefaultPadding = "0.25rem calc(0.25rem * 3)";
-export const buttonTypePrimaryDefaultBorderColorDark = "hsla(0, 0%, 0%, 0)";
-export const buttonTypePrimaryDefaultBorderColorLight = "hsla(0, 0%, 0%, 0)";
-export const buttonTypePrimaryDefaultBackgroundColorDark = "hsla(218, 100%, 28%, 1)";
-export const buttonTypePrimaryDefaultBackgroundColorLight = "hsla(139, 100%, 78%, 1)";
-export const buttonTypePrimaryDefaultTextColorDark = "hsla(40, 3%, 100%, 1)";
-export const buttonTypePrimaryDefaultTextColorLight = "hsla(223, 67%, 18%, 1)";
-export const buttonTypePrimaryHoverBorderColorDark = "hsla(0, 0%, 0%, 0)";
-export const buttonTypePrimaryHoverBorderColorLight = "hsla(0, 0%, 0%, 0)";
-export const buttonTypePrimaryHoverBackgroundColorDark = "hsla(218, 100%, 20%, 1)";
-export const buttonTypePrimaryHoverBackgroundColorLight = "hsla(139, 100%, 70%, 1)";
-export const buttonTypePrimaryHoverTextColorDark = "hsla(40, 3%, 100%, 1)";
-export const buttonTypePrimaryHoverTextColorLight = "hsla(223, 67%, 18%, 1)";
-export const buttonTypePrimaryActiveBorderColorDark = "hsla(0, 0%, 0%, 0)";
-export const buttonTypePrimaryActiveBorderColorLight = "hsla(0, 0%, 0%, 0)";
-export const buttonTypePrimaryActiveBackgroundColorDark = "hsla(218, 100%, 35%, 1)";
-export const buttonTypePrimaryActiveBackgroundColorLight = "hsla(139, 100%, 85%, 1)";
-export const buttonTypePrimaryActiveTextColorDark = "hsla(40, 3%, 100%, 1)";
-export const buttonTypePrimaryActiveTextColorLight = "hsla(223, 67%, 18%, 1)";
-export const buttonTypePrimaryFocusOutline = "0.25rem solid hsla(196, 100%, 43%, 1)";
-export const buttonTypeSecondaryDefaultBorderColorDark = "hsla(218, 100%, 28%, 1)";
-export const buttonTypeSecondaryDefaultBorderColorLight = "hsla(139, 100%, 78%, 1)";
-export const buttonTypeSecondaryDefaultBackgroundColorDark = "hsla(0, 0%, 0%, 0)";
-export const buttonTypeSecondaryDefaultBackgroundColorLight = "hsla(0, 0%, 0%, 0)";
-export const buttonTypeSecondaryDefaultTextColorDark = "hsla(218, 100%, 28%, 1)";
-export const buttonTypeSecondaryDefaultTextColorLight = "hsla(139, 100%, 78%, 1)";
-export const buttonTypeSecondaryHoverBorderColorDark = "hsla(218, 100%, 28%, 1)";
-export const buttonTypeSecondaryHoverBorderColorLight = "hsla(139, 100%, 78%, 1)";
-export const buttonTypeSecondaryHoverBackgroundColorDark = "hsla(196, 74%, 90%, 1)";
-export const buttonTypeSecondaryHoverBackgroundColorLight = "hsla(218, 100%, 25%, 1)";
-export const buttonTypeSecondaryHoverTextColorDark = "hsla(218, 100%, 28%, 1)";
-export const buttonTypeSecondaryHoverTextColorLight = "hsla(139, 100%, 78%, 1)";
-export const buttonTypeSecondaryActiveBorderColorDark = "hsla(218, 100%, 28%, 1)";
-export const buttonTypeSecondaryActiveBorderColorLight = "hsla(139, 100%, 78%, 1)";
-export const buttonTypeSecondaryActiveBackgroundColorDark = "hsla(196, 74%, 95%, 1)";
-export const buttonTypeSecondaryActiveBackgroundColorLight = "hsla(218, 100%, 35%, 1)";
-export const buttonTypeSecondaryActiveTextColorDark = "hsla(218, 100%, 28%, 1)";
-export const buttonTypeSecondaryActiveTextColorLight = "hsla(139, 100%, 78%, 1)";
-export const buttonTypeSecondaryFocusOutline = "0.25rem solid hsla(196, 100%, 43%, 1)";
-export const buttonTypeTertiaryDefaultBorderColorDark = "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryDefaultBorderColorLight = "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryDefaultBackgroundColorDark = "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryDefaultBackgroundColorLight = "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryDefaultTextColorDark = "hsla(218, 100%, 28%, 1)";
-export const buttonTypeTertiaryDefaultTextColorLight = "hsla(139, 100%, 78%, 1)";
-export const buttonTypeTertiaryHoverBorderColorDark = "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryHoverBorderColorLight = "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryHoverBackgroundColorDark = "hsla(196, 74%, 90%, 1)";
-export const buttonTypeTertiaryHoverBackgroundColorLight = "hsla(218, 100%, 25%, 1)";
-export const buttonTypeTertiaryHoverTextColorDark = "hsla(218, 100%, 28%, 1)";
-export const buttonTypeTertiaryHoverTextColorLight = "hsla(139, 100%, 78%, 1)";
-export const buttonTypeTertiaryActiveBorderColorDark = "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryActiveBorderColorLight = "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryActiveBackgroundColorDark = "hsla(196, 74%, 95%, 1)";
-export const buttonTypeTertiaryActiveBackgroundColorLight = "hsla(218, 100%, 35%, 1)";
-export const buttonTypeTertiaryActiveTextColorDark = "hsla(218, 100%, 28%, 1)";
-export const buttonTypeTertiaryActiveTextColorLight = "hsla(139, 100%, 78%, 1)";
-export const buttonTypeTertiaryFocusOutline = "0.25rem solid hsla(196, 100%, 43%, 1)";
-export const buttonDisabledCursor = "default";
-export const buttonDisabledOpacity = "50%";
-export const buttonBorderStyle = "solid";
-export const buttonBorderWidth = "calc(0.125rem / 2)";
-export const buttonFontFamily = "'Avenir Next', Arial, sans-serif";
-export const buttonFontSize = "1rem";
-export const buttonLineHeight = "1.5rem";
-export const buttonFontWeight = "500";
-export const buttonPadding = "calc(0.25rem * 1.5) calc(0.25rem * 3)";
-export const buttonTransition = "all 0.15s ease-in-out";
-export const buttonCursor = "pointer";

package/src/badge/badge.tsx

@@ -1,36 +0,0 @@
-import React from 'react'
-
-import { vui } from '../core'
-import { Tag, TagProps } from '../tag'
-import { Dict } from '../utils'
-import { BadgeProps } from './badge.types'
-import theme from './theme'
-
-/**
- * Badges are round, non-interactive tags.
- *
- * These components are used for displaying information only; they might be used as a “counter” for push notifications.
- */
-
-export const Badge = vui<'span', BadgeProps>(props => {
-  const { variant, ...rest } = props as TagProps
-  const { variants } = (theme as Dict) ?? {}
-
-  const bg = variants[variant ?? 'subtleSandstone'].container.bg
-  const color = variants[variant ?? 'subtleSandstone'].container.color
-
-  return (
-    <Tag
-      bg={bg}
-      className="vui-badge"
-      color={color}
-      isInteractive={false}
-      isRound
-      minW="20px"
-      {...rest}
-      onDelete={undefined}
-    />
-  )
-})
-
-export default Badge

package/src/badge/badge.types.ts

@@ -1,17 +0,0 @@
-import { IconProp } from '../icon'
-import { SystemProps } from '../system'
-import { TagInnerProps } from '../tag'
-import { ThemingProps } from '../theme'
-
-export type BadgeInnerProps = {
-  /** Icon that replaces any other content. */
-  icon?: IconProp | JSX.Element
-  /** Socket displaying icon on the left side. */
-  iconLeft?: IconProp | JSX.Element
-  /** Socket displaying icon on the right side. */
-  iconRight?: IconProp | JSX.Element
-  /** Socket displaying text as alternative to children. */
-  text?: React.ReactNode
-}
-
-export type BadgeProps = SystemProps & ThemingProps<'Badge'> & TagInnerProps & BadgeInnerProps

package/src/badge/index.ts

@@ -1,2 +0,0 @@
-export * from './badge'
-export { default } from './badge'

package/src/badge/theme.ts

@@ -1,140 +0,0 @@
-const baseStyle = {}
-
-const defaultProps = {
-  size: 'md',
-  variant: 'subtleSandstone'
-}
-
-const parts = ['container', 'icon', 'text']
-
-const sizes = {
-  xs: {
-    container: {
-      borderRadius: 'lg',
-      fontSize: 'sm',
-      h: 20,
-      spaceX: 4
-    },
-    icon: {
-      size: 'xs'
-    }
-  },
-  sm: {
-    container: {
-      fontSize: 'sm',
-      h: 24,
-      spaceX: 4
-    },
-    icon: {
-      size: 'xs'
-    }
-  },
-  md: {
-    container: {
-      fontSize: 'sm',
-      h: 32,
-      spaceX: 6
-    },
-    icon: {
-      size: 'sm'
-    }
-  },
-  lg: {
-    container: {
-      fontSize: 'md',
-      h: 40,
-      spaceX: 8
-    },
-    icon: {
-      size: 'md'
-    }
-  }
-}
-
-const variants = {
-  subtleSandstone: {
-    container: {
-      bg: 'sandstone.95',
-      color: 'sandstone.20',
-      borderColor: 'transparent'
-    }
-  },
-  subtleEarth: {
-    container: {
-      bg: 'earth.95',
-      color: 'earth.20'
-    }
-  },
-  subtleBlue: {
-    container: {
-      bg: 'skyBlue.95',
-      color: 'seaBlue.28'
-    }
-  },
-  subtleBlue2: {
-    container: {
-      bg: 'skyBlue.95',
-      color: 'skyBlue.20'
-    }
-  },
-  subtleRed: {
-    container: {
-      bg: 'energyRed.95',
-      color: 'energyRed.45'
-    }
-  },
-  subtleYellow: {
-    container: {
-      bg: 'sunflower.85',
-      color: 'sunflower.20'
-    }
-  },
-  subtleGreen: {
-    container: {
-      bg: 'landGreen.95',
-      color: 'landGreen.30'
-    }
-  },
-
-  /** solids next */
-  solidBlue: {
-    container: {
-      bg: 'skyBlue.65',
-      color: 'skyBlue.20'
-    }
-  },
-
-  solidDarkBlue: {
-    container: {
-      bg: 'darkBlue.18',
-      borderColor: 'darkBlue.18',
-      color: 'white'
-    }
-  },
-  solidRed: {
-    container: {
-      bg: 'energyRed.45',
-      color: 'white'
-    }
-  },
-  solidYellow: {
-    container: {
-      bg: 'sunflower.65',
-      color: 'sunflower.20'
-    }
-  },
-  solidGreen: {
-    container: {
-      bg: 'landGreen.35',
-      color: 'white'
-    }
-  }
-}
-
-export default {
-  baseStyle,
-  defaultProps,
-  parts,
-  sizes,
-  variants
-}

package/src/onedesign-tokens/dist/js/es6/rem/button.js

@@ -1,85 +0,0 @@
-/**
- * Do not edit directly
- * Generated on Thu, 17 Feb 2022 11:35:15 GMT
- */
-
-export const buttonSizeLargeFontSize = "1.125rem";
-export const buttonSizeLargeLineHeight = "1.75rem";
-export const buttonSizeLargePadding = "0.5rem 1rem";
-export const buttonSizeMediumFontSize = "1rem";
-export const buttonSizeMediumLineHeight = "1.5rem";
-export const buttonSizeMediumPadding = "0.25rem calc(0.25rem * 3)";
-export const buttonSizeSmallFontSize = "0.875rem";
-export const buttonSizeSmallLineHeight = "1.25rem";
-export const buttonSizeSmallPadding = "calc(0.25rem / 2) 0.5rem";
-export const buttonSizeDefaultFontSize = "1rem";
-export const buttonSizeDefaultLineHeight = "1.5rem";
-export const buttonSizeDefaultPadding = "0.25rem calc(0.25rem * 3)";
-export const buttonTypePrimaryDefaultBorderColorDark = "hsla(0, 0%, 0%, 0)";
-export const buttonTypePrimaryDefaultBorderColorLight = "hsla(0, 0%, 0%, 0)";
-export const buttonTypePrimaryDefaultBackgroundColorDark = "hsla(218, 100%, 28%, 1)";
-export const buttonTypePrimaryDefaultBackgroundColorLight = "hsla(139, 100%, 78%, 1)";
-export const buttonTypePrimaryDefaultTextColorDark = "hsla(40, 3%, 100%, 1)";
-export const buttonTypePrimaryDefaultTextColorLight = "hsla(223, 67%, 18%, 1)";
-export const buttonTypePrimaryHoverBorderColorDark = "hsla(0, 0%, 0%, 0)";
-export const buttonTypePrimaryHoverBorderColorLight = "hsla(0, 0%, 0%, 0)";
-export const buttonTypePrimaryHoverBackgroundColorDark = "hsla(218, 100%, 20%, 1)";
-export const buttonTypePrimaryHoverBackgroundColorLight = "hsla(139, 100%, 70%, 1)";
-export const buttonTypePrimaryHoverTextColorDark = "hsla(40, 3%, 100%, 1)";
-export const buttonTypePrimaryHoverTextColorLight = "hsla(223, 67%, 18%, 1)";
-export const buttonTypePrimaryActiveBorderColorDark = "hsla(0, 0%, 0%, 0)";
-export const buttonTypePrimaryActiveBorderColorLight = "hsla(0, 0%, 0%, 0)";
-export const buttonTypePrimaryActiveBackgroundColorDark = "hsla(218, 100%, 35%, 1)";
-export const buttonTypePrimaryActiveBackgroundColorLight = "hsla(139, 100%, 85%, 1)";
-export const buttonTypePrimaryActiveTextColorDark = "hsla(40, 3%, 100%, 1)";
-export const buttonTypePrimaryActiveTextColorLight = "hsla(223, 67%, 18%, 1)";
-export const buttonTypePrimaryFocusOutline = "0.25rem solid hsla(196, 100%, 43%, 1)";
-export const buttonTypeSecondaryDefaultBorderColorDark = "hsla(218, 100%, 28%, 1)";
-export const buttonTypeSecondaryDefaultBorderColorLight = "hsla(139, 100%, 78%, 1)";
-export const buttonTypeSecondaryDefaultBackgroundColorDark = "hsla(0, 0%, 0%, 0)";
-export const buttonTypeSecondaryDefaultBackgroundColorLight = "hsla(0, 0%, 0%, 0)";
-export const buttonTypeSecondaryDefaultTextColorDark = "hsla(218, 100%, 28%, 1)";
-export const buttonTypeSecondaryDefaultTextColorLight = "hsla(139, 100%, 78%, 1)";
-export const buttonTypeSecondaryHoverBorderColorDark = "hsla(218, 100%, 28%, 1)";
-export const buttonTypeSecondaryHoverBorderColorLight = "hsla(139, 100%, 78%, 1)";
-export const buttonTypeSecondaryHoverBackgroundColorDark = "hsla(196, 74%, 90%, 1)";
-export const buttonTypeSecondaryHoverBackgroundColorLight = "hsla(218, 100%, 25%, 1)";
-export const buttonTypeSecondaryHoverTextColorDark = "hsla(218, 100%, 28%, 1)";
-export const buttonTypeSecondaryHoverTextColorLight = "hsla(139, 100%, 78%, 1)";
-export const buttonTypeSecondaryActiveBorderColorDark = "hsla(218, 100%, 28%, 1)";
-export const buttonTypeSecondaryActiveBorderColorLight = "hsla(139, 100%, 78%, 1)";
-export const buttonTypeSecondaryActiveBackgroundColorDark = "hsla(196, 74%, 95%, 1)";
-export const buttonTypeSecondaryActiveBackgroundColorLight = "hsla(218, 100%, 35%, 1)";
-export const buttonTypeSecondaryActiveTextColorDark = "hsla(218, 100%, 28%, 1)";
-export const buttonTypeSecondaryActiveTextColorLight = "hsla(139, 100%, 78%, 1)";
-export const buttonTypeSecondaryFocusOutline = "0.25rem solid hsla(196, 100%, 43%, 1)";
-export const buttonTypeTertiaryDefaultBorderColorDark = "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryDefaultBorderColorLight = "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryDefaultBackgroundColorDark = "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryDefaultBackgroundColorLight = "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryDefaultTextColorDark = "hsla(218, 100%, 28%, 1)";
-export const buttonTypeTertiaryDefaultTextColorLight = "hsla(139, 100%, 78%, 1)";
-export const buttonTypeTertiaryHoverBorderColorDark = "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryHoverBorderColorLight = "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryHoverBackgroundColorDark = "hsla(196, 74%, 90%, 1)";
-export const buttonTypeTertiaryHoverBackgroundColorLight = "hsla(218, 100%, 25%, 1)";
-export const buttonTypeTertiaryHoverTextColorDark = "hsla(218, 100%, 28%, 1)";
-export const buttonTypeTertiaryHoverTextColorLight = "hsla(139, 100%, 78%, 1)";
-export const buttonTypeTertiaryActiveBorderColorDark = "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryActiveBorderColorLight = "hsla(0, 0%, 0%, 0)";
-export const buttonTypeTertiaryActiveBackgroundColorDark = "hsla(196, 74%, 95%, 1)";
-export const buttonTypeTertiaryActiveBackgroundColorLight = "hsla(218, 100%, 35%, 1)";
-export const buttonTypeTertiaryActiveTextColorDark = "hsla(218, 100%, 28%, 1)";
-export const buttonTypeTertiaryActiveTextColorLight = "hsla(139, 100%, 78%, 1)";
-export const buttonTypeTertiaryFocusOutline = "0.25rem solid hsla(196, 100%, 43%, 1)";
-export const buttonDisabledCursor = "default";
-export const buttonDisabledOpacity = "50%";
-export const buttonBorderStyle = "solid";
-export const buttonBorderWidth = "calc(0.125rem / 2)";
-export const buttonFontFamily = "'Avenir Next', Arial, sans-serif";
-export const buttonFontSize = "1rem";
-export const buttonLineHeight = "1.5rem";
-export const buttonFontWeight = "500";
-export const buttonPadding = "calc(0.25rem * 1.5) calc(0.25rem * 3)";
-export const buttonTransition = "all 0.15s ease-in-out";
-export const buttonCursor = "pointer";