From 351467ab6b26394dfc31a6f54f2e9bab1028f80b Mon Sep 17 00:00:00 2001 From: Jon Uhlmann Date: Mon, 28 Oct 2024 18:08:19 +0100 Subject: [PATCH] Update: Add propertyMapping option Respect also global config --- Configuration/Settings.yaml | 13 ++++ README.md | 18 +++++ .../Private/DirectionEditor/Editor/index.js | 70 ++++++++++++------- Resources/Public/Plugin.css | 2 +- Resources/Public/Plugin.css.map | 4 +- Resources/Public/Plugin.js | 2 +- Resources/Public/Plugin.js.map | 8 +-- 7 files changed, 84 insertions(+), 33 deletions(-) diff --git a/Configuration/Settings.yaml b/Configuration/Settings.yaml index 756b491..042c5c5 100644 --- a/Configuration/Settings.yaml +++ b/Configuration/Settings.yaml @@ -8,3 +8,16 @@ Neos: stylesheets: Carbon.DirectionEditor:Plugin: resource: resource://Carbon.DirectionEditor/Public/Plugin.css + frontendConfiguration: + Carbon.RangeEditor: + propertyMapping: false + north: true + east: true + south: true + west: true + northEast: true + northWest: true + southEast: true + southWest: true + center: true + disabled: false diff --git a/README.md b/README.md index aed9be7..d47ecf2 100644 --- a/README.md +++ b/README.md @@ -17,6 +17,7 @@ Example: inspector: editor: 'Carbon.DirectionEditor/Editor' editorOptions: + propertyMapping: false north: true east: true south: true @@ -27,9 +28,26 @@ Example: southWest: true center: 'If it is a string, it used as label' disabled: false +``` + +You can change the saved values if you alter the `propertyMapping`: +```yaml +'Foo.Bar:Element': + properties: + direction: + type: string + ui: + inspector: + editor: 'Carbon.DirectionEditor/Editor' + editorOptions: + propertyMapping: + north: top + south: bottom ``` +In the example above, `north` will get saved as `top` and `south` as `bottom` + [packagist]: https://packagist.org/packages/carbon/directioneditor [latest stable version]: https://poser.pugx.org/carbon/directioneditor/v/stable [total downloads]: https://poser.pugx.org/carbon/directioneditor/downloads diff --git a/Resources/Private/DirectionEditor/Editor/index.js b/Resources/Private/DirectionEditor/Editor/index.js index bad0652..25f995e 100644 --- a/Resources/Private/DirectionEditor/Editor/index.js +++ b/Resources/Private/DirectionEditor/Editor/index.js @@ -1,4 +1,4 @@ -import React, { useState } from "react"; +import React, { useState, useEffect } from "react"; import { neos } from "@neos-project/neos-ui-decorators"; import { Icon } from "@neos-project/react-ui-components"; import style from "./style.module.css"; @@ -9,38 +9,58 @@ const neosifier = neos((globalRegistry) => ({ config: globalRegistry.get("frontendConfiguration").get("Carbon.RangeEditor"), })); -const defaultProps = { - options: { - north: true, - east: true, - south: true, - west: true, - northEast: true, - northWest: true, - southEast: true, - southWest: true, - center: true, - disabled: false, - }, +const defaultOptions = { + propertyMapping: false, + north: true, + east: true, + south: true, + west: true, + northEast: true, + northWest: true, + southEast: true, + southWest: true, + center: true, + disabled: false, }; function Editor(props) { - const changeValue = (value) => { + const options = { ...defaultOptions, ...props.config, ...props.options }; + const { value, highlight, i18nRegistry } = props; + const { disabled } = options; + const [state, setState] = useState(value); + + useEffect(() => { + setState(getValueFromPropertyMapping(value)); + }, [value]); + + function getValueFromPropertyMapping(value) { + if (options.propertyMapping) { + const key = Object.keys(options.propertyMapping).find((key) => options.propertyMapping[key] === value); + if (key) { + return key; + } + } + return value; + } + + function setValueFromPropertyMapping(value) { + return options?.propertyMapping?.[value] || value; + } + + function changeValue(value) { + setState(value); + value = setValueFromPropertyMapping(value); if (value === "center") { value = ""; } props.commit(value); - }; - - const options = { ...defaultProps.options, ...props.options }; - const { value, highlight, i18nRegistry } = props; - const { disabled } = options; + } return (
{Object.entries(options).map(([key, enabled]) => { - if (!enabled || key === "disabled") { - return; + if (!enabled || key === "disabled" || key === "propertyMapping") { + return null; } const title = typeof enabled == "string" ? i18nRegistry.translate(enabled) : null; if (key === "center") { @@ -50,9 +70,9 @@ function Editor(props) { className={clsx( style.button, style[key], - !value && (highlight ? style.highlight : style.active), + (!state || state == "center") && (highlight ? style.highlight : style.active), )} - onClick={() => changeValue("")} + onClick={() => changeValue("center")} disabled={disabled} title={title} > @@ -66,7 +86,7 @@ function Editor(props) { className={clsx( style.button, style[key], - value === key && (highlight ? style.highlight : style.active), + state === key && (highlight ? style.highlight : style.active), )} onClick={() => changeValue(key)} disabled={disabled} diff --git a/Resources/Public/Plugin.css b/Resources/Public/Plugin.css index 6984b8b..25c4993 100644 --- a/Resources/Public/Plugin.css +++ b/Resources/Public/Plugin.css @@ -1,2 +1,2 @@ -.carbon-directioneditor-Yzq_9W-editor{grid-template:"carbon-directioneditor-Yzq_9W-NW carbon-directioneditor-Yzq_9W-N carbon-directioneditor-Yzq_9W-NE" "carbon-directioneditor-Yzq_9W-W carbon-directioneditor-Yzq_9W-C carbon-directioneditor-Yzq_9W-E" "carbon-directioneditor-Yzq_9W-SW carbon-directioneditor-Yzq_9W-S carbon-directioneditor-Yzq_9W-SE" / auto auto auto;display:inline-grid}.carbon-directioneditor-Yzq_9W-button{cursor:pointer;color:inherit;background:none;border:0;width:30px;height:30px;margin:0;padding:0}.carbon-directioneditor-Yzq_9W-button svg{color:inherit}.carbon-directioneditor-Yzq_9W-button:hover{color:var(--colors-PrimaryBlue)}.carbon-directioneditor-Yzq_9W-button:focus{color:var(--colors-PrimaryBlue)}.carbon-directioneditor-Yzq_9W-active{box-shadow:0 0 0 2px var(--colors-PrimaryBlue);-webkit-border-radius:50%;border-radius:50%}.carbon-directioneditor-Yzq_9W-highlight{box-shadow:0 0 0 2px var(--colors-Warn);-webkit-border-radius:50%;border-radius:50%}.carbon-directioneditor-Yzq_9W-northWest{grid-area:carbon-directioneditor-Yzq_9W-NW}.carbon-directioneditor-Yzq_9W-northWest svg{transform:rotate(-45deg)}.carbon-directioneditor-Yzq_9W-north{grid-area:carbon-directioneditor-Yzq_9W-N}.carbon-directioneditor-Yzq_9W-northEast{grid-area:carbon-directioneditor-Yzq_9W-NE}.carbon-directioneditor-Yzq_9W-northEast svg{transform:rotate(45deg)}.carbon-directioneditor-Yzq_9W-west{grid-area:carbon-directioneditor-Yzq_9W-W}.carbon-directioneditor-Yzq_9W-west svg{transform:rotate(-90deg)}.carbon-directioneditor-Yzq_9W-center{grid-area:carbon-directioneditor-Yzq_9W-C}.carbon-directioneditor-Yzq_9W-east{grid-area:carbon-directioneditor-Yzq_9W-E}.carbon-directioneditor-Yzq_9W-east svg{transform:rotate(90deg)}.carbon-directioneditor-Yzq_9W-southWest{grid-area:carbon-directioneditor-Yzq_9W-SW}.carbon-directioneditor-Yzq_9W-southWest svg{transform:rotate(-135deg)}.carbon-directioneditor-Yzq_9W-south{grid-area:carbon-directioneditor-Yzq_9W-S}.carbon-directioneditor-Yzq_9W-south svg{transform:rotate(180deg)}.carbon-directioneditor-Yzq_9W-southEast{grid-area:carbon-directioneditor-Yzq_9W-SE}.carbon-directioneditor-Yzq_9W-southEast svg{transform:rotate(135deg)} +.Yzq_9W_editor{grid-template:"Yzq_9W_NW Yzq_9W_N Yzq_9W_NE" "Yzq_9W_W Yzq_9W_C Yzq_9W_E" "Yzq_9W_SW Yzq_9W_S Yzq_9W_SE" / auto auto auto;display:inline-grid}.Yzq_9W_button{cursor:pointer;color:inherit;background:none;border:0;width:30px;height:30px;margin:0;padding:0}.Yzq_9W_button svg{color:inherit}.Yzq_9W_button:hover{color:var(--colors-PrimaryBlue)}.Yzq_9W_button:focus{color:var(--colors-PrimaryBlue)}.Yzq_9W_active{box-shadow:0 0 0 2px var(--colors-PrimaryBlue);-webkit-border-radius:50%;border-radius:50%}.Yzq_9W_highlight{box-shadow:0 0 0 2px var(--colors-Warn);-webkit-border-radius:50%;border-radius:50%}.Yzq_9W_northWest{grid-area:Yzq_9W_NW}.Yzq_9W_northWest svg{transform:rotate(-45deg)}.Yzq_9W_north{grid-area:Yzq_9W_N}.Yzq_9W_northEast{grid-area:Yzq_9W_NE}.Yzq_9W_northEast svg{transform:rotate(45deg)}.Yzq_9W_west{grid-area:Yzq_9W_W}.Yzq_9W_west svg{transform:rotate(-90deg)}.Yzq_9W_center{grid-area:Yzq_9W_C}.Yzq_9W_east{grid-area:Yzq_9W_E}.Yzq_9W_east svg{transform:rotate(90deg)}.Yzq_9W_southWest{grid-area:Yzq_9W_SW}.Yzq_9W_southWest svg{transform:rotate(-135deg)}.Yzq_9W_south{grid-area:Yzq_9W_S}.Yzq_9W_south svg{transform:rotate(180deg)}.Yzq_9W_southEast{grid-area:Yzq_9W_SE}.Yzq_9W_southEast svg{transform:rotate(135deg)} /*# sourceMappingURL=Plugin.css.map */ diff --git a/Resources/Public/Plugin.css.map b/Resources/Public/Plugin.css.map index 1b1892e..2cb8d3e 100644 --- a/Resources/Public/Plugin.css.map +++ b/Resources/Public/Plugin.css.map @@ -1,7 +1,7 @@ { "version": 3, "sources": ["../Private/DirectionEditor/Editor/style.module.css"], - "sourcesContent": [".editor {\n display: inline-grid;\n grid-template:\n \"NW N NE\" auto\n \"W C E\" auto\n \"SW S SE\" auto\n / auto auto auto;\n}\n\n.button {\n cursor: pointer;\n background: none;\n padding: 0;\n border: 0;\n color: inherit;\n height: 30px;\n width: 30px;\n margin: 0;\n\n & svg {\n color: inherit;\n }\n\n &:hover,\n &:focus {\n color: var(--colors-PrimaryBlue from global);\n }\n}\n\n.active {\n border-radius: 50%;\n box-shadow: 0 0 0 2px var(--colors-PrimaryBlue from global);\n}\n\n.highlight {\n border-radius: 50%;\n box-shadow: 0 0 0 2px var(--colors-Warn from global);\n}\n\n.northWest {\n grid-area: NW;\n\n & svg {\n transform: rotate(-45deg);\n }\n}\n\n.north {\n grid-area: N;\n}\n\n.northEast {\n grid-area: NE;\n\n & svg {\n transform: rotate(45deg);\n }\n}\n\n.west {\n grid-area: W;\n\n & svg {\n transform: rotate(-90deg);\n }\n}\n\n.center {\n grid-area: C;\n}\n\n.east {\n grid-area: E;\n\n & svg {\n transform: rotate(90deg);\n }\n}\n\n.southWest {\n grid-area: SW;\n\n & svg {\n transform: rotate(-135deg);\n }\n}\n\n.south {\n grid-area: S;\n\n & svg {\n transform: rotate(180deg);\n }\n}\n\n.southEast {\n grid-area: SE;\n\n & svg {\n transform: rotate(135deg);\n }\n}\n"], - "mappings": "AAAA,CAAA,kYASA,CAAA,kHATA,SAAA,UAmBI,CAVJ,qCAUI,kBAIA,CAdJ,oCAcI,uCAAA,CAdJ,oCAcI,uCAMJ,CAAA,8GA7BA,kBAkCA,CAAA,0GAlCA,kBAuCA,CAAA,mFAGI,CAHJ,wCAGI,6BAKJ,CAAA,8EAIA,CAAA,mFAGI,CAHJ,wCAGI,4BAKJ,CAAA,6EAGI,CAHJ,mCAGI,6BAKJ,CAAA,+EAIA,CAAA,6EAGI,CAHJ,mCAGI,4BAKJ,CAAA,mFAGI,CAHJ,wCAGI,8BAKJ,CAAA,8EAGI,CAHJ,oCAGI,6BAKJ,CAAA,mFAGI,CAHJ,wCAGI", + "sourcesContent": [".editor {\n display: inline-grid;\n grid-template:\n \"NW N NE\" auto\n \"W C E\" auto\n \"SW S SE\" auto\n / auto auto auto;\n}\n\n.button {\n cursor: pointer;\n background: none;\n padding: 0;\n border: 0;\n color: inherit;\n height: 30px;\n width: 30px;\n margin: 0;\n\n & svg {\n color: inherit;\n }\n\n &:hover,\n &:focus {\n color: var(--colors-PrimaryBlue);\n }\n}\n\n.active {\n border-radius: 50%;\n box-shadow: 0 0 0 2px var(--colors-PrimaryBlue);\n}\n\n.highlight {\n border-radius: 50%;\n box-shadow: 0 0 0 2px var(--colors-Warn);\n}\n\n.northWest {\n grid-area: NW;\n\n & svg {\n transform: rotate(-45deg);\n }\n}\n\n.north {\n grid-area: N;\n}\n\n.northEast {\n grid-area: NE;\n\n & svg {\n transform: rotate(45deg);\n }\n}\n\n.west {\n grid-area: W;\n\n & svg {\n transform: rotate(-90deg);\n }\n}\n\n.center {\n grid-area: C;\n}\n\n.east {\n grid-area: E;\n\n & svg {\n transform: rotate(90deg);\n }\n}\n\n.southWest {\n grid-area: SW;\n\n & svg {\n transform: rotate(-135deg);\n }\n}\n\n.south {\n grid-area: S;\n\n & svg {\n transform: rotate(180deg);\n }\n}\n\n.southEast {\n grid-area: SE;\n\n & svg {\n transform: rotate(135deg);\n }\n}\n"], + "mappings": "AAAA,CAAA,4JASA,CAAA,2FATA,SAAA,UAmBI,CAVJ,cAUI,kBAIA,CAdJ,aAcI,uCAAA,CAdJ,aAcI,uCAMJ,CAAA,uFA7BA,kBAkCA,CAAA,mFAlCA,kBAuCA,CAAA,qCAGI,CAHJ,iBAGI,6BAKJ,CAAA,gCAIA,CAAA,qCAGI,CAHJ,iBAGI,4BAKJ,CAAA,+BAGI,CAHJ,YAGI,6BAKJ,CAAA,iCAIA,CAAA,+BAGI,CAHJ,YAGI,4BAKJ,CAAA,qCAGI,CAHJ,iBAGI,8BAKJ,CAAA,gCAGI,CAHJ,aAGI,6BAKJ,CAAA,qCAGI,CAHJ,iBAGI", "names": [] } diff --git a/Resources/Public/Plugin.js b/Resources/Public/Plugin.js index 7538f10..639fbb0 100644 --- a/Resources/Public/Plugin.js +++ b/Resources/Public/Plugin.js @@ -1,2 +1,2 @@ -(()=>{var X=Object.create;var I=Object.defineProperty;var Z=Object.getOwnPropertyDescriptor;var q=Object.getOwnPropertyNames;var v=Object.getPrototypeOf,F=Object.prototype.hasOwnProperty;var N=(t,r)=>()=>(t&&(r=t(t=0)),r);var f=(t,r)=>()=>(r||t((r={exports:{}}).exports,r),r.exports);var S=(t,r,e,o)=>{if(r&&typeof r=="object"||typeof r=="function")for(let i of q(r))!F.call(t,i)&&i!==e&&I(t,i,{get:()=>r[i],enumerable:!(o=Z(r,i))||o.enumerable});return t};var l=(t,r,e)=>(e=t!=null?X(v(t)):{},S(r||!t||!t.__esModule?I(e,"default",{value:t,enumerable:!0}):e,t));function c(t){return(...r)=>{if(window["@Neos:HostPluginAPI"]&&window["@Neos:HostPluginAPI"][`@${t}`])return window["@Neos:HostPluginAPI"][`@${t}`](...r);throw new Error("You are trying to read from a consumer api that hasn't been initialized yet!")}}var d=N(()=>{});var z=f((bt,C)=>{d();C.exports=c("vendor")().React});var O=f((lt,A)=>{d();A.exports=c("NeosProjectPackages")().NeosUiDecorators});var y=f((mt,Y)=>{d();Y.exports=c("NeosProjectPackages")().ReactUiComponents});d();var W=c("manifest");var a=l(z()),_=l(O()),h=l(y());var n={W:"carbon-directioneditor-Yzq_9W-W",northWest:"carbon-directioneditor-Yzq_9W-northWest",button:"carbon-directioneditor-Yzq_9W-button",active:"carbon-directioneditor-Yzq_9W-active",NE:"carbon-directioneditor-Yzq_9W-NE",northEast:"carbon-directioneditor-Yzq_9W-northEast",west:"carbon-directioneditor-Yzq_9W-west",S:"carbon-directioneditor-Yzq_9W-S",N:"carbon-directioneditor-Yzq_9W-N",highlight:"carbon-directioneditor-Yzq_9W-highlight",E:"carbon-directioneditor-Yzq_9W-E",NW:"carbon-directioneditor-Yzq_9W-NW",center:"carbon-directioneditor-Yzq_9W-center",SW:"carbon-directioneditor-Yzq_9W-SW",east:"carbon-directioneditor-Yzq_9W-east",C:"carbon-directioneditor-Yzq_9W-C",southWest:"carbon-directioneditor-Yzq_9W-southWest",SE:"carbon-directioneditor-Yzq_9W-SE",southEast:"carbon-directioneditor-Yzq_9W-southEast",editor:"carbon-directioneditor-Yzq_9W-editor",south:"carbon-directioneditor-Yzq_9W-south",north:"carbon-directioneditor-Yzq_9W-north"};function B(t){var r,e,o="";if(typeof t=="string"||typeof t=="number")o+=t;else if(typeof t=="object")if(Array.isArray(t)){var i=t.length;for(r=0;r({i18nRegistry:t.get("i18n"),config:t.get("frontendConfiguration").get("Carbon.RangeEditor")})),V={options:{north:!0,east:!0,south:!0,west:!0,northEast:!0,northWest:!0,southEast:!0,southWest:!0,center:!0,disabled:!1}};function U(t){let r=s=>{s==="center"&&(s=""),t.commit(s)},e={...V.options,...t.options},{value:o,highlight:i,i18nRegistry:x}=t,{disabled:u}=e;return a.default.createElement("div",{className:g(n.editor,u&&n.editorDisabled)},Object.entries(e).map(([s,b])=>{if(!b||s==="disabled")return;let m=typeof b=="string"?x.translate(b):null;return s==="center"?a.default.createElement("button",{type:"button",className:g(n.button,n[s],!o&&(i?n.highlight:n.active)),onClick:()=>r(""),disabled:u,title:m},a.default.createElement(h.Icon,{icon:"dot-circle"})):a.default.createElement("button",{type:"button",className:g(n.button,n[s],o===s&&(i?n.highlight:n.active)),onClick:()=>r(s),disabled:u,title:m},a.default.createElement(h.Icon,{icon:"chevron-up"}))}))}var G=w(U);W("Carbon.DirectionEditor:Editor",{},t=>{t.get("inspector").get("editors").set("Carbon.DirectionEditor/Editor",{component:G})});})(); +(()=>{var N=Object.create;var W=Object.defineProperty;var v=Object.getOwnPropertyDescriptor;var E=Object.getOwnPropertyNames;var S=Object.getPrototypeOf,J=Object.prototype.hasOwnProperty;var w=(t,e)=>()=>(t&&(e=t(t=0)),e);var h=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports);var V=(t,e,o,s)=>{if(e&&typeof e=="object"||typeof e=="function")for(let i of E(e))!J.call(t,i)&&i!==o&&W(t,i,{get:()=>e[i],enumerable:!(s=v(e,i))||s.enumerable});return t};var m=(t,e,o)=>(o=t!=null?N(S(t)):{},V(e||!t||!t.__esModule?W(o,"default",{value:t,enumerable:!0}):o,t));function a(t){return(...e)=>{if(window["@Neos:HostPluginAPI"]&&window["@Neos:HostPluginAPI"][`@${t}`])return window["@Neos:HostPluginAPI"][`@${t}`](...e);throw new Error("You are trying to read from a consumer api that hasn't been initialized yet!")}}var u=w(()=>{});var O=h((mt,A)=>{u();A.exports=a("vendor")().React});var Y=h((It,y)=>{u();y.exports=a("NeosProjectPackages")().NeosUiDecorators});var G=h((Wt,B)=>{u();B.exports=a("NeosProjectPackages")().ReactUiComponents});u();var z=a("manifest");var c=m(O()),X=m(Y()),_=m(G());var n={highlight:"Yzq_9W_highlight",W:"Yzq_9W_W",northEast:"Yzq_9W_northEast",south:"Yzq_9W_south",button:"Yzq_9W_button",north:"Yzq_9W_north",southEast:"Yzq_9W_southEast",E:"Yzq_9W_E",northWest:"Yzq_9W_northWest",west:"Yzq_9W_west",east:"Yzq_9W_east",SW:"Yzq_9W_SW",active:"Yzq_9W_active",N:"Yzq_9W_N",NE:"Yzq_9W_NE",NW:"Yzq_9W_NW",C:"Yzq_9W_C",SE:"Yzq_9W_SE",center:"Yzq_9W_center",S:"Yzq_9W_S",editor:"Yzq_9W_editor",southWest:"Yzq_9W_southWest"};function x(t){var e,o,s="";if(typeof t=="string"||typeof t=="number")s+=t;else if(typeof t=="object")if(Array.isArray(t)){var i=t.length;for(e=0;e({i18nRegistry:t.get("i18n"),config:t.get("frontendConfiguration").get("Carbon.RangeEditor")})),H={propertyMapping:!1,north:!0,east:!0,south:!0,west:!0,northEast:!0,northWest:!0,southEast:!0,southWest:!0,center:!0,disabled:!1};function j(t){let e={...H,...t.config,...t.options},{value:o,highlight:s,i18nRegistry:i}=t,{disabled:p}=e,[l,I]=(0,c.useState)(o);(0,c.useEffect)(()=>{I(Z(o))},[o]);function Z(r){if(e.propertyMapping){let g=Object.keys(e.propertyMapping).find(d=>e.propertyMapping[d]===r);if(g)return g}return r}function F(r){return e?.propertyMapping?.[r]||r}function b(r){I(r),r=F(r),r==="center"&&(r=""),t.commit(r)}return c.default.createElement("div",{className:f(n.editor,p&&n.editorDisabled)},Object.entries(e).map(([r,g])=>{if(!g||r==="disabled"||r==="propertyMapping")return null;let d=typeof g=="string"?i.translate(g):null;return r==="center"?c.default.createElement("button",{type:"button",className:f(n.button,n[r],(!l||l=="center")&&(s?n.highlight:n.active)),onClick:()=>b("center"),disabled:p,title:d},c.default.createElement(_.Icon,{icon:"dot-circle"})):c.default.createElement("button",{type:"button",className:f(n.button,n[r],l===r&&(s?n.highlight:n.active)),onClick:()=>b(r),disabled:p,title:d},c.default.createElement(_.Icon,{icon:"chevron-up"}))}))}var q=M(j);z("Carbon.DirectionEditor:Editor",{},t=>{t.get("inspector").get("editors").set("Carbon.DirectionEditor/Editor",{component:q})});})(); //# sourceMappingURL=Plugin.js.map diff --git a/Resources/Public/Plugin.js.map b/Resources/Public/Plugin.js.map index 44f6f44..17a532a 100644 --- a/Resources/Public/Plugin.js.map +++ b/Resources/Public/Plugin.js.map @@ -1,7 +1,7 @@ { "version": 3, - "sources": ["../../node_modules/.pnpm/@neos-project+neos-ui-extensibility@8.3.10/node_modules/@neos-project/neos-ui-extensibility/src/readFromConsumerApi.ts", "../../node_modules/.pnpm/@neos-project+neos-ui-extensibility@8.3.10/node_modules/@neos-project/neos-ui-extensibility/src/shims/vendor/react/index.js", "../../node_modules/.pnpm/@neos-project+neos-ui-extensibility@8.3.10/node_modules/@neos-project/neos-ui-extensibility/src/shims/neosProjectPackages/neos-ui-decorators/index.js", "../../node_modules/.pnpm/@neos-project+neos-ui-extensibility@8.3.10/node_modules/@neos-project/neos-ui-extensibility/src/shims/neosProjectPackages/react-ui-components/index.js", "../../node_modules/.pnpm/@neos-project+neos-ui-extensibility@8.3.10/node_modules/@neos-project/neos-ui-extensibility/src/index.ts", "../Private/DirectionEditor/Editor/index.js", "../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs", "../Private/DirectionEditor/manifest.js"], - "sourcesContent": [null, null, null, null, null, "import React, { useState } from \"react\";\nimport { neos } from \"@neos-project/neos-ui-decorators\";\nimport { Icon } from \"@neos-project/react-ui-components\";\nimport style from \"./style.module.css\";\nimport clsx from \"clsx\";\n\nconst neosifier = neos((globalRegistry) => ({\n i18nRegistry: globalRegistry.get(\"i18n\"),\n config: globalRegistry.get(\"frontendConfiguration\").get(\"Carbon.RangeEditor\"),\n}));\n\nconst defaultProps = {\n options: {\n north: true,\n east: true,\n south: true,\n west: true,\n northEast: true,\n northWest: true,\n southEast: true,\n southWest: true,\n center: true,\n disabled: false,\n },\n};\n\nfunction Editor(props) {\n const changeValue = (value) => {\n if (value === \"center\") {\n value = \"\";\n }\n props.commit(value);\n };\n\n const options = { ...defaultProps.options, ...props.options };\n const { value, highlight, i18nRegistry } = props;\n const { disabled } = options;\n\n return (\n
\n {Object.entries(options).map(([key, enabled]) => {\n if (!enabled || key === \"disabled\") {\n return;\n }\n const title = typeof enabled == \"string\" ? i18nRegistry.translate(enabled) : null;\n if (key === \"center\") {\n return (\n changeValue(\"\")}\n disabled={disabled}\n title={title}\n >\n \n \n );\n }\n return (\n changeValue(key)}\n disabled={disabled}\n title={title}\n >\n \n \n );\n })}\n
\n );\n}\n\nexport default neosifier(Editor);\n", "function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t {\n const editorsRegistry = globalRegistry.get(\"inspector\").get(\"editors\");\n\n editorsRegistry.set(\"Carbon.DirectionEditor/Editor\", {\n component: Editor,\n });\n});\n"], - "mappings": "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", - "names": ["readFromConsumerApi", "key", "args", "init_readFromConsumerApi", "__esmMin", "require_react", "__commonJSMin", "exports", "module", "init_readFromConsumerApi", "readFromConsumerApi", "require_neos_ui_decorators", "__commonJSMin", "exports", "module", "init_readFromConsumerApi", "readFromConsumerApi", "require_react_ui_components", "__commonJSMin", "exports", "module", "init_readFromConsumerApi", "readFromConsumerApi", "init_readFromConsumerApi", "dist_default", "readFromConsumerApi", "import_react", "import_neos_ui_decorators", "import_react_ui_components", "r", "e", "t", "f", "n", "o", "clsx", "clsx_default", "neosifier", "globalRegistry", "defaultProps", "Editor", "props", "changeValue", "value", "options", "highlight", "i18nRegistry", "disabled", "React", "clsx_default", "style_default", "key", "enabled", "title", "Editor_default", "dist_default", "globalRegistry", "Editor_default"] + "sources": ["../../node_modules/.pnpm/@neos-project+neos-ui-extensibility@8.3.11/node_modules/@neos-project/neos-ui-extensibility/src/readFromConsumerApi.ts", "../../node_modules/.pnpm/@neos-project+neos-ui-extensibility@8.3.11/node_modules/@neos-project/neos-ui-extensibility/src/shims/vendor/react/index.js", "../../node_modules/.pnpm/@neos-project+neos-ui-extensibility@8.3.11/node_modules/@neos-project/neos-ui-extensibility/src/shims/neosProjectPackages/neos-ui-decorators/index.js", "../../node_modules/.pnpm/@neos-project+neos-ui-extensibility@8.3.11/node_modules/@neos-project/neos-ui-extensibility/src/shims/neosProjectPackages/react-ui-components/index.js", "../../node_modules/.pnpm/@neos-project+neos-ui-extensibility@8.3.11/node_modules/@neos-project/neos-ui-extensibility/src/index.ts", "../Private/DirectionEditor/Editor/index.js", "../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs", "../Private/DirectionEditor/manifest.js"], + "sourcesContent": [null, null, null, null, null, "import React, { useState, useEffect } from \"react\";\nimport { neos } from \"@neos-project/neos-ui-decorators\";\nimport { Icon } from \"@neos-project/react-ui-components\";\nimport style from \"./style.module.css\";\nimport clsx from \"clsx\";\n\nconst neosifier = neos((globalRegistry) => ({\n i18nRegistry: globalRegistry.get(\"i18n\"),\n config: globalRegistry.get(\"frontendConfiguration\").get(\"Carbon.RangeEditor\"),\n}));\n\nconst defaultOptions = {\n propertyMapping: false,\n north: true,\n east: true,\n south: true,\n west: true,\n northEast: true,\n northWest: true,\n southEast: true,\n southWest: true,\n center: true,\n disabled: false,\n};\n\nfunction Editor(props) {\n const options = { ...defaultOptions, ...props.config, ...props.options };\n const { value, highlight, i18nRegistry } = props;\n const { disabled } = options;\n const [state, setState] = useState(value);\n\n useEffect(() => {\n setState(getValueFromPropertyMapping(value));\n }, [value]);\n\n function getValueFromPropertyMapping(value) {\n if (options.propertyMapping) {\n const key = Object.keys(options.propertyMapping).find((key) => options.propertyMapping[key] === value);\n if (key) {\n return key;\n }\n }\n return value;\n }\n\n function setValueFromPropertyMapping(value) {\n return options?.propertyMapping?.[value] || value;\n }\n\n function changeValue(value) {\n setState(value);\n value = setValueFromPropertyMapping(value);\n if (value === \"center\") {\n value = \"\";\n }\n props.commit(value);\n }\n\n return (\n
\n {Object.entries(options).map(([key, enabled]) => {\n if (!enabled || key === \"disabled\" || key === \"propertyMapping\") {\n return null;\n }\n const title = typeof enabled == \"string\" ? i18nRegistry.translate(enabled) : null;\n if (key === \"center\") {\n return (\n changeValue(\"center\")}\n disabled={disabled}\n title={title}\n >\n \n \n );\n }\n return (\n changeValue(key)}\n disabled={disabled}\n title={title}\n >\n \n \n );\n })}\n
\n );\n}\n\nexport default neosifier(Editor);\n", "function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t {\n const editorsRegistry = globalRegistry.get(\"inspector\").get(\"editors\");\n\n editorsRegistry.set(\"Carbon.DirectionEditor/Editor\", {\n component: Editor,\n });\n});\n"], + "mappings": "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", + "names": ["readFromConsumerApi", "key", "args", "init_readFromConsumerApi", "__esmMin", "require_react", "__commonJSMin", "exports", "module", "init_readFromConsumerApi", "readFromConsumerApi", "require_neos_ui_decorators", "__commonJSMin", "exports", "module", "init_readFromConsumerApi", "readFromConsumerApi", "require_react_ui_components", "__commonJSMin", "exports", "module", "init_readFromConsumerApi", "readFromConsumerApi", "init_readFromConsumerApi", "dist_default", "readFromConsumerApi", "import_react", "import_neos_ui_decorators", "import_react_ui_components", "r", "e", "t", "f", "n", "o", "clsx", "clsx_default", "neosifier", "globalRegistry", "defaultOptions", "Editor", "props", "options", "value", "highlight", "i18nRegistry", "disabled", "state", "setState", "getValueFromPropertyMapping", "key", "setValueFromPropertyMapping", "changeValue", "React", "clsx_default", "style_default", "enabled", "title", "Editor_default", "dist_default", "globalRegistry", "Editor_default"] }