@rhc-shared-components/form-select-component 0.1.2 → 0.1.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.
@@ -17,6 +17,7 @@ export interface FormSelectProps {
17
17
  subInfo?: string;
18
18
  ariaLabel?: string;
19
19
  helperText?: string;
20
+ onChange?: (_event: any, selection: any) => void;
20
21
  }
21
22
  declare const FormSelect: React.FC<FormSelectProps>;
22
23
  export default FormSelect;
package/dist/index.js CHANGED
@@ -23,6 +23,22 @@ function _interopNamespace(e) {
23
23
 
24
24
  var React__namespace = /*#__PURE__*/_interopNamespace(React);
25
25
 
26
+ function _inheritsLoose(subClass, superClass) {
27
+ subClass.prototype = Object.create(superClass.prototype);
28
+ subClass.prototype.constructor = subClass;
29
+
30
+ _setPrototypeOf(subClass, superClass);
31
+ }
32
+
33
+ function _setPrototypeOf(o, p) {
34
+ _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
35
+ o.__proto__ = p;
36
+ return o;
37
+ };
38
+
39
+ return _setPrototypeOf(o, p);
40
+ }
41
+
26
42
  function _objectWithoutPropertiesLoose(source, excluded) {
27
43
  if (source == null) return {};
28
44
  var target = {};
@@ -9537,70 +9553,112 @@ function __rest(s, e) {
9537
9553
  }
9538
9554
 
9539
9555
  var IconSize;
9556
+
9540
9557
  (function (IconSize) {
9541
- IconSize["sm"] = "sm";
9542
- IconSize["md"] = "md";
9543
- IconSize["lg"] = "lg";
9544
- IconSize["xl"] = "xl";
9558
+ IconSize["sm"] = "sm";
9559
+ IconSize["md"] = "md";
9560
+ IconSize["lg"] = "lg";
9561
+ IconSize["xl"] = "xl";
9545
9562
  })(IconSize || (IconSize = {}));
9546
- const getSize = (size) => {
9547
- switch (size) {
9548
- case IconSize.sm:
9549
- return '1em';
9550
- case IconSize.md:
9551
- return '1.5em';
9552
- case IconSize.lg:
9553
- return '2em';
9554
- case IconSize.xl:
9555
- return '3em';
9556
- default:
9557
- return '1em';
9558
- }
9563
+
9564
+ var getSize = function getSize(size) {
9565
+ switch (size) {
9566
+ case IconSize.sm:
9567
+ return '1em';
9568
+
9569
+ case IconSize.md:
9570
+ return '1.5em';
9571
+
9572
+ case IconSize.lg:
9573
+ return '2em';
9574
+
9575
+ case IconSize.xl:
9576
+ return '3em';
9577
+
9578
+ default:
9579
+ return '1em';
9580
+ }
9559
9581
  };
9560
- let currentId = 0;
9582
+ var currentId = 0;
9561
9583
  /**
9562
9584
  * Factory to create Icon class components for consumers
9563
9585
  */
9564
- function createIcon({ name, xOffset = 0, yOffset = 0, width, height, svgPath }) {
9565
- var _a;
9566
- return _a = class SVGIcon extends React__namespace.Component {
9567
- constructor() {
9568
- super(...arguments);
9569
- this.id = `icon-title-${currentId++}`;
9570
- }
9571
- render() {
9572
- const _a = this.props, { size, color, title, noVerticalAlign } = _a, props = __rest(_a, ["size", "color", "title", "noVerticalAlign"]);
9573
- const hasTitle = Boolean(title);
9574
- const heightWidth = getSize(size);
9575
- const baseAlign = -0.125 * Number.parseFloat(heightWidth);
9576
- const style = noVerticalAlign ? null : { verticalAlign: `${baseAlign}em` };
9577
- const viewBox = [xOffset, yOffset, width, height].join(' ');
9578
- return (React__namespace.createElement("svg", Object.assign({ style: style, fill: color, height: heightWidth, width: heightWidth, viewBox: viewBox, "aria-labelledby": hasTitle ? this.id : null, "aria-hidden": hasTitle ? null : true, role: "img" }, props),
9579
- hasTitle && React__namespace.createElement("title", { id: this.id }, title),
9580
- React__namespace.createElement("path", { d: svgPath })));
9581
- }
9582
- },
9583
- _a.displayName = name,
9584
- _a.defaultProps = {
9585
- color: 'currentColor',
9586
- size: IconSize.sm,
9587
- noVerticalAlign: false
9588
- },
9589
- _a;
9586
+
9587
+ function createIcon(_ref) {
9588
+ var name = _ref.name,
9589
+ _ref$xOffset = _ref.xOffset,
9590
+ xOffset = _ref$xOffset === void 0 ? 0 : _ref$xOffset,
9591
+ _ref$yOffset = _ref.yOffset,
9592
+ yOffset = _ref$yOffset === void 0 ? 0 : _ref$yOffset,
9593
+ width = _ref.width,
9594
+ height = _ref.height,
9595
+ svgPath = _ref.svgPath;
9596
+
9597
+ var _a;
9598
+
9599
+ return _a = /*#__PURE__*/function (_React$Component) {
9600
+ _inheritsLoose(SVGIcon, _React$Component);
9601
+
9602
+ function SVGIcon() {
9603
+ var _this;
9604
+
9605
+ _this = _React$Component.apply(this, arguments) || this;
9606
+ _this.id = "icon-title-" + currentId++;
9607
+ return _this;
9608
+ }
9609
+
9610
+ var _proto = SVGIcon.prototype;
9611
+
9612
+ _proto.render = function render() {
9613
+ var _a = this.props,
9614
+ size = _a.size,
9615
+ color = _a.color,
9616
+ title = _a.title,
9617
+ noVerticalAlign = _a.noVerticalAlign,
9618
+ props = __rest(_a, ["size", "color", "title", "noVerticalAlign"]);
9619
+
9620
+ var hasTitle = Boolean(title);
9621
+ var heightWidth = getSize(size);
9622
+ var baseAlign = -0.125 * Number.parseFloat(heightWidth);
9623
+ var style = noVerticalAlign ? null : {
9624
+ verticalAlign: baseAlign + "em"
9625
+ };
9626
+ var viewBox = [xOffset, yOffset, width, height].join(' ');
9627
+ return React__namespace.createElement("svg", Object.assign({
9628
+ style: style,
9629
+ fill: color,
9630
+ height: heightWidth,
9631
+ width: heightWidth,
9632
+ viewBox: viewBox,
9633
+ "aria-labelledby": hasTitle ? this.id : null,
9634
+ "aria-hidden": hasTitle ? null : true,
9635
+ role: "img"
9636
+ }, props), hasTitle && React__namespace.createElement("title", {
9637
+ id: this.id
9638
+ }, title), React__namespace.createElement("path", {
9639
+ d: svgPath
9640
+ }));
9641
+ };
9642
+
9643
+ return SVGIcon;
9644
+ }(React__namespace.Component), _a.displayName = name, _a.defaultProps = {
9645
+ color: 'currentColor',
9646
+ size: IconSize.sm,
9647
+ noVerticalAlign: false
9648
+ }, _a;
9590
9649
  }
9591
9650
 
9592
- const InfoCircleIconConfig = {
9651
+ var InfoCircleIconConfig = {
9593
9652
  name: 'InfoCircleIcon',
9594
9653
  height: 512,
9595
9654
  width: 512,
9596
9655
  svgPath: 'M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z',
9597
9656
  yOffset: 0,
9598
- xOffset: 0,
9657
+ xOffset: 0
9599
9658
  };
9659
+ var InfoCircleIcon = createIcon(InfoCircleIconConfig);
9600
9660
 
9601
- const InfoCircleIcon = createIcon(InfoCircleIconConfig);
9602
-
9603
- var _excluded = ["label", "isRequired", "children", "selectOptions", "ariaLabel", "placeholder", "helperText", "subLabel", "subInfo"];
9661
+ var _excluded = ["label", "isRequired", "children", "selectOptions", "ariaLabel", "placeholder", "helperText", "subLabel", "subInfo", "onChange"];
9604
9662
 
9605
9663
  var FormSelect = function FormSelect(_ref) {
9606
9664
  var label = _ref.label,
@@ -9612,6 +9670,7 @@ var FormSelect = function FormSelect(_ref) {
9612
9670
  helperText = _ref.helperText,
9613
9671
  subLabel = _ref.subLabel,
9614
9672
  subInfo = _ref.subInfo,
9673
+ onChange = _ref.onChange,
9615
9674
  rest = _objectWithoutPropertiesLoose(_ref, _excluded);
9616
9675
 
9617
9676
  var _useField = formik.useField(rest),
@@ -9637,6 +9696,7 @@ var FormSelect = function FormSelect(_ref) {
9637
9696
  };
9638
9697
 
9639
9698
  var onSelect = function onSelect(_event, selection) {
9699
+ if (onChange) onChange(_event, selection);
9640
9700
  setFieldValue(rest.name, selection);
9641
9701
  validateField(rest.name);
9642
9702
  onToggle();
@@ -9515,56 +9515,91 @@ function __rest(s, e) {
9515
9515
  }
9516
9516
 
9517
9517
  var IconSize;
9518
+
9518
9519
  (function (IconSize) {
9519
- IconSize["sm"] = "sm";
9520
- IconSize["md"] = "md";
9521
- IconSize["lg"] = "lg";
9522
- IconSize["xl"] = "xl";
9520
+ IconSize["sm"] = "sm";
9521
+ IconSize["md"] = "md";
9522
+ IconSize["lg"] = "lg";
9523
+ IconSize["xl"] = "xl";
9523
9524
  })(IconSize || (IconSize = {}));
9524
- const getSize = (size) => {
9525
- switch (size) {
9526
- case IconSize.sm:
9527
- return '1em';
9528
- case IconSize.md:
9529
- return '1.5em';
9530
- case IconSize.lg:
9531
- return '2em';
9532
- case IconSize.xl:
9533
- return '3em';
9534
- default:
9535
- return '1em';
9536
- }
9525
+
9526
+ const getSize = size => {
9527
+ switch (size) {
9528
+ case IconSize.sm:
9529
+ return '1em';
9530
+
9531
+ case IconSize.md:
9532
+ return '1.5em';
9533
+
9534
+ case IconSize.lg:
9535
+ return '2em';
9536
+
9537
+ case IconSize.xl:
9538
+ return '3em';
9539
+
9540
+ default:
9541
+ return '1em';
9542
+ }
9537
9543
  };
9538
9544
  let currentId = 0;
9539
9545
  /**
9540
9546
  * Factory to create Icon class components for consumers
9541
9547
  */
9542
- function createIcon({ name, xOffset = 0, yOffset = 0, width, height, svgPath }) {
9543
- var _a;
9544
- return _a = class SVGIcon extends React.Component {
9545
- constructor() {
9546
- super(...arguments);
9547
- this.id = `icon-title-${currentId++}`;
9548
- }
9549
- render() {
9550
- const _a = this.props, { size, color, title, noVerticalAlign } = _a, props = __rest(_a, ["size", "color", "title", "noVerticalAlign"]);
9551
- const hasTitle = Boolean(title);
9552
- const heightWidth = getSize(size);
9553
- const baseAlign = -0.125 * Number.parseFloat(heightWidth);
9554
- const style = noVerticalAlign ? null : { verticalAlign: `${baseAlign}em` };
9555
- const viewBox = [xOffset, yOffset, width, height].join(' ');
9556
- return (React.createElement("svg", Object.assign({ style: style, fill: color, height: heightWidth, width: heightWidth, viewBox: viewBox, "aria-labelledby": hasTitle ? this.id : null, "aria-hidden": hasTitle ? null : true, role: "img" }, props),
9557
- hasTitle && React.createElement("title", { id: this.id }, title),
9558
- React.createElement("path", { d: svgPath })));
9559
- }
9560
- },
9561
- _a.displayName = name,
9562
- _a.defaultProps = {
9563
- color: 'currentColor',
9564
- size: IconSize.sm,
9565
- noVerticalAlign: false
9566
- },
9567
- _a;
9548
+
9549
+ function createIcon({
9550
+ name,
9551
+ xOffset = 0,
9552
+ yOffset = 0,
9553
+ width,
9554
+ height,
9555
+ svgPath
9556
+ }) {
9557
+ var _a;
9558
+
9559
+ return _a = class SVGIcon extends React.Component {
9560
+ constructor() {
9561
+ super(...arguments);
9562
+ this.id = `icon-title-${currentId++}`;
9563
+ }
9564
+
9565
+ render() {
9566
+ const _a = this.props,
9567
+ {
9568
+ size,
9569
+ color,
9570
+ title,
9571
+ noVerticalAlign
9572
+ } = _a,
9573
+ props = __rest(_a, ["size", "color", "title", "noVerticalAlign"]);
9574
+
9575
+ const hasTitle = Boolean(title);
9576
+ const heightWidth = getSize(size);
9577
+ const baseAlign = -0.125 * Number.parseFloat(heightWidth);
9578
+ const style = noVerticalAlign ? null : {
9579
+ verticalAlign: `${baseAlign}em`
9580
+ };
9581
+ const viewBox = [xOffset, yOffset, width, height].join(' ');
9582
+ return React.createElement("svg", Object.assign({
9583
+ style: style,
9584
+ fill: color,
9585
+ height: heightWidth,
9586
+ width: heightWidth,
9587
+ viewBox: viewBox,
9588
+ "aria-labelledby": hasTitle ? this.id : null,
9589
+ "aria-hidden": hasTitle ? null : true,
9590
+ role: "img"
9591
+ }, props), hasTitle && React.createElement("title", {
9592
+ id: this.id
9593
+ }, title), React.createElement("path", {
9594
+ d: svgPath
9595
+ }));
9596
+ }
9597
+
9598
+ }, _a.displayName = name, _a.defaultProps = {
9599
+ color: 'currentColor',
9600
+ size: IconSize.sm,
9601
+ noVerticalAlign: false
9602
+ }, _a;
9568
9603
  }
9569
9604
 
9570
9605
  const InfoCircleIconConfig = {
@@ -9573,12 +9608,11 @@ const InfoCircleIconConfig = {
9573
9608
  width: 512,
9574
9609
  svgPath: 'M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 110c23.196 0 42 18.804 42 42s-18.804 42-42 42-42-18.804-42-42 18.804-42 42-42zm56 254c0 6.627-5.373 12-12 12h-88c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h12v-64h-12c-6.627 0-12-5.373-12-12v-24c0-6.627 5.373-12 12-12h64c6.627 0 12 5.373 12 12v100h12c6.627 0 12 5.373 12 12v24z',
9575
9610
  yOffset: 0,
9576
- xOffset: 0,
9611
+ xOffset: 0
9577
9612
  };
9578
-
9579
9613
  const InfoCircleIcon = createIcon(InfoCircleIconConfig);
9580
9614
 
9581
- const _excluded = ["label", "isRequired", "children", "selectOptions", "ariaLabel", "placeholder", "helperText", "subLabel", "subInfo"];
9615
+ const _excluded = ["label", "isRequired", "children", "selectOptions", "ariaLabel", "placeholder", "helperText", "subLabel", "subInfo", "onChange"];
9582
9616
 
9583
9617
  const FormSelect = _ref => {
9584
9618
  let {
@@ -9589,7 +9623,8 @@ const FormSelect = _ref => {
9589
9623
  placeholder,
9590
9624
  helperText,
9591
9625
  subLabel,
9592
- subInfo
9626
+ subInfo,
9627
+ onChange
9593
9628
  } = _ref,
9594
9629
  rest = _objectWithoutPropertiesLoose(_ref, _excluded);
9595
9630
 
@@ -9610,6 +9645,7 @@ const FormSelect = _ref => {
9610
9645
  };
9611
9646
 
9612
9647
  const onSelect = (_event, selection) => {
9648
+ if (onChange) onChange(_event, selection);
9613
9649
  setFieldValue(rest.name, selection);
9614
9650
  validateField(rest.name);
9615
9651
  onToggle();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rhc-shared-components/form-select-component",
3
- "version": "0.1.2",
3
+ "version": "0.1.3",
4
4
  "description": "project description",
5
5
  "author": "redhatofficial",
6
6
  "license": "MIT",