@artsy/palette 38.15.0 → 39.0.0

package/dist/elements/TextArea/TextArea.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextArea.js","names":["_themeGet","require","_react","_interopRequireWildcard","_styledComponents","_RequiredField","_Box","_Text","_Tooltip","_tokens","_helpers","_excluded","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_extends","assign","bind","target","i","arguments","length","source","apply","_slicedToArray","arr","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","TextArea","React","forwardRef","_ref","ref","error","disabled","focus","hover","characterLimit","characterLimitHelper","title","description","_ref$defaultValue","defaultValue","required","onChange","rest","_splitBoxProps","splitBoxProps","_splitBoxProps2","boxProps","inputProps","_useState","useState","_useState2","setValue","characterLimitExceeded","useCallback","text","Boolean","characterLimitReached","handleChange","event","nextValue","currentTarget","exceedsCharacterLimit","hasError","useMemo","showCharacterLimitReached","createElement","Box","width","Tooltip","pointer","content","placement","Text","variant","color","textAlign","position","mt","StyledTextArea","placeholder","StyledLabel","htmlFor","display","mx","RequiredField","flex","ml","exports","displayName","styled","textarea","withConfig","componentId","themeGet","props","css","TEXTAREA_STATES","active","completed","label","FORM_ELEMENT_TRANSITION"],"sources":["../../../src/elements/TextArea/TextArea.tsx"],"sourcesContent":["import { themeGet } from \"@styled-system/theme-get\"\nimport React, { useCallback, useMemo, useState } from \"react\"\nimport styled, { css } from \"styled-components\"\nimport { RequiredField } from \"../../shared/RequiredField\"\nimport { Box, BoxProps, splitBoxProps } from \"../Box\"\nimport { Text } from \"../Text\"\nimport { Tooltip } from \"../Tooltip\"\nimport { TEXTAREA_STATES } from \"./tokens\"\nimport { FORM_ELEMENT_TRANSITION } from \"../../helpers\"\n\nexport interface TextAreaProps\n  extends BoxProps,\n    Omit<\n      React.TextareaHTMLAttributes<HTMLTextAreaElement>,\n      \"onChange\" | \"title\"\n    > {\n  active?: boolean\n  characterLimit?: number\n  characterLimitHelper?: boolean\n  defaultValue?: string\n  description?: React.ReactNode\n  required?: boolean\n  title?: string\n  disabled?: boolean\n  error?: string | boolean\n  focus?: boolean\n  hover?: boolean\n  onChange?(result: TextAreaChange): void\n}\n\nexport interface TextAreaChange {\n  value: string\n  exceedsCharacterLimit: boolean\n}\n\n/** TextArea */\nexport const TextArea: React.ForwardRefExoticComponent<\n  TextAreaProps & { ref?: React.Ref<HTMLTextAreaElement> }\n> = React.forwardRef(\n  (\n    {\n      error,\n      disabled,\n      focus,\n      hover,\n      characterLimit,\n      characterLimitHelper,\n      title,\n      description,\n      defaultValue = \"\",\n      required,\n      onChange,\n      ...rest\n    },\n    ref\n  ) => {\n    const [boxProps, inputProps] = splitBoxProps(rest)\n\n    const [value, setValue] = useState(defaultValue)\n\n    const characterLimitExceeded = useCallback(\n      (text: string) => {\n        return Boolean(characterLimit && text.length > characterLimit)\n      },\n      [characterLimit]\n    )\n\n    const characterLimitReached = useCallback(\n      (text: string) => {\n        return Boolean(characterLimit && text.length >= characterLimit)\n      },\n      [characterLimit]\n    )\n\n    const handleChange = useCallback(\n      (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n        const nextValue = event.currentTarget.value\n        setValue(nextValue)\n        onChange?.({\n          value: nextValue,\n          exceedsCharacterLimit: characterLimitExceeded(nextValue),\n        })\n      },\n      [characterLimitExceeded, onChange]\n    )\n\n    const hasError = useMemo(\n      () => Boolean(error || characterLimitExceeded(value)),\n      [characterLimitExceeded, error, value]\n    )\n\n    const showCharacterLimitReached =\n      characterLimitHelper &&\n      typeof characterLimit !== \"undefined\" &&\n      characterLimitReached(value)\n\n    return (\n      <Box width=\"100%\" {...boxProps}>\n        {!!description && (\n          <Tooltip pointer content={description} placement=\"top-end\">\n            <Text variant=\"xs\" color=\"black60\" textAlign=\"right\">\n              <u>What is this?</u>\n            </Text>\n          </Tooltip>\n        )}\n\n        <Box position=\"relative\" mt={!!title && !description ? 1 : 0}>\n          <StyledTextArea\n            ref={ref as any}\n            disabled={disabled}\n            focus={focus}\n            hover={hover}\n            error={hasError}\n            onChange={handleChange}\n            defaultValue={defaultValue}\n            required={required}\n            title={title}\n            placeholder={inputProps.placeholder || \" \"}\n            {...inputProps}\n          />\n\n          {!!title && (\n            <StyledLabel htmlFor={inputProps.name}>\n              {title}\n              <span />\n            </StyledLabel>\n          )}\n        </Box>\n\n        {(required || characterLimit) && !(error && typeof error === \"string\") && (\n          <Box display=\"flex\" mt={0.5} mx={1}>\n            {required && !showCharacterLimitReached && (\n              <RequiredField flex={1} disabled={disabled} />\n            )}\n\n            {showCharacterLimitReached && (\n              <Text flex={1} variant=\"xs\" color=\"black60\" textAlign=\"left\">\n                Character limit reached\n              </Text>\n            )}\n\n            {typeof characterLimit !== \"undefined\" && (\n              <Text\n                flex={1}\n                variant=\"xs\"\n                color={characterLimitExceeded(value) ? \"red100\" : \"black60\"}\n                textAlign=\"right\"\n              >\n                {value.length}/{characterLimit}\n              </Text>\n            )}\n          </Box>\n        )}\n\n        {error && typeof error === \"string\" && (\n          <Text variant=\"xs\" color=\"red100\" mt={0.5} ml={1}>\n            {error}\n          </Text>\n        )}\n      </Box>\n    )\n  }\n)\n\nTextArea.displayName = \"TextArea\"\n\ntype StyledTextAreaProps = Pick<\n  TextAreaProps,\n  \"disabled\" | \"error\" | \"hover\" | \"focus\" | \"active\" | \"title\"\n>\n\nconst StyledTextArea = styled.textarea<StyledTextAreaProps>`\n  appearance: none;\n  display: block;\n  width: 100%;\n  background-color: ${themeGet(\"colors.white100\")};\n  padding: ${themeGet(\"space.1\")};\n  resize: vertical;\n  transition: border-color 0.25s, color 0.25s;\n  outline: none;\n  border: 1px solid;\n  border-radius: 3px;\n  font-family: ${themeGet(\"fonts.sans\")};\n\n  ::placeholder {\n    transition: color 0.25s, opacity 0.25s;\n  }\n\n  ${(props) => {\n    return css`\n      ${TEXTAREA_STATES.default}\n      ${props.hover && TEXTAREA_STATES.hover}\n      ${props.focus && TEXTAREA_STATES.focus}\n      ${props.active && TEXTAREA_STATES.active}\n      ${props.disabled && TEXTAREA_STATES.disabled}\n      ${props.error && TEXTAREA_STATES.error}\n\n      &:hover {\n        ${TEXTAREA_STATES.hover}\n      }\n\n      &:not(:placeholder-shown) {\n        ${TEXTAREA_STATES.completed}\n        ${props.error && TEXTAREA_STATES.error}\n      }\n\n      &:focus {\n        outline: none;\n        ${TEXTAREA_STATES.focus}\n\n        :not(:placeholder-shown) {\n          ${!!props.placeholder && TEXTAREA_STATES.active}\n          ${props.error && TEXTAREA_STATES.error}\n        }\n      }\n\n      &:disabled {\n        cursor: default;\n        ${TEXTAREA_STATES.disabled}\n      }\n\n      ${props.title &&\n      css`\n        ::placeholder {\n          opacity: 0;\n        }\n      `}\n    `\n  }}\n`\nconst StyledLabel = styled.label`\n  position: absolute;\n  top: 25px;\n  left: 6px;\n  padding: 0 5px;\n  background-color: transparent;\n  transform: translateY(-50%);\n  transition: ${FORM_ELEMENT_TRANSITION};\n  transition-property: color, transform, padding, font-size;\n  font-family: ${themeGet(\"fonts.sans\")};\n  pointer-events: none;\n\n  & > span {\n    background-color: ${themeGet(\"colors.white100\")};\n    height: 100%;\n    width: 100%;\n    display: block;\n    position: absolute;\n    top: 0;\n    left: 0;\n    z-index: -1;\n    transition: ${FORM_ELEMENT_TRANSITION};\n    transition-property: height, top;\n    transition-delay: 0.1s;\n  }\n`\n"],"mappings":"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"}
+{"version":3,"file":"TextArea.js","names":["_themeGet","require","_react","_interopRequireWildcard","_styledComponents","_RequiredField","_Box","_Text","_Tooltip","_tokens","_helpers","_excluded","_getRequireWildcardCache","nodeInterop","WeakMap","cacheBabelInterop","cacheNodeInterop","obj","__esModule","_typeof","default","cache","has","get","newObj","hasPropertyDescriptor","Object","defineProperty","getOwnPropertyDescriptor","key","prototype","hasOwnProperty","call","desc","set","_extends","assign","bind","target","i","arguments","length","source","apply","_slicedToArray","arr","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","toString","slice","constructor","name","Array","from","test","len","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","_objectWithoutProperties","excluded","_objectWithoutPropertiesLoose","getOwnPropertySymbols","sourceSymbolKeys","indexOf","propertyIsEnumerable","sourceKeys","keys","TextArea","React","forwardRef","_ref","ref","error","disabled","focus","hover","characterLimit","characterLimitHelper","title","description","_ref$defaultValue","defaultValue","required","onChange","rest","_splitBoxProps","splitBoxProps","_splitBoxProps2","boxProps","inputProps","_useState","useState","_useState2","setValue","characterLimitExceeded","useCallback","text","Boolean","characterLimitReached","handleChange","event","nextValue","currentTarget","exceedsCharacterLimit","hasError","useMemo","showCharacterLimitReached","createElement","Box","width","Tooltip","pointer","content","placement","Text","variant","color","textAlign","position","mt","StyledTextArea","placeholder","StyledLabel","htmlFor","display","mx","RequiredField","flex","ml","exports","displayName","styled","textarea","withConfig","componentId","themeGet","props","css","TEXTAREA_STATES","active","completed","label","FORM_ELEMENT_TRANSITION"],"sources":["../../../src/elements/TextArea/TextArea.tsx"],"sourcesContent":["import { themeGet } from \"@styled-system/theme-get\"\nimport React, { useCallback, useMemo, useState } from \"react\"\nimport styled, { css } from \"styled-components\"\nimport { RequiredField } from \"../../shared/RequiredField\"\nimport { Box, BoxProps, splitBoxProps } from \"../Box\"\nimport { Text } from \"../Text\"\nimport { Tooltip } from \"../Tooltip\"\nimport { TEXTAREA_STATES } from \"./tokens\"\nimport { FORM_ELEMENT_TRANSITION } from \"../../helpers\"\n\nexport interface TextAreaProps\n  extends BoxProps,\n    Omit<\n      React.TextareaHTMLAttributes<HTMLTextAreaElement>,\n      \"onChange\" | \"title\"\n    > {\n  active?: boolean\n  characterLimit?: number\n  characterLimitHelper?: boolean\n  defaultValue?: string\n  description?: React.ReactNode\n  required?: boolean\n  title?: string\n  disabled?: boolean\n  error?: string | boolean\n  focus?: boolean\n  hover?: boolean\n  onChange?(result: TextAreaChange): void\n}\n\nexport interface TextAreaChange {\n  value: string\n  exceedsCharacterLimit: boolean\n}\n\n/** TextArea */\nexport const TextArea: React.ForwardRefExoticComponent<\n  TextAreaProps & { ref?: React.Ref<HTMLTextAreaElement> }\n> = React.forwardRef(\n  (\n    {\n      error,\n      disabled,\n      focus,\n      hover,\n      characterLimit,\n      characterLimitHelper,\n      title,\n      description,\n      defaultValue = \"\",\n      required,\n      onChange,\n      ...rest\n    },\n    ref\n  ) => {\n    const [boxProps, inputProps] = splitBoxProps(rest)\n\n    const [value, setValue] = useState(defaultValue)\n\n    const characterLimitExceeded = useCallback(\n      (text: string) => {\n        return Boolean(characterLimit && text.length > characterLimit)\n      },\n      [characterLimit]\n    )\n\n    const characterLimitReached = useCallback(\n      (text: string) => {\n        return Boolean(characterLimit && text.length >= characterLimit)\n      },\n      [characterLimit]\n    )\n\n    const handleChange = useCallback(\n      (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n        const nextValue = event.currentTarget.value\n        setValue(nextValue)\n        onChange?.({\n          value: nextValue,\n          exceedsCharacterLimit: characterLimitExceeded(nextValue),\n        })\n      },\n      [characterLimitExceeded, onChange]\n    )\n\n    const hasError = useMemo(\n      () => Boolean(error || characterLimitExceeded(value)),\n      [characterLimitExceeded, error, value]\n    )\n\n    const showCharacterLimitReached =\n      characterLimitHelper &&\n      typeof characterLimit !== \"undefined\" &&\n      characterLimitReached(value)\n\n    return (\n      <Box width=\"100%\" {...boxProps}>\n        {!!description && (\n          <Tooltip pointer content={description} placement=\"top-end\">\n            <Text variant=\"xs\" color=\"black60\" textAlign=\"right\">\n              <u>What is this?</u>\n            </Text>\n          </Tooltip>\n        )}\n\n        <Box position=\"relative\" mt={!!title && !description ? 1 : 0}>\n          <StyledTextArea\n            ref={ref as any}\n            disabled={disabled}\n            focus={focus}\n            hover={hover}\n            error={hasError}\n            onChange={handleChange}\n            defaultValue={defaultValue}\n            required={required}\n            title={title}\n            placeholder={inputProps.placeholder || \" \"}\n            {...inputProps}\n          />\n\n          {!!title && (\n            <StyledLabel htmlFor={inputProps.name}>\n              {title}\n              <span />\n            </StyledLabel>\n          )}\n        </Box>\n\n        {(required || characterLimit) && !(error && typeof error === \"string\") && (\n          <Box display=\"flex\" mt={0.5} mx={1}>\n            {required && !showCharacterLimitReached && (\n              <RequiredField flex={1} disabled={disabled} />\n            )}\n\n            {showCharacterLimitReached && (\n              <Text flex={1} variant=\"xs\" color=\"black60\" textAlign=\"left\">\n                Character limit reached\n              </Text>\n            )}\n\n            {typeof characterLimit !== \"undefined\" && (\n              <Text\n                flex={1}\n                variant=\"xs\"\n                color={characterLimitExceeded(value) ? \"red100\" : \"black60\"}\n                textAlign=\"right\"\n              >\n                {value.length}/{characterLimit}\n              </Text>\n            )}\n          </Box>\n        )}\n\n        {error && typeof error === \"string\" && (\n          <Text variant=\"xs\" color=\"red100\" mt={0.5} ml={1}>\n            {error}\n          </Text>\n        )}\n      </Box>\n    )\n  }\n)\n\nTextArea.displayName = \"TextArea\"\n\ntype StyledTextAreaProps = Pick<\n  TextAreaProps,\n  \"disabled\" | \"error\" | \"hover\" | \"focus\" | \"active\" | \"title\"\n>\n\nconst StyledTextArea = styled.textarea<StyledTextAreaProps>`\n  appearance: none;\n  display: block;\n  width: 100%;\n  background-color: ${themeGet(\"colors.white100\")};\n  padding: ${themeGet(\"space.1\")};\n  resize: vertical;\n  transition: border-color 0.25s, color 0.25s;\n  outline: none;\n  border: 1px solid;\n  border-radius: 3px;\n  font-family: ${themeGet(\"fonts.sans\")};\n\n  ::placeholder {\n    transition: color 0.25s, opacity 0.25s;\n  }\n\n  ${(props) => {\n    return css`\n      ${TEXTAREA_STATES.default}\n      ${props.hover && TEXTAREA_STATES.hover}\n      ${props.focus && TEXTAREA_STATES.focus}\n      ${props.active && TEXTAREA_STATES.active}\n      ${props.disabled && TEXTAREA_STATES.disabled}\n      ${props.error && TEXTAREA_STATES.error}\n\n      &:hover {\n        ${TEXTAREA_STATES.hover}\n      }\n\n      &:not(:placeholder-shown) {\n        ${TEXTAREA_STATES.completed}\n        ${props.error && TEXTAREA_STATES.error}\n      }\n\n      &:focus {\n        outline: none;\n        ${TEXTAREA_STATES.focus}\n\n        :not(:placeholder-shown) {\n          ${!!props.placeholder && TEXTAREA_STATES.active}\n          ${props.error && TEXTAREA_STATES.error}\n        }\n      }\n\n      &:disabled {\n        cursor: default;\n        ${TEXTAREA_STATES.disabled}\n      }\n\n      ${props.title &&\n      css`\n        ::placeholder {\n          opacity: 0;\n        }\n      `}\n    `\n  }}\n`\nconst StyledLabel = styled.label`\n  position: absolute;\n  top: 25px;\n  left: 6px;\n  padding: 0 5px;\n  background-color: transparent;\n  transform: translateY(-50%);\n  transition: ${FORM_ELEMENT_TRANSITION};\n  transition-property: color, transform, padding, font-size;\n  font-family: ${themeGet(\"fonts.sans\")};\n  pointer-events: none;\n\n  & > span {\n    background-color: ${themeGet(\"colors.white100\")};\n    height: 100%;\n    width: 100%;\n    display: block;\n    position: absolute;\n    top: 0;\n    left: 0;\n    z-index: -1;\n    transition: ${FORM_ELEMENT_TRANSITION};\n    transition-property: height, top;\n    transition-delay: 0.1s;\n  }\n`\n"],"mappings":"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"}

