@peculiar/react-components 0.6.6 → 1.0.0

package/dist/cjs/Alert/alert.js

@@ -54,6 +54,7 @@ var styled_1 = __importDefault(require("@emotion/styled"));
 var Typography_1 = require("../Typography");
 var IconButton_1 = require("../IconButton");
 var CircularProgress_1 = require("../CircularProgress");
+var Flex_1 = require("../Flex");
 var icons_1 = require("../icons");
 /**
  *
@@ -61,9 +62,9 @@ var icons_1 = require("../icons");
 /**
  * Styles.
  */
-var AlertRoot = (0, styled_1.default)('div')({
+var AlertRoot = (0, styled_1.default)(Flex_1.FlexContainer)({
     width: '100%',
-    display: 'flex',
+    gap: 'var(--pv-size-base-2)',
     padding: 'var(--pv-size-base-2) var(--pv-size-base-4)',
     boxSizing: 'border-box',
     borderRadius: '4px',
@@ -91,17 +92,17 @@ var AlertRoot = (0, styled_1.default)('div')({
         backgroundColor: backgroundColor,
     };
 });
-var AlertIcon = (0, styled_1.default)('div')(function (props) { return (__assign(__assign(__assign({ marginRight: 'var(--pv-size-base-2)', width: '24px', display: 'flex', padding: 'var(--pv-size-base-half) 0px', justifyContent: 'center', alignItems: 'center' }, (props.variant === 'wrong' && {
+var AlertIcon = (0, styled_1.default)('div')(function (props) { return (__assign(__assign(__assign({ width: '24px', display: 'flex', justifyContent: 'center', alignItems: 'center' }, (props.variant === 'wrong' && {
     color: 'var(--pv-color-wrong)',
 })), (props.variant === 'attention' && {
     color: 'var(--pv-color-attention)',
 })), (props.variant === 'success' && {
     color: 'var(--pv-color-success)',
 }))); });
-var AlertMessage = (0, styled_1.default)(Typography_1.Typography)({
+var AlertMessage = (0, styled_1.default)(Flex_1.Flex)({
     padding: 'var(--pv-size-base) 0px',
-    flex: '1',
     minHeight: 'var(--pv-text-b3-height)',
+    overflowWrap: 'break-word',
 });
 /**
  *
@@ -125,7 +126,8 @@ exports.Alert = React.forwardRef(function (props, ref) {
     };
     return (React.createElement(AlertRoot, __assign({ ref: ref, role: "alert", variant: variant }, other),
         !disableIcon && (React.createElement(AlertIcon, { variant: variant }, renderIcon())),
-        React.createElement(AlertMessage, { variant: "b3", color: variant === 'wrong' ? 'wrong' : 'white' }, children),
+        React.createElement(AlertMessage, { size: "grow" },
+            React.createElement(Typography_1.Typography, { variant: "b3", color: variant === 'wrong' ? 'wrong' : 'white' }, children)),
         onClose && (React.createElement(IconButton_1.IconButton, { size: "small", color: variant === 'wrong' ? 'wrong' : 'white', circled: true, onClick: onClose },
             React.createElement(icons_1.CloseIcon, null)))));
 });

package/dist/cjs/Alert/alert.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert.js","sourceRoot":"","sources":["../../../src/Alert/alert.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"alert.js","sourceRoot":"","sources":["../../../src/Alert/alert.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+B;AAC/B,2DAAqC;AACrC,4CAA2C;AAC3C,4CAA2C;AAC3C,wDAAuD;AACvD,gCAA8C;AAC9C,kCAKkB;AAkClB;;GAEG;AAEH;;GAEG;AACH,IAAM,SAAS,GAAG,IAAA,gBAAM,EAAC,oBAAa,CAAC,CACrC;IACE,KAAK,EAAE,MAAM;IACb,GAAG,EAAE,uBAAuB;IAC5B,OAAO,EAAE,6CAA6C;IACtD,SAAS,EAAE,YAAY;IACvB,YAAY,EAAE,KAAK;CACpB,EACD,UAAC,KAAK;IACJ,IAAM,MAAM,GAAG,KAAK,CAAC,KAAK,CAAC,IAAI,KAAK,MAAM,CAAC;IAC3C,IAAI,eAAuB,CAAC;IAE5B,IAAI,KAAK,CAAC,OAAO,KAAK,OAAO,EAAE;QAC7B,IAAI,MAAM,EAAE;YACV,eAAe,GAAG,+BAA+B,CAAC;SACnD;aAAM;YACL,eAAe,GAAG,8BAA8B,CAAC;SAClD;QAED,OAAO;YACL,eAAe,iBAAA;SAChB,CAAC;KACH;IAED,IAAI,MAAM,EAAE;QACV,eAAe,GAAG,wBAAwB,CAAC;KAC5C;SAAM;QACL,eAAe,GAAG,uBAAuB,CAAC;KAC3C;IAED,OAAO;QACL,eAAe,iBAAA;KAChB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,IAAM,SAAS,GAAG,IAAA,gBAAM,EAAC,KAAK,CAAC,CAC7B,UAAC,KAAK,IAAK,OAAA,8BACT,KAAK,EAAE,MAAM,EACb,OAAO,EAAE,MAAM,EACf,cAAc,EAAE,QAAQ,EACxB,UAAU,EAAE,QAAQ,IACjB,CAAC,KAAK,CAAC,OAAO,KAAK,OAAO,IAAI;IAC/B,KAAK,EAAE,uBAAuB;CAC/B,CAAC,GACC,CAAC,KAAK,CAAC,OAAO,KAAK,WAAW,IAAI;IACnC,KAAK,EAAE,2BAA2B;CACnC,CAAC,GACC,CAAC,KAAK,CAAC,OAAO,KAAK,SAAS,IAAI;IACjC,KAAK,EAAE,yBAAyB;CACjC,CAAC,EACF,EAdS,CAcT,CACH,CAAC;AAEF,IAAM,YAAY,GAAG,IAAA,gBAAM,EAAC,WAAI,CAAC,CAAC;IAChC,OAAO,EAAE,yBAAyB;IAClC,SAAS,EAAE,0BAA0B;IACrC,YAAY,EAAE,YAAY;CAC3B,CAAC,CAAC;AACH;;GAEG;AAEU,QAAA,KAAK,GAAG,KAAK,CAAC,UAAU,CAA6B,UAAC,KAAK,EAAE,GAAG;IAEzE,IAAA,QAAQ,GAKN,KAAK,SALC,EACR,OAAO,GAIL,KAAK,QAJA,EACP,WAAW,GAGT,KAAK,YAHI,EACX,OAAO,GAEL,KAAK,QAFA,EACJ,KAAK,UACN,KAAK,EANH,iDAML,CADS,CACA;IAEV,IAAM,UAAU,GAAG;QACjB,IAAI,OAAO,KAAK,OAAO,EAAE;YACvB,OAAO,CACL,oBAAC,uBAAe,mBACF,MAAM,GAClB,CACH,CAAC;SACH;QAED,IAAI,OAAO,KAAK,WAAW,EAAE;YAC3B,OAAO,CACL,oBAAC,mBAAW,mBACE,MAAM,GAClB,CACH,CAAC;SACH;QAED,IAAI,OAAO,KAAK,SAAS,EAAE;YACzB,OAAO,CACL,oBAAC,uBAAe,mBACF,MAAM,GAClB,CACH,CAAC;SACH;QAED,IAAI,OAAO,KAAK,SAAS,EAAE;YACzB,OAAO,CACL,oBAAC,mCAAgB,IACf,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,WAAW,iBACL,MAAM,GAClB,CACH,CAAC;SACH;QAED,OAAO,IAAI,CAAC;IACd,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,SAAS,aACR,GAAG,EAAE,GAAG,EACR,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,OAAO,IACZ,KAAK;QAER,CAAC,WAAW,IAAI,CACf,oBAAC,SAAS,IACR,OAAO,EAAE,OAAO,IAEf,UAAU,EAAE,CACH,CACb;QACD,oBAAC,YAAY,IAAC,IAAI,EAAC,MAAM;YACvB,oBAAC,uBAAU,IACT,OAAO,EAAC,IAAI,EACZ,KAAK,EAAE,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,IAE7C,QAAQ,CACE,CACA;QACd,OAAO,IAAI,CACV,oBAAC,uBAAU,IACT,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,EAC9C,OAAO,QACP,OAAO,EAAE,OAAO;YAEhB,oBAAC,iBAAS,OAAG,CACF,CACd,CACS,CACb,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,aAAK,CAAC,WAAW,GAAG,OAAO,CAAC;AAE5B,aAAK,CAAC,YAAY,GAAG;IACnB,WAAW,EAAE,IAAI;CAClB,CAAC"}

package/dist/cjs/Chip/chip.js

@@ -62,7 +62,7 @@ var icons_1 = require("../icons");
  */
 var ChipRoot = (0, styled_1.default)('div', {
     shouldForwardProp: function (prop) { return (0, is_prop_valid_1.default)(prop) && prop !== 'color'; },
-})(function (props) { return (__assign(__assign({ display: 'inline-flex', maxWidth: '100%', fontFamily: 'inherit', outline: '0', boxSizing: 'border-box', borderRadius: 'var(--pv-size-base-3)', padding: '0 var(--pv-size-base-2)', height: 'var(--pv-size-base-6)', backgroundColor: 'transparent', transition: 'background-color 200ms, color 200ms, border-color 200ms, box-shadow 200ms', margin: '0 var(--pv-size-base)', cursor: 'default', border: '1px solid transparent', verticalAlign: 'middle', justifyContent: 'center', alignItems: 'center', whiteSpace: 'nowrap', textDecoration: 'none' }, (props.disabled && {
+})(function (props) { return (__assign(__assign({ display: 'inline-flex', maxWidth: '100%', fontFamily: 'inherit', outline: '0', boxSizing: 'border-box', borderRadius: 'var(--pv-size-base-3)', padding: '0 var(--pv-size-base-2)', height: 'var(--pv-size-base-6)', backgroundColor: 'transparent', transition: 'background-color 200ms, color 200ms, border-color 200ms, box-shadow 200ms', margin: '0 var(--pv-size-base)', cursor: 'default', border: '1px solid transparent', verticalAlign: 'middle', justifyContent: 'center', alignItems: 'center', whiteSpace: 'nowrap', textDecoration: 'none', gap: 'var(--pv-size-base)' }, (props.disabled && {
     pointerEvents: 'none',
 })), (Boolean(props.onClick) && !props.disabled && {
     cursor: 'pointer',
@@ -175,11 +175,9 @@ var ChipDeleteIcon = (0, styled_1.default)('span')({
     },
 });
 var ChipStartContent = (0, styled_1.default)('span')({
-    marginRight: 'var(--pv-size-base)',
     display: 'inherit',
 });
 var ChipEndContent = (0, styled_1.default)('span')({
-    marginLeft: 'var(--pv-size-base)',
     display: 'inherit',
 });
 /**

package/dist/cjs/Chip/chip.js.map

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

package/dist/cjs/Dialog/dialog_title.js

@@ -42,9 +42,7 @@ var DialogTitleRoot = (0, styled_1.default)('header')({
     display: 'flex',
     flex: '0 0 auto',
     justifyContent: 'space-between',
-});
-var DialogTitleCloseButton = (0, styled_1.default)(IconButton_1.IconButton)({
-    margin: '0 calc(var(--pv-size-base) * -1) 0 var(--pv-size-base-2)',
+    gap: 'var(--pv-size-base-2)',
 });
 /**
  *
@@ -53,7 +51,7 @@ exports.DialogTitle = react_1.default.forwardRef(function (props, ref) {
     var children = props.children, onClose = props.onClose, other = __rest(props, ["children", "onClose"]);
     return (react_1.default.createElement(DialogTitleRoot, __assign({ ref: ref, "data-key": "dialog.title" }, other),
         react_1.default.createElement(Typography_1.Typography, { variant: "h4", color: "inherit" }, children),
-        onClose && (react_1.default.createElement(DialogTitleCloseButton, { size: "small", onClick: onClose },
+        onClose && (react_1.default.createElement(IconButton_1.IconButton, { size: "small", onClick: onClose },
             react_1.default.createElement(icons_1.CloseIcon, null)))));
 });
 exports.DialogTitle.displayName = 'DialogTitle';

package/dist/cjs/Dialog/dialog_title.js.map

@@ -1 +1 @@
-{"version":3,"file":"dialog_title.js","sourceRoot":"","sources":["../../../src/Dialog/dialog_title.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,gDAA0B;AAC1B,2DAAqC;AACrC,4CAA2C;AAC3C,4CAA2C;AAC3C,kCAAqC;AAqBrC;;GAEG;AAEH;;GAEG;AACH,IAAM,eAAe,GAAG,IAAA,gBAAM,EAAC,QAAQ,CAAC,CAAC;IACvC,OAAO,EAAE,mEAAmE;IAC5E,OAAO,EAAE,MAAM;IACf,IAAI,EAAE,UAAU;IAChB,cAAc,EAAE,eAAe;CAChC,CAAC,CAAC;AAEH,IAAM,sBAAsB,GAAG,IAAA,gBAAM,EAAC,uBAAU,CAAC,CAAC;IAChD,MAAM,EAAE,0DAA0D;CACnE,CAAC,CAAC;AACH;;GAEG;AAEU,QAAA,WAAW,GAAG,eAAK,CAAC,UAAU,CAAmC,UAAC,KAAK,EAAE,GAAG;IAErF,IAAA,QAAQ,GAGN,KAAK,SAHC,EACR,OAAO,GAEL,KAAK,QAFA,EACJ,KAAK,UACN,KAAK,EAJH,uBAIL,CADS,CACA;IAEV,OAAO,CACL,8BAAC,eAAe,aACd,GAAG,EAAE,GAAG,cACC,cAAc,IACnB,KAAK;QAET,8BAAC,uBAAU,IACT,OAAO,EAAC,IAAI,EACZ,KAAK,EAAC,SAAS,IAEd,QAAQ,CACE;QAEZ,OAAO,IAAI,CACV,8BAAC,sBAAsB,IACrB,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,OAAO;YAEhB,8BAAC,iBAAS,OAAG,CACU,CAC1B,CACe,CACnB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,mBAAW,CAAC,WAAW,GAAG,aAAa,CAAC;AAExC,mBAAW,CAAC,YAAY,GAAG,EAAE,CAAC"}
+{"version":3,"file":"dialog_title.js","sourceRoot":"","sources":["../../../src/Dialog/dialog_title.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,gDAA0B;AAC1B,2DAAqC;AACrC,4CAA2C;AAC3C,4CAA2C;AAC3C,kCAAqC;AAqBrC;;GAEG;AAEH;;GAEG;AACH,IAAM,eAAe,GAAG,IAAA,gBAAM,EAAC,QAAQ,CAAC,CAAC;IACvC,OAAO,EAAE,mEAAmE;IAC5E,OAAO,EAAE,MAAM;IACf,IAAI,EAAE,UAAU;IAChB,cAAc,EAAE,eAAe;IAC/B,GAAG,EAAE,uBAAuB;CAC7B,CAAC,CAAC;AACH;;GAEG;AAEU,QAAA,WAAW,GAAG,eAAK,CAAC,UAAU,CAAmC,UAAC,KAAK,EAAE,GAAG;IAErF,IAAA,QAAQ,GAGN,KAAK,SAHC,EACR,OAAO,GAEL,KAAK,QAFA,EACJ,KAAK,UACN,KAAK,EAJH,uBAIL,CADS,CACA;IAEV,OAAO,CACL,8BAAC,eAAe,aACd,GAAG,EAAE,GAAG,cACC,cAAc,IACnB,KAAK;QAET,8BAAC,uBAAU,IACT,OAAO,EAAC,IAAI,EACZ,KAAK,EAAC,SAAS,IAEd,QAAQ,CACE;QAEZ,OAAO,IAAI,CACV,8BAAC,uBAAU,IACT,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,OAAO;YAEhB,8BAAC,iBAAS,OAAG,CACF,CACd,CACe,CACnB,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,mBAAW,CAAC,WAAW,GAAG,aAAa,CAAC;AAExC,mBAAW,CAAC,YAAY,GAAG,EAAE,CAAC"}

package/dist/cjs/NativeSelect/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NativeSelect = void 0;
+var native_select_1 = require("./native_select");
+Object.defineProperty(exports, "NativeSelect", { enumerable: true, get: function () { return native_select_1.NativeSelect; } });
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/NativeSelect/index.ts"],"names":[],"mappings":";;;AAAA,iDAA+C;AAAtC,6GAAA,YAAY,OAAA"}

package/dist/cjs/NativeSelect/native_select.js

@@ -0,0 +1,151 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = 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];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NativeSelect = void 0;
+var React = __importStar(require("react"));
+var styled_1 = __importDefault(require("@emotion/styled"));
+var Typography_1 = require("../Typography");
+var icons_1 = require("../icons");
+/**
+ *
+ */
+/**
+ * Styles.
+ */
+var NativeSelectRoot = (0, styled_1.default)('select')(function (props) { return (__assign(__assign(__assign({ fontFamily: 'inherit', outline: 'none', cursor: 'pointer', boxSizing: 'border-box', width: '100%', borderRadius: '4px', padding: '0 calc(var(--pv-size-base-2) + 24px) 0 var(--pv-size-base-2)', backgroundColor: 'var(--pv-color-gray-1)', borderStyle: 'solid', borderWidth: '1px', transition: 'background-color 200ms, color 200ms, border-color 200ms', display: 'block', appearance: 'none', fontWeight: 'var(--pv-text-c1-weight)', fontSize: 'var(--pv-text-c1-size)', lineHeight: 'var(--pv-text-c1-height)', letterSpacing: 'var(--pv-text-c1-spacing)' }, (props.selectSize === 'small' && {
+    height: 'var(--pv-size-base-6)',
+})), (props.selectSize === 'medium' && {
+    height: 'var(--pv-size-base-7)',
+})), (props.selectSize === 'large' && {
+    height: 'var(--pv-size-base-8)',
+}))); }, function (props) {
+    var isDark = props.theme.mode === 'dark';
+    var color = isDark
+        ? 'var(--pv-color-white)'
+        : 'var(--pv-color-black)';
+    var borderColor = 'var(--pv-color-gray-8)';
+    var borderColorHover = 'var(--pv-color-gray-7)';
+    var borderColorDisabled = 'var(--pv-color-gray-5)';
+    var colorDisabled = 'var(--pv-color-gray-7)';
+    var invalidBackgroundColor = 'var(--pv-color-wrong-tint-5)';
+    var invalidBorderColor = 'var(--pv-color-wrong-tint-3)';
+    var backgroundColorFocus = 'var(--pv-color-secondary-tint-5)';
+    var borderColorFocus = 'var(--pv-color-secondary-tint-3)';
+    if (isDark) {
+        borderColor = 'var(--pv-color-gray-5)';
+        borderColorHover = 'var(--pv-color-gray-4)';
+        borderColorDisabled = 'var(--pv-color-gray-4)';
+        colorDisabled = 'var(--pv-color-gray-4)';
+        invalidBackgroundColor = 'var(--pv-color-wrong-shade-4)';
+        invalidBorderColor = 'var(--pv-color-wrong-shade-1)';
+        backgroundColorFocus = 'var(--pv-color-secondary-shade-4)';
+        borderColorFocus = 'var(--pv-color-secondary-shade-1)';
+    }
+    return ({
+        color: color,
+        borderColor: borderColor,
+        '&:hover': {
+            backgroundColor: 'var(--pv-color-gray-3)',
+            borderColor: borderColorHover,
+        },
+        '&:disabled': {
+            cursor: 'not-allowed',
+            backgroundColor: 'var(--pv-color-gray-1)',
+            borderColor: borderColorDisabled,
+            color: colorDisabled,
+        },
+        '&:not(:disabled)': {
+            '&[aria-invalid]': {
+                backgroundColor: invalidBackgroundColor,
+                borderColor: invalidBorderColor,
+            },
+            '&:focus-visible': {
+                backgroundColor: backgroundColorFocus,
+                borderColor: borderColorFocus,
+            },
+        },
+    });
+});
+var NativeSelectLabel = (0, styled_1.default)('label')({
+    marginBottom: '2px',
+    display: 'inline-block',
+});
+var NativeSelectErrorMessage = (0, styled_1.default)(Typography_1.Typography)({
+    marginTop: '2px',
+});
+var NativeSelectContainer = (0, styled_1.default)('div')({
+    position: 'relative',
+});
+var NativeSelectArrowIcon = (0, styled_1.default)(icons_1.ArrowDropDownIcon)(function (props) { return (__assign({ position: 'absolute', right: '0px', top: 'calc(50% - 12px)', pointerEvents: 'none', margin: '0px var(--pv-size-base)', color: 'var(--pv-color-gray-10)' }, (props.disabled && {
+    color: 'var(--pv-color-gray-7)',
+}))); });
+/**
+ *
+ */
+exports.NativeSelect = React.forwardRef(function (props, ref) {
+    var options = props.options, size = props.size, label = props.label, inputProps = props.inputProps, disabled = props.disabled, defaultValue = props.defaultValue, id = props.id, value = props.value, placeholder = props.placeholder, required = props.required, name = props.name, inputRef = props.inputRef, error = props.error, errorText = props.errorText, autoFocus = props.autoFocus, onChange = props.onChange, other = __rest(props, ["options", "size", "label", "inputProps", "disabled", "defaultValue", "id", "value", "placeholder", "required", "name", "inputRef", "error", "errorText", "autoFocus", "onChange"]);
+    return (React.createElement("div", __assign({ ref: ref }, other),
+        label && (React.createElement(NativeSelectLabel, { htmlFor: id },
+            React.createElement(Typography_1.Typography, { component: "span", variant: "c2", color: "gray-10" }, label))),
+        React.createElement(NativeSelectContainer, null,
+            React.createElement(NativeSelectRoot, __assign({ selectSize: size, disabled: disabled, defaultValue: defaultValue, id: id, value: value, required: required, name: name, ref: inputRef, 
+                // eslint-disable-next-line jsx-a11y/no-autofocus
+                autoFocus: autoFocus, "aria-invalid": error || undefined, onChange: onChange }, inputProps),
+                placeholder && (React.createElement("option", { value: "" }, placeholder)),
+                options.map(function (option) { return (React.createElement("option", { key: option.value, value: option.value }, option.label)); })),
+            React.createElement(NativeSelectArrowIcon, { disabled: disabled, "aria-hidden": true })),
+        error && errorText && (React.createElement(NativeSelectErrorMessage, { variant: "c2", color: "wrong" }, errorText))));
+});
+exports.NativeSelect.displayName = 'NativeSelect';
+exports.NativeSelect.defaultProps = {
+    disabled: false,
+    size: 'medium',
+};
+//# sourceMappingURL=native_select.js.map

package/dist/cjs/NativeSelect/native_select.js.map

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

package/dist/cjs/Select/select.js

@@ -10,29 +10,6 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = 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];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -49,28 +26,37 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Select = void 0;
-var React = __importStar(require("react"));
+var react_1 = __importDefault(require("react"));
 var styled_1 = __importDefault(require("@emotion/styled"));
+var hooks_1 = require("../hooks");
+var Popover_1 = require("../Popover");
+var TextField_1 = require("../TextField");
 var Typography_1 = require("../Typography");
+var Box_1 = require("../Box");
+var Chip_1 = require("../Chip");
+var Button_1 = require("../Button");
 var icons_1 = require("../icons");
+var MenuList_1 = require("../MenuList");
 /**
  *
  */
 /**
  * Styles.
  */
-var SelectRoot = (0, styled_1.default)('select')(function (props) { return (__assign(__assign(__assign({ fontFamily: 'inherit', outline: 'none', cursor: 'pointer', boxSizing: 'border-box', width: '100%', borderRadius: '4px', padding: '0 calc(var(--pv-size-base-2) + 24px) 0 var(--pv-size-base-2)', backgroundColor: 'var(--pv-color-gray-1)', borderStyle: 'solid', borderWidth: '1px', transition: 'background-color 200ms, color 200ms, border-color 200ms', display: 'block', appearance: 'none', fontWeight: 'var(--pv-text-c1-weight)', fontSize: 'var(--pv-text-c1-size)', lineHeight: 'var(--pv-text-c1-height)', letterSpacing: 'var(--pv-text-c1-spacing)' }, (props.selectSize === 'small' && {
+var SelectField = (0, styled_1.default)(Typography_1.Typography)(function (props) { return (__assign(__assign(__assign({ outline: 'none', boxSizing: 'border-box', width: '100%', borderRadius: '4px', padding: '0 calc(var(--pv-size-base-2) + 24px) 0 var(--pv-size-base-2)', backgroundColor: 'var(--pv-color-gray-1)', borderStyle: 'solid', borderWidth: '1px', transition: 'background-color 200ms, color 200ms, border-color 200ms', appearance: 'none', userSelect: 'none', textAlign: 'left', cursor: 'pointer', fontFamily: 'inherit', height: 'var(--pv-size-base-8)', position: 'relative' }, (props.size === 'small' && {
     height: 'var(--pv-size-base-6)',
-})), (props.selectSize === 'medium' && {
+})), (props.size === 'medium' && {
     height: 'var(--pv-size-base-7)',
-})), (props.selectSize === 'large' && {
-    height: 'var(--pv-size-base-8)',
+})), (props.multiple === true && {
+    display: 'inline-flex',
+    alignItems: 'center',
 }))); }, function (props) {
     var isDark = props.theme.mode === 'dark';
     var color = isDark
         ? 'var(--pv-color-white)'
         : 'var(--pv-color-black)';
     var borderColor = 'var(--pv-color-gray-8)';
+    var colorPlaceholder = 'var(--pv-color-gray-9)';
     var borderColorHover = 'var(--pv-color-gray-7)';
     var borderColorDisabled = 'var(--pv-color-gray-5)';
     var colorDisabled = 'var(--pv-color-gray-7)';
@@ -80,6 +66,7 @@ var SelectRoot = (0, styled_1.default)('select')(function (props) { return (__as
     var borderColorFocus = 'var(--pv-color-secondary-tint-3)';
     if (isDark) {
         borderColor = 'var(--pv-color-gray-5)';
+        colorPlaceholder = 'var(--pv-color-gray-6)';
         borderColorHover = 'var(--pv-color-gray-4)';
         borderColorDisabled = 'var(--pv-color-gray-4)';
         colorDisabled = 'var(--pv-color-gray-4)';
@@ -89,7 +76,6 @@ var SelectRoot = (0, styled_1.default)('select')(function (props) { return (__as
         borderColorFocus = 'var(--pv-color-secondary-shade-1)';
     }
     return ({
-        color: color,
         borderColor: borderColor,
         '&:hover': {
             backgroundColor: 'var(--pv-color-gray-3)',
@@ -102,6 +88,10 @@ var SelectRoot = (0, styled_1.default)('select')(function (props) { return (__as
             color: colorDisabled,
         },
         '&:not(:disabled)': {
+            color: color,
+            '&[aria-placeholder]': {
+                color: colorPlaceholder,
+            },
             '&[aria-invalid]': {
                 backgroundColor: invalidBackgroundColor,
                 borderColor: invalidBorderColor,
@@ -113,39 +103,166 @@ var SelectRoot = (0, styled_1.default)('select')(function (props) { return (__as
         },
     });
 });
-var SelectLabel = (0, styled_1.default)('label')({
-    marginBottom: '2px',
-    display: 'inline-block',
+var SelectArrowIcon = (0, styled_1.default)(icons_1.ArrowDropDownIcon)({
+    position: 'absolute',
+    right: '0px',
+    top: 'calc(50% - 12px)',
+    margin: '0px var(--pv-size-base)',
+    color: 'var(--pv-color-gray-10)',
+    '&[aria-disabled="true"]': {
+        color: 'inherit',
+    },
 });
-var SelectErrorMessage = (0, styled_1.default)(Typography_1.Typography)({
-    marginTop: '2px',
+var SelectNativeInput = (0, styled_1.default)('input')({
+    bottom: 0,
+    left: 0,
+    height: '100%',
+    position: 'absolute',
+    opacity: 0,
+    pointerEvents: 'none',
+    width: '100%',
+    boxSizing: 'border-box',
 });
-var SelectContainer = (0, styled_1.default)('div')({
+var SelectDropdownStateItem = (0, styled_1.default)('div')({
+    padding: 'var(--pv-size-base-3) var(--pv-size-base-2)',
+});
+var SelectDropdownList = (0, styled_1.default)('ul')({
+    maxHeight: '36vh',
+    overflowY: 'auto',
+    margin: 0,
+    listStyleType: 'none',
     position: 'relative',
+    padding: '10px 0',
+});
+var SelectDropdownGroupName = (0, styled_1.default)(Typography_1.Typography)(function (props) { return ({
+    padding: 'var(--pv-size-base-2)',
+    color: props.theme.mode === 'dark'
+        ? 'var(--pv-color-gray-6)'
+        : 'var(--pv-color-gray-9)',
+}); });
+var SelectDropdownGroupList = (0, styled_1.default)('ul')({
+    padding: 0,
+    listStyleType: 'none',
 });
-var SelectArrowIcon = (0, styled_1.default)(icons_1.ArrowDropDownIcon)(function (props) { return (__assign({ position: 'absolute', right: '0px', top: 'calc(50% - 12px)', pointerEvents: 'none', margin: '0px var(--pv-size-base)', color: 'var(--pv-color-gray-10)' }, (props.disabled && {
-    color: 'var(--pv-color-gray-7)',
+var SelectDropdownGroupListItem = (0, styled_1.default)(MenuList_1.MenuItem)(function (props) { return (__assign({}, (props.inGroup && {
+    padding: '0px var(--pv-size-base-2) 0 var(--pv-size-base-3)',
 }))); });
+var SelectPopover = (0, styled_1.default)(Popover_1.Popover)({
+    minWidth: 240,
+});
+var SelectTagsList = (0, styled_1.default)('div')({
+    overflow: 'hidden',
+    width: '100%',
+    display: 'grid',
+    gridTemplateColumns: 'repeat(auto-fit, minmax(0, max-content))',
+    gap: 'var(--pv-size-base)',
+});
+var SelectTag = (0, styled_1.default)(Chip_1.Chip)(function (props) { return (__assign({ label: 'Select-tag', borderRadius: '3px', margin: 0 }, (props.size === 'small' && {
+    height: 'var(--pv-size-base-5)',
+}))); });
+var SelectTagSize = (0, styled_1.default)(Typography_1.Typography)({
+    margin: '0 var(--pv-size-base-2)',
+});
+var SelectSearchInput = (0, styled_1.default)(TextField_1.TextField)({
+    padding: 'var(--pv-size-base-3) var(--pv-size-base-3) var(--pv-size-base-2)',
+});
+var SelectCreateNewButton = (0, styled_1.default)(Button_1.Button)({
+    width: '100%',
+    borderRadius: 0,
+    justifyContent: 'left',
+    padding: '0px var(--pv-size-base-2)',
+});
+var SelectError = (0, styled_1.default)(Typography_1.Typography)({
+    marginTop: '2px',
+});
+var SelectLabel = (0, styled_1.default)('label')({
+    label: 'TextField-label',
+    marginBottom: '2px',
+    display: 'inline-block',
+});
 /**
  *
  */
-exports.Select = React.forwardRef(function (props, ref) {
-    var options = props.options, size = props.size, label = props.label, inputProps = props.inputProps, disabled = props.disabled, defaultValue = props.defaultValue, id = props.id, value = props.value, placeholder = props.placeholder, required = props.required, name = props.name, inputRef = props.inputRef, error = props.error, errorText = props.errorText, autoFocus = props.autoFocus, onChange = props.onChange, other = __rest(props, ["options", "size", "label", "inputProps", "disabled", "defaultValue", "id", "value", "placeholder", "required", "name", "inputRef", "error", "errorText", "autoFocus", "onChange"]);
-    return (React.createElement("div", __assign({ ref: ref }, other),
-        label && (React.createElement(SelectLabel, { htmlFor: id },
-            React.createElement(Typography_1.Typography, { component: "span", variant: "c2", color: "gray-10" }, label))),
-        React.createElement(SelectContainer, null,
-            React.createElement(SelectRoot, __assign({ selectSize: size, disabled: disabled, defaultValue: defaultValue, id: id, value: value, required: required, name: name, ref: inputRef, 
-                // eslint-disable-next-line jsx-a11y/no-autofocus
-                autoFocus: autoFocus, "aria-invalid": error || undefined, onChange: onChange }, inputProps),
-                placeholder && (React.createElement("option", { value: "" }, placeholder)),
-                options.map(function (option) { return (React.createElement("option", { key: option.value, value: option.value }, option.label)); })),
-            React.createElement(SelectArrowIcon, { disabled: disabled, "aria-hidden": true })),
-        error && errorText && (React.createElement(SelectErrorMessage, { variant: "c2", color: "wrong" }, errorText))));
-});
-exports.Select.displayName = 'Select';
+var Select = function (props) {
+    var className = props.className, size = props.size, placeholder = props.placeholder, label = props.label, disableSearch = props.disableSearch, _a = props.disabled, disabled = _a === void 0 ? false : _a, noOptionsText = props.noOptionsText, loading = props.loading, loadingText = props.loadingText, _b = props.limitTags, limitTags = _b === void 0 ? 2 : _b, name = props.name, required = props.required, _c = props.multiple, multiple = _c === void 0 ? false : _c, readOnly = props.readOnly, createOptionText = props.createOptionText, allowCreateOption = props.allowCreateOption, error = props.error, errorText = props.errorText, renderRootProp = props.renderRoot, renderOptionProp = props.renderOption, _d = props.getLimitTagsText, getLimitTagsText = _d === void 0 ? function (more) { return "".concat(more, " more"); } : _d, groupBy = props.groupBy, onCreate = props.onCreate;
+    var _e = (0, hooks_1.useAutocomplete)(props), id = _e.id, value = _e.value, searchValue = _e.searchValue, groupedOptions = _e.groupedOptions, getRootProps = _e.getRootProps, getInputLabelProps = _e.getInputLabelProps, getInputProps = _e.getInputProps, getListboxProps = _e.getListboxProps, getOptionProps = _e.getOptionProps, getPopoverProps = _e.getPopoverProps, getTagProps = _e.getTagProps, getOptionLabel = _e.getOptionLabel;
+    var _f = getInputProps(), onChange = _f.onChange, otherInputProps = __rest(_f, ["onChange"]);
+    var popoverProps = getPopoverProps();
+    var handleCreate = function (event) {
+        if (onCreate) {
+            onCreate(event, searchValue);
+        }
+        popoverProps.onClose(event);
+    };
+    var defaultRenderOption = function (propsOption, option) { return (react_1.default.createElement(SelectDropdownGroupListItem, __assign({}, propsOption, { inGroup: Boolean(groupBy) }), getOptionLabel(option))); };
+    var renderGroup = function (params) { return (react_1.default.createElement("li", { key: params.key },
+        react_1.default.createElement(SelectDropdownGroupName, { variant: "c1", color: "gray-10" }, params.group),
+        react_1.default.createElement(SelectDropdownGroupList, null, params.children))); };
+    var renderValue = function () {
+        if (!value || (Array.isArray(value) && value.length === 0)) {
+            return null;
+        }
+        if (Array.isArray(value)) {
+            var more = (value.length > limitTags) ? (value.length - limitTags) : 0;
+            var valueLimits = more > 0 ? value.slice(0, limitTags) : value;
+            return (react_1.default.createElement(react_1.default.Fragment, null,
+                react_1.default.createElement(SelectTagsList, null, valueLimits.map(function (v, index) { return (react_1.default.createElement(SelectTag, __assign({}, getTagProps(v, index), { color: "secondary", variant: "contained", size: size }), getOptionLabel(v))); })),
+                !!more && (react_1.default.createElement(SelectTagSize, { variant: "c2", color: "gray-9" }, getLimitTagsText(more)))));
+        }
+        return getOptionLabel(value);
+    };
+    var renderedValue = renderValue();
+    var isValueEmpty = renderedValue === null;
+    var defaultRenderRoot = function (propsRoot, valueRoot) { return (react_1.default.createElement(SelectField, __assign({}, propsRoot, { noWrap: true, 
+        // @ts-ignore
+        component: "button", type: "button", variant: size === 'small' ? 'c1' : 'b3', "aria-invalid": error || undefined, "aria-placeholder": isValueEmpty || undefined, multiple: multiple, size: size }),
+        isValueEmpty ? placeholder : renderedValue,
+        react_1.default.createElement(SelectArrowIcon, { "aria-disabled": disabled, "aria-hidden": true }),
+        react_1.default.createElement(SelectNativeInput, { type: "text", value: isValueEmpty ? '' : JSON.stringify(valueRoot), tabIndex: -1, "aria-hidden": "true", disabled: disabled, autoComplete: "off", id: id, name: name, required: required, readOnly: readOnly, onChange: function () { } }))); };
+    var renderOption = renderOptionProp || defaultRenderOption;
+    var renderRoot = renderRootProp || defaultRenderRoot;
+    var renderListOption = function (option, index) {
+        var optionProps = getOptionProps(option, index);
+        return renderOption(optionProps, option);
+    };
+    return (react_1.default.createElement("div", { className: className },
+        label && (react_1.default.createElement(SelectLabel, __assign({}, getInputLabelProps()),
+            react_1.default.createElement(Typography_1.Typography, { component: "span", variant: "c2", color: "gray-10" }, label))),
+        renderRoot(__assign(__assign({}, getRootProps()), { disabled: disabled }), value, getTagProps),
+        error && errorText && (react_1.default.createElement(SelectError, { variant: "c2", color: "wrong" }, errorText)),
+        react_1.default.createElement(SelectPopover, __assign({ placement: "bottom-start", allowUseSameWidth: true }, popoverProps),
+            !disableSearch && (react_1.default.createElement(Box_1.Box, { borderColor: "gray-3", borderPosition: "bottom", borderStyle: "solid", borderWidth: 1 },
+                react_1.default.createElement(SelectSearchInput, { id: otherInputProps.id, inputProps: otherInputProps, onChange: onChange, placeholder: "Search", disabled: loading }))),
+            loading && groupedOptions.length === 0 && (react_1.default.createElement(SelectDropdownStateItem, null, typeof loadingText === 'string' ? (react_1.default.createElement(Typography_1.Typography, { variant: "b2", color: "gray-10" }, loadingText)) : loadingText)),
+            groupedOptions.length === 0 && !loading && (react_1.default.createElement(SelectDropdownStateItem, null, typeof noOptionsText === 'string' ? (react_1.default.createElement(Typography_1.Typography, { variant: "b2", color: "gray-10" }, noOptionsText)) : noOptionsText)),
+            groupedOptions.length > 0 && (react_1.default.createElement(SelectDropdownList, __assign({}, getListboxProps()), groupedOptions
+                // @ts-ignore
+                .map(function (option, index) {
+                // @ts-ignore
+                if (groupBy && 'options' in option) {
+                    return renderGroup({
+                        key: option.key,
+                        group: option.group,
+                        // @ts-ignore
+                        children: option.options.map(function (option2, index2) { return (renderListOption(option2, option.index + index2)); }),
+                    });
+                }
+                return renderListOption(option, index);
+            }))),
+            (allowCreateOption && searchValue.length > 0 && !loading) && (react_1.default.createElement(Box_1.Box, { borderColor: "gray-3", borderPosition: "top", borderStyle: "solid", borderWidth: 1 },
+                react_1.default.createElement(SelectCreateNewButton, { color: "secondary", textVariant: "b3", onClick: handleCreate, startIcon: react_1.default.createElement(icons_1.PlusIcon, null) }, createOptionText.replace('{{value}}', searchValue)))))));
+};
+exports.Select = Select;
+// @ts-ignore
 exports.Select.defaultProps = {
-    disabled: false,
+    disableSearch: false,
+    noOptionsText: 'No options',
+    loading: false,
+    loadingText: 'Loading...',
+    limitTags: 2,
+    required: false,
+    allowCreateOption: false,
+    createOptionText: 'Create "{{value}}"',
     size: 'medium',
 };
 //# sourceMappingURL=select.js.map