function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
var _excluded = ["component", "debug", "initialValue", "view", "variant", "useLabelAsInlineLabel", "useDescriptionAsInlineDescription"];
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
import { pick } from 'ramda';
import React from 'react';
import { Box, Button, Form, useFormContext } from '../../index';
var stylesFormDebugger = {
  backgroundColor: '#444',
  color: '#f1f1f1',
  fontSize: '0.8rem'
};
export function FormDebugger() {
  var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
  var fields = useFormContext();
  var record = {};
  if (!Object.keys(props).length) {
    record = fields;
  } else {
    record = pick(Object.keys(props), fields);
  }
  return /*#__PURE__*/React.createElement(Box, {
    flex: "1",
    padding: "md",
    margin: "lg none",
    style: stylesFormDebugger
  }, /*#__PURE__*/React.createElement("pre", {
    style: {
      whiteSpace: 'break-spaces'
    }
  }, JSON.stringify(record, null, 2)));
}
/**
 * Takes a Form Field component, e.g. Form.Select, and creates
 * a full Form of one view and variant. Empty value examples,
 * examples with values, various text or state formats.
 */
var SingleForm = function SingleForm(_ref) {
  var _ref$component = _ref.component,
    FieldComponent = _ref$component === void 0 ? Form.Field : _ref$component,
    debug = _ref.debug,
    initialValue = _ref.initialValue,
    view = _ref.view,
    variant = _ref.variant,
    useLabelAsInlineLabel = _ref.useLabelAsInlineLabel,
    useDescriptionAsInlineDescription = _ref.useDescriptionAsInlineDescription,
    props = _objectWithoutProperties(_ref, _excluded);
  // removes colStart from DOM for traditional variant
  var columnOne = variant === 'traditional' ? {} : {
    colStart: 1
  };
  var columnTwo = variant === 'traditional' ? {} : {
    colStart: 7
  };
  return /*#__PURE__*/React.createElement(Form, {
    enableReinitialize: true,
    initialValues: {
      value: initialValue
    },
    variant: variant,
    view: view,
    onSubmit: function onSubmit(values) {
      return alert(JSON.stringify(values, null, 2));
    }
  }, /*#__PURE__*/React.createElement(Form.Form, null, debug && /*#__PURE__*/React.createElement(FormDebugger, null), /*#__PURE__*/React.createElement(Form.Row, null, /*#__PURE__*/React.createElement(FieldComponent, _extends({
    name: "empty"
  }, useLabelAsInlineLabel ? {
    inlineLabel: 'Empty Text'
  } : {
    label: 'Empty Text'
  }, useDescriptionAsInlineDescription ? {
    inlineDescription: 'Empty Description'
  } : {
    description: 'Empty Description'
  }, columnOne, props)), /*#__PURE__*/React.createElement(FieldComponent, _extends({
    name: "value"
  }, useLabelAsInlineLabel ? {
    inlineLabel: 'Initial Value Text'
  } : {
    label: 'Initial Value Text'
  }, useDescriptionAsInlineDescription ? {
    inlineDescription: 'Initial Value Description'
  } : {
    description: 'Initial Value Description'
  }, columnTwo, props))), /*#__PURE__*/React.createElement(Form.Row, null, /*#__PURE__*/React.createElement(FieldComponent, _extends({
    name: "disabled-empty",
    disabled: true
  }, useLabelAsInlineLabel ? {
    inlineLabel: 'Disabled Empty Text'
  } : {
    label: 'Disabled Empty Text'
  }, useDescriptionAsInlineDescription ? {
    inlineDescription: 'Disabled Empty Description'
  } : {
    description: 'Disabled Empty Description'
  }, columnOne, props)), /*#__PURE__*/React.createElement(FieldComponent, _extends({
    name: "disabled-value",
    disabled: true
  }, useLabelAsInlineLabel ? {
    inlineLabel: 'Disabled Initial Value Text'
  } : {
    label: 'Disabled Initial Value Text'
  }, useDescriptionAsInlineDescription ? {
    inlineDescription: 'Disabled Initial Description'
  } : {
    description: 'Disabled Initial Description'
  }, columnTwo, props))), /*#__PURE__*/React.createElement(Form.Row, null, /*#__PURE__*/React.createElement(FieldComponent, _extends({
    name: "error-empty",
    error: true
  }, useLabelAsInlineLabel ? {
    inlineLabel: 'Error Boolean Empty Text'
  } : {
    label: 'Error Boolean Empty Text'
  }, useDescriptionAsInlineDescription ? {
    inlineDescription: 'Error Boolean Description'
  } : {
    description: 'Error Boolean Description'
  }, columnOne, props)), /*#__PURE__*/React.createElement(FieldComponent, _extends({
    name: "error-value",
    error: "Some error message that should be read red"
  }, useLabelAsInlineLabel ? {
    inlineLabel: 'Error Message Initial Value Text'
  } : {
    label: 'Error Message Initial Value Text'
  }, useDescriptionAsInlineDescription ? {
    inlineDescription: 'Error Message Initial Description'
  } : {
    description: 'Error Message Initial Description'
  }, columnTwo, props)))));
};
export var DemoForm = function DemoForm(_ref2) {
  var _ref2$view = _ref2.view,
    view = _ref2$view === void 0 ? 'create' : _ref2$view,
    _ref2$enableConfirmNa = _ref2.enableConfirmNavigation,
    enableConfirmNavigation = _ref2$enableConfirmNa === void 0 ? true : _ref2$enableConfirmNa;
  return /*#__PURE__*/React.createElement(Form, {
    view: view,
    onSubmit: function onSubmit() {
      alert(JSON.stringify(arguments.length <= 0 ? undefined : arguments[0], null, 2));
      return Promise.resolve();
    },
    enableConfirmNavigation: enableConfirmNavigation
  }, /*#__PURE__*/React.createElement(Form.Form, null, /*#__PURE__*/React.createElement(Form.Row, null, /*#__PURE__*/React.createElement(Form.Text, {
    name: "text",
    label: "Text",
    colStart: 1
  }), /*#__PURE__*/React.createElement(Form.Number, {
    name: "number",
    label: "Number",
    required: true,
    tooltip: "An example tooltip for any field, this value goes directly to the Tooltip overlay prop",
    colStart: 7
  })), /*#__PURE__*/React.createElement(Form.Row, null, /*#__PURE__*/React.createElement(Form.Select, {
    name: "select",
    label: "Select",
    options: formSelectOptions,
    colStart: 1
  }), /*#__PURE__*/React.createElement(Form.MultiSelect, {
    name: "multiselect",
    label: "MultiSelect",
    options: formSelectOptions,
    colStart: 7
  })), /*#__PURE__*/React.createElement(Form.Row, null, /*#__PURE__*/React.createElement(Form.Select, {
    name: "select",
    label: "Select with Groups",
    getGroup: function getGroup(option) {
      return option.groupAssociation;
    },
    groupGetId: function groupGetId(group) {
      return group.uuid;
    },
    groupGetLabel: function groupGetLabel(group) {
      return group.displayName;
    },
    options: formSelectOptions,
    optgroups: formSelectGroupOptions
  }), /*#__PURE__*/React.createElement(Form.PillSelect, {
    name: "pillselect",
    label: "Status",
    options: formPillSelectOptions,
    colStart: 7
  })), /*#__PURE__*/React.createElement(Form.Row, null, /*#__PURE__*/React.createElement(Form.TieredSelect, {
    name: "tieredselect",
    label: "Tiered Select",
    options: formTieredSelectOptions,
    colStart: 1
  }), /*#__PURE__*/React.createElement(Form.GroupSelect, {
    name: "groupselect",
    label: "Group Select for Distribution",
    options: formGroupSelectOptions,
    groups: formGroupSelectGroups,
    colStart: 7
  })), /*#__PURE__*/React.createElement(Box, {
    textAlign: "center",
    marginTop: "sm",
    marginBottom: "xl"
  }, /*#__PURE__*/React.createElement(Button, {
    variant: "secondary",
    type: "reset"
  }, "Reset"), ' ', /*#__PURE__*/React.createElement(Button, {
    type: "submit"
  }, "Save"))));
};

