Add excludedPropTypes as an option to info addon #3468
Conversation
andyo729
requested review from
dangreenisrael,
danielduan,
Hypnosphi,
theinterned,
usulpro and
z4o4z
as code owners
| } | ||
|
|
||
| return propDefinitions.filter( | ||
| propDefinition => !excludedPropTypes.includes(propDefinition.property) |
There was a problem hiding this comment.
You need to import a polyfill on top of this file:
import 'core-js/fn/array/includes';
See https://babeljs.io/docs/plugins/transform-runtime/
NOTE: Instance methods such as
"foobar".includes("foo")will not work since that would require modification of existing built-ins
There was a problem hiding this comment.
Pulled the polyfill into the PropTable
|
Please add a usage example to |
| @@ -331,7 +331,7 @@ class Story extends React.Component { | |||
| const array = Array.from(types.keys()); | |||
| array.sort((a, b) => getName(a) > getName(b)); | |||
|
|
|||
| const { maxPropObjectKeys, maxPropArrayLength, maxPropStringLength } = this.props; | |||
| const { maxPropObjectKeys, maxPropArrayLength, maxPropStringLength, excludedPropTypes } = this.props; | |||
There was a problem hiding this comment.
Do we have a place to document this?
There was a problem hiding this comment.
Added this new option to the README
Codecov Report
@@ Coverage Diff @@
## master #3468 +/- ##
==========================================
+ Coverage 37.42% 37.56% +0.14%
==========================================
Files 457 457
Lines 10304 10320 +16
Branches 906 907 +1
==========================================
+ Hits 3856 3877 +21
+ Misses 5910 5904 -6
- Partials 538 539 +1
Continue to review full report at Codecov.
|
| @@ -59,6 +59,14 @@ storiesOf('Addons|Info.Options.inline', module).add( | |||
| })(() => <BaseButton label="Button" />) | |||
| ); | |||
|
|
|||
| storiesOf('Addons|Info.Options.excludedPropTypes').add( | |||
There was a problem hiding this comment.
please don't forget adding second module parameter, this is needed for HMR
| @@ -1,5 +1,6 @@ | |||
| import PropTypes from 'prop-types'; | |||
| import React from 'react'; | |||
| import 'core-js/fn/array/includes'; | |||
There was a problem hiding this comment.
You need to add core-js as dependency to addons/info/package.json
yarn.lock
Outdated
| @@ -4058,6 +4058,10 @@ copy-webpack-plugin@~4.4.1: | |||
| p-limit "^1.0.0" | |||
| serialize-javascript "^1.4.0" | |||
|
|
|||
| core-js@2.5.5: | |||
| version "2.5.5" | |||
| resolved "http://npm.kroger.com/core-js/-/core-js-2.5.5.tgz#b14dde936c640c0579a6b50cabcc132dd6127e3b" | |||
There was a problem hiding this comment.
Looks like this is your private registry and other people can't install from there. You might need to add an empty .npmrc to project root (without commiting it), and run yarn again
There was a problem hiding this comment.
Thanks for pointing that out. This has been updated.
andyo729
force-pushed
the
feature/add-excluded-proptypes-to-with-info
branch
from
e4600cd
to
14a2888
Compare
andyo729
force-pushed
the
feature/add-excluded-proptypes-to-with-info
branch
from
14a2888
to
6286f12
Compare
There was a problem hiding this comment.
It doesn't seem to work: label prop is still shown in the table: https://deploy-preview-3468--storybooks-official.netlify.com/?selectedKind=Addons%7CInfo.Options.excludedPropTypes&selectedStory=Excludes%20propTypes%20that%20are%20in%20the%20excludedPropTypes%20array&full=0&addons=1&stories=1&panelRight=0&addonPanel=storybook%2Fstories%2Fstories-panel
…d-proptypes-to-with-info # Conflicts: # examples/official-storybook/stories/__snapshots__/addon-info.stories.storyshot
Issue: #3408
What I did
I updated the info addon to include an
excludedPropTypesoption to exclude those prop types from thePropTable.How to test
There are two new tests in
PropTable, one for the default behavior and another for the new filtering behavior.