aristath/kirki

{"version":3,"file":"control.js","mappings":"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","sources":["webpack://control-range-slider/external var \"React\"","webpack://control-range-slider/./src/KirkiSliderForm.js","webpack://control-range-slider/./src/KirkiSliderControl.js","webpack://control-range-slider/./src/control.js"],"sourcesContent":["const __WEBPACK_NAMESPACE_OBJECT__ = React;","import { useRef } from \"react\";\n\nconst KirkiSliderForm = (props) => {\n  const { control, customizerSetting, choices } = props;\n\n  let trigger = \"\";\n\n  control.updateComponentState = (val) => {\n    if (\"slider\" === trigger) {\n      valueRef.current.textContent = val;\n    } else if (\"input\" === trigger) {\n      sliderRef.current.value = val;\n    }\n  };\n\n  const handleChange = (e) => {\n    trigger = \"range\" === e.target.type ? \"slider\" : \"input\";\n\n    let value = e.target.value;\n\n    if (value < choices.min) {\n      value = choices.min;\n      if (\"input\" === trigger) e.target.value = value;\n    }\n\n    if (value > choices.max) {\n      value = choices.max;\n      if (\"input\" === trigger) e.target.value = value;\n    }\n\n    customizerSetting.set(value);\n  };\n\n  const handleReset = (e) => {\n    if (\"\" !== props.default && \"undefined\" !== typeof props.default) {\n      sliderRef.current.value = props.default;\n      valueRef.current.textContent = props.default;\n    } else {\n      if (\"\" !== props.value) {\n        sliderRef.current.value = props.value;\n        valueRef.current.textContent = props.value;\n      } else {\n        sliderRef.current.value = choices.min;\n        valueRef.current.textContent = \"\";\n      }\n    }\n  };\n\n  // Preparing for the template.\n  const fieldId = `kirki-control-input-${customizerSetting.id}`;\n  const value = \"\" !== props.value ? props.value : 0;\n\n  const sliderRef = useRef(null);\n  const valueRef = useRef(null);\n\n  return (\n    <div className=\"kirki-control-form\" tabIndex=\"1\">\n      <label className=\"kirki-control-label\" htmlFor={fieldId}>\n        <span className=\"customize-control-title\">{props.label}</span>\n        <span className=\"customize-control-description description\">\n          {props.description}\n        </span>\n      </label>\n\n      <div\n        className=\"customize-control-notifications-container\"\n        ref={props.setNotificationContainer}\n      ></div>\n\n      <button\n        type=\"button\"\n        className=\"kirki-control-reset\"\n        onClick={handleReset}\n      >\n        <i className=\"dashicons dashicons-image-rotate\"></i>\n      </button>\n\n      <div className=\"kirki-control-cols\">\n        <div className=\"kirki-control-left-col\">\n          <input\n            ref={sliderRef}\n            type=\"range\"\n            id={fieldId}\n            defaultValue={value}\n            min={choices.min}\n            max={choices.max}\n            step={choices.step}\n            className=\"kirki-control-slider\"\n            onChange={handleChange}\n          />\n        </div>\n        <div className=\"kirki-control-right-col\">\n          <div className=\"kirki-control-value\" ref={valueRef}>\n            {value}\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nexport default KirkiSliderForm;\n","import KirkiSliderForm from './KirkiSliderForm';\r\n\r\n/**\r\n * KirkiSliderControl.\r\n *\r\n * Global objects brought:\r\n * - wp\r\n * - jQuery\r\n * - React\r\n * - ReactDOM\r\n *\r\n * @class\r\n * @augments wp.customize.Control\r\n * @augments wp.customize.Class\r\n */\r\nconst KirkiSliderControl = wp.customize.Control.extend({\r\n\r\n\t/**\r\n\t * Initialize.\r\n\t *\r\n\t * @param {string} id - Control ID.\r\n\t * @param {object} params - Control params.\r\n\t */\r\n\tinitialize: function (id, params) {\r\n\t\tconst control = this;\r\n\r\n\t\t// Bind functions to this control context for passing as React props.\r\n\t\tcontrol.setNotificationContainer = control.setNotificationContainer.bind(control);\r\n\r\n\t\twp.customize.Control.prototype.initialize.call(control, id, params);\r\n\r\n\t\t// The following should be eliminated with <https://core.trac.wordpress.org/ticket/31334>.\r\n\t\tfunction onRemoved(removedControl) {\r\n\t\t\tif (control === removedControl) {\r\n\t\t\t\tcontrol.destroy();\r\n\t\t\t\tcontrol.container.remove();\r\n\t\t\t\twp.customize.control.unbind('removed', onRemoved);\r\n\t\t\t}\r\n\t\t}\r\n\t\twp.customize.control.bind('removed', onRemoved);\r\n\t},\r\n\r\n\t/**\r\n\t * Set notification container and render.\r\n\t *\r\n\t * This is called when the React component is mounted.\r\n\t *\r\n\t * @param {Element} element - Notification container.\r\n\t * @returns {void}\r\n\t */\r\n\tsetNotificationContainer: function setNotificationContainer(element) {\r\n\t\tconst control = this;\r\n\r\n\t\tcontrol.notifications.container = jQuery(element);\r\n\t\tcontrol.notifications.render();\r\n\t},\r\n\r\n\t/**\r\n\t * Render the control into the DOM.\r\n\t *\r\n\t * This is called from the Control#embed() method in the parent class.\r\n\t *\r\n\t * @returns {void}\r\n\t */\r\n\trenderContent: function renderContent() {\r\n\t\tconst control = this;\r\n\r\n\t\tReactDOM.render(\r\n\t\t\t<KirkiSliderForm\r\n\t\t\t\t{...control.params}\r\n\t\t\t\tcontrol={control}\r\n\t\t\t\tcustomizerSetting={control.setting}\r\n\t\t\t\tsetNotificationContainer={control.setNotificationCotainer}\r\n\t\t\t\tvalue={control.params.value}\r\n\t\t\t/>,\r\n\t\t\tcontrol.container[0]\r\n\t\t);\r\n\r\n\t\tif (false !== control.params.choices.allowCollapse) {\r\n\t\t\tcontrol.container.addClass('allowCollapse');\r\n\t\t}\r\n\t},\r\n\r\n\t/**\r\n\t * After control has been first rendered, start re-rendering when setting changes.\r\n\t *\r\n\t * React is able to be used here instead of the wp.customize.Element abstraction.\r\n\t *\r\n\t * @returns {void}\r\n\t */\r\n\tready: function ready() {\r\n\t\tconst control = this;\r\n\r\n\t\t/**\r\n\t\t * Update component value's state when customizer setting's value is changed.\r\n\t\t */\r\n\t\tcontrol.setting.bind((val) => {\r\n\t\t\tcontrol.updateComponentState(val);\r\n\t\t});\r\n\t},\r\n\r\n\t/**\r\n\t * This method will be overriden by the rendered component.\r\n\t */\r\n\tupdateComponentState: (val) => { },\r\n\r\n\t/**\r\n\t * Handle removal/de-registration of the control.\r\n\t *\r\n\t * This is essentially the inverse of the Control#embed() method.\r\n\t *\r\n\t * @link https://core.trac.wordpress.org/ticket/31334\r\n\t * @returns {void}\r\n\t */\r\n\tdestroy: function destroy() {\r\n\t\tconst control = this;\r\n\r\n\t\t// Garbage collection: undo mounting that was done in the embed/renderContent method.\r\n\t\tReactDOM.unmountComponentAtNode(control.container[0]);\r\n\r\n\t\t// Call destroy method in parent if it exists (as of #31334).\r\n\t\tif (wp.customize.Control.prototype.destroy) {\r\n\t\t\twp.customize.Control.prototype.destroy.call(control);\r\n\t\t}\r\n\t}\r\n});\r\n\r\nexport default KirkiSliderControl;\r\n","import \"./control.scss\";\r\nimport KirkiSliderControl from './KirkiSliderControl';\r\n\r\n\r\n// Register control type with Customizer.\r\nwp.customize.controlConstructor['kirki-slider'] = KirkiSliderControl;\r\n"],"names":["React","props","control","customizerSetting","choices","trigger","updateComponentState","val","valueRef","current","textContent","sliderRef","value","fieldId","id","useRef","className","tabIndex","htmlFor","label","description","ref","setNotificationContainer","type","onClick","e","min","defaultValue","max","step","onChange","target","set","wp","customize","Control","extend","initialize","params","this","bind","prototype","call","onRemoved","removedControl","destroy","container","remove","unbind","element","notifications","jQuery","render","renderContent","ReactDOM","setting","setNotificationCotainer","allowCollapse","addClass","ready","unmountComponentAtNode","controlConstructor","KirkiSliderControl"],"sourceRoot":""}