@codecademy/gamut 67.6.4-alpha.94f59d.0 → 67.6.4-alpha.a08632.0

package/dist/Toggle/elements.d.ts

@@ -31,29 +31,53 @@ export declare const ToggleTrack: import("@emotion/styled").StyledComponent<{
     }>;
     px?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "padding";
-        readonly properties: readonly ["paddingLeft", "paddingRight"];
+        readonly properties: {
+            readonly physical: readonly ["paddingLeft", "paddingRight"];
+            readonly logical: readonly ["paddingInlineStart", "paddingInlineEnd"];
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
     py?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "padding";
-        readonly properties: readonly ["paddingTop", "paddingBottom"];
+        readonly properties: {
+            readonly physical: readonly ["paddingTop", "paddingBottom"];
+            readonly logical: readonly ["paddingBlockStart", "paddingBlockEnd"];
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
     pt?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: "paddingTop";
+        readonly property: {
+            readonly physical: "paddingTop";
+            readonly logical: "paddingBlockStart";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
     pb?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: "paddingBottom";
+        readonly property: {
+            readonly physical: "paddingBottom";
+            readonly logical: "paddingBlockEnd";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
     pr?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: "paddingRight";
+        readonly property: {
+            readonly physical: "paddingRight";
+            readonly logical: "paddingInlineEnd";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
     pl?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: "paddingLeft";
+        readonly property: {
+            readonly physical: "paddingLeft";
+            readonly logical: "paddingInlineStart";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
     m?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "margin";
@@ -61,29 +85,53 @@ export declare const ToggleTrack: import("@emotion/styled").StyledComponent<{
     }>;
     mx?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "margin";
-        readonly properties: readonly ["marginLeft", "marginRight"];
+        readonly properties: {
+            readonly physical: readonly ["marginLeft", "marginRight"];
+            readonly logical: readonly ["marginInlineStart", "marginInlineEnd"];
+        };
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
         readonly scale: "spacing";
     }>;
     my?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "margin";
-        readonly properties: readonly ["marginTop", "marginBottom"];
+        readonly properties: {
+            readonly physical: readonly ["marginTop", "marginBottom"];
+            readonly logical: readonly ["marginBlockStart", "marginBlockEnd"];
+        };
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
         readonly scale: "spacing";
     }>;
     mt?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: "marginTop";
+        readonly property: {
+            readonly physical: "marginTop";
+            readonly logical: "marginBlockStart";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
     mb?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: "marginBottom";
+        readonly property: {
+            readonly physical: "marginBottom";
+            readonly logical: "marginBlockEnd";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
     mr?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: "marginRight";
+        readonly property: {
+            readonly physical: "marginRight";
+            readonly logical: "marginInlineEnd";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
     ml?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: "marginLeft";
+        readonly property: {
+            readonly physical: "marginLeft";
+            readonly logical: "marginInlineStart";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
     textColor?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "color";
@@ -143,29 +191,53 @@ export declare const ToggleLabel: import("@emotion/styled").StyledComponent<{
     }>;
     px?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "padding";
-        readonly properties: readonly ["paddingLeft", "paddingRight"];
+        readonly properties: {
+            readonly physical: readonly ["paddingLeft", "paddingRight"];
+            readonly logical: readonly ["paddingInlineStart", "paddingInlineEnd"];
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
     py?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "padding";
-        readonly properties: readonly ["paddingTop", "paddingBottom"];
+        readonly properties: {
+            readonly physical: readonly ["paddingTop", "paddingBottom"];
+            readonly logical: readonly ["paddingBlockStart", "paddingBlockEnd"];
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
     pt?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: "paddingTop";
+        readonly property: {
+            readonly physical: "paddingTop";
+            readonly logical: "paddingBlockStart";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
     pb?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: "paddingBottom";
+        readonly property: {
+            readonly physical: "paddingBottom";
+            readonly logical: "paddingBlockEnd";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
     pr?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: "paddingRight";
+        readonly property: {
+            readonly physical: "paddingRight";
+            readonly logical: "paddingInlineEnd";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
     pl?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: "paddingLeft";
+        readonly property: {
+            readonly physical: "paddingLeft";
+            readonly logical: "paddingInlineStart";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
     m?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "margin";
@@ -173,28 +245,52 @@ export declare const ToggleLabel: import("@emotion/styled").StyledComponent<{
     }>;
     mx?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "margin";
-        readonly properties: readonly ["marginLeft", "marginRight"];
+        readonly properties: {
+            readonly physical: readonly ["marginLeft", "marginRight"];
+            readonly logical: readonly ["marginInlineStart", "marginInlineEnd"];
+        };
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
         readonly scale: "spacing";
     }>;
     my?: import("@codecademy/variance/dist/types/config").Scale<{
         readonly property: "margin";
-        readonly properties: readonly ["marginTop", "marginBottom"];
+        readonly properties: {
+            readonly physical: readonly ["marginTop", "marginBottom"];
+            readonly logical: readonly ["marginBlockStart", "marginBlockEnd"];
+        };
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
         readonly scale: "spacing";
     }>;
     mt?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: "marginTop";
+        readonly property: {
+            readonly physical: "marginTop";
+            readonly logical: "marginBlockStart";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
     mb?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: "marginBottom";
+        readonly property: {
+            readonly physical: "marginBottom";
+            readonly logical: "marginBlockEnd";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
     mr?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: "marginRight";
+        readonly property: {
+            readonly physical: "marginRight";
+            readonly logical: "marginInlineEnd";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
     ml?: import("@codecademy/variance/dist/types/config").Scale<{
-        readonly property: "marginLeft";
+        readonly property: {
+            readonly physical: "marginLeft";
+            readonly logical: "marginInlineStart";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     }>;
 }, import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, {}>;

package/dist/Typography/Text.d.ts

@@ -184,29 +184,53 @@ declare const textProps: import("@codecademy/variance/dist/types/config").Parser
     };
     readonly px: {
         readonly property: "padding";
-        readonly properties: readonly ["paddingLeft", "paddingRight"];
+        readonly properties: {
+            readonly physical: readonly ["paddingLeft", "paddingRight"];
+            readonly logical: readonly ["paddingInlineStart", "paddingInlineEnd"];
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     };
     readonly py: {
         readonly property: "padding";
-        readonly properties: readonly ["paddingTop", "paddingBottom"];
+        readonly properties: {
+            readonly physical: readonly ["paddingTop", "paddingBottom"];
+            readonly logical: readonly ["paddingBlockStart", "paddingBlockEnd"];
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     };
     readonly pt: {
-        readonly property: "paddingTop";
+        readonly property: {
+            readonly physical: "paddingTop";
+            readonly logical: "paddingBlockStart";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     };
     readonly pb: {
-        readonly property: "paddingBottom";
+        readonly property: {
+            readonly physical: "paddingBottom";
+            readonly logical: "paddingBlockEnd";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     };
     readonly pr: {
-        readonly property: "paddingRight";
+        readonly property: {
+            readonly physical: "paddingRight";
+            readonly logical: "paddingInlineEnd";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     };
     readonly pl: {
-        readonly property: "paddingLeft";
+        readonly property: {
+            readonly physical: "paddingLeft";
+            readonly logical: "paddingInlineStart";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     };
     readonly m: {
         readonly property: "margin";
@@ -214,29 +238,53 @@ declare const textProps: import("@codecademy/variance/dist/types/config").Parser
     };
     readonly mx: {
         readonly property: "margin";
-        readonly properties: readonly ["marginLeft", "marginRight"];
+        readonly properties: {
+            readonly physical: readonly ["marginLeft", "marginRight"];
+            readonly logical: readonly ["marginInlineStart", "marginInlineEnd"];
+        };
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
         readonly scale: "spacing";
     };
     readonly my: {
         readonly property: "margin";
-        readonly properties: readonly ["marginTop", "marginBottom"];
+        readonly properties: {
+            readonly physical: readonly ["marginTop", "marginBottom"];
+            readonly logical: readonly ["marginBlockStart", "marginBlockEnd"];
+        };
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
         readonly scale: "spacing";
     };
     readonly mt: {
-        readonly property: "marginTop";
+        readonly property: {
+            readonly physical: "marginTop";
+            readonly logical: "marginBlockStart";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     };
     readonly mb: {
-        readonly property: "marginBottom";
+        readonly property: {
+            readonly physical: "marginBottom";
+            readonly logical: "marginBlockEnd";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     };
     readonly mr: {
-        readonly property: "marginRight";
+        readonly property: {
+            readonly physical: "marginRight";
+            readonly logical: "marginInlineEnd";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     };
     readonly ml: {
-        readonly property: "marginLeft";
+        readonly property: {
+            readonly physical: "marginLeft";
+            readonly logical: "marginInlineStart";
+        };
         readonly scale: "spacing";
+        readonly resolveProperty: (useLogicalProperties: boolean) => import("@codecademy/variance/dist/types/properties").PropertyMode;
     };
 }>>, import("@codecademy/variance/dist/types/config").Parser<import("@codecademy/variance/dist/types/config").TransformerMap<{
     truncateLines: {

package/dist/index.d.ts

@@ -16,7 +16,6 @@ export * from './Coachmark';
 export * from './ConnectedForm';
 export * from './ContentContainer';
 export * from './DelayedRenderWrapper';
-export * from './DetailedCode';
 export * from './Disclosure';
 export * from './DataList';
 export * from './Drawer';

package/dist/index.js

@@ -15,7 +15,6 @@ export * from './Coachmark';
 export * from './ConnectedForm';
 export * from './ContentContainer';
 export * from './DelayedRenderWrapper';
-export * from './DetailedCode';
 export * from './Disclosure';
 export * from './DataList';
 export * from './Drawer';

package/package.json

@@ -1,14 +1,14 @@
 {
   "name": "@codecademy/gamut",
   "description": "Styleguide & Component library for Codecademy",
-  "version": "67.6.4-alpha.94f59d.0",
+  "version": "67.6.4-alpha.a08632.0",
   "author": "Codecademy Engineering <dev@codecademy.com>",
   "dependencies": {
-    "@codecademy/gamut-icons": "9.54.0",
-    "@codecademy/gamut-illustrations": "0.58.0",
-    "@codecademy/gamut-patterns": "0.10.19",
-    "@codecademy/gamut-styles": "17.11.0",
-    "@codecademy/variance": "0.25.0",
+    "@codecademy/gamut-icons": "9.54.1-alpha.a08632.0",
+    "@codecademy/gamut-illustrations": "0.58.1-alpha.a08632.0",
+    "@codecademy/gamut-patterns": "0.10.20-alpha.a08632.0",
+    "@codecademy/gamut-styles": "17.11.1-alpha.a08632.0",
+    "@codecademy/variance": "0.25.1-alpha.a08632.0",
     "@types/marked": "^4.0.8",
     "@vidstack/react": "^1.12.12",
     "classnames": "^2.2.5",
@@ -56,5 +56,5 @@
     "dist/**/[A-Z]**/[A-Z]*.js",
     "dist/**/[A-Z]**/index.js"
   ],
-  "gitHead": "8f14a84598d7d1990ab4c10ef32656ad37111eb5"
+  "gitHead": "bdb0f1e00dd0595f0fb2e61e131eedb0aa86f04d"
 }

package/dist/DetailedCode/DetailedCodeBody/index.d.ts

@@ -1,3 +0,0 @@
-import * as React from 'react';
-import { DetailedCodeBodyProps } from '../types';
-export declare const DetailedCodeBody: React.FC<DetailedCodeBodyProps>;

package/dist/DetailedCode/DetailedCodeBody/index.js

@@ -1,17 +0,0 @@
-import { Source } from '@storybook/blocks';
-import * as React from 'react';
-import { DetailedCodeBodyWrapper } from '../elements';
-import { jsx as _jsx } from "react/jsx-runtime";
-export const DetailedCodeBody = ({
-  code,
-  language
-}) => {
-  return /*#__PURE__*/_jsx(DetailedCodeBodyWrapper, {
-    column: true,
-    children: /*#__PURE__*/_jsx(Source, {
-      code: code,
-      dark: true,
-      language: language
-    })
-  });
-};

package/dist/DetailedCode/DetailedCodeButton/index.d.ts

@@ -1,3 +0,0 @@
-import * as React from 'react';
-import { DetailedCodeButtonProps } from '../types';
-export declare const DetailedCodeButton: React.FC<DetailedCodeButtonProps>;

package/dist/DetailedCode/DetailedCodeButton/index.js

@@ -1,65 +0,0 @@
-import { MiniChevronDownIcon } from '@codecademy/gamut-icons';
-import * as React from 'react';
-import { Rotation } from '../../Animation';
-import { Box, FlexBox } from '../../Box';
-import { Text } from '../../Typography';
-import { DetailedCodeButtonWrapper } from '../elements';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export const DetailedCodeButton = ({
-  heading,
-  isExpanded,
-  language,
-  setIsExpanded
-}) => {
-  const handleClick = () => {
-    if (setIsExpanded) {
-      setIsExpanded(prev => !prev);
-    }
-  };
-  return /*#__PURE__*/_jsx(FlexBox, {
-    children: /*#__PURE__*/_jsx(DetailedCodeButtonWrapper, {
-      "aria-expanded": isExpanded,
-      height: "100%",
-      px: 16,
-      py: 12,
-      variant: "interface",
-      width: "100%",
-      onClick: handleClick,
-      children: /*#__PURE__*/_jsxs(FlexBox, {
-        alignItems: "center",
-        columnGap: 16,
-        flexDirection: "row",
-        justifyContent: "space-between",
-        width: "100%",
-        children: [/*#__PURE__*/_jsxs(FlexBox, {
-          alignItems: "center",
-          columnGap: 12,
-          children: [heading && /*#__PURE__*/_jsx(Text, {
-            as: "h3",
-            fontWeight: "title",
-            p: 0,
-            textAlign: "start",
-            variant: "title-xs",
-            children: heading
-          }), /*#__PURE__*/_jsx(Text, {
-            color: "text-secondary",
-            fontFamily: "monospace",
-            variant: "p-small",
-            children: language
-          })]
-        }), /*#__PURE__*/_jsx(Box, {
-          p: 8,
-          children: /*#__PURE__*/_jsx(Rotation, {
-            height: 16,
-            rotated: isExpanded,
-            width: 16,
-            children: /*#__PURE__*/_jsx(MiniChevronDownIcon, {
-              "aria-hidden": true,
-              size: 16
-            })
-          })
-        })]
-      })
-    })
-  });
-};