Skip to content
This repository has been archived by the owner on Oct 19, 2021. It is now read-only.

feat(skeleton-states): Add Skeleton states #833

Merged
merged 20 commits into from
May 9, 2018
Merged

feat(skeleton-states): Add Skeleton states #833

merged 20 commits into from
May 9, 2018

Conversation

alisonjoseph
Copy link
Member

@alisonjoseph alisonjoseph commented Apr 24, 2018

Will need the updated styles from this PR in carbon-components carbon-design-system/carbon#713 to view

Ref https://github.ibm.com/carbon/issues/issues/614
Ref https://github.ibm.com/carbon/issues/issues/559

Add skeleton states

Testing / Reviewing

Staging url: http://carbon-storybook-interciliary-isooctane.stage1.mybluemix.net

Changelog

New Skeleton State Components

  • Skeleton Text
  • Button
  • Label
  • Textarea
  • Text input
  • Number input
  • Date Picker
  • Search
  • Radio Button
  • Checkbox
  • Data Table
  • Breadcrumb
  • Accordion
  • Code Snippet
  • Dropdown
  • Progress Indicator
  • Toggle
  • Small Toggle
  • Slider
  • Tag
  • Tabs
  • Pagination
  • Icon

@alisonjoseph alisonjoseph changed the title [WIP] feat(skeleton-states): Add Skeleton states DONT MERGE YET feat(skeleton-states): Add Skeleton states DONT MERGE YET(waiting on styles from carbon-components) Apr 30, 2018
@alisonjoseph alisonjoseph changed the title feat(skeleton-states): Add Skeleton states DONT MERGE YET(waiting on styles from carbon-components) feat(skeleton-states): Add Skeleton states May 7, 2018
Copy link
Contributor

@asudoh asudoh left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Amazing to see that you got it covered for all components in a short amount of time @alisonjoseph!! I’m thinking that it’s great to have a set of stories that transits from skeleton state to non-skeleton state (e.g. starting with skeleton state and then switches to non-skeleton state in 3 seconds), as IIUC a skeleton UI is a transient version of the corresponding non-skeleton UI. Thanks!

@alisonjoseph
Copy link
Member Author

@asudoh thats a great idea, would love some help/guidance on the best way to set that up in our storybook? I've also started this code sample that will be linked to from the docs on the website as one example on how to use this https://codesandbox.io/s/wq264y43k8 ("...loading" will be swapped out with a skeleton component once its ready)

Copy link
Contributor

@marijohannessen marijohannessen left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It looks so good! An example like Akira mentioned would be great to add in as well, but I am also okay with providing this on the website or in a separate PR. 👍 ✅ 🎉

routes:
- route: carbon-react-storybook.mybluemix.net
- route: react.carbondesignsystem.com
random-route: true
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Could you revert this one back after done testing with the staging URL? 🙂

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yep! good catch 👍

Copy link
Member

@tw15egan tw15egan left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

These look awesome! Nice work @alisonjoseph 🎉

@shinytoyrobots shinytoyrobots merged commit c033111 into carbon-design-system:master May 9, 2018
@carbon-bot
Copy link

🎉 This PR is included in version 5.49.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

7 participants