@alixpartners/ui-components 1.22.2 → 1.22.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/esm/components/ApSelect/ApSelect.js +6 -4
- package/dist/esm/components/ApSelect/ApSelect.js.map +1 -1
- package/dist/esm/components/ApSelect/ApSelect.styles.js +6 -3
- package/dist/esm/components/ApSelect/ApSelect.styles.js.map +1 -1
- package/dist/types/components/ApSelect/ApSelect.d.ts +1 -0
- package/dist/types/components/ApSelect/ApSelect.styles.d.ts +5 -1
- package/dist/umd/index.js +2 -2
- package/package.json +2 -2
|
@@ -27,12 +27,14 @@ var React = require("react");
|
|
|
27
27
|
var ApIcon_1 = require("../ApIcon");
|
|
28
28
|
var ApSelect_styles_1 = require("./ApSelect.styles");
|
|
29
29
|
exports.ApSelect = function (_a) {
|
|
30
|
-
var disabled = _a.disabled, name = _a.name, onChange = _a.onChange, options = _a.options, placeholder = _a.placeholder, value = _a.value, props = __rest(_a, ["disabled", "name", "onChange", "options", "placeholder", "value"]);
|
|
31
|
-
return (React.createElement(ApSelect_styles_1.Wrapper,
|
|
30
|
+
var disabled = _a.disabled, name = _a.name, onChange = _a.onChange, options = _a.options, placeholder = _a.placeholder, value = _a.value, backgroundColor = _a.backgroundColor, props = __rest(_a, ["disabled", "name", "onChange", "options", "placeholder", "value", "backgroundColor"]);
|
|
31
|
+
return (React.createElement(ApSelect_styles_1.Wrapper, { bg: backgroundColor },
|
|
32
32
|
React.createElement(ApSelect_styles_1.Arrow, null,
|
|
33
33
|
React.createElement(ApIcon_1.ApIcon, { iconName: "baseline_arrow_drop_down" })),
|
|
34
|
-
React.createElement(ApSelect_styles_1.Select, __assign({ disabled: disabled, id: "select-" + name, value: value, onChange: function (e) {
|
|
35
|
-
|
|
34
|
+
React.createElement(ApSelect_styles_1.Select, __assign({ disabled: disabled, id: "select-" + name, value: value, onChange: function (e) {
|
|
35
|
+
onChange(e.target.value);
|
|
36
|
+
} }, props),
|
|
37
|
+
placeholder ? (React.createElement("option", { value: "", hidden: true }, placeholder)) : null,
|
|
36
38
|
options.map(function (opt) { return (React.createElement("option", { key: "name-dropdown-" + opt.value + "-" + opt.label, value: opt.value }, opt.label)); }))));
|
|
37
39
|
};
|
|
38
40
|
//# sourceMappingURL=ApSelect.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ApSelect.js","sourceRoot":"","sources":["../../../../src/components/ApSelect/ApSelect.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA,
|
|
1
|
+
{"version":3,"file":"ApSelect.js","sourceRoot":"","sources":["../../../../src/components/ApSelect/ApSelect.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6BAA8B;AAE9B,oCAAkC;AAElC,qDAA0D;AAiB7C,QAAA,QAAQ,GAA6B,UAAC,EASlD;IARC,IAAA,QAAQ,cAAA,EACR,IAAI,UAAA,EACJ,QAAQ,cAAA,EACR,OAAO,aAAA,EACP,WAAW,iBAAA,EACX,KAAK,WAAA,EACL,eAAe,qBAAA,EACZ,KAAK,cARyC,sFASlD,CADS;IAER,OAAO,CACL,oBAAC,yBAAO,IAAC,EAAE,EAAE,eAAe;QAC1B,oBAAC,uBAAK;YACJ,oBAAC,eAAM,IAAC,QAAQ,EAAC,0BAA0B,GAAG,CACxC;QACR,oBAAC,wBAAM,aACL,QAAQ,EAAE,QAAQ,EAClB,EAAE,EAAE,YAAU,IAAM,EACpB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,UAAC,CAAuC;gBAChD,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;YAC1B,CAAC,IACG,KAAK;YAER,WAAW,CAAC,CAAC,CAAC,CACb,gCAAQ,KAAK,EAAC,EAAE,EAAC,MAAM,UACpB,WAAW,CACL,CACV,CAAC,CAAC,CAAC,IAAI;YACP,OAAO,CAAC,GAAG,CAAC,UAAC,GAAY,IAAK,OAAA,CAC7B,gCACE,GAAG,EAAE,mBAAiB,GAAG,CAAC,KAAK,SAAI,GAAG,CAAC,KAAO,EAC9C,KAAK,EAAE,GAAG,CAAC,KAAK,IAEf,GAAG,CAAC,KAAK,CACH,CACV,EAP8B,CAO9B,CAAC,CACK,CACD,CACX,CAAA;AACH,CAAC,CAAA"}
|
|
@@ -7,8 +7,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
7
7
|
exports.Select = exports.Wrapper = exports.Arrow = void 0;
|
|
8
8
|
var styled_components_1 = require("styled-components");
|
|
9
9
|
var theme_1 = require("../../utils/theme");
|
|
10
|
-
exports.Arrow = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n
|
|
11
|
-
exports.Wrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n
|
|
12
|
-
|
|
10
|
+
exports.Arrow = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n position: absolute;\n width: 32px;\n height: 40px;\n right: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n"], ["\n position: absolute;\n width: 32px;\n height: 40px;\n right: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n"])));
|
|
11
|
+
exports.Wrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n position: relative;\n display: flex;\n ", "\n"], ["\n position: relative;\n display: flex;\n ", "\n"])), function (_a) {
|
|
12
|
+
var bg = _a.bg;
|
|
13
|
+
return (bg ? "background-color: " + bg + ";" : '');
|
|
14
|
+
});
|
|
15
|
+
exports.Select = styled_components_1.default.select(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n height: 40px;\n width: 100%;\n min-width: 120px;\n padding-right: 32px;\n border: 1px solid ", ";\n border-radius: 1px;\n background-color: transparent;\n display: flex;\n justify-content: space-between;\n align-items: center;\n color: ", ";\n font-size: 16px;\n line-height: 24px;\n appearance: none;\n text-indent: 8px;\n cursor: pointer;\n overflow: hidden;\n text-overflow: ellipsis;\n z-index: 1;\n &:hover,\n &:focus {\n border-color: ", ";\n outline: none;\n }\n &:active {\n border-color: ", ";\n outline: none;\n }\n &:disabled {\n pointer-events: none;\n color: ", ";\n border-color: ", ";\n }\n"], ["\n height: 40px;\n width: 100%;\n min-width: 120px;\n padding-right: 32px;\n border: 1px solid ", ";\n border-radius: 1px;\n background-color: transparent;\n display: flex;\n justify-content: space-between;\n align-items: center;\n color: ", ";\n font-size: 16px;\n line-height: 24px;\n appearance: none;\n text-indent: 8px;\n cursor: pointer;\n overflow: hidden;\n text-overflow: ellipsis;\n z-index: 1;\n &:hover,\n &:focus {\n border-color: ", ";\n outline: none;\n }\n &:active {\n border-color: ", ";\n outline: none;\n }\n &:disabled {\n pointer-events: none;\n color: ", ";\n border-color: ", ";\n }\n"])), theme_1.colors.grey4, theme_1.colors.grey8, theme_1.colors.green2, theme_1.colors.green3, theme_1.colors.grey5, theme_1.colors.grey2);
|
|
13
16
|
var templateObject_1, templateObject_2, templateObject_3;
|
|
14
17
|
//# sourceMappingURL=ApSelect.styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ApSelect.styles.js","sourceRoot":"","sources":["../../../../src/components/ApSelect/ApSelect.styles.ts"],"names":[],"mappings":";;;;;;;AAAA,
|
|
1
|
+
{"version":3,"file":"ApSelect.styles.js","sourceRoot":"","sources":["../../../../src/components/ApSelect/ApSelect.styles.ts"],"names":[],"mappings":";;;;;;;AAAA,uDAAsC;AAEtC,2CAA0C;AAM7B,QAAA,KAAK,GAAG,2BAAM,CAAC,GAAG,kNAAA,+IAQ9B,KAAA;AAEY,QAAA,OAAO,GAAG,2BAAM,CAAC,GAAG,wHAAe,+CAG5C,EAAkD,IACrD,KADG,UAAC,EAAM;QAAJ,EAAE,QAAA;IAAO,OAAA,CAAC,EAAE,CAAC,CAAC,CAAC,uBAAqB,EAAE,MAAG,CAAC,CAAC,CAAC,EAAE,CAAC;AAAtC,CAAsC,EACrD;AAEY,QAAA,MAAM,GAAG,2BAAM,CAAC,MAAM,otBAAA,sGAKb,EAAY,oJAMvB,EAAY,wNAWH,EAAa,8DAIb,EAAa,oFAKpB,EAAY,uBACL,EAAY,UAE/B,KA7BqB,cAAM,CAAC,KAAK,EAMvB,cAAM,CAAC,KAAK,EAWH,cAAM,CAAC,MAAM,EAIb,cAAM,CAAC,MAAM,EAKpB,cAAM,CAAC,KAAK,EACL,cAAM,CAAC,KAAK,EAE/B"}
|
|
@@ -1,3 +1,7 @@
|
|
|
1
|
+
interface IWrapperProps {
|
|
2
|
+
bg?: string;
|
|
3
|
+
}
|
|
1
4
|
export declare const Arrow: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
2
|
-
export declare const Wrapper: import("styled-components").StyledComponent<"div", any,
|
|
5
|
+
export declare const Wrapper: import("styled-components").StyledComponent<"div", any, IWrapperProps, never>;
|
|
3
6
|
export declare const Select: import("styled-components").StyledComponent<"select", any, {}, never>;
|
|
7
|
+
export {};
|