Skip to content

Commit

Permalink
chore: remove safari <14.1 styles and logic
Browse files Browse the repository at this point in the history
  • Loading branch information
@DSil
DSil committed Oct 9, 2024
1 parent d6c98e2 commit e3ca018
Show file tree
Hide file tree
Showing 4 changed files with 111 additions and 437 deletions.
211 changes: 105 additions & 106 deletions packages/orbit-components/src/Inline/helpers.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,81 +3,80 @@ import type { MediaQuery } from "./types";
import { getJustifyClasses, getAlignItemsClasses } from "../common/tailwind";
import { QUERIES } from "../utils/mediaQuery";

// TODO refactor to gap once we no longer support iOS Safari < 14.5
const spacingClasses: {
[K in QUERIES | SPACINGS | DEPRECATED_SPACINGS]: K extends QUERIES
? Record<SPACINGS | DEPRECATED_SPACINGS, string>
: string;
} = {
[SPACINGS.NONE]: "",
[SPACINGS.FIFTY]: "-mt-50 -ms-50 *:mt-50 *:ms-50",
[SPACINGS.ONE_HUNDRED]: "-mt-100 -ms-100 *:mt-100 *:ms-100",
[SPACINGS.ONE_HUNDRED_FIFTY]: "-mt-150 -ms-150 *:mt-150 *:ms-150",
[SPACINGS.TWO_HUNDRED]: "-mt-200 -ms-200 *:mt-200 *:ms-200",
[SPACINGS.THREE_HUNDRED]: "-mt-300 -ms-300 *:mt-300 *:ms-300",
[SPACINGS.FOUR_HUNDRED]: "-mt-400 -ms-400 *:mt-400 *:ms-400",
[SPACINGS.FIVE_HUNDRED]: "-mt-500 -ms-500 *:mt-500 *:ms-500",
[SPACINGS.SIX_HUNDRED]: "-mt-600 -ms-600 *:mt-600 *:ms-600",
[SPACINGS.EIGHT_HUNDRED]: "-mt-800 -ms-800 *:mt-800 *:ms-800",
[SPACINGS.ONE_THOUSAND]: "-mt-1000 -ms-1000 *:mt-1000 *:ms-1000",
[SPACINGS.ONE_THOUSAND_TWO_HUNDRED]: "-mt-1200 -ms-1200 *:mt-1200 *:ms-1200",
[SPACINGS.ONE_THOUSAND_SIX_HUNDRED]: "-mt-1600 -ms-1600 *:mt-1600 *:ms-1600",
[DEPRECATED_SPACINGS.XXXSMALL]: "-mt-50 -ms-50 *:mt-50 *:ms-50", // deprecated
[DEPRECATED_SPACINGS.XXSMALL]: "-mt-100 -ms-100 *:mt-100 *:ms-100", // deprecated
[DEPRECATED_SPACINGS.XSMALL]: "-mt-200 -ms-200 *:mt-200 *:ms-200", // deprecated
[DEPRECATED_SPACINGS.SMALL]: "-mt-300 -ms-300 *:mt-300 *:ms-300", // deprecated
[DEPRECATED_SPACINGS.MEDIUM]: "-mt-400 -ms-400 *:mt-400 *:ms-400", // deprecated
[DEPRECATED_SPACINGS.LARGE]: "-mt-600 -ms-600 *:mt-600 *:ms-600", // deprecated
[DEPRECATED_SPACINGS.XLARGE]: "-mt-800 -ms-800 *:mt-800 *:ms-800", // deprecated
[DEPRECATED_SPACINGS.XXLARGE]: "-mt-1000 -ms-1000 *:mt-1000 *:ms-1000", // deprecated
[DEPRECATED_SPACINGS.XXXLARGE]: "-mt-[52px] -ms-[52px] *:mt-[52px] *:ms-[52px]", // deprecated
[SPACINGS.FIFTY]: "gap-50",
[SPACINGS.ONE_HUNDRED]: "gap-100",
[SPACINGS.ONE_HUNDRED_FIFTY]: "gap-150",
[SPACINGS.TWO_HUNDRED]: "gap-200",
[SPACINGS.THREE_HUNDRED]: "gap-300",
[SPACINGS.FOUR_HUNDRED]: "gap-400",
[SPACINGS.FIVE_HUNDRED]: "gap-500",
[SPACINGS.SIX_HUNDRED]: "gap-600",
[SPACINGS.EIGHT_HUNDRED]: "gap-800",
[SPACINGS.ONE_THOUSAND]: "gap-1000",
[SPACINGS.ONE_THOUSAND_TWO_HUNDRED]: "gap-1200",
[SPACINGS.ONE_THOUSAND_SIX_HUNDRED]: "gap-1600",
[DEPRECATED_SPACINGS.XXXSMALL]: "gap-50", // deprecated
[DEPRECATED_SPACINGS.XXSMALL]: "gap-100", // deprecated
[DEPRECATED_SPACINGS.XSMALL]: "gap-200", // deprecated
[DEPRECATED_SPACINGS.SMALL]: "gap-300", // deprecated
[DEPRECATED_SPACINGS.MEDIUM]: "gap-400", // deprecated
[DEPRECATED_SPACINGS.LARGE]: "gap-600", // deprecated
[DEPRECATED_SPACINGS.XLARGE]: "gap-800", // deprecated
[DEPRECATED_SPACINGS.XXLARGE]: "gap-1000", // deprecated
[DEPRECATED_SPACINGS.XXXLARGE]: "gap-[52px]", // deprecated
[QUERIES.LARGEDESKTOP]: {
[SPACINGS.NONE]: "",
[SPACINGS.FIFTY]: "ld:-mt-50 ld:-ms-50 ld:*:mt-50 ld:*:ms-50",
[SPACINGS.ONE_HUNDRED]: "ld:-mt-100 ld:-ms-100 ld:*:mt-100 ld:*:ms-100",
[SPACINGS.ONE_HUNDRED_FIFTY]: "ld:-mt-150 ld:-ms-150 ld:*:mt-150 ld:*:ms-150",
[SPACINGS.TWO_HUNDRED]: "ld:-mt-200 ld:-ms-200 ld:*:mt-200 ld:*:ms-200",
[SPACINGS.THREE_HUNDRED]: "ld:-mt-300 ld:-ms-300 ld:*:mt-300 ld:*:ms-300",
[SPACINGS.FOUR_HUNDRED]: "ld:-mt-400 ld:-ms-400 ld:*:mt-400 ld:*:ms-400",
[SPACINGS.FIVE_HUNDRED]: "ld:-mt-500 ld:-ms-500 ld:*:mt-500 ld:*:ms-500",
[SPACINGS.SIX_HUNDRED]: "ld:-mt-600 ld:-ms-600 ld:*:mt-600 ld:*:ms-600",
[SPACINGS.EIGHT_HUNDRED]: "ld:-mt-800 ld:-ms-800 ld:*:mt-800 ld:*:ms-800",
[SPACINGS.ONE_THOUSAND]: "ld:-mt-1000 ld:-ms-1000 ld:*:mt-1000 ld:*:ms-1000",
[SPACINGS.ONE_THOUSAND_TWO_HUNDRED]: "ld:-mt-1200 ld:-ms-1200 ld:*:mt-1200 ld:*:ms-1200",
[SPACINGS.ONE_THOUSAND_SIX_HUNDRED]: "ld:-mt-1600 ld:-ms-1600 ld:*:mt-1600 ld:*:ms-1600",
[DEPRECATED_SPACINGS.XXXSMALL]: "ld:-mt-50 ld:-ms-50 ld:*:mt-50 ld:*:ms-50", // deprecated
[DEPRECATED_SPACINGS.XXSMALL]: "ld:-mt-100 ld:-ms-100 ld:*:mt-100 ld:*:ms-100", // deprecated
[DEPRECATED_SPACINGS.XSMALL]: "ld:-mt-200 ld:-ms-200 ld:*:mt-200 ld:*:ms-200", // deprecated
[DEPRECATED_SPACINGS.SMALL]: "ld:-mt-300 ld:-ms-300 ld:*:mt-300 ld:*:ms-300", // deprecated
[DEPRECATED_SPACINGS.MEDIUM]: "ld:-mt-400 ld:-ms-400 ld:*:mt-400 ld:*:ms-400", // deprecated
[DEPRECATED_SPACINGS.LARGE]: "ld:-mt-600 ld:-ms-600 ld:*:mt-600 ld:*:ms-600", // deprecated
[DEPRECATED_SPACINGS.XLARGE]: "ld:-mt-800 ld:-ms-800 ld:*:mt-800 ld:*:ms-800", // deprecated
[DEPRECATED_SPACINGS.XXLARGE]: "ld:-mt-1000 ld:-ms-1000 ld:*:mt-1000 ld:*:ms-1000", // deprecated
[DEPRECATED_SPACINGS.XXXLARGE]: "ld:-mt-[52px] ld:-ms-[52px] ld:*:mt-[52px] ld:*:ms-[52px]", // deprecated
[SPACINGS.FIFTY]: "ld:gap-50",
[SPACINGS.ONE_HUNDRED]: "ld:gap-100",
[SPACINGS.ONE_HUNDRED_FIFTY]: "ld:gap-150",
[SPACINGS.TWO_HUNDRED]: "ld:gap-200",
[SPACINGS.THREE_HUNDRED]: "ld:gap-300",
[SPACINGS.FOUR_HUNDRED]: "ld:gap-400",
[SPACINGS.FIVE_HUNDRED]: "ld:gap-500",
[SPACINGS.SIX_HUNDRED]: "ld:gap-600",
[SPACINGS.EIGHT_HUNDRED]: "ld:gap-800",
[SPACINGS.ONE_THOUSAND]: "ld:gap-1000",
[SPACINGS.ONE_THOUSAND_TWO_HUNDRED]: "ld:gap-1200",
[SPACINGS.ONE_THOUSAND_SIX_HUNDRED]: "ld:gap-1600",
[DEPRECATED_SPACINGS.XXXSMALL]: "ld:gap-50", // deprecated
[DEPRECATED_SPACINGS.XXSMALL]: "ld:gap-100", // deprecated
[DEPRECATED_SPACINGS.XSMALL]: "ld:gap-200", // deprecated
[DEPRECATED_SPACINGS.SMALL]: "ld:gap-300", // deprecated
[DEPRECATED_SPACINGS.MEDIUM]: "ld:gap-400", // deprecated
[DEPRECATED_SPACINGS.LARGE]: "ld:gap-600", // deprecated
[DEPRECATED_SPACINGS.XLARGE]: "ld:gap-800", // deprecated
[DEPRECATED_SPACINGS.XXLARGE]: "ld:gap-1000", // deprecated
[DEPRECATED_SPACINGS.XXXLARGE]: "ld:gap-[52px]", // deprecated
},
[QUERIES.DESKTOP]: {
[SPACINGS.NONE]: "",
[SPACINGS.FIFTY]: "de:-mt-50 de:-ms-50 de:*:mt-50 de:*:ms-50",
[SPACINGS.ONE_HUNDRED]: "de:-mt-100 de:-ms-100 de:*:mt-100 de:*:ms-100",
[SPACINGS.ONE_HUNDRED_FIFTY]: "de:-mt-150 de:-ms-150 de:*:mt-150 de:*:ms-150",
[SPACINGS.TWO_HUNDRED]: "de:-mt-200 de:-ms-200 de:*:mt-200 de:*:ms-200",
[SPACINGS.THREE_HUNDRED]: "de:-mt-300 de:-ms-300 de:*:mt-300 de:*:ms-300",
[SPACINGS.FOUR_HUNDRED]: "de:-mt-400 de:-ms-400 de:*:mt-400 de:*:ms-400",
[SPACINGS.FIVE_HUNDRED]: "de:-mt-500 de:-ms-500 de:*:mt-500 de:*:ms-500",
[SPACINGS.SIX_HUNDRED]: "de:-mt-600 de:-ms-600 de:*:mt-600 de:*:ms-600",
[SPACINGS.EIGHT_HUNDRED]: "de:-mt-800 de:-ms-800 de:*:mt-800 de:*:ms-800",
[SPACINGS.ONE_THOUSAND]: "de:-mt-1000 de:-ms-1000 de:*:mt-1000 de:*:ms-1000",
[SPACINGS.ONE_THOUSAND_TWO_HUNDRED]: "de:-mt-1200 de:-ms-1200 de:*:mt-1200 de:*:ms-1200",
[SPACINGS.ONE_THOUSAND_SIX_HUNDRED]: "de:-mt-1600 de:-ms-1600 de:*:mt-1600 de:*:ms-1600",
[DEPRECATED_SPACINGS.XXXSMALL]: "de:-mt-50 de:-ms-50 de:*:mt-50 de:*:ms-50", // deprecated
[DEPRECATED_SPACINGS.XXSMALL]: "de:-mt-100 de:-ms-100 de:*:mt-100 de:*:ms-100", // deprecated
[DEPRECATED_SPACINGS.XSMALL]: "de:-mt-200 de:-ms-200 de:*:mt-200 de:*:ms-200", // deprecated
[DEPRECATED_SPACINGS.SMALL]: "de:-mt-300 de:-ms-300 de:*:mt-300 de:*:ms-300", // deprecated
[DEPRECATED_SPACINGS.MEDIUM]: "de:-mt-400 de:-ms-400 de:*:mt-400 de:*:ms-400", // deprecated
[DEPRECATED_SPACINGS.LARGE]: "de:-mt-600 de:-ms-600 de:*:mt-600 de:*:ms-600", // deprecated
[DEPRECATED_SPACINGS.XLARGE]: "de:-mt-800 de:-ms-800 de:*:mt-800 de:*:ms-800", // deprecated
[DEPRECATED_SPACINGS.XXLARGE]: "de:-mt-1000 de:-ms-1000 de:*:mt-1000 de:*:ms-1000", // deprecated
[DEPRECATED_SPACINGS.XXXLARGE]: "de:-mt-[52px] de:-ms-[52px] de:*:mt-[52px] de:*:ms-[52px]", // deprecated
[SPACINGS.FIFTY]: "de:gap-50",
[SPACINGS.ONE_HUNDRED]: "de:gap-100",
[SPACINGS.ONE_HUNDRED_FIFTY]: "de:gap-150",
[SPACINGS.TWO_HUNDRED]: "de:gap-200",
[SPACINGS.THREE_HUNDRED]: "de:gap-300",
[SPACINGS.FOUR_HUNDRED]: "de:gap-400",
[SPACINGS.FIVE_HUNDRED]: "de:gap-500",
[SPACINGS.SIX_HUNDRED]: "de:gap-600",
[SPACINGS.EIGHT_HUNDRED]: "de:gap-800",
[SPACINGS.ONE_THOUSAND]: "de:gap-1000",
[SPACINGS.ONE_THOUSAND_TWO_HUNDRED]: "de:gap-1200",
[SPACINGS.ONE_THOUSAND_SIX_HUNDRED]: "de:gap-1600",
[DEPRECATED_SPACINGS.XXXSMALL]: "de:gap-50", // deprecated
[DEPRECATED_SPACINGS.XXSMALL]: "de:gap-100", // deprecated
[DEPRECATED_SPACINGS.XSMALL]: "de:gap-200", // deprecated
[DEPRECATED_SPACINGS.SMALL]: "de:gap-300", // deprecated
[DEPRECATED_SPACINGS.MEDIUM]: "de:gap-400", // deprecated
[DEPRECATED_SPACINGS.LARGE]: "de:gap-600", // deprecated
[DEPRECATED_SPACINGS.XLARGE]: "de:gap-800", // deprecated
[DEPRECATED_SPACINGS.XXLARGE]: "de:gap-1000", // deprecated
[DEPRECATED_SPACINGS.XXXLARGE]: "de:gap-[52px]", // deprecated
},
[QUERIES.TABLET]: {
[SPACINGS.NONE]: "",
Expand Down Expand Up @@ -105,51 +104,51 @@ const spacingClasses: {
},
[QUERIES.LARGEMOBILE]: {
[SPACINGS.NONE]: "",
[SPACINGS.FIFTY]: "lm:-mt-50 lm:-ms-50 lm:*:mt-50 lm:*:ms-50",
[SPACINGS.ONE_HUNDRED]: "lm:-mt-100 lm:-ms-100 lm:*:mt-100 lm:*:ms-100",
[SPACINGS.ONE_HUNDRED_FIFTY]: "lm:-mt-150 lm:-ms-150 lm:*:mt-150 lm:*:ms-150",
[SPACINGS.TWO_HUNDRED]: "lm:-mt-200 lm:-ms-200 lm:*:mt-200 lm:*:ms-200",
[SPACINGS.THREE_HUNDRED]: "lm:-mt-300 lm:-ms-300 lm:*:mt-300 lm:*:ms-300",
[SPACINGS.FOUR_HUNDRED]: "lm:-mt-400 lm:-ms-400 lm:*:mt-400 lm:*:ms-400",
[SPACINGS.FIVE_HUNDRED]: "lm:-mt-500 lm:-ms-500 lm:*:mt-500 lm:*:ms-500",
[SPACINGS.SIX_HUNDRED]: "lm:-mt-600 lm:-ms-600 lm:*:mt-600 lm:*:ms-600",
[SPACINGS.EIGHT_HUNDRED]: "lm:-mt-800 lm:-ms-800 lm:*:mt-800 lm:*:ms-800",
[SPACINGS.ONE_THOUSAND]: "lm:-mt-1000 lm:-ms-1000 lm:*:mt-1000 lm:*:ms-1000",
[SPACINGS.ONE_THOUSAND_TWO_HUNDRED]: "lm:-mt-1200 lm:-ms-1200 lm:*:mt-1200 lm:*:ms-1200",
[SPACINGS.ONE_THOUSAND_SIX_HUNDRED]: "lm:-mt-1600 lm:-ms-1600 lm:*:mt-1600 lm:*:ms-1600",
[DEPRECATED_SPACINGS.XXXSMALL]: "lm:-mt-50 lm:-ms-50 lm:*:mt-50 lm:*:ms-50", // deprecated
[DEPRECATED_SPACINGS.XXSMALL]: "lm:-mt-100 lm:-ms-100 lm:*:mt-100 lm:*:ms-100", // deprecated
[DEPRECATED_SPACINGS.XSMALL]: "lm:-mt-200 lm:-ms-200 lm:*:mt-200 lm:*:ms-200", // deprecated
[DEPRECATED_SPACINGS.SMALL]: "lm:-mt-300 lm:-ms-300 lm:*:mt-300 lm:*:ms-300", // deprecated
[DEPRECATED_SPACINGS.MEDIUM]: "lm:-mt-400 lm:-ms-400 lm:*:mt-400 lm:*:ms-400", // deprecated
[DEPRECATED_SPACINGS.LARGE]: "lm:-mt-600 lm:-ms-600 lm:*:mt-600 lm:*:ms-600", // deprecated
[DEPRECATED_SPACINGS.XLARGE]: "lm:-mt-800 lm:-ms-800 lm:*:mt-800 lm:*:ms-800", // deprecated
[DEPRECATED_SPACINGS.XXLARGE]: "lm:-mt-1000 lm:-ms-1000 lm:*:mt-1000 lm:*:ms-1000", // deprecated
[DEPRECATED_SPACINGS.XXXLARGE]: "lm:-mt-[52px] lm:-ms-[52px] lm:*:mt-[52px] lm:*:ms-[52px]", // deprecated
[SPACINGS.FIFTY]: "lm:gap-50",
[SPACINGS.ONE_HUNDRED]: "lm:gap-100",
[SPACINGS.ONE_HUNDRED_FIFTY]: "lm:gap-150",
[SPACINGS.TWO_HUNDRED]: "lm:gap-200",
[SPACINGS.THREE_HUNDRED]: "lm:gap-300",
[SPACINGS.FOUR_HUNDRED]: "lm:gap-400",
[SPACINGS.FIVE_HUNDRED]: "lm:gap-500",
[SPACINGS.SIX_HUNDRED]: "lm:gap-600",
[SPACINGS.EIGHT_HUNDRED]: "lm:gap-800",
[SPACINGS.ONE_THOUSAND]: "lm:gap-1000",
[SPACINGS.ONE_THOUSAND_TWO_HUNDRED]: "lm:gap-1200",
[SPACINGS.ONE_THOUSAND_SIX_HUNDRED]: "lm:gap-1600",
[DEPRECATED_SPACINGS.XXXSMALL]: "lm:gap-50", // deprecated
[DEPRECATED_SPACINGS.XXSMALL]: "lm:gap-100", // deprecated
[DEPRECATED_SPACINGS.XSMALL]: "lm:gap-200", // deprecated
[DEPRECATED_SPACINGS.SMALL]: "lm:gap-300", // deprecated
[DEPRECATED_SPACINGS.MEDIUM]: "lm:gap-400", // deprecated
[DEPRECATED_SPACINGS.LARGE]: "lm:gap-600", // deprecated
[DEPRECATED_SPACINGS.XLARGE]: "lm:gap-800", // deprecated
[DEPRECATED_SPACINGS.XXLARGE]: "lm:gap-1000", // deprecated
[DEPRECATED_SPACINGS.XXXLARGE]: "lm:gap-[52px]", // deprecated
},
[QUERIES.MEDIUMMOBILE]: {
[SPACINGS.NONE]: "",
[SPACINGS.FIFTY]: "mm:-mt-50 mm:-ms-50 mm:*:mt-50 mm:*:ms-50",
[SPACINGS.ONE_HUNDRED]: "mm:-mt-100 mm:-ms-100 mm:*:mt-100 mm:*:ms-100",
[SPACINGS.ONE_HUNDRED_FIFTY]: "mm:-mt-150 mm:-ms-150 mm:*:mt-150 mm:*:ms-150",
[SPACINGS.TWO_HUNDRED]: "mm:-mt-200 mm:-ms-200 mm:*:mt-200 mm:*:ms-200",
[SPACINGS.THREE_HUNDRED]: "mm:-mt-300 mm:-ms-300 mm:*:mt-300 mm:*:ms-300",
[SPACINGS.FOUR_HUNDRED]: "mm:-mt-400 mm:-ms-400 mm:*:mt-400 mm:*:ms-400",
[SPACINGS.FIVE_HUNDRED]: "mm:-mt-500 mm:-ms-500 mm:*:mt-500 mm:*:ms-500",
[SPACINGS.SIX_HUNDRED]: "mm:-mt-600 mm:-ms-600 mm:*:mt-600 mm:*:ms-600",
[SPACINGS.EIGHT_HUNDRED]: "mm:-mt-800 mm:-ms-800 mm:*:mt-800 mm:*:ms-800",
[SPACINGS.ONE_THOUSAND]: "mm:-mt-1000 mm:-ms-1000 mm:*:mt-1000 mm:*:ms-1000",
[SPACINGS.ONE_THOUSAND_TWO_HUNDRED]: "mm:-mt-1200 mm:-ms-1200 mm:*:mt-1200 mm:*:ms-1200",
[SPACINGS.ONE_THOUSAND_SIX_HUNDRED]: "mm:-mt-1600 mm:-ms-1600 mm:*:mt-1600 mm:*:ms-1600",
[DEPRECATED_SPACINGS.XXXSMALL]: "mm:-mt-50 mm:-ms-50 mm:*:mt-50 mm:*:ms-50", // deprecated
[DEPRECATED_SPACINGS.XXSMALL]: "mm:-mt-100 mm:-ms-100 mm:*:mt-100 mm:*:ms-100", // deprecated
[DEPRECATED_SPACINGS.XSMALL]: "mm:-mt-200 mm:-ms-200 mm:*:mt-200 mm:*:ms-200", // deprecated
[DEPRECATED_SPACINGS.SMALL]: "mm:-mt-300 mm:-ms-300 mm:*:mt-300 mm:*:ms-300", // deprecated
[DEPRECATED_SPACINGS.MEDIUM]: "mm:-mt-400 mm:-ms-400 mm:*:mt-400 mm:*:ms-400", // deprecated
[DEPRECATED_SPACINGS.LARGE]: "mm:-mt-600 mm:-ms-600 mm:*:mt-600 mm:*:ms-600", // deprecated
[DEPRECATED_SPACINGS.XLARGE]: "mm:-mt-800 mm:-ms-800 mm:*:mt-800 mm:*:ms-800", // deprecated
[DEPRECATED_SPACINGS.XXLARGE]: "mm:-mt-1000 mm:-ms-1000 mm:*:mt-1000 mm:*:ms-1000", // deprecated
[DEPRECATED_SPACINGS.XXXLARGE]: "mm:-mt-[52px] mm:-ms-[52px] mm:*:mt-[52px] mm:*:ms-[52px]", // deprecated
[SPACINGS.FIFTY]: "mm:gap-50",
[SPACINGS.ONE_HUNDRED]: "mm:gap-100",
[SPACINGS.ONE_HUNDRED_FIFTY]: "mm:gap-150",
[SPACINGS.TWO_HUNDRED]: "mm:gap-200",
[SPACINGS.THREE_HUNDRED]: "mm:gap-300",
[SPACINGS.FOUR_HUNDRED]: "mm:gap-400",
[SPACINGS.FIVE_HUNDRED]: "mm:gap-500",
[SPACINGS.SIX_HUNDRED]: "mm:gap-600",
[SPACINGS.EIGHT_HUNDRED]: "mm:gap-800",
[SPACINGS.ONE_THOUSAND]: "mm:gap-1000",
[SPACINGS.ONE_THOUSAND_TWO_HUNDRED]: "mm:gap-1200",
[SPACINGS.ONE_THOUSAND_SIX_HUNDRED]: "mm:gap-1600",
[DEPRECATED_SPACINGS.XXXSMALL]: "mm:gap-50", // deprecated
[DEPRECATED_SPACINGS.XXSMALL]: "mm:gap-100", // deprecated
[DEPRECATED_SPACINGS.XSMALL]: "mm:gap-200", // deprecated
[DEPRECATED_SPACINGS.SMALL]: "mm:gap-300", // deprecated
[DEPRECATED_SPACINGS.MEDIUM]: "mm:gap-400", // deprecated
[DEPRECATED_SPACINGS.LARGE]: "mm:gap-600", // deprecated
[DEPRECATED_SPACINGS.XLARGE]: "mm:gap-800", // deprecated
[DEPRECATED_SPACINGS.XXLARGE]: "mm:gap-1000", // deprecated
[DEPRECATED_SPACINGS.XXXLARGE]: "mm:gap-[52px]", // deprecated
},
};

Expand Down
4 changes: 1 addition & 3 deletions packages/orbit-components/src/Slider/components/Handle/index.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import * as React from "react";
import cx from "clsx";

import { left as leftRight } from "../../../utils/rtl";
import type { Value } from "../../types";
import useTheme from "../../../hooks/useTheme";

Expand Down Expand Up @@ -87,8 +86,7 @@ const Handle = ({
onTop && "z-20",
)}
style={{
// TODO use inset-inline-start once we don’t support ios_safari 14
[leftRight({ theme })]: `calc(${left}% - ${theme.orbit.space300})`,
insetInlineStart: `calc(${left}% - ${theme.orbit.space300})`,
}}
data-test={dataTest}
tabIndex={0}
Expand Down
Loading

0 comments on commit e3ca018

Please sign in to comment.