{/* ATTENTION */}

{/* When updating this file, please add the newest comments at the top of the file so they are displayed first */}

{/* Changes should include any functional changes made to the component and how that affects the component/function usage */}

{/* or changes made to the Types (and what effect that will have for the component/function) */}

import { Canvas, Meta, Story } from '@storybook/addon-docs/blocks'

<Meta
  title='ChangeLog/v3/3.13'
  parameters={{
    viewMode: 'docs',
    previewTabs: {
      canvas: { hidden: true },
    },
  }}
/>

{/* INSERT NEW UPDATE HERE */}

{/* Include date, version & the change and it's functional effects */}

**23-August-2022**

### 3.13.13

Updated types for useShowElement to fix typescript errors.

---

### 3.13.12

Added an optional feature to automatically close the SideDrawer with a `click` outside the SideDrawer on
the desktop version of the app. To activate this feature the `closeOnOutsideClick` parameter must be provided
to `SideDrawer`. A `closeCallout` method must also be supplied for this feature to work.

This is an "opt in" feature which means that you must supply the `closeOnOutsideClick` parameter to activate
the feature and will continue to work unchanged for all other instances of the SideDrawer component.

---

### 3.13.11

Removed the `label` prop from Breadcrumbs because it was not being used.

---

### 3.13.10

Added hook `useShowElement`. It conditionally shows an element based on if a ref is visible on the page.

Story Link: [useShowElement](/story/hooks-useshowelement--example)

---

**22-August-2022**

### 3.13.9

Added dynamic label placement on the `BubbleChart`. No additional types or props have been used and labels are shown
by default for the top 10 labels (by size). Currently, there is no toggle or prop to turn this feature off. In it'scripts
only implementation, the default is to show the top 10 labels.

---

**16-August-2022**

### 3.13.7

`SortColumn` now handles `PopoverAndMobileDrawer`. The `SideDrawer` was updated to use 2 sizes - `sm` and `lg`. The `sm` size has `max-width: 448px` and the `lg` size has `max-width: 767px`.

---

**15-August-2022**

### 3.13.8

Cleaning up some code that was added as a temporary fix until other instances of the component were updated. Now the components are updated so a slight change to `CustomDisplay` props was necessary.

---

**12-August-2022**

### 3.13.7

Officially deprecating the old `Tag` component and renaming our `TagNew` component to `Tag`

---

**12-August-2022**

### 3.13.6

Prop Updates:

- `PopoverWithConfirmation` - made `children` optional in the `OptionItem` because when there is a single option, we do not need to show children to handle that action.
- `ToggleOptions` - added `labelText` and `required` as optional props. This will help keep styling consistent.

---

**11-August-2022**

### 3.13.5

StandardTable: Added optional `showCaret` to `nestedRowProps` which allows the nested rows expand/collapse caret to be conditionally shown/hidden based on row data

Link to Story: [StandardTable (Nested)](/story/components-tables-standardtable--nested)

---

**10-August-2022**

### 3.13.4

Introduced a new prop called `mainButtonPopoverClassName` in PrimaryActionButton component to apply no-padding popover experience.

Link to Story: [PrimaryActionButton](/story/components-primaryactionbutton--menu-button-as-popover)

---

**05-August-2022**

### 3.13.3

Refactored the `Switch` component based on feedback from UX. Simplified props.

Link to Story: [Switch](/story/components-switch--basic)

---

**05-August-2022**

### 3.13.2

Introduced a new prop called `mainButtonType` and `children` in PrimaryActionButton component to handle the popover experience.

Link to Story: [PrimaryActionButton](/story/components-primaryactionbutton--menu-button-as-popover)

---

**04-August-2022**

### 3.13.1

Version bump to try and fix npm publish issues. Unsuccessful attempt. Needed to roll back our `copy-files` scripts in the package.json in order to fix the issue.

---

**03-August-2022**

### 3.13.0

Created new component `EmptyState`. It is meant to be used in similar ways as `NoListData`. It has
an optional icon and button, as well as an optional background.

Link to Story: [EmptyState](/story/components-emptystate--everything)

---