@clayui/label 3.39.0 → 3.56.0

package/README.md

@@ -0,0 +1,19 @@
+# `@clayui/label`
+
+Labels are a visual pattern used to categorize information providing quick and easy recognition.
+
+-   [Documentation](https://clayui.com/docs/components/label.html)
+-   [Changelog](./CHANGELOG.md)
+-   [Breaking change schedule](./BREAKING.md)
+
+## Install
+
+Run `yarn`
+
+```shell
+yarn add @clayui/label
+```
+
+## Contribute
+
+We'd love to get contributions from you! Please, check our [Contributing Guidelines](https://github.com/liferay/clay/blob/master/CONTRIBUTING.md) to see how you can help us improve.

package/lib/index.d.ts

@@ -1,17 +1,42 @@
+/**
+ * SPDX-FileCopyrightText: © 2019 Liferay, Inc. <https://liferay.com>
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
 import React from 'react';
 declare const ClayLabelItemExpand: React.ForwardRefExoticComponent<React.BaseHTMLAttributes<HTMLAnchorElement | HTMLSpanElement> & React.RefAttributes<HTMLAnchorElement | HTMLSpanElement>>;
 declare type DisplayType = 'secondary' | 'info' | 'warning' | 'danger' | 'success' | 'unstyled';
 interface IBaseProps extends React.BaseHTMLAttributes<HTMLSpanElement> {
+    /**
+     * Flag to indicate if `label-dismissible` class should be applied.
+     */
     dismissible?: boolean;
+    /**
+     * Determines the style of the label.
+     */
     displayType?: DisplayType;
+    /**
+     * Flag to indicate if the label should be of the `large` variant.
+     */
     large?: boolean;
 }
 interface IProps extends IBaseProps {
+    /**
+     * HTML properties that are applied to the 'x' button.
+     */
     closeButtonProps?: React.ButtonHTMLAttributes<HTMLButtonElement> & {
         ref?: (instance: HTMLButtonElement | null) => void;
     };
+    /**
+     * Pros to add to the inner label item
+     */
     innerElementProps?: React.ComponentProps<typeof ClayLabelItemExpand>;
+    /**
+     * Path to the location of the spritemap resource used for Icon.
+     */
     spritemap?: string;
+    /**
+     * Flag to indicate if component should include the close button
+     */
     withClose?: boolean;
 }
 declare const _default: React.ForwardRefExoticComponent<IProps & React.RefAttributes<HTMLAnchorElement | HTMLSpanElement>> & {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@clayui/label",
-	"version": "3.39.0",
+	"version": "3.56.0",
 	"description": "ClayLabel component",
 	"license": "BSD-3-Clause",
 	"repository": "https://github.com/liferay/clay",
@@ -17,8 +17,8 @@
 	],
 	"scripts": {
 		"build": "babel src --root-mode upward --out-dir lib --extensions .ts,.tsx",
-		"build:types": "tsc --project ./tsconfig.declarations.json",
-		"prepublishOnly": "yarn build && yarn build:types",
+		"buildTypes": "tsc --project ./tsconfig.declarations.json",
+		"prepublishOnly": "yarn build && yarn buildTypes",
 		"test": "jest --config ../../jest.config.js"
 	},
 	"keywords": [
@@ -26,8 +26,8 @@
 		"react"
 	],
 	"dependencies": {
-		"@clayui/icon": "^3.39.0",
-		"@clayui/link": "^3.39.0",
+		"@clayui/icon": "^3.56.0",
+		"@clayui/link": "^3.56.0",
 		"classnames": "^2.2.6"
 	},
 	"peerDependencies": {
@@ -38,5 +38,5 @@
 	"browserslist": [
 		"extends browserslist-config-clay"
 	],
-	"gitHead": "724e75f8e23b45a42cdfba839ba11f738f84e85a"
+	"gitHead": "1c33d9c709d8ce071862f0087c76ac23ce11465b"
 }

package/README.mdx

@@ -1,49 +0,0 @@
----
-title: 'Label'
-description: 'Labels are a visual pattern used to categorize information providing quick and easy recognition.'
-lexiconDefinition: 'https://liferay.design/lexicon/core-components/labels/'
-packageNpm: '@clayui/label'
----
-
-import {
-	Label,
-	LabelClosingActions,
-	LabelDisplayTypes,
-} from '$packages/clay-label/docs/index';
-
-<div class="nav-toc-absolute">
-<div class="nav-toc">
-
--   [Display Types](#display-types)
--   [Closing Actions](#closing-actions)
-
-</div>
-</div>
-
-## Overview
-
-`ClayLabel` offers two different APIs for use by toggling the prop `withClose`. By default(`withClose={true}`), `ClayLabel` behaves like a high-level component. If you want to use the lower-level components and compose multiple parts to your label, all you need to do is set `withClose={false}`.
-
-Check out [this storybook example](storybook.clayui.com/?path=/story/components-claylabel--w-content-before) for a demo.
-
-## Display Types
-
-Using [`displayType`](#api-displayType) property you can use these color variations on Label component:
-
-<LabelDisplayTypes />
-
-## Closing Actions
-
-<div class="clay-site-alert alert alert-warning">
-	This property is mandatory if you want make your label dismissible.
-</div>
-
-Use [`closeButtonProps`](#api-closeButtonProps) property for applying custom properties to the button that wraps the closing icon.
-
-In this example, an Id was settled for the closing element:
-
-<LabelClosingActions />
-
-You can also set a state for the visibility of the ClayLabel for example, handling `onClick` property on the closing element.
-
-<Label />