/** All variations for a field. views, with values, no values, text variations, etc.
 * @example
 *  <BaseCRU
      component={Form.Number}
      initialValue={100}
    />
 */
export function BaseCRU(props) {
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("h1", null, "Standard"), /*#__PURE__*/React.createElement("h2", null, "Create"), /*#__PURE__*/React.createElement(SingleForm, _extends({
    view: "create"
  }, props)), /*#__PURE__*/React.createElement("h2", null, "Read"), /*#__PURE__*/React.createElement(SingleForm, _extends({
    view: "read"
  }, props)), /*#__PURE__*/React.createElement("h2", null, "Update"), /*#__PURE__*/React.createElement(SingleForm, _extends({
    view: "update"
  }, props)), /*#__PURE__*/React.createElement("h1", null, "Traditional"), /*#__PURE__*/React.createElement("h2", null, "Create"), /*#__PURE__*/React.createElement(SingleForm, _extends({
    view: "create",
    variant: "traditional"
  }, props)), /*#__PURE__*/React.createElement("h2", null, "Read"), /*#__PURE__*/React.createElement(SingleForm, _extends({
    view: "read",
    variant: "traditional"
  }, props)), /*#__PURE__*/React.createElement("h2", null, "Update"), /*#__PURE__*/React.createElement(SingleForm, _extends({
    view: "update",
    variant: "traditional"
  }, props)));
}
export var formGroupSelectOptions = [{
  id: 5139977,
  label: 'Cat'
}, {
  id: 1279548,
  label: 'Cow'
}, {
  id: 1690,
  label: 'Duck'
}, {
  id: 3116635,
  label: 'Crocodile'
}, {
  id: 1037291,
  label: 'Dog'
}, {
  id: 1987946,
  label: 'Elephant'
}, {
  id: 1665038,
  label: 'Fox'
}, {
  id: 10338,
  label: 'Frog'
}, {
  id: 4177019,
  label: 'Giraffe'
}, {
  id: 5136274,
  label: 'Lion'
}, {
  id: 1819065,
  label: 'Owl'
}, {
  id: 3733119,
  label: 'Parrot'
}, {
  id: 2142072,
  label: 'Pig'
}, {
  id: 1360365,
  label: 'Wolf'
}];
export var formGroupSelectGroups = [{
  id: 180604,
  label: 'Group #1',
  options: [5139977, 1037291, 1279548, 5136274]
}, {
  id: 183915,
  label: 'Group #2',
  options: [1037291, 1279548]
}, {
  id: 187138,
  label: 'Group #3',
  options: [1665038, 10338]
}, {
  id: 127496,
  label: 'Group #4',
  options: [3116635, 1819065]
}, {
  id: 126261,
  label: 'Group #5',
  options: [1690]
}].map(function (group) {
  return _objectSpread(_objectSpread({}, group), {}, {
    options: group.options.map(function (groupOpt) {
      return formGroupSelectOptions.find(function (option) {
        return option.id === groupOpt;
      });
    })
  });
});
export var formTieredSelectOptions = [{
  id: 1,
  groupId: null,
  nextGroupId: 10,
  label: 'Apple Farm'
}, {
  id: 3,
  groupId: null,
  nextGroupId: 30,
  label: 'Sports R Us'
}, {
  id: 4,
  groupId: null,
  nextGroupId: 30,
  label: 'Sail It Again Ports'
}, {
  id: 5,
  groupId: null,
  nextGroupId: 30,
  label: 'Dublix'
}, {
  id: 6,
  groupId: null,
  nextGroupId: 30,
  label: 'The Hardees Boys'
}, {
  id: 7,
  groupId: null,
  nextGroupId: 30,
  label: 'Carls Senior'
}, {
  id: 8,
  groupId: null,
  nextGroupId: 30,
  label: 'Tar J'
}, {
  id: 9,
  groupId: null,
  nextGroupId: 30,
  label: 'Innovation Station'
}, {
  id: 10,
  groupId: null,
  nextGroupId: 30,
  label: 'Innovation Nation'
}, {
  id: 11,
  groupId: null,
  nextGroupId: 30,
  label: 'Global Studios'
}, {
  id: 12,
  groupId: null,
  nextGroupId: 30,
  label: "Ralphie's"
}, {
  id: 13,
  groupId: null,
  nextGroupId: 30,
  label: 'Humble State University'
}, {
  id: 14,
  groupId: null,
  nextGroupId: 30,
  label: 'Test Driven Devolvement'
}, {
  id: 15,
  groupId: null,
  nextGroupId: 30,
  label: 'The Drilling Company'
}, {
  id: 16,
  groupId: null,
  nextGroupId: 30,
  label: 'Wrapping text that is very long and will definitely wrap onto two or more lines'
}, {
  id: 17,
  groupId: 10,
  nextGroupId: 100,
  label: 'Granny Smith'
}, {
  id: 18,
  groupId: 10,
  nextGroupId: 101,
  label: 'Gala'
}, {
  id: 21,
  groupId: 30,
  nextGroupId: 300,
  label: 'Project Basketball'
}, {
  id: 22,
  groupId: 30,
  nextGroupId: 301,
  label: 'Table Tennis'
}, {
  id: 23,
  groupId: 30,
  label: 'Table Ten'
}, {
  id: 24,
  groupId: 100,
  label: 'Michigan'
}, {
  id: 25,
  groupId: 101,
  label: 'Washington'
}, {
  id: 26,
  groupId: 200,
  label: 'Georgia'
}, {
  id: 27,
  groupId: 201,
  label: 'California'
}, {
  id: 28,
  groupId: 300,
  label: 'Toronto'
}, {
  id: 29,
  groupId: 301,
  nextGroupId: 302,
  label: 'Court Complex Uno'
}, {
  id: 30,
  groupId: 302,
  nextGroupId: 303,
  label: 'Wrap'
}, {
  id: 31,
  groupId: 303,
  nextGroupId: 304,
  label: 'Wrap'
}, {
  id: 32,
  groupId: 304,
  nextGroupId: 305,
  label: 'Wrap'
}, {
  id: 33,
  groupId: 305,
  nextGroupId: 306,
  label: 'Wrap'
}, {
  id: 34,
  groupId: 306,
  nextGroupId: 307,
  label: 'Wrap'
}, {
  id: 35,
  groupId: 307,
  label: 'Wrap'
}];
export var formSelectOptions = [{
  id: 1,
  label: 'Option Example Uno',
  groupAssociation: 1
}, {
  id: 2,
  label: 'Item Deux 2',
  groupAssociation: 2
}, {
  id: 3,
  label: 'Three Three Three',
  groupAssociation: 1
}, {
  id: 4,
  label: 'Next Item In List Is Design System Design System',
  groupAssociation: 2
}, {
  id: 5,
  label: '5 Entries',
  groupAssociation: 2
}, {
  id: 6,
  label: 'Another Option With A Longer Amount of Important Information To Read',
  groupAssociation: 3
}];
export var formSelectGroupOptions = [{
  uuid: 1,
  displayName: 'Group 1'
}, {
  uuid: 2,
  displayName: 'Group Having a Longer Group Label, Group Two Is That Group'
}, {
  uuid: 3,
  displayName: 'Group 3'
}];
export var formPillSelectOptions = [{
  id: '1',
  label: 'Questionable',
  color: 'yellow'
}, {
  id: '2',
  label: 'False',
  color: 'red'
}, {
  id: '3',
  label: 'The Sky Is Blue',
  color: 'blue'
}, {
  id: '4',
  label: 'Pending Resolution',
  color: 'gray'
}, {
  id: '5',
  label: 'A very long STATUS that has to wrap cause it is so long',
  color: 'green'
}];
export var formInitialValues = {
  text: 'Hello String',
  number: 123456.789,
  checkbox: true,
  checkboxes: [formSelectOptions[1], formSelectOptions[2]],
  currency: 1200300.55,
  date: new Date(2020, 9, 31, 14, 30, 42),
  // Halloween, a Saturday at 2:30 PM
  textarea: 'Hello\nWorld  !!\n\n    Hello    World',
  select: formSelectOptions[1],
  multiselect: [formSelectOptions[1], formSelectOptions[3], formSelectOptions[0]],
  pillselect: formPillSelectOptions[0],
  groupselect: [formGroupSelectOptions[0], formGroupSelectOptions[2]],
  tieredselect: [{
    id: 4,
    groupId: null,
    nextGroupId: 30,
    label: 'Sail It Again Ports'
  }, {
    id: 22,
    groupId: 30,
    nextGroupId: 301,
    label: 'Table Tennis'
  }, {
    id: 29,
    groupId: 301,
    nextGroupId: 302,
    label: 'Court Complex Uno'
  }],
  radiobuttons: formSelectOptions[5],
  richtext: '<p><span style="font-size: 18pt; background-color: #00ff00;">Rich Text Is <strong>Bold</strong></span></p> '
};
//# sourceMappingURL=util.js.map