관리-도구
편집 파일: control.js.map
{"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 } else if (\"reset\" === trigger) {\n valueRef.current.textContent = val;\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) value = choices.min;\n\n if (value > choices.max) value = choices.max;\n\n if (\"input\" === trigger) e.target.value = value;\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 trigger = \"reset\";\n customizerSetting.set(sliderRef.current.value);\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\n className=\"customize-control-description description\"\n dangerouslySetInnerHTML={{ __html: props.description }}\n />\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","dangerouslySetInnerHTML","__html","description","ref","setNotificationContainer","type","onClick","e","min","set","defaultValue","max","step","onChange","target","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":""}