package/dist/elements/Toggle/tokens.d.ts

@@ -1,13 +1,13 @@
 export declare const SWITCH_STATES: {
-    readonly selected: import("styled-components").InterpolationValue[];
-    readonly default: import("styled-components").InterpolationValue[];
+    readonly selected: import("styled-components").RuleSet<object>;
+    readonly default: import("styled-components").RuleSet<object>;
 };
 export declare const TOGGLE_STATES: {
-    readonly default: import("styled-components").FlattenInterpolation<any>[];
-    readonly selected: import("styled-components").FlattenInterpolation<any>[];
-    readonly hover: import("styled-components").InterpolationValue[];
+    readonly default: import("styled-components").RuleSet<object>;
+    readonly selected: import("styled-components").RuleSet<object>;
+    readonly hover: import("styled-components").RuleSet<object>;
     readonly disabled: {
-        readonly default: import("styled-components").FlattenInterpolation<any>[];
-        readonly selected: import("styled-components").FlattenInterpolation<any>[];
+        readonly default: import("styled-components").RuleSet<object>;
+        readonly selected: import("styled-components").RuleSet<object>;
     };
 };

package/dist/elements/Tooltip/Tooltip.js

@@ -119,13 +119,13 @@ var Tooltip = function Tooltip(_ref) {
 exports.Tooltip = Tooltip;
 var Tip = (0, _styledComponents.default)(_Box.Box).withConfig({
   displayName: "Tooltip__Tip",
-  componentId: "ymkaxc-0"
+  componentId: "sc-ymkaxc-0"
 })(["position:absolute;transition:opacity 250ms ease-out;text-align:left;box-shadow:", ";cursor:default;pointer-events:none;font-weight:normal;font-style:normal;", ""], (0, _themeGet.themeGet)("effects.dropShadow"), (0, _styledSystem.variant)({
   variants: TOOLTIP_VARIANTS
 }));
 var Panel = (0, _styledComponents.default)(_Box.Box).withConfig({
   displayName: "Tooltip__Panel",
-  componentId: "ymkaxc-1"
+  componentId: "sc-ymkaxc-1"
 })(["", ""], (0, _styledSystem.variant)({
   variants: TOOLTIP_VARIANTS
 }));

package/dist/elements/VisuallyHidden/VisuallyHidden.d.ts

@@ -8,9 +8,9 @@ import { BoxProps } from "../Box";
  * https://webaim.org/techniques/css/invisiblecontent/
  * https://www.scottohara.me/blog/2017/04/14/inclusively-hidden.html
  */
-export declare const visuallyHiddenMixin: import("styled-components").InterpolationValue[];
+export declare const visuallyHiddenMixin: import("styled-components").RuleSet<object>;
 /** Reset to `inherit` all properties that cause visually-hidden */
-export declare const visuallyUnhiddenMixin: import("styled-components").InterpolationValue[];
+export declare const visuallyUnhiddenMixin: import("styled-components").RuleSet<object>;
 export interface VisuallyHiddenProps extends BoxProps {
     show?: boolean;
 }
@@ -22,4 +22,6 @@ export interface VisuallyHiddenProps extends BoxProps {
  * https://webaim.org/techniques/css/invisiblecontent/
  * https://www.scottohara.me/blog/2017/04/14/inclusively-hidden.html
  */
-export declare const VisuallyHidden: import("styled-components").StyledComponentClass<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & BoxProps & VisuallyHiddenProps, any, import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & BoxProps & VisuallyHiddenProps>;
+export declare const VisuallyHidden: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Pick<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof BoxProps> & BoxProps, keyof BoxProps | "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, VisuallyHiddenProps>> & string;

package/dist/helpers/injectGlobalStyles.d.ts

@@ -1,8 +1,9 @@
+/// <reference types="react" />
 import { css } from "styled-components";
 /**
  * Injects globally relevant styles, including helper classes for our Typography.
  * Apps that use palette should mount this component at the root of their tree.
  */
-export declare function injectGlobalStyles<P>(additionalStyles?: string | ReturnType<typeof css>): {
-    GlobalStyles: import("styled-components").GlobalStyleClass<P, import("styled-components").DefaultTheme>;
+export declare function injectGlobalStyles<P extends object>(additionalStyles?: string | ReturnType<typeof css>): {
+    GlobalStyles: import("react").NamedExoticComponent<import("styled-components").ExecutionProps & P>;
 };

package/dist/helpers/injectGlobalStyles.js

@@ -6,14 +6,13 @@ Object.defineProperty(exports, "__esModule", {
 exports.injectGlobalStyles = injectGlobalStyles;
 var _themeGet = require("@styled-system/theme-get");
 var _styledComponents = require("styled-components");
-var _templateObject;
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 /**
  * Injects globally relevant styles, including helper classes for our Typography.
  * Apps that use palette should mount this component at the root of their tree.
  */
+// eslint-disable-next-line @typescript-eslint/ban-types
 function injectGlobalStyles(additionalStyles) {
-  var GlobalStyles = (0, _styledComponents.createGlobalStyle)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    html {\n      box-sizing: border-box;\n    }\n\n    *,\n    *::before,\n    *::after {\n      box-sizing: inherit;\n    }\n\n    &:focus {\n      outline: 0;\n    }\n\n    &:focus-visible {\n      outline: 1px solid ", ";\n    }\n\n    ::selection {\n      background-color: ", ";\n      color: ", ";\n    }\n\n    html,\n    body,\n    #root {\n      -webkit-tap-highlight-color: transparent;\n      height: 100%;\n    }\n\n    body {\n      margin: 0;\n      padding: 0;\n    }\n\n    html, body {\n      font-family: ", ";\n      font-size: ", ";\n      line-height: ", ";\n      background-color: ", ";\n      color: ", ";\n      -webkit-font-smoothing: antialiased;\n      -moz-osx-font-smoothing: grayscale;\n      text-rendering: optimizeLegibility;\n    }\n\n    a {\n      cursor: pointer;\n      color: inherit;\n      transition: color 0.25s;\n      text-decoration: underline;\n\n      &:hover {\n        color: ", ";\n      }\n\n      &:active {\n        color: ", ";\n      }\n    }\n\n    h1,\n    h2,\n    h3,\n    h4,\n    h5,\n    h6 {\n      font-style: inherit;\n      font-family: inherit;\n      font-weight: inherit;\n      font-size: inherit;\n      margin: 0;\n    }\n\n    dl,\n    dt,\n    dd {\n      margin: 0;\n    }\n\n    ol,\n    ul {\n      list-style: none;\n      margin: 0;\n      padding: 0;\n    }\n\n    ", ";\n  "])), (0, _themeGet.themeGet)("colors.blue100"), (0, _themeGet.themeGet)("colors.blue15"), (0, _themeGet.themeGet)("colors.black100"), (0, _themeGet.themeGet)("fonts.sans"), (0, _themeGet.themeGet)("textVariants.sm.fontSize"), (0, _themeGet.themeGet)("textVariants.sm.lineHeight"), (0, _themeGet.themeGet)("colors.white100"), (0, _themeGet.themeGet)("colors.black100"), (0, _themeGet.themeGet)("colors.black100"), (0, _themeGet.themeGet)("colors.black100"), additionalStyles);
+  var GlobalStyles = (0, _styledComponents.createGlobalStyle)(["html{box-sizing:border-box;}*,*::before,*::after{box-sizing:inherit;}&:focus{outline:0;}&:focus-visible{outline:1px solid ", ";}::selection{background-color:", ";color:", ";}html,body,#root{-webkit-tap-highlight-color:transparent;height:100%;}body{margin:0;padding:0;}html,body{font-family:", ";font-size:", ";line-height:", ";background-color:", ";color:", ";-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;}a{cursor:pointer;color:inherit;transition:color 0.25s;text-decoration:underline;&:hover{color:", ";}&:active{color:", ";}}h1,h2,h3,h4,h5,h6{font-style:inherit;font-family:inherit;font-weight:inherit;font-size:inherit;margin:0;}dl,dt,dd{margin:0;}ol,ul{list-style:none;margin:0;padding:0;}", ";"], (0, _themeGet.themeGet)("colors.blue100"), (0, _themeGet.themeGet)("colors.blue15"), (0, _themeGet.themeGet)("colors.black100"), (0, _themeGet.themeGet)("fonts.sans"), (0, _themeGet.themeGet)("textVariants.sm.fontSize"), (0, _themeGet.themeGet)("textVariants.sm.lineHeight"), (0, _themeGet.themeGet)("colors.white100"), (0, _themeGet.themeGet)("colors.black100"), (0, _themeGet.themeGet)("colors.black100"), (0, _themeGet.themeGet)("colors.black100"), additionalStyles);
   GlobalStyles.displayName = "GlobalStyles";
   return {
     GlobalStyles: GlobalStyles

package/dist/helpers/injectGlobalStyles.js.map

@@ -1 +1 @@
-{"version":3,"file":"injectGlobalStyles.js","names":["_themeGet","require","_styledComponents","_templateObject","_taggedTemplateLiteral","strings","raw","slice","Object","freeze","defineProperties","value","injectGlobalStyles","additionalStyles","GlobalStyles","createGlobalStyle","themeGet","displayName"],"sources":["../../src/helpers/injectGlobalStyles.tsx"],"sourcesContent":["import { themeGet } from \"@styled-system/theme-get\"\nimport { createGlobalStyle, css } from \"styled-components\"\n\n/**\n * Injects globally relevant styles, including helper classes for our Typography.\n * Apps that use palette should mount this component at the root of their tree.\n */\nexport function injectGlobalStyles<P>(\n  additionalStyles?: string | ReturnType<typeof css>\n) {\n  const GlobalStyles = createGlobalStyle<P>`\n    html {\n      box-sizing: border-box;\n    }\n\n    *,\n    *::before,\n    *::after {\n      box-sizing: inherit;\n    }\n\n    &:focus {\n      outline: 0;\n    }\n\n    &:focus-visible {\n      outline: 1px solid ${themeGet(\"colors.blue100\")};\n    }\n\n    ::selection {\n      background-color: ${themeGet(\"colors.blue15\")};\n      color: ${themeGet(\"colors.black100\")};\n    }\n\n    html,\n    body,\n    #root {\n      -webkit-tap-highlight-color: transparent;\n      height: 100%;\n    }\n\n    body {\n      margin: 0;\n      padding: 0;\n    }\n\n    html, body {\n      font-family: ${themeGet(\"fonts.sans\")};\n      font-size: ${themeGet(\"textVariants.sm.fontSize\")};\n      line-height: ${themeGet(\"textVariants.sm.lineHeight\")};\n      background-color: ${themeGet(\"colors.white100\")};\n      color: ${themeGet(\"colors.black100\")};\n      -webkit-font-smoothing: antialiased;\n      -moz-osx-font-smoothing: grayscale;\n      text-rendering: optimizeLegibility;\n    }\n\n    a {\n      cursor: pointer;\n      color: inherit;\n      transition: color 0.25s;\n      text-decoration: underline;\n\n      &:hover {\n        color: ${themeGet(\"colors.black100\")};\n      }\n\n      &:active {\n        color: ${themeGet(\"colors.black100\")};\n      }\n    }\n\n    h1,\n    h2,\n    h3,\n    h4,\n    h5,\n    h6 {\n      font-style: inherit;\n      font-family: inherit;\n      font-weight: inherit;\n      font-size: inherit;\n      margin: 0;\n    }\n\n    dl,\n    dt,\n    dd {\n      margin: 0;\n    }\n\n    ol,\n    ul {\n      list-style: none;\n      margin: 0;\n      padding: 0;\n    }\n\n    ${additionalStyles};\n  `\n\n  GlobalStyles.displayName = \"GlobalStyles\"\n\n  return {\n    GlobalStyles,\n  }\n}\n"],"mappings":";;;;;;AAAA,IAAAA,SAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAD,OAAA;AAA0D,IAAAE,eAAA;AAAA,SAAAC,uBAAAC,OAAA,EAAAC,GAAA,SAAAA,GAAA,IAAAA,GAAA,GAAAD,OAAA,CAAAE,KAAA,cAAAC,MAAA,CAAAC,MAAA,CAAAD,MAAA,CAAAE,gBAAA,CAAAL,OAAA,IAAAC,GAAA,IAAAK,KAAA,EAAAH,MAAA,CAAAC,MAAA,CAAAH,GAAA;AAE1D;AACA;AACA;AACA;AACO,SAASM,kBAAkBA,CAChCC,gBAAkD,EAClD;EACA,IAAMC,YAAY,OAAGC,mCAAiB,EAAAZ,eAAA,KAAAA,eAAA,GAAAC,sBAAA,w1CAgBb,IAAAY,kBAAQ,EAAC,gBAAgB,CAAC,EAI3B,IAAAA,kBAAQ,EAAC,eAAe,CAAC,EACpC,IAAAA,kBAAQ,EAAC,iBAAiB,CAAC,EAgBrB,IAAAA,kBAAQ,EAAC,YAAY,CAAC,EACxB,IAAAA,kBAAQ,EAAC,0BAA0B,CAAC,EAClC,IAAAA,kBAAQ,EAAC,4BAA4B,CAAC,EACjC,IAAAA,kBAAQ,EAAC,iBAAiB,CAAC,EACtC,IAAAA,kBAAQ,EAAC,iBAAiB,CAAC,EAazB,IAAAA,kBAAQ,EAAC,iBAAiB,CAAC,EAI3B,IAAAA,kBAAQ,EAAC,iBAAiB,CAAC,EA8BtCH,gBAAgB,CACnB;EAEDC,YAAY,CAACG,WAAW,GAAG,cAAc;EAEzC,OAAO;IACLH,YAAY,EAAZA;EACF,CAAC;AACH"}
+{"version":3,"file":"injectGlobalStyles.js","names":["_themeGet","require","_styledComponents","injectGlobalStyles","additionalStyles","GlobalStyles","createGlobalStyle","themeGet","displayName"],"sources":["../../src/helpers/injectGlobalStyles.tsx"],"sourcesContent":["import { themeGet } from \"@styled-system/theme-get\"\nimport { createGlobalStyle, css } from \"styled-components\"\n\n/**\n * Injects globally relevant styles, including helper classes for our Typography.\n * Apps that use palette should mount this component at the root of their tree.\n */\n// eslint-disable-next-line @typescript-eslint/ban-types\nexport function injectGlobalStyles<P extends object>(\n  additionalStyles?: string | ReturnType<typeof css>\n) {\n  const GlobalStyles = createGlobalStyle<P>`\n    html {\n      box-sizing: border-box;\n    }\n\n    *,\n    *::before,\n    *::after {\n      box-sizing: inherit;\n    }\n\n    &:focus {\n      outline: 0;\n    }\n\n    &:focus-visible {\n      outline: 1px solid ${themeGet(\"colors.blue100\")};\n    }\n\n    ::selection {\n      background-color: ${themeGet(\"colors.blue15\")};\n      color: ${themeGet(\"colors.black100\")};\n    }\n\n    html,\n    body,\n    #root {\n      -webkit-tap-highlight-color: transparent;\n      height: 100%;\n    }\n\n    body {\n      margin: 0;\n      padding: 0;\n    }\n\n    html, body {\n      font-family: ${themeGet(\"fonts.sans\")};\n      font-size: ${themeGet(\"textVariants.sm.fontSize\")};\n      line-height: ${themeGet(\"textVariants.sm.lineHeight\")};\n      background-color: ${themeGet(\"colors.white100\")};\n      color: ${themeGet(\"colors.black100\")};\n      -webkit-font-smoothing: antialiased;\n      -moz-osx-font-smoothing: grayscale;\n      text-rendering: optimizeLegibility;\n    }\n\n    a {\n      cursor: pointer;\n      color: inherit;\n      transition: color 0.25s;\n      text-decoration: underline;\n\n      &:hover {\n        color: ${themeGet(\"colors.black100\")};\n      }\n\n      &:active {\n        color: ${themeGet(\"colors.black100\")};\n      }\n    }\n\n    h1,\n    h2,\n    h3,\n    h4,\n    h5,\n    h6 {\n      font-style: inherit;\n      font-family: inherit;\n      font-weight: inherit;\n      font-size: inherit;\n      margin: 0;\n    }\n\n    dl,\n    dt,\n    dd {\n      margin: 0;\n    }\n\n    ol,\n    ul {\n      list-style: none;\n      margin: 0;\n      padding: 0;\n    }\n\n    ${additionalStyles};\n  `\n\n  GlobalStyles.displayName = \"GlobalStyles\"\n\n  return {\n    GlobalStyles,\n  }\n}\n"],"mappings":";;;;;;AAAA,IAAAA,SAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAD,OAAA;AAEA;AACA;AACA;AACA;AACA;AACO,SAASE,kBAAkBA,CAChCC,gBAAkD,EAClD;EACA,IAAMC,YAAY,OAAGC,mCAAiB,6vBAgBb,IAAAC,kBAAQ,EAAC,gBAAgB,CAAC,EAI3B,IAAAA,kBAAQ,EAAC,eAAe,CAAC,EACpC,IAAAA,kBAAQ,EAAC,iBAAiB,CAAC,EAgBrB,IAAAA,kBAAQ,EAAC,YAAY,CAAC,EACxB,IAAAA,kBAAQ,EAAC,0BAA0B,CAAC,EAClC,IAAAA,kBAAQ,EAAC,4BAA4B,CAAC,EACjC,IAAAA,kBAAQ,EAAC,iBAAiB,CAAC,EACtC,IAAAA,kBAAQ,EAAC,iBAAiB,CAAC,EAazB,IAAAA,kBAAQ,EAAC,iBAAiB,CAAC,EAI3B,IAAAA,kBAAQ,EAAC,iBAAiB,CAAC,EA8BtCH,gBAAgB,CACnB;EAEDC,YAAY,CAACG,WAAW,GAAG,cAAc;EAEzC,OAAO;IACLH,YAAY,EAAZA;EACF,CAAC;AACH"}

package/dist/helpers/visuallyDisableScrollbar.d.ts

@@ -1,4 +1,4 @@
 /**
  * Mixin that disables the scrollbar
  */
-export declare const visuallyDisableScrollbar: import("styled-components").InterpolationValue[];
+export declare const visuallyDisableScrollbar: import("styled-components").RuleSet<object>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@artsy/palette",
-  "version": "38.15.0",
+  "version": "39.0.0",
   "description": "Design system library for react components",
   "main": "dist/index.js",
   "publishConfig": {
@@ -41,7 +41,7 @@
   "peerDependencies": {
     "react": "^16.2.0",
     "react-dom": "^16.2.0",
-    "styled-components": "^4"
+    "styled-components": "^6"
   },
   "devDependencies": {
     "@artsy/auto-config": "1.2.0",
@@ -71,7 +71,6 @@
     "@types/react-lazy-load-image-component": "1.3.0",
     "@types/react-test-renderer": "16.8.1",
     "@types/semver": "5.5.0",
-    "@types/styled-components": "4.0.3",
     "@types/styled-system": "5.1.9",
     "@types/styled-system__theme-get": "5.0.0",
     "@typescript-eslint/eslint-plugin": "^4.31.1",
@@ -82,7 +81,7 @@
     "babel-loader": "8.2.2",
     "babel-plugin-add-react-displayname": "0.0.5",
     "babel-plugin-module-resolver": "4.1.0",
-    "babel-plugin-styled-components": "1.12.0",
+    "babel-plugin-styled-components": "2.1.4",
     "cache-loader": "3.0.0",
     "chromatic": "5.9.2",
     "concurrently": "3.6.1",
@@ -97,7 +96,7 @@
     "husky": "2.1.0",
     "jest": "^28.0.0",
     "jest-environment-jsdom": "^29.5.0",
-    "jest-styled-components": "7.0.0-2",
+    "jest-styled-components": "7.2.0",
     "lint-staged": "8.1.5",
     "mock-raf": "1.0.1",
     "nodemon": "^2.0.22",
@@ -110,7 +109,7 @@
     "simple-progress-webpack-plugin": "1.1.2",
     "static-extend": "0.1.2",
     "storybook-states": "1.2.0",
-    "styled-components": "4.3.2",
+    "styled-components": "6.1.13",
     "ts-node": "8.1.0",
     "typescript": "4.7.4",
     "typescript-styled-plugin": "0.10.0",
@@ -182,5 +181,5 @@
       "url": "http://localhost"
     }
   },
-  "gitHead": "e2ca9bf9b5b06d77e67678531b228cb089fe6d79"
+  "gitHead": "3bfdf8b1625044b942af28b940bb0c2ba4f7da0d"
 }