@wordpress/components 19.11.0 → 19.14.0

package/src/tree-select/stories/index.js

@@ -1,80 +0,0 @@
-/**
- * External dependencies
- */
-import { boolean, object, text } from '@storybook/addon-knobs';
-
-/**
- * WordPress dependencies
- */
-import { useState } from '@wordpress/element';
-
-/**
- * Internal dependencies
- */
-import TreeSelect from '../';
-
-export default {
-	title: 'Components/TreeSelect',
-	component: TreeSelect,
-	parameters: {
-		knobs: { disable: false },
-	},
-};
-
-const TreeSelectWithState = ( props ) => {
-	const [ selection, setSelection ] = useState();
-
-	return (
-		<TreeSelect
-			{ ...props }
-			onChange={ setSelection }
-			selectedId={ selection }
-		/>
-	);
-};
-
-export const _default = () => {
-	const label = text( 'Label', 'Label Text' );
-	const noOptionLabel = text( 'No Option Label', 'No parent page' );
-	const hideLabelFromVision = boolean( 'Hide Label From Vision', false );
-	const help = text(
-		'Help Text',
-		'Help text to explain the select control.'
-	);
-	const tree = object( 'Tree', [
-		{
-			name: 'Page 1',
-			id: 'p1',
-			children: [
-				{ name: 'Descend 1 of page 1', id: 'p11' },
-				{ name: 'Descend 2 of page 1', id: 'p12' },
-			],
-		},
-		{
-			name: 'Page 2',
-			id: 'p2',
-			children: [
-				{
-					name: 'Descend 1 of page 2',
-					id: 'p21',
-					children: [
-						{
-							name: 'Descend 1 of Descend 1 of page 2',
-							id: 'p211',
-						},
-					],
-				},
-			],
-		},
-	] );
-
-	return (
-		<TreeSelectWithState
-			label={ label }
-			noOptionLabel={ noOptionLabel }
-			hideLabelFromVision={ hideLabelFromVision }
-			help={ help }
-			tree={ tree }
-		/>
-	);
-};

package/src/truncate/stories/index.js

@@ -1,38 +0,0 @@
-/**
- * External dependencies
- */
-import { number } from '@storybook/addon-knobs';
-
-/**
- * Internal dependencies
- */
-import { Truncate } from '..';
-
-export default {
-	component: Truncate,
-	title: 'Components (Experimental)/Truncate',
-	parameters: {
-		knobs: { disable: false },
-	},
-};
-
-export const _default = () => {
-	const numberOfLines = number( 'numberOfLines', 2 );
-	return (
-		<Truncate numberOfLines={ numberOfLines }>
-			Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut
-			facilisis dictum tortor, eu tincidunt justo scelerisque tincidunt.
-			Duis semper dui id augue malesuada, ut feugiat nisi aliquam.
-			Vestibulum venenatis diam sem, finibus dictum massa semper in. Nulla
-			facilisi. Nunc vulputate faucibus diam, in lobortis arcu ornare vel.
-			In dignissim nunc sed facilisis finibus. Etiam imperdiet mattis
-			arcu, sed rutrum sapien blandit gravida. Aenean sollicitudin neque
-			eget enim blandit, sit amet rutrum leo vehicula. Nunc malesuada
-			ultricies eros ut faucibus. Aliquam erat volutpat. Nulla nec feugiat
-			risus. Vivamus iaculis dui aliquet ante ultricies feugiat.
-			Vestibulum ante ipsum primis in faucibus orci luctus et ultrices
-			posuere cubilia curae; Vivamus nec pretium velit, sit amet
-			consectetur ante. Praesent porttitor ex eget fermentum mattis.
-		</Truncate>
-	);
-};

package/src/utils/hooks/use-combined-ref.ts

@@ -1,28 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { useRef, useEffect } from '@wordpress/element';
-/**
- * External dependencies
- */
-import type { MutableRefObject, RefCallback } from 'react';
-
-type Ref< T > = MutableRefObject< T | null > | RefCallback< T | null >;
-
-export function useCombinedRef< T extends HTMLElement >( ...refs: Ref< T >[] ) {
-	const targetRef = useRef( null );
-
-	useEffect( () => {
-		refs.forEach( ( ref ) => {
-			if ( ! ref ) return;
-
-			if ( typeof ref === 'function' ) {
-				ref( targetRef.current );
-			} else {
-				ref.current = targetRef.current;
-			}
-		} );
-	}, [ refs ] );
-
-	return targetRef;
-}

package/src/z-stack/stories/index.js

@@ -1,70 +0,0 @@
-/**
- * External dependencies
- */
-import { boolean, number } from '@storybook/addon-knobs';
-
-/**
- * Internal dependencies
- */
-import { Elevation } from '../../elevation';
-import { HStack } from '../../h-stack';
-import { View } from '../../view';
-import { ZStack } from '..';
-
-export default {
-	component: ZStack,
-	title: 'Components (Experimental)/ZStack',
-	parameters: {
-		knobs: { disable: false },
-	},
-};
-
-const Avatar = ( { backgroundColor } ) => {
-	return (
-		<View>
-			<View
-				style={ {
-					border: '3px solid black',
-					borderRadius: '9999px',
-					height: '48px',
-					width: '48px',
-					backgroundColor,
-				} }
-			/>
-			<Elevation
-				borderRadius={ 9999 }
-				isInteractive={ false }
-				value={ 3 }
-			/>
-		</View>
-	);
-};
-
-const AnimatedAvatars = () => {
-	const props = {
-		offset: number( 'offset', 20 ),
-		isLayered: boolean( 'isLayered', true ),
-		isReversed: boolean( 'isReversed', false ),
-	};
-
-	return (
-		<HStack>
-			<View>
-				<ZStack { ...props }>
-					<Avatar backgroundColor="#444" />
-					<Avatar backgroundColor="#777" />
-					<Avatar backgroundColor="#aaa" />
-					<Avatar backgroundColor="#fff" />
-				</ZStack>
-			</View>
-		</HStack>
-	);
-};
-
-export const _default = () => {
-	return (
-		<View>
-			<AnimatedAvatars />
-		</View>
-	);
-};