@openedx/paragon 21.7.1 → 21.7.2

package/README.md

@@ -15,6 +15,14 @@ Documentation lives at https://paragon-openedx.netlify.app/.
 
 ## Getting Started
 
+### Getting Help
+
+Please reach out to the Paragon Working Group (PWG):
+
+* Open edX Slack ([request an invite](https://openedx.org/slack)): [#wg-paragon](https://openedx.slack.com/archives/C02NR285KV4)
+* [Github Issues](https://github.com/openedx/paragon/issues/new?template=blank-issue.md)
+* [Weekly PWG Meeting](https://calendar.google.com/calendar/embed?src=c_v86shrnegshsqgp4fj2k94u7bc%40group.calendar.google.com&ctz=America%2FNew_York)
+
 ### React Components
 
 Paragon components require React 16 or higher. To install Paragon into your project:
@@ -65,14 +73,6 @@ The Paragon CLI (Command Line Interface) is a tool that provides various utility
 
 Use `paragon help` to see more information.
 
-## Getting Help
-
-Please reach out to the Paragon Working Group (PWG):
-
-* Open edX Slack ([request an invite](https://openedx.org/slack)): [#wg-paragon](https://openedx.slack.com/archives/C02NR285KV4)
-* [Github Issues](https://github.com/openedx/paragon/issues/new?template=blank-issue.md)
-* [Weekly PWG Meeting](https://calendar.google.com/calendar/embed?src=c_v86shrnegshsqgp4fj2k94u7bc%40group.calendar.google.com&ctz=America%2FNew_York)
-
 ## Internationalization
 
 Paragon supports internationalization for its components out of the box with the support of [react-intl](https://formatjs.io/docs/react-intl/). You may view translated strings for each component on the documentation website by switching languages in the settings.

package/dist/Card/_variables.scss

@@ -29,7 +29,6 @@ $card-columns-gap:                   1.25rem !default;
 $card-columns-margin:                $card-spacer-y !default;
 
 $card-divider-bg:                    $light-400 !default;
-$card-divider-margin-y:              $card-spacer-y !default;
 
 $card-footer-actions-gap:            .5rem !default;
 

package/dist/Form/_index.scss

@@ -46,6 +46,20 @@ $select-icon-padding: .5625rem !default;
   flex-grow: 1;
   align-items: flex-start;
 
+  textarea {
+    &.form-control {
+      min-height: $input-height;
+    }
+
+    &.form-control-lg {
+      min-height: $input-height-lg;
+    }
+
+    &.form-control-sm {
+      min-height: $input-height-sm;
+    }
+  }
+
   @media (min-width: map-get($grid-breakpoints, "sm")) {
     margin-inline-end: $custom-control-gutter;
   }

package/dist/Nav/_variables.scss

@@ -56,4 +56,3 @@ $nav-inverse-tabs-link-active-bg:                  $nav-inverse-tabs-link-hover-
 $nav-inverse-tabs-link-active-border-bottom-width: $nav-tabs-border-width !default;
 $nav-inverse-tabs-tab-content-color:               $nav-inverse-tabs-link-color !default;
 $nav-inverse-tabs-dropdown-border-color:           $nav-inverse-tabs-link-active-hover-bg !default;
-$nav-inverse-tabs-dropdown-bottom-gap:             .4375rem !default;

package/dist/Pagination/_variables.scss

@@ -7,12 +7,9 @@ $pagination-padding-x-sm:           .6rem !default;
 $pagination-padding-y-lg:           .75rem !default;
 $pagination-padding-x-lg:           1.5rem !default;
 $pagination-margin-x:               .5rem !default;
-$pagination-margin-y:               .5rem !default;
 $pagination-line-height:            1.5rem !default;
 $pagination-font-size-sm:           .875rem !default;
 
-$pagination-icon-size:              1.375rem !default;
-$pagination-icon-size-sm:           1rem !default;
 $pagination-icon-width:             2.25rem !default;
 $pagination-icon-height:            2.25rem !default;
 $pagination-padding-icon:           .5rem !default;

package/dist/SearchField/_variables.scss

@@ -3,12 +3,10 @@ $search-btn-variants: (
   "dark":   $brand-500,
 );
 $search-border-radius:                0 !default;
-$search-line-height:                  1.5rem !default;
 $search-border-color:                 $gray-500 !default;
 $search-form-background-color:        $white !default;
 $search-border-color-interaction:     $black !default;
 $search-border-width:                 .0625rem !default;
-$search-border-width-interaction:     .125rem !default;
 $search-disabled-opacity:             .3 !default;
 $search-button-margin:                .5rem !default;
 $input-height-search:                 calc(#{$input-line-height * 1em} + #{$input-padding-y * 2}) !default;

package/dist/paragon.css

@@ -24,7 +24,13 @@
   1.3333em + 1.125rem + 2px
 );margin:0;overflow:hidden;opacity:0}.custom-file-input:focus~.custom-file-label{border-color:#0a3055;box-shadow:0 0 0 1px #0a3055}.custom-file-input[disabled]~.custom-file-label,.custom-file-input:disabled~.custom-file-label{background-color:#ebebeb}.custom-file-input:lang(en)~.custom-file-label::after{content:"Browse"}.custom-file-input~.custom-file-label[data-browse]::after{content:attr(data-browse)}.custom-file-label{position:absolute;top:0;right:0;left:0;z-index:1;height:calc(
   1.3333em + 1.125rem + 2px
-);padding:.5625rem 1rem;overflow:hidden;font-weight:400;line-height:1.3333;color:#454545;background-color:#fff;border:1px solid #707070;border-radius:.375rem}.custom-file-label::after{position:absolute;top:0;right:0;bottom:0;z-index:3;display:block;height:calc(1.3333em + 1.125rem);padding:.5625rem 1rem;line-height:1.3333;color:#454545;content:"Browse";background-color:#ebebeb;border-left:inherit;border-radius:0 .375rem .375rem 0}.custom-range{width:100%;height:calc(1rem + 2px);padding:0;background-color:rgba(0,0,0,0);appearance:none}.custom-range:focus{outline:0}.custom-range:focus::-webkit-slider-thumb{box-shadow:0 0 0 1px #fff,0 0 0 1px #0a3055}.custom-range:focus::-moz-range-thumb{box-shadow:0 0 0 1px #fff,0 0 0 1px #0a3055}.custom-range:focus::-ms-thumb{box-shadow:0 0 0 1px #fff,0 0 0 1px #0a3055}.custom-range::-moz-focus-outer{border:0}.custom-range::-webkit-slider-thumb{width:1rem;height:1rem;margin-top:-0.25rem;background-color:#0a3055;border:0;border-radius:1rem;transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;appearance:none}@media(prefers-reduced-motion: reduce){.custom-range::-webkit-slider-thumb{transition:none}}.custom-range::-webkit-slider-thumb:active{background-color:#2b8ae6}.custom-range::-webkit-slider-runnable-track{width:100%;height:.5rem;color:rgba(0,0,0,0);cursor:pointer;background-color:#adadad;border-color:rgba(0,0,0,0);border-radius:1rem}.custom-range::-moz-range-thumb{width:1rem;height:1rem;background-color:#0a3055;border:0;border-radius:1rem;transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;appearance:none}@media(prefers-reduced-motion: reduce){.custom-range::-moz-range-thumb{transition:none}}.custom-range::-moz-range-thumb:active{background-color:#2b8ae6}.custom-range::-moz-range-track{width:100%;height:.5rem;color:rgba(0,0,0,0);cursor:pointer;background-color:#adadad;border-color:rgba(0,0,0,0);border-radius:1rem}.custom-range::-ms-thumb{width:1rem;height:1rem;margin-top:0;margin-right:1px;margin-left:1px;background-color:#0a3055;border:0;border-radius:1rem;transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;appearance:none}@media(prefers-reduced-motion: reduce){.custom-range::-ms-thumb{transition:none}}.custom-range::-ms-thumb:active{background-color:#2b8ae6}.custom-range::-ms-track{width:100%;height:.5rem;color:rgba(0,0,0,0);cursor:pointer;background-color:rgba(0,0,0,0);border-color:rgba(0,0,0,0);border-width:.5rem}.custom-range::-ms-fill-lower{background-color:#adadad;border-radius:1rem}.custom-range::-ms-fill-upper{margin-right:15px;background-color:#adadad;border-radius:1rem}.custom-range:disabled::-webkit-slider-thumb{background-color:#707070}.custom-range:disabled::-webkit-slider-runnable-track{cursor:default}.custom-range:disabled::-moz-range-thumb{background-color:#707070}.custom-range:disabled::-moz-range-track{cursor:default}.custom-range:disabled::-ms-thumb{background-color:#707070}.custom-control-label::before,.custom-file-label,.custom-select{transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media(prefers-reduced-motion: reduce){.custom-control-label::before,.custom-file-label,.custom-select{transition:none}}.pgn__form-text{font-size:87.5%;display:flex;align-items:center}.pgn__form-text .pgn__icon{height:1em;margin-inline-end:.25em;width:1em;display:inline-block}.pgn__form-text~.pgn__form-text{margin-top:.25rem}.form-control+.pgn__form-text,.pgn__form-control-set+.pgn__form-text,.pgn__form-control-decorator-group+.pgn__form-text{margin-top:.25rem}.pgn__form-text-default{color:#707070}.pgn__form-text-valid{color:#178253}.pgn__form-text-invalid{color:#c32d3a}.pgn__form-text-warning{color:#212529}.pgn__form-text-criteria-empty .pgn__icon{color:#707070}.pgn__form-text-criteria-valid .pgn__icon{color:#178253}.pgn__form-text-criteria-invalid .pgn__icon{color:#c32d3a}.pgn__form-control-set{display:flex;align-items:flex-start;flex-direction:column}.pgn__form-control-set>*+*{margin:.75rem 0 0}.pgn__form-control-set-inline{flex-flow:row wrap;align-items:flex-start}.pgn__form-control-set-inline>*+*{margin:0 0 0 .5em}[dir=rtl] .pgn__form-control-set-inline>*{margin-left:.5em}.form-control.is-invalid.is-invalid-nodanger{border-color:#707070}.form-control.is-invalid.is-invalid-nodanger:focus{color:#454545;background-color:#fff;border-color:#0a3055;outline:0;box-shadow:0 0 0 1px #0a3055}.form-control:hover{border:solid 1px #1f3226}.pgn__form-group{margin-bottom:1rem;text-align:start}[dir=rtl] .pgn__form-group .form-check{padding-left:0;padding-right:1.25rem}[dir=rtl] .pgn__form-group .form-check .form-check-input{margin-left:0;margin-right:-1.25rem}.pgn__form-control-decorator-group{position:relative;display:flex;flex-grow:1;align-items:flex-start;font-size:1.125rem;line-height:1.3333}@media(min-width: 576px){.pgn__form-control-decorator-group{margin-inline-end:.5rem}}.pgn__form-control-decorator-group.has-prepended-node .form-control{padding-inline-start:calc(1rem + 32px)}[dir=rtl] .pgn__form-control-decorator-group.has-prepended-node .form-control{background-position:left .5625rem center}.pgn__form-control-decorator-group.has-prepended-node .form-control-lg{padding-inline-start:calc(1.25rem + 32px)}.pgn__form-control-decorator-group.has-prepended-node .form-control-sm{padding-inline-start:calc(0.75rem + 32px)}.pgn__form-control-decorator-group.has-appended-node .form-control{padding-inline-end:calc(1rem + 32px)}.pgn__form-control-decorator-group.has-appended-node .form-control-lg{padding-inline-end:calc(1.25rem + 32px)}.pgn__form-control-decorator-group.has-appended-node .form-control-sm{padding-inline-end:calc(0.75rem + 32px)}.pgn__form-control-decorator-group.pgn__form-control-decorator-group-sm{font-size:.875rem;line-height:1.4286}.pgn__form-control-decorator-group.pgn__form-control-decorator-group-lg{font-size:1.325rem;line-height:1.5}.pgn__form-control-decorator{position:absolute;pointer-events:none;height:calc(
+);padding:.5625rem 1rem;overflow:hidden;font-weight:400;line-height:1.3333;color:#454545;background-color:#fff;border:1px solid #707070;border-radius:.375rem}.custom-file-label::after{position:absolute;top:0;right:0;bottom:0;z-index:3;display:block;height:calc(1.3333em + 1.125rem);padding:.5625rem 1rem;line-height:1.3333;color:#454545;content:"Browse";background-color:#ebebeb;border-left:inherit;border-radius:0 .375rem .375rem 0}.custom-range{width:100%;height:calc(1rem + 2px);padding:0;background-color:rgba(0,0,0,0);appearance:none}.custom-range:focus{outline:0}.custom-range:focus::-webkit-slider-thumb{box-shadow:0 0 0 1px #fff,0 0 0 1px #0a3055}.custom-range:focus::-moz-range-thumb{box-shadow:0 0 0 1px #fff,0 0 0 1px #0a3055}.custom-range:focus::-ms-thumb{box-shadow:0 0 0 1px #fff,0 0 0 1px #0a3055}.custom-range::-moz-focus-outer{border:0}.custom-range::-webkit-slider-thumb{width:1rem;height:1rem;margin-top:-0.25rem;background-color:#0a3055;border:0;border-radius:1rem;transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;appearance:none}@media(prefers-reduced-motion: reduce){.custom-range::-webkit-slider-thumb{transition:none}}.custom-range::-webkit-slider-thumb:active{background-color:#2b8ae6}.custom-range::-webkit-slider-runnable-track{width:100%;height:.5rem;color:rgba(0,0,0,0);cursor:pointer;background-color:#adadad;border-color:rgba(0,0,0,0);border-radius:1rem}.custom-range::-moz-range-thumb{width:1rem;height:1rem;background-color:#0a3055;border:0;border-radius:1rem;transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;appearance:none}@media(prefers-reduced-motion: reduce){.custom-range::-moz-range-thumb{transition:none}}.custom-range::-moz-range-thumb:active{background-color:#2b8ae6}.custom-range::-moz-range-track{width:100%;height:.5rem;color:rgba(0,0,0,0);cursor:pointer;background-color:#adadad;border-color:rgba(0,0,0,0);border-radius:1rem}.custom-range::-ms-thumb{width:1rem;height:1rem;margin-top:0;margin-right:1px;margin-left:1px;background-color:#0a3055;border:0;border-radius:1rem;transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;appearance:none}@media(prefers-reduced-motion: reduce){.custom-range::-ms-thumb{transition:none}}.custom-range::-ms-thumb:active{background-color:#2b8ae6}.custom-range::-ms-track{width:100%;height:.5rem;color:rgba(0,0,0,0);cursor:pointer;background-color:rgba(0,0,0,0);border-color:rgba(0,0,0,0);border-width:.5rem}.custom-range::-ms-fill-lower{background-color:#adadad;border-radius:1rem}.custom-range::-ms-fill-upper{margin-right:15px;background-color:#adadad;border-radius:1rem}.custom-range:disabled::-webkit-slider-thumb{background-color:#707070}.custom-range:disabled::-webkit-slider-runnable-track{cursor:default}.custom-range:disabled::-moz-range-thumb{background-color:#707070}.custom-range:disabled::-moz-range-track{cursor:default}.custom-range:disabled::-ms-thumb{background-color:#707070}.custom-control-label::before,.custom-file-label,.custom-select{transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media(prefers-reduced-motion: reduce){.custom-control-label::before,.custom-file-label,.custom-select{transition:none}}.pgn__form-text{font-size:87.5%;display:flex;align-items:center}.pgn__form-text .pgn__icon{height:1em;margin-inline-end:.25em;width:1em;display:inline-block}.pgn__form-text~.pgn__form-text{margin-top:.25rem}.form-control+.pgn__form-text,.pgn__form-control-set+.pgn__form-text,.pgn__form-control-decorator-group+.pgn__form-text{margin-top:.25rem}.pgn__form-text-default{color:#707070}.pgn__form-text-valid{color:#178253}.pgn__form-text-invalid{color:#c32d3a}.pgn__form-text-warning{color:#212529}.pgn__form-text-criteria-empty .pgn__icon{color:#707070}.pgn__form-text-criteria-valid .pgn__icon{color:#178253}.pgn__form-text-criteria-invalid .pgn__icon{color:#c32d3a}.pgn__form-control-set{display:flex;align-items:flex-start;flex-direction:column}.pgn__form-control-set>*+*{margin:.75rem 0 0}.pgn__form-control-set-inline{flex-flow:row wrap;align-items:flex-start}.pgn__form-control-set-inline>*+*{margin:0 0 0 .5em}[dir=rtl] .pgn__form-control-set-inline>*{margin-left:.5em}.form-control.is-invalid.is-invalid-nodanger{border-color:#707070}.form-control.is-invalid.is-invalid-nodanger:focus{color:#454545;background-color:#fff;border-color:#0a3055;outline:0;box-shadow:0 0 0 1px #0a3055}.form-control:hover{border:solid 1px #1f3226}.pgn__form-group{margin-bottom:1rem;text-align:start}[dir=rtl] .pgn__form-group .form-check{padding-left:0;padding-right:1.25rem}[dir=rtl] .pgn__form-group .form-check .form-check-input{margin-left:0;margin-right:-1.25rem}.pgn__form-control-decorator-group{position:relative;display:flex;flex-grow:1;align-items:flex-start;font-size:1.125rem;line-height:1.3333}.pgn__form-control-decorator-group textarea.form-control{min-height:calc(
+  1.3333em + 1.125rem + 2px
+)}.pgn__form-control-decorator-group textarea.form-control-lg{min-height:calc(
+  1.5em + 1.375rem + 2px
+)}.pgn__form-control-decorator-group textarea.form-control-sm{min-height:calc(
+  1.4286em + 0.875rem + 2px
+)}@media(min-width: 576px){.pgn__form-control-decorator-group{margin-inline-end:.5rem}}.pgn__form-control-decorator-group.has-prepended-node .form-control{padding-inline-start:calc(1rem + 32px)}[dir=rtl] .pgn__form-control-decorator-group.has-prepended-node .form-control{background-position:left .5625rem center}.pgn__form-control-decorator-group.has-prepended-node .form-control-lg{padding-inline-start:calc(1.25rem + 32px)}.pgn__form-control-decorator-group.has-prepended-node .form-control-sm{padding-inline-start:calc(0.75rem + 32px)}.pgn__form-control-decorator-group.has-appended-node .form-control{padding-inline-end:calc(1rem + 32px)}.pgn__form-control-decorator-group.has-appended-node .form-control-lg{padding-inline-end:calc(1.25rem + 32px)}.pgn__form-control-decorator-group.has-appended-node .form-control-sm{padding-inline-end:calc(0.75rem + 32px)}.pgn__form-control-decorator-group.pgn__form-control-decorator-group-sm{font-size:.875rem;line-height:1.4286}.pgn__form-control-decorator-group.pgn__form-control-decorator-group-lg{font-size:1.325rem;line-height:1.5}.pgn__form-control-decorator{position:absolute;pointer-events:none;height:calc(
   1.3333em + 1.125rem + 2px
 );min-width:calc(
   1.3333em + 1.125rem + 2px

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openedx/paragon",
-  "version": "21.7.1",
+  "version": "21.7.2",
   "description": "Accessible, responsive UI component library based on Bootstrap.",
   "main": "dist/index.js",
   "module": "dist/index.js",

package/src/Avatar/README.md

@@ -5,7 +5,6 @@ components:
 - Avatar
 categories:
 - Imagery & Iconography
-- Content
 status: 'New'
 designStatus: 'Done'
 devStatus: 'Done'

package/src/Card/_variables.scss

@@ -29,7 +29,6 @@ $card-columns-gap:                   1.25rem !default;
 $card-columns-margin:                $card-spacer-y !default;
 
 $card-divider-bg:                    $light-400 !default;
-$card-divider-margin-y:              $card-spacer-y !default;
 
 $card-footer-actions-gap:            .5rem !default;
 

package/src/CheckBox/README.md

@@ -7,7 +7,7 @@ categories:
 - Forms (deprecated)
 status: 'Deprecate Soon'
 designStatus: 'TBD'
-devStatus: 'To Do'
+devStatus: 'Done'
 notes: |
   Replaced by Form.Checkbox
 ---

package/src/Form/_index.scss

@@ -46,6 +46,20 @@ $select-icon-padding: .5625rem !default;
   flex-grow: 1;
   align-items: flex-start;
 
+  textarea {
+    &.form-control {
+      min-height: $input-height;
+    }
+
+    &.form-control-lg {
+      min-height: $input-height-lg;
+    }
+
+    &.form-control-sm {
+      min-height: $input-height-sm;
+    }
+  }
+
   @media (min-width: map-get($grid-breakpoints, "sm")) {
     margin-inline-end: $custom-control-gutter;
   }

package/src/Image/README.md

@@ -3,7 +3,6 @@ title: 'Image'
 type: 'component'
 categories:
 - Imagery & Iconography
-- Content
 components:
 - Image
 status: 'Stable'

package/src/Nav/_variables.scss

@@ -56,4 +56,3 @@ $nav-inverse-tabs-link-active-bg:                  $nav-inverse-tabs-link-hover-
 $nav-inverse-tabs-link-active-border-bottom-width: $nav-tabs-border-width !default;
 $nav-inverse-tabs-tab-content-color:               $nav-inverse-tabs-link-color !default;
 $nav-inverse-tabs-dropdown-border-color:           $nav-inverse-tabs-link-active-hover-bg !default;
-$nav-inverse-tabs-dropdown-bottom-gap:             .4375rem !default;

package/src/Pagination/_variables.scss

@@ -7,12 +7,9 @@ $pagination-padding-x-sm:           .6rem !default;
 $pagination-padding-y-lg:           .75rem !default;
 $pagination-padding-x-lg:           1.5rem !default;
 $pagination-margin-x:               .5rem !default;
-$pagination-margin-y:               .5rem !default;
 $pagination-line-height:            1.5rem !default;
 $pagination-font-size-sm:           .875rem !default;
 
-$pagination-icon-size:              1.375rem !default;
-$pagination-icon-size-sm:           1rem !default;
 $pagination-icon-width:             2.25rem !default;
 $pagination-icon-height:            2.25rem !default;
 $pagination-padding-icon:           .5rem !default;

package/src/SearchField/README.md

@@ -10,7 +10,6 @@ components:
 - SearchFieldSubmitButton
 categories:
 - Forms
-- Navigation
 status: 'Stable'
 designStatus: 'Needs Review'
 devStatus: 'Done'

package/src/SearchField/_variables.scss

@@ -3,12 +3,10 @@ $search-btn-variants: (
   "dark":   $brand-500,
 );
 $search-border-radius:                0 !default;
-$search-line-height:                  1.5rem !default;
 $search-border-color:                 $gray-500 !default;
 $search-form-background-color:        $white !default;
 $search-border-color-interaction:     $black !default;
 $search-border-width:                 .0625rem !default;
-$search-border-width-interaction:     .125rem !default;
 $search-disabled-opacity:             .3 !default;
 $search-button-margin:                .5rem !default;
 $input-height-search:                 calc(#{$input-line-height * 1em} + #{$input-padding-y * 2}) !default;

package/src/SelectableBox/README.md

@@ -6,7 +6,6 @@ components:
 - SelectableBoxSet
 categories:
 - Forms
-- Content
 status: 'New'
 designStatus: 'Done'
 devStatus: 'In progress'

package/src/Spinner/README.md

@@ -6,7 +6,6 @@ components:
 - Spinner
 categories:
 - Status & metadata
-- Choreography
 designStatus: 'Done'
 devStatus: 'Done'
 notes: |

package/src/Stepper/README.md

@@ -10,7 +10,6 @@ components:
 - StepperHeaderStep
 categories:
 - Navigation
-- Content
 designStatus: 'Done'
 devStatus: 'Done'
 notes: |

package/src/Table/README.md

@@ -1,5 +1,5 @@
 ---
-title: 'Table (Deprecated)'
+title: 'Table'
 type: 'component'
 components:
 - TableDeprecated

package/src/Truncate/README.md

@@ -3,6 +3,8 @@ title: 'Truncate'
 type: 'component'
 components:
 - Truncate
+categories:
+- Content
 status: 'New'
 designStatus: 'Done'
 devStatus: 'Done'

package/src/hooks/useIndexOfLastVisibleChild.mdx

@@ -3,7 +3,6 @@ title: 'useIndexOfLastVisibleChild'
 type: 'hook'
 categories:
 - Hooks
-- Layout
 components:
 - useIndexOfLastVisibleChild
 status: 'New'

package/src/hooks/useIsVisible.mdx

@@ -3,7 +3,6 @@ title: 'useIsVisible'
 type: 'hook'
 categories:
 - Hooks
-- Layout
 components:
 - useIsVisible
 status: 'Stable'

package/src/hooks/useWindowSize.mdx

@@ -3,7 +3,6 @@ title: 'useWindowSize'
 type: 'hook'
 categories:
 - Hooks
-- Layout
 components:
 - useWindowSize
 status: 'New'