chore(dropindicator): update storybook prop to use length instead of …

…size (#3025)
adobe · Sep 19, 2024 · 1830942 · 1830942
1 parent 24f0734
commit 1830942
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 9 deletions.
diff --git a/components/dropindicator/stories/dropindicator.stories.js b/components/dropindicator/stories/dropindicator.stories.js
@@ -20,7 +20,7 @@ export default {
 			options: ["horizontal", "vertical"],
 			control: "select",
 		},
-		size: {
+		length: {
 			name: "Size",
 			description:
 				"Size of the drop indicator, requires a unit be provided; i.e., 200px or 100%.",
@@ -35,7 +35,7 @@ export default {
 	args: {
 		rootClass: "spectrum-DropIndicator",
 		direction: "vertical",
-		size: "300px",
+		length: "300px",
 	},
 	parameters: {
 		packageJson: pkgJson,
@@ -50,7 +50,7 @@ Default.tags = ["!autodocs"];
 export const DefaultGroup = DocsDropIndicatorGroup.bind({});
 DefaultGroup.storyName = "Default";
 DefaultGroup.tags = ["!dev"];
-DefaultGroup.parameters = { 
+DefaultGroup.parameters = {
 	chromatic: { disableSnapshot: true }
 };
 

diff --git a/components/dropindicator/stories/template.js b/components/dropindicator/stories/template.js
@@ -10,7 +10,7 @@ export const Template = ({
 	customClasses = [],
 	customStyles = {},
 	direction = "vertical",
-	size = "300px",
+	length = "300px",
 } = {}) => {
 	return html`
 		<div
@@ -20,8 +20,8 @@ export const Template = ({
 				...customClasses.reduce((a, c) => ({ ...a, [c]: true }), {}),
 			})}
 			style=${ifDefined(styleMap({
-				"block-size": direction == "vertical" ? size : undefined,
-				"inline-size": direction == "horizontal" ? size : undefined,
+				"block-size": direction == "vertical" ? length : undefined,
+				"inline-size": direction == "horizontal" ? length : undefined,
 				...customStyles,
 			}))}
 		></div>
@@ -35,9 +35,7 @@ export const DocsDropIndicatorGroup = (args, context) => html`
 		"gap": "16px",
 		"justify-content": "space-evenly",
 	})}>
-	${Template({
-			...args,
-		}, context)}
+	${Template(args, context)}
 		${Template({
 			...args,
 			direction: "horizontal",