@peculiar/react-components 0.0.2-alpha.89 → 0.1.0

package/dist/cjs/Backdrop/backdrop.js

@@ -12,7 +12,11 @@ var __assign = (this && this.__assign) || function () {
 };
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -51,7 +55,7 @@ var variants = {
     medium: 0.5,
     heavy: 0.9,
 };
-var stylesBase = function () { return styles_1.css({
+var stylesBase = function () { return (0, styles_1.css)({
     label: 'Backdrop',
     zIndex: -1,
     position: 'fixed',
@@ -61,15 +65,15 @@ var stylesBase = function () { return styles_1.css({
     left: 0,
     WebkitTapHighlightColor: 'transparent',
 }); };
-var stylesInvisible = function () { return styles_1.css({
-    labe: 'invisible',
+var stylesInvisible = function () { return (0, styles_1.css)({
+    label: 'invisible',
     backgroundColor: 'transparent',
 }); };
 exports.Backdrop = React.forwardRef(function (props, ref) {
     var _a;
     var className = props.className, invisible = props.invisible, open = props.open, transitionDuration = props.transitionDuration, variant = props.variant, onEnter = props.onEnter, onEntered = props.onEntered, onEntering = props.onEntering, onExit = props.onExit, onExited = props.onExited, onExiting = props.onExiting, other = __rest(props, ["className", "invisible", "open", "transitionDuration", "variant", "onEnter", "onEntered", "onEntering", "onExit", "onExited", "onExiting"]);
     return (React.createElement(Fade_1.Fade, { in: open, timeout: transitionDuration, onEnter: onEnter, onEntered: onEntered, onEntering: onEntering, onExit: onExit, onExited: onExited, onExiting: onExiting, finalOpacity: variants[variant] },
-        React.createElement(Box_1.Box, __assign({}, other, { ref: ref, background: "black", className: styles_1.cx((_a = {},
+        React.createElement(Box_1.Box, __assign({}, other, { ref: ref, background: "black", className: (0, styles_1.cx)((_a = {},
                 _a[stylesBase()] = true,
                 _a[stylesInvisible()] = invisible,
                 _a[className] = !!className,
@@ -77,8 +81,8 @@ exports.Backdrop = React.forwardRef(function (props, ref) {
 });
 exports.Backdrop.displayName = 'Backdrop';
 exports.Backdrop.defaultProps = {
-    open: true,
     variant: 'medium',
     invisible: false,
+    transitionDuration: 225,
 };
 //# sourceMappingURL=backdrop.js.map

package/dist/cjs/Backdrop/backdrop.js.map

@@ -1 +1 @@
-{"version":3,"file":"backdrop.js","sourceRoot":"","sources":["../../../src/Backdrop/backdrop.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+B;AAC/B,gCAAoD;AACpD,8BAA6B;AAC7B,oCAAoC;AAqBpC,IAAM,QAAQ,GAAG;IACf,KAAK,EAAE,GAAG;IACV,MAAM,EAAE,GAAG;IACX,KAAK,EAAE,GAAG;CACX,CAAC;AAEF,IAAM,UAAU,GAAG,cAAM,OAAA,YAAG,CAAC;IAC3B,KAAK,EAAE,UAAU;IACjB,MAAM,EAAE,CAAC,CAAC;IACV,QAAQ,EAAE,OAAO;IACjB,KAAK,EAAE,CAAC;IACR,MAAM,EAAE,CAAC;IACT,GAAG,EAAE,CAAC;IACN,IAAI,EAAE,CAAC;IACP,uBAAuB,EAAE,aAAa;CACvC,CAAC,EATuB,CASvB,CAAC;AAEH,IAAM,eAAe,GAAG,cAAM,OAAA,YAAG,CAAC;IAChC,IAAI,EAAE,WAAW;IACjB,eAAe,EAAE,aAAa;CAC/B,CAAC,EAH4B,CAG5B,CAAC;AAEU,QAAA,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAgC,UAAC,KAAK,EAAE,GAAG;;IAE/E,IAAA,SAAS,GAYP,KAAK,UAZE,EACT,SAAS,GAWP,KAAK,UAXE,EACT,IAAI,GAUF,KAAK,KAVH,EACJ,kBAAkB,GAShB,KAAK,mBATW,EAClB,OAAO,GAQL,KAAK,QARA,EACP,OAAO,GAOL,KAAK,QAPA,EACP,SAAS,GAMP,KAAK,UANE,EACT,UAAU,GAKR,KAAK,WALG,EACV,MAAM,GAIJ,KAAK,OAJD,EACN,QAAQ,GAGN,KAAK,SAHC,EACR,SAAS,GAEP,KAAK,UAFE,EACN,KAAK,UACN,KAAK,EAbH,4IAaL,CADS,CACA;IAEV,OAAO,CACL,oBAAC,WAAI,IACH,EAAE,EAAE,IAAI,EACR,OAAO,EAAE,kBAAkB,EAC3B,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,UAAU,EACtB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,QAAQ,CAAC,OAAO,CAAC;QAE/B,oBAAC,SAAG,eACE,KAAK,IACT,GAAG,EAAE,GAAG,EACR,UAAU,EAAC,OAAO,EAClB,SAAS,EAAE,WAAE;gBACX,GAAC,UAAU,EAAE,IAAG,IAAI;gBACpB,GAAC,eAAe,EAAE,IAAG,SAAS;gBAC9B,GAAC,SAAS,IAAG,CAAC,CAAC,SAAS;oBACxB,iBACU,MAAM,IAClB,CACG,CACR,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,gBAAQ,CAAC,WAAW,GAAG,UAAU,CAAC;AAElC,gBAAQ,CAAC,YAAY,GAAG;IACtB,IAAI,EAAE,IAAI;IACV,OAAO,EAAE,QAAQ;IACjB,SAAS,EAAE,KAAK;CACjB,CAAC"}
+{"version":3,"file":"backdrop.js","sourceRoot":"","sources":["../../../src/Backdrop/backdrop.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+B;AAC/B,gCAAoD;AACpD,8BAA6B;AAC7B,oCAAoC;AAwBpC,IAAM,QAAQ,GAAG;IACf,KAAK,EAAE,GAAG;IACV,MAAM,EAAE,GAAG;IACX,KAAK,EAAE,GAAG;CACX,CAAC;AAEF,IAAM,UAAU,GAAG,cAAM,OAAA,IAAA,YAAG,EAAC;IAC3B,KAAK,EAAE,UAAU;IACjB,MAAM,EAAE,CAAC,CAAC;IACV,QAAQ,EAAE,OAAO;IACjB,KAAK,EAAE,CAAC;IACR,MAAM,EAAE,CAAC;IACT,GAAG,EAAE,CAAC;IACN,IAAI,EAAE,CAAC;IACP,uBAAuB,EAAE,aAAa;CACvC,CAAC,EATuB,CASvB,CAAC;AAEH,IAAM,eAAe,GAAG,cAAM,OAAA,IAAA,YAAG,EAAC;IAChC,KAAK,EAAE,WAAW;IAClB,eAAe,EAAE,aAAa;CAC/B,CAAC,EAH4B,CAG5B,CAAC;AAEU,QAAA,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAgC,UAAC,KAAK,EAAE,GAAG;;IAE/E,IAAA,SAAS,GAYP,KAAK,UAZE,EACT,SAAS,GAWP,KAAK,UAXE,EACT,IAAI,GAUF,KAAK,KAVH,EACJ,kBAAkB,GAShB,KAAK,mBATW,EAClB,OAAO,GAQL,KAAK,QARA,EACP,OAAO,GAOL,KAAK,QAPA,EACP,SAAS,GAMP,KAAK,UANE,EACT,UAAU,GAKR,KAAK,WALG,EACV,MAAM,GAIJ,KAAK,OAJD,EACN,QAAQ,GAGN,KAAK,SAHC,EACR,SAAS,GAEP,KAAK,UAFE,EACN,KAAK,UACN,KAAK,EAbH,4IAaL,CADS,CACA;IAEV,OAAO,CACL,oBAAC,WAAI,IACH,EAAE,EAAE,IAAI,EACR,OAAO,EAAE,kBAAkB,EAC3B,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,UAAU,EACtB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE,QAAQ,CAAC,OAAO,CAAC;QAE/B,oBAAC,SAAG,eACE,KAAK,IACT,GAAG,EAAE,GAAG,EACR,UAAU,EAAC,OAAO,EAClB,SAAS,EAAE,IAAA,WAAE;gBACX,GAAC,UAAU,EAAE,IAAG,IAAI;gBACpB,GAAC,eAAe,EAAE,IAAG,SAAS;gBAC9B,GAAC,SAAS,IAAG,CAAC,CAAC,SAAS;oBACxB,iBACU,MAAM,IAClB,CACG,CACR,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,gBAAQ,CAAC,WAAW,GAAG,UAAU,CAAC;AAElC,gBAAQ,CAAC,YAAY,GAAG;IACtB,OAAO,EAAE,QAAQ;IACjB,SAAS,EAAE,KAAK;IAChB,kBAAkB,EAAE,GAAG;CACxB,CAAC"}

package/dist/cjs/Backdrop/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/Backdrop/index.ts"],"names":[],"mappings":";;;AAAA,uCAAsC;AAA7B,oGAAA,QAAQ,OAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/Backdrop/index.ts"],"names":[],"mappings":";;;AAAA,uCAAqD;AAA5C,oGAAA,QAAQ,OAAA"}

package/dist/cjs/Box/box.js

@@ -12,7 +12,11 @@ var __assign = (this && this.__assign) || function () {
 };
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -44,20 +48,29 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Box = void 0;
 var React = __importStar(require("react"));
 var styles_1 = require("../styles");
-var stylesBase = function () { return styles_1.css({
+/**
+ *
+ */
+/**
+ * Styles.
+ */
+var stylesBase = function () { return (0, styles_1.css)({
     label: 'Box',
 }); };
-var stylesBackground = function (color) { return styles_1.css({
+var stylesBackground = function (color) { return (0, styles_1.css)({
     label: color,
-    background: "var(--pv-color-" + color + ")",
+    background: "var(--pv-color-".concat(color, ")"),
 }); };
-var stylesBorderColor = function (color) { return styles_1.css({
+var stylesBorderColor = function (color) { return (0, styles_1.css)({
     label: color,
-    borderColor: "var(--pv-color-" + color + ")",
+    borderColor: "var(--pv-color-".concat(color, ")"),
 }); };
+/**
+ *
+ */
 exports.Box = React.forwardRef(function (props, ref) {
     var _a;
-    var className = props.className, as = props.as, background = props.background, borderColor = props.borderColor, borderWidth = props.borderWidth, borderStyle = props.borderStyle, borderPosition = props.borderPosition, borderRadius = props.borderRadius, dataTestId = props.dataTestId, other = __rest(props, ["className", "as", "background", "borderColor", "borderWidth", "borderStyle", "borderPosition", "borderRadius", "dataTestId"]);
+    var className = props.className, background = props.background, borderColor = props.borderColor, borderWidth = props.borderWidth, borderStyle = props.borderStyle, borderPosition = props.borderPosition, borderRadius = props.borderRadius, component = props.component, other = __rest(props, ["className", "background", "borderColor", "borderWidth", "borderStyle", "borderPosition", "borderRadius", "component"]);
     var getBorderWidth = function () {
         if (typeof borderWidth !== 'number') {
             return undefined;
@@ -82,19 +95,17 @@ exports.Box = React.forwardRef(function (props, ref) {
         }
         return borderWidth;
     };
-    return React.createElement(as || 'div', __assign(__assign({}, other), { ref: ref, className: styles_1.cx((_a = {},
+    var Component = component || 'div';
+    return (React.createElement(Component, __assign({}, other, { ref: ref, className: (0, styles_1.cx)((_a = {},
             _a[stylesBase()] = true,
             _a[stylesBackground(background)] = !!background,
             _a[stylesBorderColor(borderColor)] = !!borderColor,
             _a[className] = !!className,
-            _a), styles_1.css({
+            _a), (0, styles_1.css)({
             borderWidth: getBorderWidth(),
             borderStyle: borderStyle,
             borderRadius: borderRadius,
-        })), 'data-testid': dataTestId }));
+        })) })));
 });
 exports.Box.displayName = 'Box';
-exports.Box.defaultProps = {
-    as: 'div',
-};
 //# sourceMappingURL=box.js.map

package/dist/cjs/Box/box.js.map

@@ -1 +1 @@
-{"version":3,"file":"box.js","sourceRoot":"","sources":["../../../src/Box/box.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"box.js","sourceRoot":"","sources":["../../../src/Box/box.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/Box/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/Box/index.ts"],"names":[],"mappings":";;;AAAA,6BAA4B;AAAnB,0FAAA,GAAG,OAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/Box/index.ts"],"names":[],"mappings":";;;AAAA,6BAIe;AAHb,0FAAA,GAAG,OAAA"}

package/dist/cjs/Button/button.js

@@ -12,7 +12,11 @@ var __assign = (this && this.__assign) || function () {
 };
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -45,46 +49,65 @@ exports.Button = void 0;
 var React = __importStar(require("react"));
 var styles_1 = require("../styles");
 var ButtonBase_1 = require("../ButtonBase");
-var stylesBase = function () { return styles_1.css({
+/**
+ *
+ */
+/**
+ * Styles.
+ */
+var stylesBase = function () { return (0, styles_1.css)({
     label: 'Button',
     borderRadius: '4px',
 }); };
-var stylesSizeSmall = function (circled) { return styles_1.css({
-    label: 'small',
-    height: '30px',
-    minWidth: '30px',
-    padding: '0 10px',
-    borderRadius: circled ? '30px' : undefined,
+var stylesSizeSmall = function (props) { return (0, styles_1.css)(__assign(__assign({ label: 'small', height: 'var(--pv-size-base-6)', minWidth: 'var(--pv-size-base-6)' }, (props.circled && {
+    borderRadius: 'var(--pv-size-base-6)',
+})), (!props.withoutPadding && {
+    padding: '0 var(--pv-size-base-2)',
+}))); };
+var stylesSizeMedium = function (props) { return (0, styles_1.css)(__assign(__assign({ label: 'medium', height: 'var(--pv-size-base-7)', minWidth: 'var(--pv-size-base-7)' }, (props.circled && {
+    borderRadius: 'var(--pv-size-base-7)',
+})), (!props.withoutPadding && {
+    padding: '0 var(--pv-size-base-3)',
+}))); };
+var stylesSizeLarge = function (props) { return (0, styles_1.css)(__assign(__assign({ label: 'large', height: 'var(--pv-size-base-8)', minWidth: 'var(--pv-size-base-8)' }, (props.circled && {
+    borderRadius: 'var(--pv-size-base-8)',
+})), (!props.withoutPadding && {
+    padding: '0 var(--pv-size-base-4)',
+}))); };
+var stylesStartIcon = function () { return (0, styles_1.css)({
+    label: 'Button-startIcon',
+    marginRight: 'var(--pv-size-base)',
+    display: 'inherit',
 }); };
-var stylesSizeMedium = function (circled) { return styles_1.css({
-    label: 'medium',
-    height: '35px',
-    minWidth: '35px',
-    padding: '0 15px',
-    borderRadius: circled ? '35px' : undefined,
-}); };
-var stylesSizeLarge = function (circled) { return styles_1.css({
-    label: 'large',
-    height: '40px',
-    minWidth: '40px',
-    padding: '0 20px',
-    borderRadius: circled ? '40px' : undefined,
+var stylesEndIcon = function () { return (0, styles_1.css)({
+    label: 'Button-endIcon',
+    marginLeft: 'var(--pv-size-base)',
+    display: 'inherit',
 }); };
+/**
+ *
+ */
 exports.Button = React.forwardRef(function (props, ref) {
     var _a;
-    var children = props.children, className = props.className, size = props.size, circled = props.circled, other = __rest(props, ["children", "className", "size", "circled"]);
-    return (React.createElement(ButtonBase_1.ButtonBase, __assign({}, other, { ref: ref, className: styles_1.cx((_a = {},
+    var children = props.children, className = props.className, size = props.size, circled = props.circled, startIconProp = props.startIcon, endIconProp = props.endIcon, withoutPadding = props.withoutPadding, other = __rest(props, ["children", "className", "size", "circled", "startIcon", "endIcon", "withoutPadding"]);
+    var startIcon = startIconProp && (React.createElement("span", { className: (0, styles_1.cx)(stylesStartIcon()) }, startIconProp));
+    var endIcon = endIconProp && (React.createElement("span", { className: (0, styles_1.cx)(stylesEndIcon()) }, endIconProp));
+    return (React.createElement(ButtonBase_1.ButtonBase, __assign({}, other, { ref: ref, className: (0, styles_1.cx)((_a = {},
             _a[stylesBase()] = true,
-            _a[stylesSizeSmall(circled)] = size === 'small',
-            _a[stylesSizeMedium(circled)] = size === 'medium',
-            _a[stylesSizeLarge(circled)] = size === 'large',
+            _a[stylesSizeSmall(props)] = size === 'small',
+            _a[stylesSizeMedium(props)] = size === 'medium',
+            _a[stylesSizeLarge(props)] = size === 'large',
             _a[className] = !!className,
-            _a)), size: size }), children));
+            _a)), size: size }),
+        startIcon,
+        children,
+        endIcon));
 });
 exports.Button.displayName = 'Button';
 exports.Button.defaultProps = {
     disabled: false,
-    variant: 'primary',
+    variant: 'text',
+    color: 'default',
     size: 'medium',
 };
 //# sourceMappingURL=button.js.map

package/dist/cjs/Button/button.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../src/Button/button.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+B;AAC/B,oCAAoC;AACpC,4CAA4D;AAQ5D,IAAM,UAAU,GAAG,cAAM,OAAA,YAAG,CAAC;IAC3B,KAAK,EAAE,QAAQ;IACf,YAAY,EAAE,KAAK;CACpB,CAAC,EAHuB,CAGvB,CAAC;AAEH,IAAM,eAAe,GAAG,UAAC,OAAiB,IAAK,OAAA,YAAG,CAAC;IACjD,KAAK,EAAE,OAAO;IACd,MAAM,EAAE,MAAM;IACd,QAAQ,EAAE,MAAM;IAChB,OAAO,EAAE,QAAQ;IACjB,YAAY,EAAE,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;CAC3C,CAAC,EAN6C,CAM7C,CAAC;AAEH,IAAM,gBAAgB,GAAG,UAAC,OAAiB,IAAK,OAAA,YAAG,CAAC;IAClD,KAAK,EAAE,QAAQ;IACf,MAAM,EAAE,MAAM;IACd,QAAQ,EAAE,MAAM;IAChB,OAAO,EAAE,QAAQ;IACjB,YAAY,EAAE,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;CAC3C,CAAC,EAN8C,CAM9C,CAAC;AAEH,IAAM,eAAe,GAAG,UAAC,OAAiB,IAAK,OAAA,YAAG,CAAC;IACjD,KAAK,EAAE,OAAO;IACd,MAAM,EAAE,MAAM;IACd,QAAQ,EAAE,MAAM;IAChB,OAAO,EAAE,QAAQ;IACjB,YAAY,EAAE,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;CAC3C,CAAC,EAN6C,CAM7C,CAAC;AAEU,QAAA,MAAM,GAAG,KAAK,CAAC,UAAU,CAAiC,UAAC,KAAK,EAAE,GAAG;;IAE9E,IAAA,QAAQ,GAKN,KAAK,SALC,EACR,SAAS,GAIP,KAAK,UAJE,EACT,IAAI,GAGF,KAAK,KAHH,EACJ,OAAO,GAEL,KAAK,QAFA,EACJ,KAAK,UACN,KAAK,EANH,4CAML,CADS,CACA;IAEV,OAAO,CACL,oBAAC,uBAAU,eACL,KAAK,IACT,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,WAAE;YACX,GAAC,UAAU,EAAE,IAAG,IAAI;YACpB,GAAC,eAAe,CAAC,OAAO,CAAC,IAAG,IAAI,KAAK,OAAO;YAC5C,GAAC,gBAAgB,CAAC,OAAO,CAAC,IAAG,IAAI,KAAK,QAAQ;YAC9C,GAAC,eAAe,CAAC,OAAO,CAAC,IAAG,IAAI,KAAK,OAAO;YAC5C,GAAC,SAAS,IAAG,CAAC,CAAC,SAAS;gBACxB,EACF,IAAI,EAAE,IAAI,KAET,QAAQ,CACE,CACd,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,cAAM,CAAC,WAAW,GAAG,QAAQ,CAAC;AAE9B,cAAM,CAAC,YAAY,GAAG;IACpB,QAAQ,EAAE,KAAK;IACf,OAAO,EAAE,SAAS;IAClB,IAAI,EAAE,QAAQ;CACf,CAAC"}
+{"version":3,"file":"button.js","sourceRoot":"","sources":["../../../src/Button/button.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/Button/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/Button/index.ts"],"names":[],"mappings":";;;AAAA,mCAAkC;AAAzB,gGAAA,MAAM,OAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/Button/index.ts"],"names":[],"mappings":";;;AAAA,mCAIkB;AAHhB,gGAAA,MAAM,OAAA"}

package/dist/cjs/ButtonBase/button_base.js

@@ -12,7 +12,11 @@ var __assign = (this && this.__assign) || function () {
 };
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -45,7 +49,13 @@ exports.ButtonBase = void 0;
 var React = __importStar(require("react"));
 var styles_1 = require("../styles");
 var Typography_1 = require("../Typography");
-var stylesBase = function () { return styles_1.css({
+/**
+ *
+ */
+/**
+ * Styles.
+ */
+var stylesBase = function () { return (0, styles_1.css)({
     label: 'ButtonBase',
     fontFamily: 'inherit',
     outline: 'none',
@@ -53,37 +63,124 @@ var stylesBase = function () { return styles_1.css({
     boxSizing: 'border-box',
     border: '1px solid transparent',
     transition: 'background-color 200ms, color 200ms, box-shadow 200ms, border-color 200ms',
+    userSelect: 'none',
+    whiteSpace: 'nowrap',
+    display: 'inline-flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    verticalAlign: 'middle',
+    backgroundColor: 'transparent',
+    padding: 0,
+    textDecoration: 'none',
     '&:disabled': {
         cursor: 'not-allowed',
         boxShadow: 'none',
     },
 }); };
-var stylesVariantPrimary = function () { return styles_1.css({
-    label: 'primary',
+var stylesVariantTextColorDefault = function () { return (0, styles_1.css)({
+    color: 'var(--pv-color-black)',
+    '&:not(:disabled)': {
+        '&:hover': {
+            backgroundColor: 'var(--pv-color-gray-3)',
+        },
+        '&:focus': {
+            backgroundColor: 'var(--pv-color-gray-4)',
+        },
+        '&:active': {
+            backgroundColor: 'var(--pv-color-gray-5)',
+        },
+    },
+}); };
+var stylesVariantTextColorWhite = function () { return (0, styles_1.css)({
     color: 'var(--pv-color-white)',
-    backgroundColor: 'var(--pv-color-primary)',
-    boxShadow: 'var(--pv-shadow-light-low)',
     '&:not(:disabled)': {
         '&:hover': {
-            backgroundColor: 'var(--pv-color-primary-tint-1)',
+            backgroundColor: 'var(--pv-color-gray-7)',
+        },
+        '&:focus': {
+            backgroundColor: 'var(--pv-color-gray-8)',
+        },
+        '&:active': {
+            backgroundColor: 'var(--pv-color-gray-9)',
+        },
+    },
+}); };
+var stylesVariantTextColor = function (color) { return (0, styles_1.css)({
+    color: "var(--pv-color-".concat(color, ")"),
+    '&:not(:disabled)': {
+        '&:hover': {
+            backgroundColor: "var(--pv-color-".concat(color, "-tint-5)"),
+        },
+        '&:focus': {
+            backgroundColor: "var(--pv-color-".concat(color, "-tint-4)"),
+        },
+        '&:active': {
+            backgroundColor: "var(--pv-color-".concat(color, "-tint-3)"),
+        },
+    },
+}); };
+var stylesVariantText = function () { return (0, styles_1.css)({
+    '&:disabled': {
+        color: 'var(--pv-color-gray-7)',
+    },
+}); };
+var stylesVariantContainedColorDefault = function () { return (0, styles_1.css)({
+    backgroundColor: 'var(--pv-color-gray-8)',
+    color: 'var(--pv-color-black)',
+    '&:not(:disabled)': {
+        '&:hover': {
+            backgroundColor: 'var(--pv-color-gray-7)',
         },
         '&:focus': {
-            backgroundColor: 'var(--pv-color-primary-tint-2)',
+            backgroundColor: 'var(--pv-color-gray-6)',
         },
         '&:active': {
-            backgroundColor: 'var(--pv-color-primary-tint-2)',
+            backgroundColor: 'var(--pv-color-gray-5)',
             boxShadow: 'var(--pv-shadow-light-medium)',
         },
     },
+}); };
+var stylesVariantContainedColorWhite = function () { return (0, styles_1.css)({
+    backgroundColor: 'var(--pv-color-white)',
+    color: 'var(--pv-color-black)',
+    '&:not(:disabled)': {
+        '&:hover': {
+            backgroundColor: 'var(--pv-color-gray-7)',
+        },
+        '&:focus': {
+            backgroundColor: 'var(--pv-color-gray-6)',
+        },
+        '&:active': {
+            backgroundColor: 'var(--pv-color-gray-5)',
+            boxShadow: 'var(--pv-shadow-light-medium)',
+        },
+    },
+}); };
+var stylesVariantContainedColor = function (color) { return (0, styles_1.css)({
+    backgroundColor: "var(--pv-color-".concat(color, ")"),
+    color: "var(--pv-color-".concat(color, "-contrast)"),
+    '&:not(:disabled)': {
+        '&:hover': {
+            backgroundColor: "var(--pv-color-".concat(color, "-tint-1)"),
+        },
+        '&:focus': {
+            backgroundColor: "var(--pv-color-".concat(color, "-tint-2)"),
+        },
+        '&:active': {
+            backgroundColor: "var(--pv-color-".concat(color, "-tint-2)"),
+            boxShadow: 'var(--pv-shadow-light-medium)',
+        },
+    },
+}); };
+var stylesVariantContained = function () { return (0, styles_1.css)({
+    boxShadow: 'var(--pv-shadow-light-low)',
     '&:disabled': {
         color: 'var(--pv-color-gray-8)',
         backgroundColor: 'var(--pv-color-gray-4)',
     },
 }); };
-var stylesVariantSecondary = function () { return styles_1.css({
-    label: 'secondary',
+var stylesVariantOutlinedColorDefault = function () { return (0, styles_1.css)({
     color: 'var(--pv-color-black)',
-    backgroundColor: 'transparent',
     borderColor: 'var(--pv-color-gray-8)',
     '&:not(:disabled)': {
         '&:hover': {
@@ -96,64 +193,79 @@ var stylesVariantSecondary = function () { return styles_1.css({
             backgroundColor: 'var(--pv-color-gray-5)',
         },
     },
-    '&:disabled': {
-        color: 'var(--pv-color-gray-7)',
-    },
 }); };
-var stylesVariantWrong = function () { return styles_1.css({
-    label: 'wrong',
+var stylesVariantOutlinedColorWhite = function () { return (0, styles_1.css)({
     color: 'var(--pv-color-white)',
-    backgroundColor: 'var(--pv-color-wrong)',
-    boxShadow: 'var(--pv-shadow-light-low)',
+    borderColor: 'var(--pv-color-white)',
     '&:not(:disabled)': {
         '&:hover': {
-            backgroundColor: 'var(--pv-color-wrong-tint-1)',
+            backgroundColor: 'var(--pv-color-gray-7)',
         },
         '&:focus': {
-            backgroundColor: 'var(--pv-color-wrong-tint-2)',
+            backgroundColor: 'var(--pv-color-gray-8)',
         },
         '&:active': {
-            backgroundColor: 'var(--pv-color-wrong-tint-2)',
-            boxShadow: 'var(--pv-shadow-light-medium)',
+            backgroundColor: 'var(--pv-color-gray-9)',
         },
     },
-    '&:disabled': {
-        color: 'var(--pv-color-gray-8)',
-        backgroundColor: 'var(--pv-color-gray-4)',
-    },
 }); };
-var stylesVariantTertiary = function () { return styles_1.css({
-    label: 'tertiary',
-    color: 'var(--pv-color-secondary)',
-    backgroundColor: 'transparent',
+var stylesVariantOutlinedColor = function (color) { return (0, styles_1.css)({
+    color: "var(--pv-color-".concat(color, ")"),
+    borderColor: "var(--pv-color-".concat(color, "-tint-2)"),
     '&:not(:disabled)': {
         '&:hover': {
-            backgroundColor: 'var(--pv-color-secondary-tint-5)',
+            backgroundColor: "var(--pv-color-".concat(color, "-tint-5)"),
         },
         '&:focus': {
-            backgroundColor: 'var(--pv-color-secondary-tint-4)',
+            backgroundColor: "var(--pv-color-".concat(color, "-tint-4)"),
         },
         '&:active': {
-            backgroundColor: 'var(--pv-color-secondary-tint-3)',
+            backgroundColor: "var(--pv-color-".concat(color, "-tint-3)"),
         },
     },
+}); };
+var stylesVariantOutlined = function () { return (0, styles_1.css)({
     '&:disabled': {
-        color: 'var(--pv-color-gray-7)',
+        color: 'var(--pv-color-gray-8)',
+        borderColor: 'var(--pv-color-gray-4)',
     },
 }); };
+var stylesLabel = function () { return (0, styles_1.css)({
+    label: 'ButtonBase-label',
+    width: '100%',
+    display: 'inherit',
+    alignItems: 'inherit',
+    justifyContent: 'inherit',
+}); };
+/**
+ *
+ */
 exports.ButtonBase = React.forwardRef(function (props, ref) {
     var _a;
-    var variant = props.variant, size = props.size, className = props.className, children = props.children, dataTestId = props.dataTestId, other = __rest(props, ["variant", "size", "className", "children", "dataTestId"]);
-    return (React.createElement("button", __assign({}, other, { ref: ref, type: "button", className: styles_1.cx((_a = {},
+    var variant = props.variant, textVariantProp = props.textVariant, color = props.color, size = props.size, className = props.className, children = props.children, disabled = props.disabled, _b = props.type, type = _b === void 0 ? 'button' : _b, component = props.component, other = __rest(props, ["variant", "textVariant", "color", "size", "className", "children", "disabled", "type", "component"]);
+    var Component = component || 'button';
+    var textVariant = textVariantProp || (size === 'small' ? 'btn2' : 'btn1');
+    return (React.createElement(Component, __assign({}, other, { ref: ref, type: type, disabled: disabled, className: (0, styles_1.cx)((_a = {},
             _a[stylesBase()] = true,
-            _a[stylesVariantPrimary()] = variant === 'primary',
-            _a[stylesVariantSecondary()] = variant === 'secondary',
-            _a[stylesVariantWrong()] = variant === 'wrong',
-            _a[stylesVariantTertiary()] = variant === 'tertiary',
+            _a[stylesVariantTextColorDefault()] = variant === 'text' && color === 'default',
+            _a[stylesVariantTextColorWhite()] = variant === 'text' && color === 'white',
+            _a[stylesVariantTextColor(color)] = variant === 'text' && !['white', 'default'].includes(color),
+            _a[stylesVariantText()] = variant === 'text',
+            _a[stylesVariantContainedColorDefault()] = variant === 'contained' && color === 'default',
+            _a[stylesVariantContainedColorWhite()] = variant === 'contained' && color === 'white',
+            _a[stylesVariantContainedColor(color)] = variant === 'contained' && !['white', 'default'].includes(color),
+            _a[stylesVariantContained()] = variant === 'contained',
+            _a[stylesVariantOutlinedColorDefault()] = variant === 'outlined' && color === 'default',
+            _a[stylesVariantOutlinedColorWhite()] = variant === 'outlined' && color === 'white',
+            _a[stylesVariantOutlinedColor(color)] = variant === 'outlined' && !['white', 'default'].includes(color),
+            _a[stylesVariantOutlined()] = variant === 'outlined',
             _a[className] = !!className,
-            _a)), "data-testid": dataTestId }),
-        React.createElement(Typography_1.Typography, { variant: size === 'small' ? 'btn2' : 'btn1' }, children)));
+            _a)) }),
+        React.createElement(Typography_1.Typography, { variant: textVariant, className: (0, styles_1.cx)(stylesLabel()), color: "inherit" }, children)));
 });
 exports.ButtonBase.displayName = 'ButtonBase';
-exports.ButtonBase.defaultProps = {};
+exports.ButtonBase.defaultProps = {
+    variant: 'text',
+    color: 'default',
+};
 //# sourceMappingURL=button_base.js.map

package/dist/cjs/ButtonBase/button_base.js.map

@@ -1 +1 @@
-{"version":3,"file":"button_base.js","sourceRoot":"","sources":["../../../src/ButtonBase/button_base.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"button_base.js","sourceRoot":"","sources":["../../../src/ButtonBase/button_base.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/ButtonBase/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ButtonBase/index.ts"],"names":[],"mappings":";;;AAAA,6CAA4D;AAAnD,yGAAA,UAAU,OAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ButtonBase/index.ts"],"names":[],"mappings":";;;AAAA,6CAIuB;AAHrB,yGAAA,UAAU,OAAA"}