@dooboostore/dom-render 1.0.108 → 1.0.110
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.
- package/README.MD +27 -1451
- package/dist/cjs/DomRender.js +41 -26
- package/dist/cjs/DomRender.js.map +2 -2
- package/dist/cjs/DomRenderProxy.js +134 -62
- package/dist/cjs/DomRenderProxy.js.map +2 -2
- package/dist/cjs/bundle-entry.js +32 -21
- package/dist/cjs/bundle-entry.js.map +2 -2
- package/dist/cjs/components/ComponentBase.js +24 -6
- package/dist/cjs/components/ComponentBase.js.map +2 -2
- package/dist/cjs/components/ComponentRouterBase.js +11 -1
- package/dist/cjs/components/ComponentRouterBase.js.map +2 -2
- package/dist/cjs/components/appender/Appender.js +0 -3
- package/dist/cjs/components/appender/Appender.js.map +2 -2
- package/dist/cjs/components/checkbox/CheckBox.js.map +2 -2
- package/dist/cjs/components/choose/Choose.js +7 -1
- package/dist/cjs/components/choose/Choose.js.map +2 -2
- package/dist/cjs/components/details/Details.js +2 -2
- package/dist/cjs/components/details/Details.js.map +2 -2
- package/dist/cjs/components/forOf/ForOf.js.map +2 -2
- package/dist/cjs/components/if/If.js +2 -2
- package/dist/cjs/components/if/If.js.map +2 -2
- package/dist/cjs/components/input/Input.js +2 -2
- package/dist/cjs/components/input/Input.js.map +2 -2
- package/dist/cjs/components/promise/PromiseSwitch.js +6 -6
- package/dist/cjs/components/promise/PromiseSwitch.js.map +2 -2
- package/dist/cjs/components/radio/Radio.js.map +2 -2
- package/dist/cjs/components/router/Route.js +2 -2
- package/dist/cjs/components/router/Route.js.map +2 -2
- package/dist/cjs/components/router/RouterOutlet.js +17 -3
- package/dist/cjs/components/router/RouterOutlet.js.map +2 -2
- package/dist/cjs/components/select/Select.js +26 -12
- package/dist/cjs/components/select/Select.js.map +2 -2
- package/dist/cjs/components/this/This.js +2 -2
- package/dist/cjs/components/this/This.js.map +2 -2
- package/dist/cjs/components/timer/Timer.js +15 -13
- package/dist/cjs/components/timer/Timer.js.map +2 -2
- package/dist/cjs/decorators/DomRenderNoProxy.js +2 -1
- package/dist/cjs/decorators/DomRenderNoProxy.js.map +2 -2
- package/dist/cjs/events/EventManager.js +9 -2
- package/dist/cjs/events/EventManager.js.map +2 -2
- package/dist/cjs/lifecycle/OnInitRender.js.map +1 -1
- package/dist/cjs/lifecycle/OnRawSetRendered.js +26 -0
- package/dist/cjs/lifecycle/OnRawSetRendered.js.map +7 -0
- package/dist/cjs/lifecycle/index.js +1 -0
- package/dist/cjs/lifecycle/index.js.map +2 -2
- package/dist/cjs/operators/DrForOf.js +24 -11
- package/dist/cjs/operators/DrForOf.js.map +2 -2
- package/dist/cjs/operators/DrIf.js +1 -2
- package/dist/cjs/operators/DrIf.js.map +2 -2
- package/dist/cjs/operators/DrInnerText.js +2 -2
- package/dist/cjs/operators/DrInnerText.js.map +2 -2
- package/dist/cjs/operators/DrTargetElement.js +2 -0
- package/dist/cjs/operators/DrTargetElement.js.map +2 -2
- package/dist/cjs/operators/OperatorExecuter.js +1 -2
- package/dist/cjs/operators/OperatorExecuter.js.map +2 -2
- package/dist/cjs/package.json +5 -0
- package/dist/cjs/rawsets/RawSet.js +392 -115
- package/dist/cjs/rawsets/RawSet.js.map +3 -3
- package/dist/cjs/rawsets/Render.js.map +1 -1
- package/dist/cjs/routers/PathRouter.js +13 -7
- package/dist/cjs/routers/PathRouter.js.map +2 -2
- package/dist/cjs/routers/Router.js +76 -36
- package/dist/cjs/routers/Router.js.map +3 -3
- package/dist/esm/DomRender.js +41 -26
- package/dist/esm/DomRender.js.map +2 -2
- package/dist/esm/DomRenderProxy.js +134 -62
- package/dist/esm/DomRenderProxy.js.map +2 -2
- package/dist/esm/bundle-entry.js +22 -21
- package/dist/esm/bundle-entry.js.map +2 -2
- package/dist/esm/components/ComponentBase.js +24 -6
- package/dist/esm/components/ComponentBase.js.map +2 -2
- package/dist/esm/components/ComponentRouterBase.js +11 -1
- package/dist/esm/components/ComponentRouterBase.js.map +2 -2
- package/dist/esm/components/appender/Appender.js +0 -3
- package/dist/esm/components/appender/Appender.js.map +2 -2
- package/dist/esm/components/checkbox/CheckBox.js.map +2 -2
- package/dist/esm/components/choose/Choose.js +7 -1
- package/dist/esm/components/choose/Choose.js.map +2 -2
- package/dist/esm/components/details/Details.js +2 -2
- package/dist/esm/components/details/Details.js.map +2 -2
- package/dist/esm/components/forOf/ForOf.js.map +2 -2
- package/dist/esm/components/if/If.js +2 -2
- package/dist/esm/components/if/If.js.map +2 -2
- package/dist/esm/components/input/Input.js +2 -2
- package/dist/esm/components/input/Input.js.map +2 -2
- package/dist/esm/components/promise/PromiseSwitch.js +6 -6
- package/dist/esm/components/promise/PromiseSwitch.js.map +2 -2
- package/dist/esm/components/radio/Radio.js.map +2 -2
- package/dist/esm/components/router/Route.js +2 -2
- package/dist/esm/components/router/Route.js.map +2 -2
- package/dist/esm/components/router/RouterOutlet.js +18 -4
- package/dist/esm/components/router/RouterOutlet.js.map +2 -2
- package/dist/esm/components/select/Select.js +26 -12
- package/dist/esm/components/select/Select.js.map +2 -2
- package/dist/esm/components/this/This.js +2 -2
- package/dist/esm/components/this/This.js.map +2 -2
- package/dist/esm/components/timer/Timer.js +15 -13
- package/dist/esm/components/timer/Timer.js.map +2 -2
- package/dist/esm/decorators/DomRenderNoProxy.js +2 -1
- package/dist/esm/decorators/DomRenderNoProxy.js.map +2 -2
- package/dist/esm/events/EventManager.js +9 -2
- package/dist/esm/events/EventManager.js.map +2 -2
- package/dist/esm/lifecycle/OnInitRender.js.map +1 -1
- package/dist/esm/lifecycle/OnRawSetRendered.js +7 -0
- package/dist/esm/lifecycle/OnRawSetRendered.js.map +7 -0
- package/dist/esm/lifecycle/index.js +1 -0
- package/dist/esm/lifecycle/index.js.map +2 -2
- package/dist/esm/operators/DrForOf.js +24 -11
- package/dist/esm/operators/DrForOf.js.map +2 -2
- package/dist/esm/operators/DrIf.js +1 -2
- package/dist/esm/operators/DrIf.js.map +2 -2
- package/dist/esm/operators/DrInnerText.js +2 -2
- package/dist/esm/operators/DrInnerText.js.map +2 -2
- package/dist/esm/operators/DrTargetElement.js +2 -0
- package/dist/esm/operators/DrTargetElement.js.map +2 -2
- package/dist/esm/operators/OperatorExecuter.js +1 -2
- package/dist/esm/operators/OperatorExecuter.js.map +2 -2
- package/dist/esm/rawsets/RawSet.js +392 -115
- package/dist/esm/rawsets/RawSet.js.map +3 -3
- package/dist/esm/routers/PathRouter.js +13 -7
- package/dist/esm/routers/PathRouter.js.map +2 -2
- package/dist/esm/routers/Router.js +76 -36
- package/dist/esm/routers/Router.js.map +3 -3
- package/dist/esm-bundle/dooboostore-dom-render.esm.js +14023 -6402
- package/dist/esm-bundle/dooboostore-dom-render.esm.js.map +4 -4
- package/dist/types/DomRender.d.ts +11 -5
- package/dist/types/DomRender.d.ts.map +1 -1
- package/dist/types/DomRenderProxy.d.ts +2 -2
- package/dist/types/DomRenderProxy.d.ts.map +1 -1
- package/dist/types/bundle-entry.d.ts +5 -2
- package/dist/types/bundle-entry.d.ts.map +1 -1
- package/dist/types/components/ComponentBase.d.ts +8 -2
- package/dist/types/components/ComponentBase.d.ts.map +1 -1
- package/dist/types/components/ComponentRouterBase.d.ts +8 -0
- package/dist/types/components/ComponentRouterBase.d.ts.map +1 -1
- package/dist/types/components/appender/Appender.d.ts +0 -2
- package/dist/types/components/appender/Appender.d.ts.map +1 -1
- package/dist/types/components/checkbox/CheckBox.d.ts.map +1 -1
- package/dist/types/components/choose/Choose.d.ts.map +1 -1
- package/dist/types/components/details/Details.d.ts +1 -1
- package/dist/types/components/details/Details.d.ts.map +1 -1
- package/dist/types/components/forOf/ForOf.d.ts.map +1 -1
- package/dist/types/components/if/If.d.ts +1 -1
- package/dist/types/components/if/If.d.ts.map +1 -1
- package/dist/types/components/index.d.ts +2 -1
- package/dist/types/components/index.d.ts.map +1 -1
- package/dist/types/components/input/Input.d.ts +1 -1
- package/dist/types/components/input/Input.d.ts.map +1 -1
- package/dist/types/components/promise/PromiseSwitch.d.ts +1 -1
- package/dist/types/components/promise/PromiseSwitch.d.ts.map +1 -1
- package/dist/types/components/radio/Radio.d.ts.map +1 -1
- package/dist/types/components/router/Route.d.ts +1 -1
- package/dist/types/components/router/Route.d.ts.map +1 -1
- package/dist/types/components/router/RouterOutlet.d.ts +6 -2
- package/dist/types/components/router/RouterOutlet.d.ts.map +1 -1
- package/dist/types/components/select/Select.d.ts +5 -5
- package/dist/types/components/select/Select.d.ts.map +1 -1
- package/dist/types/components/this/This.d.ts +1 -1
- package/dist/types/components/this/This.d.ts.map +1 -1
- package/dist/types/components/timer/Timer.d.ts +6 -4
- package/dist/types/components/timer/Timer.d.ts.map +1 -1
- package/dist/types/decorators/DomRenderNoProxy.d.ts.map +1 -1
- package/dist/types/events/EventManager.d.ts +8 -0
- package/dist/types/events/EventManager.d.ts.map +1 -1
- package/dist/types/index.d.ts +0 -100
- package/dist/types/lifecycle/OnInitRender.d.ts +1 -1
- package/dist/types/lifecycle/OnInitRender.d.ts.map +1 -1
- package/dist/types/lifecycle/OnRawSetRendered.d.ts +10 -0
- package/dist/types/lifecycle/OnRawSetRendered.d.ts.map +1 -0
- package/dist/types/lifecycle/index.d.ts +1 -0
- package/dist/types/lifecycle/index.d.ts.map +1 -1
- package/dist/types/operators/DrForOf.d.ts.map +1 -1
- package/dist/types/operators/DrInnerText.d.ts.map +1 -1
- package/dist/types/operators/DrTargetElement.d.ts.map +1 -1
- package/dist/types/operators/OperatorExecuter.d.ts.map +1 -1
- package/dist/types/rawsets/RawSet.d.ts +17 -9
- package/dist/types/rawsets/RawSet.d.ts.map +1 -1
- package/dist/types/rawsets/Render.d.ts +1 -0
- package/dist/types/rawsets/Render.d.ts.map +1 -1
- package/dist/types/routers/PathRouter.d.ts.map +1 -1
- package/dist/types/routers/Router.d.ts +11 -14
- package/dist/types/routers/Router.d.ts.map +1 -1
- package/dist/umd-bundle/dooboostore-dom-render.umd.js +14104 -6502
- package/dist/umd-bundle/dooboostore-dom-render.umd.js.map +4 -4
- package/package.json +9 -8
- package/src/DomRender.ts +62 -34
- package/src/DomRenderProxy.ts +275 -142
- package/src/bundle-entry.ts +5 -3
- package/src/components/ComponentBase.ts +33 -11
- package/src/components/ComponentRouterBase.ts +17 -2
- package/src/components/appender/Appender.ts +0 -5
- package/src/components/checkbox/CheckBox.ts +22 -25
- package/src/components/choose/Choose.ts +19 -18
- package/src/components/details/Details.ts +40 -43
- package/src/components/forOf/ForOf.ts +6 -9
- package/src/components/if/If.ts +9 -11
- package/src/components/input/Input.ts +16 -22
- package/src/components/promise/PromiseSwitch.ts +67 -66
- package/src/components/radio/Radio.ts +23 -28
- package/src/components/router/Route.ts +10 -13
- package/src/components/router/RouterOutlet.ts +29 -8
- package/src/components/select/Select.ts +47 -33
- package/src/components/this/This.ts +13 -12
- package/src/components/timer/Timer.ts +29 -65
- package/src/decorators/DomRenderNoProxy.ts +3 -1
- package/src/events/EventManager.ts +15 -4
- package/src/lifecycle/OnInitRender.ts +1 -1
- package/src/lifecycle/OnRawSetRendered.ts +15 -0
- package/src/lifecycle/index.ts +1 -0
- package/src/node_modules/.bin/acorn +17 -0
- package/src/node_modules/.bin/browserslist +17 -0
- package/src/node_modules/.bin/eslint +17 -0
- package/src/node_modules/.bin/sbf +17 -0
- package/src/node_modules/.bin/ts-node +17 -0
- package/src/node_modules/.bin/ts-node-cwd +17 -0
- package/src/node_modules/.bin/ts-node-dev +17 -0
- package/src/node_modules/.bin/ts-node-esm +17 -0
- package/src/node_modules/.bin/ts-node-script +17 -0
- package/src/node_modules/.bin/ts-node-transpile-only +17 -0
- package/src/node_modules/.bin/ts-script +17 -0
- package/src/node_modules/.bin/tsc +17 -0
- package/src/node_modules/.bin/tsnd +17 -0
- package/src/node_modules/.bin/tsserver +17 -0
- package/src/node_modules/.bin/webpack +17 -0
- package/src/node_modules/.bin/webpack-cli +17 -0
- package/src/node_modules/.bin/webpack-dev-server +17 -0
- package/src/operators/DrForOf.ts +25 -10
- package/src/operators/DrIf.ts +1 -1
- package/src/operators/DrInnerText.ts +2 -1
- package/src/operators/DrTargetElement.ts +14 -0
- package/src/operators/OperatorExecuter.ts +1 -2
- package/src/rawsets/RawSet.ts +709 -295
- package/src/rawsets/Render.ts +1 -0
- package/src/routers/PathRouter.ts +14 -7
- package/src/routers/Router.ts +107 -61
- package/types.d.ts +0 -2825
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/components/radio/Radio.ts"],
|
|
4
|
-
"sourcesContent": ["import { ComponentBase } from '../ComponentBase';\nimport { DomRender, DomRenderRunConfig } from '../../DomRender';\nimport { RawSet } from '../../rawsets/RawSet';\nimport { OtherData } from '../../lifecycle/OnChangeAttrRender';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,2BAA8B;AAC9B,uBAA8C;AAC9C,oBAAuB;
|
|
4
|
+
"sourcesContent": ["import { ComponentBase } from '../ComponentBase';\nimport { DomRender, DomRenderRunConfig } from '../../DomRender';\nimport { RawSet } from '../../rawsets/RawSet';\nimport { OtherData } from '../../lifecycle/OnChangeAttrRender';\nimport { OnCreateRenderDataParams } from '../../lifecycle/OnCreateRenderData';\n\nexport namespace Radio {\n export const selector = 'System:Radio';\n export type Attribute = {\n class?: string;\n };\n export type LabelAttribute = {\n class?: string;\n name?: string;\n value?: string;\n checked?: boolean;\n on_change_checked?: (checked: boolean, element: HTMLInputElement) => void;\n };\n\n class RadioBase extends ComponentBase<Attribute> {\n public hidden = true;\n }\n\n export class Checked extends RadioBase {\n public name = 'Checked';\n\n constructor() {\n super({ onlyParentType: Radio });\n }\n }\n\n export class UnChecked extends RadioBase {\n public name = 'unChecked';\n\n constructor() {\n super({ onlyParentType: Radio });\n }\n }\n\n export class Radio extends ComponentBase<LabelAttribute> {\n private checked = false;\n private inputElement?: HTMLInputElement;\n\n change(checked?: boolean) {\n checked = checked ?? this.checked;\n this.checked = checked;\n this.setChildrenHidden(checked);\n console.log('radio checked!!!!!!!', checked, this.checked, this.inputElement?.checked);\n if (this.getAttribute('on_change_checked')) {\n this.getAttribute('on_change_checked')?.(checked, this.inputElement!);\n }\n }\n\n private setChildrenHidden(checked: boolean) {\n this.getChildren(Checked).forEach(it => {\n it.hidden = !checked;\n });\n this.getChildren(UnChecked).forEach(it => {\n it.hidden = checked;\n });\n }\n\n onCreatedThisChild(child: RadioBase, childData: OnCreateRenderDataParams): void {\n super.onCreatedThisChild(child, childData);\n this.setChildrenHidden(this.checked);\n }\n\n onInitInputElement(element: HTMLInputElement) {\n this.inputElement = element;\n }\n\n onChangeAttrRender(name: string, val: any, other: OtherData) {\n super.onChangeAttrRender(name, val, other);\n if (this.inputElement && this.getAttribute('checked') !== this.checked) {\n this.inputElement.checked = !!this.getAttribute('checked');\n console.log('----changeAttribute', this.getAttribute('checked'));\n this.change(!!this.getAttribute('checked'));\n }\n }\n }\n}\n\nexport default {\n radioChecked: (config?: DomRenderRunConfig) => {\n return RawSet.createComponentTargetElement({\n name: `${Radio.selector}-checked`,\n template: '<div dr-if=\"!@this@.hidden\" dr-option-strip=\"true\" >#innerHTML#</div>',\n objFactory: (e, o, r2, counstructorParam) => {\n return DomRender.run({ rootObject: new Radio.Checked(), config: config });\n }\n });\n },\n radioUnChecked: (config?: DomRenderRunConfig) => {\n return RawSet.createComponentTargetElement({\n name: `${Radio.selector}-unchecked`,\n template: '<div dr-if=\"!@this@.hidden\" dr-option-strip=\"true\" >#innerHTML#</div>',\n objFactory: (e, o, r2, counstructorParam) => {\n return DomRender.run({ rootObject: new Radio.UnChecked(), config: config });\n }\n });\n },\n radio: (config?: DomRenderRunConfig) => {\n return RawSet.createComponentTargetElement({\n name: `${Radio.selector}`,\n template:\n '<label class=\"${@this@.getAttribute(\\'class\\')}$\">\\n' +\n ' <input\\n' +\n ' name=\"${@this@.getAttribute(\\'name\\')}$\"\\n' +\n ' checked=\"${@this@.getAttribute(\\'checked\\')}$\"\\n' +\n ' value=\"${@this@.getAttribute(\\'value\\')}$\"\\n' +\n ' dr-on-init=\"@this@.onInitInputElement($element)\"\\n' +\n ' dr-event-change=\"@this@.change($element.checked);\"\\n' +\n ' type=\"radio\"\\n' +\n '\\n' +\n ' />\\n' +\n \" ${@this@.getAttribute('checked')}$\\n\" +\n ' #innerHTML#\\n' +\n '</label>',\n objFactory: (e, o, r2, counstructorParam) => {\n return DomRender.run({ rootObject: new Radio.Radio(...counstructorParam), config: config });\n }\n });\n }\n};"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,2BAA8B;AAC9B,uBAA8C;AAC9C,oBAAuB;AAIhB,IAAU;AAAA,CAAV,CAAU,WAAV;AACE,EAAM,kBAAW;AAAA,EAYxB,MAAM,kBAAkB,mCAAyB;AAAA,IAAjD;AAAA;AACE,WAAO,SAAS;AAAA;AAAA,EAClB;AAAA,EAEO,MAAM,gBAAgB,UAAU;AAAA,IAGrC,cAAc;AACZ,YAAM,EAAE,gBAAgBA,OAAM,CAAC;AAHjC,WAAO,OAAO;AAAA,IAId;AAAA,EACF;AANO,SAAM;AAAA,EAQN,MAAM,kBAAkB,UAAU;AAAA,IAGvC,cAAc;AACZ,YAAM,EAAE,gBAAgBA,OAAM,CAAC;AAHjC,WAAO,OAAO;AAAA,IAId;AAAA,EACF;AANO,SAAM;AAAA,EAQN,MAAMA,eAAc,mCAA8B;AAAA,IAAlD;AAAA;AACL,WAAQ,UAAU;AAAA;AAAA,IAGlB,OAAO,SAAmB;AACxB,gBAAU,WAAW,KAAK;AAC1B,WAAK,UAAU;AACf,WAAK,kBAAkB,OAAO;AAC9B,cAAQ,IAAI,wBAAwB,SAAS,KAAK,SAAS,KAAK,cAAc,OAAO;AACrF,UAAI,KAAK,aAAa,mBAAmB,GAAG;AAC1C,aAAK,aAAa,mBAAmB,IAAI,SAAS,KAAK,YAAa;AAAA,MACtE;AAAA,IACF;AAAA,IAEQ,kBAAkB,SAAkB;AAC1C,WAAK,YAAY,OAAO,EAAE,QAAQ,QAAM;AACtC,WAAG,SAAS,CAAC;AAAA,MACf,CAAC;AACD,WAAK,YAAY,SAAS,EAAE,QAAQ,QAAM;AACxC,WAAG,SAAS;AAAA,MACd,CAAC;AAAA,IACH;AAAA,IAEA,mBAAmB,OAAkB,WAA2C;AAC9E,YAAM,mBAAmB,OAAO,SAAS;AACzC,WAAK,kBAAkB,KAAK,OAAO;AAAA,IACrC;AAAA,IAEA,mBAAmB,SAA2B;AAC5C,WAAK,eAAe;AAAA,IACtB;AAAA,IAEA,mBAAmB,MAAc,KAAU,OAAkB;AAC3D,YAAM,mBAAmB,MAAM,KAAK,KAAK;AACzC,UAAI,KAAK,gBAAgB,KAAK,aAAa,SAAS,MAAM,KAAK,SAAS;AACtE,aAAK,aAAa,UAAU,CAAC,CAAC,KAAK,aAAa,SAAS;AACzD,gBAAQ,IAAI,uBAAuB,KAAK,aAAa,SAAS,CAAC;AAC/D,aAAK,OAAO,CAAC,CAAC,KAAK,aAAa,SAAS,CAAC;AAAA,MAC5C;AAAA,IACF;AAAA,EACF;AAxCO,SAAM,QAAAA;AAAA,GAjCE;AA4EjB,IAAO,gBAAQ;AAAA,EACb,cAAc,CAAC,WAAgC;AAC7C,WAAO,qBAAO,6BAA6B;AAAA,MACzC,MAAM,GAAG,MAAM,QAAQ;AAAA,MACvB,UAAU;AAAA,MACV,YAAY,CAAC,GAAG,GAAG,IAAI,sBAAsB;AAC3C,eAAO,2BAAU,IAAI,EAAE,YAAY,IAAI,MAAM,QAAQ,GAAG,OAAe,CAAC;AAAA,MAC1E;AAAA,IACF,CAAC;AAAA,EACH;AAAA,EACA,gBAAgB,CAAC,WAAgC;AAC/C,WAAO,qBAAO,6BAA6B;AAAA,MACzC,MAAM,GAAG,MAAM,QAAQ;AAAA,MACvB,UAAU;AAAA,MACV,YAAY,CAAC,GAAG,GAAG,IAAI,sBAAsB;AAC3C,eAAO,2BAAU,IAAI,EAAE,YAAY,IAAI,MAAM,UAAU,GAAG,OAAe,CAAC;AAAA,MAC5E;AAAA,IACF,CAAC;AAAA,EACH;AAAA,EACA,OAAO,CAAC,WAAgC;AACtC,WAAO,qBAAO,6BAA6B;AAAA,MACzC,MAAM,GAAG,MAAM,QAAQ;AAAA,MACvB,UACE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAaF,YAAY,CAAC,GAAG,GAAG,IAAI,sBAAsB;AAC3C,eAAO,2BAAU,IAAI,EAAE,YAAY,IAAI,MAAM,MAAM,GAAG,iBAAiB,GAAG,OAAe,CAAC;AAAA,MAC5F;AAAA,IACF,CAAC;AAAA,EACH;AACF;",
|
|
6
6
|
"names": ["Radio"]
|
|
7
7
|
}
|
|
@@ -43,8 +43,8 @@ var Route;
|
|
|
43
43
|
this.sw = false;
|
|
44
44
|
this.inputDomRenderConfig = domRenderConfig;
|
|
45
45
|
}
|
|
46
|
-
onInitRender(param, rawSet) {
|
|
47
|
-
super.onInitRender(param, rawSet);
|
|
46
|
+
async onInitRender(param, rawSet) {
|
|
47
|
+
await super.onInitRender(param, rawSet);
|
|
48
48
|
this.routerSubscription = this.inputDomRenderConfig?.router?.observable.subscribe((it) => {
|
|
49
49
|
if (this.value && this.inputDomRenderConfig) {
|
|
50
50
|
this.sw = this.check(this.inputDomRenderConfig);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/components/router/Route.ts"],
|
|
4
|
-
"sourcesContent": ["import { attribute, ComponentBase } from '../ComponentBase';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA,2BAAyC;
|
|
4
|
+
"sourcesContent": ["import { attribute, ComponentBase } from '../ComponentBase';\nimport { DomRender } from '../../DomRender';\nimport { OnInitRender } from '../../lifecycle/OnInitRender';\nimport { RawSet } from '../../rawsets/RawSet';\nimport type { DomRenderConfig } from '../../configs/DomRenderConfig';\nimport { DomRenderNoProxy } from '../../decorators/DomRenderNoProxy';\nimport { OnDestroyRenderParams } from '../../lifecycle/OnDestroyRender';\nimport { Subscription } from '@dooboostore/core/message/Subscription';\n\nexport namespace Route {\n export const selector = 'dr-route';\n export type Attribute<D> = {\n value?: null | string;\n };\n\n abstract class CheckerBase<D> extends ComponentBase<Attribute<D>> implements OnInitRender {\n protected sw: boolean = false;\n @attribute({ name: 'value' })\n value?: string;\n @DomRenderNoProxy\n private inputDomRenderConfig?: DomRenderConfig;\n private routerSubscription?: Subscription;\n\n constructor(domRenderConfig?: DomRenderConfig) {\n super();\n this.inputDomRenderConfig = domRenderConfig;\n }\n\n async onInitRender(param: any, rawSet: RawSet) {\n await super.onInitRender(param, rawSet);\n this.routerSubscription = this.inputDomRenderConfig?.router?.observable.subscribe(it => {\n if (this.value && this.inputDomRenderConfig) {\n this.sw = this.check(this.inputDomRenderConfig);\n } else {\n this.sw = false;\n }\n });\n }\n\n onDrThisBind() {\n super.onDrThisBind();\n }\n\n onDrThisUnBind() {\n super.onDrThisUnBind();\n }\n\n onDestroyRender(data?: OnDestroyRenderParams) {\n super.onDestroyRender(data);\n this.routerSubscription?.unsubscribe();\n }\n\n abstract check(config?: DomRenderConfig): boolean;\n }\n\n export class Match<D> extends CheckerBase<D> {\n check(config?: DomRenderConfig): boolean {\n return !!config?.router?.test(this.value);\n }\n }\n\n export class Regexp<D> extends CheckerBase<D> {\n check(config?: DomRenderConfig): boolean {\n return !!config?.router?.testRegexp(this.value);\n }\n }\n}\n\nexport default {\n match: (config?: DomRenderConfig) => {\n return RawSet.createComponentTargetElement({\n name: `${Route.selector}-match`,\n template: '<div dr-if=\"@this@.sw\" dr-option-strip=\"true\">#innerHTML#</div>',\n objFactory: (e, o, r2, counstructorParam) => {\n return DomRender.run({ rootObject: new Route.Match(config), config: config });\n }\n });\n },\n regexp: (config?: DomRenderConfig) => {\n return RawSet.createComponentTargetElement({\n name: `${Route.selector}-regexp`,\n template: '<div dr-if=\"@this@.sw\" dr-option-strip=\"true\">#innerHTML#</div>',\n objFactory: (e, o, r2, counstructorParam) => {\n return DomRender.run({ rootObject: new Route.Regexp(config), config: config });\n }\n });\n }\n};\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA,2BAAyC;AACzC,uBAA0B;AAE1B,oBAAuB;AAEvB,8BAAiC;;;;;;;;;;AAI3B,IAAW;CAAjB,SAAiBA,QAAK;AACP,EAAAA,OAAA,WAAW;EAKxB,MAAe,oBAAuB,mCAA2B;IAQ/D,YAAY,iBAAiC;AAC3C,YAAK;AARG,WAAA,KAAc;AAStB,WAAK,uBAAuB;IAC9B;IAEA,MAAM,aAAa,OAAY,QAAc;AAC3C,YAAM,MAAM,aAAa,OAAO,MAAM;AACtC,WAAK,qBAAqB,KAAK,sBAAsB,QAAQ,WAAW,UAAU,QAAK;AACrF,YAAI,KAAK,SAAS,KAAK,sBAAsB;AAC3C,eAAK,KAAK,KAAK,MAAM,KAAK,oBAAoB;QAChD,OAAO;AACL,eAAK,KAAK;QACZ;MACF,CAAC;IACH;IAEA,eAAY;AACV,YAAM,aAAY;IACpB;IAEA,iBAAc;AACZ,YAAM,eAAc;IACtB;IAEA,gBAAgB,MAA4B;AAC1C,YAAM,gBAAgB,IAAI;AAC1B,WAAK,oBAAoB,YAAW;IACtC;;AAhCA,aAAA;QADC,gCAAU,EAAE,MAAM,QAAO,CAAE;;;AAGpB,aAAA;IADP;;;EAoCH,MAAa,cAAiB,YAAc;IAC1C,MAAM,QAAwB;AAC5B,aAAO,CAAC,CAAC,QAAQ,QAAQ,KAAK,KAAK,KAAK;IAC1C;;AAHW,EAAAA,OAAA,QAAK;EAMlB,MAAa,eAAkB,YAAc;IAC3C,MAAM,QAAwB;AAC5B,aAAO,CAAC,CAAC,QAAQ,QAAQ,WAAW,KAAK,KAAK;IAChD;;AAHW,EAAAA,OAAA,SAAM;AAKrB,GAzDiB,UAAA,QAAK,CAAA,EAAA;AA2DtB,IAAA,gBAAe;EACb,OAAO,CAAC,WAA4B;AAClC,WAAO,qBAAO,6BAA6B;MACzC,MAAM,GAAG,MAAM,QAAQ;MACvB,UAAU;MACV,YAAY,CAAC,GAAG,GAAG,IAAI,sBAAqB;AAC1C,eAAO,2BAAU,IAAI,EAAE,YAAY,IAAI,MAAM,MAAM,MAAM,GAAG,OAAc,CAAE;MAC9E;KACD;EACH;EACA,QAAQ,CAAC,WAA4B;AACnC,WAAO,qBAAO,6BAA6B;MACzC,MAAM,GAAG,MAAM,QAAQ;MACvB,UAAU;MACV,YAAY,CAAC,GAAG,GAAG,IAAI,sBAAqB;AAC1C,eAAO,2BAAU,IAAI,EAAE,YAAY,IAAI,MAAM,OAAO,MAAM,GAAG,OAAc,CAAE;MAC/E;KACD;EACH;;",
|
|
6
6
|
"names": ["Route"]
|
|
7
7
|
}
|
|
@@ -35,10 +35,13 @@ var RouterOutlet;
|
|
|
35
35
|
setValue(value) {
|
|
36
36
|
this.value = value;
|
|
37
37
|
}
|
|
38
|
-
onInitRender(param, rawSet) {
|
|
39
|
-
super.onInitRender(param, rawSet);
|
|
38
|
+
async onInitRender(param, rawSet) {
|
|
39
|
+
await super.onInitRender(param, rawSet);
|
|
40
40
|
const c = this.getParentThis();
|
|
41
|
-
|
|
41
|
+
const userValue = this.getAttribute("value");
|
|
42
|
+
if (userValue) {
|
|
43
|
+
this.value = userValue;
|
|
44
|
+
} else if (c instanceof import_ComponentRouterBase.ComponentRouterBase) {
|
|
42
45
|
this.value = c.child;
|
|
43
46
|
}
|
|
44
47
|
}
|
|
@@ -57,6 +60,17 @@ var RouterOutlet;
|
|
|
57
60
|
this.createArguments = value;
|
|
58
61
|
}
|
|
59
62
|
}
|
|
63
|
+
onCreatedThisChild(child, data) {
|
|
64
|
+
super.onCreatedThisChild(child, data);
|
|
65
|
+
}
|
|
66
|
+
onCreatedThisChildDebounce(childrenSet) {
|
|
67
|
+
super.onCreatedThisChildDebounce(childrenSet);
|
|
68
|
+
let parentThis = this.getParentThis();
|
|
69
|
+
if ((0, import_ComponentRouterBase.isOnCreatedOutletDebounce)(parentThis)) {
|
|
70
|
+
parentThis.onCreatedOutletDebounce(this.value?.obj);
|
|
71
|
+
}
|
|
72
|
+
this.getAttribute("onCreatedDebounce")?.(this.value?.obj);
|
|
73
|
+
}
|
|
60
74
|
created(component) {
|
|
61
75
|
component ?? (component = this.value?.obj);
|
|
62
76
|
this.getAttribute("onCreated")?.(component);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/components/router/RouterOutlet.ts"],
|
|
4
|
-
"sourcesContent": ["import { ComponentBase } from '../ComponentBase';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,
|
|
4
|
+
"sourcesContent": ["import { ChildrenSet, ComponentBase } from '../ComponentBase';\nimport { DomRenderRunConfig } from '../../DomRender';\nimport { RawSet } from '../../rawsets/RawSet';\nimport { OtherData } from '../../lifecycle/OnChangeAttrRender';\nimport { OnInitRender } from '../../lifecycle/OnInitRender';\nimport { ComponentSet } from '../../components/ComponentSet';\nimport { OnDestroyRenderParams } from '../../lifecycle/OnDestroyRender';\nimport { ComponentRouterBase, isOnCreatedOutletDebounce } from '../../components/ComponentRouterBase';\nimport { OnCreateRenderDataParams } from 'src/lifecycle';\n\nexport namespace RouterOutlet {\n export const selector = 'dr-router-outlet';\n export type Attribute = {\n value: ComponentSet;\n if: boolean | null;\n createArguments: any[];\n onCreated?: (value: any) => void;\n onCreatedDebounce?: (value: any) => void;\n onDestroyRender?: () => void;\n };\n\n export class RouterOutlet extends ComponentBase<Attribute> implements OnInitRender {\n private value?: ComponentSet;\n private if?: boolean | null = null;\n private createArguments?: any[];\n\n setValue(value: ComponentSet) {\n this.value = value;\n // console.log('sssssssssss');\n }\n\n async onInitRender(param: any, rawSet: RawSet) {\n await super.onInitRender(param, rawSet);\n const c = this.getParentThis();\n const userValue = this.getAttribute('value');\n if (userValue) {\n this.value = userValue;\n } else if (c instanceof ComponentRouterBase) {\n this.value = c.child;\n }\n // console.log('------',c);\n }\n\n onDestroyRender(data: OnDestroyRenderParams) {\n super.onDestroyRender(data);\n }\n\n onChangeAttrRender(name: string, value: any, other: OtherData) {\n super.onChangeAttrRender(name, value, other);\n if (this.equalsAttributeName(name, 'value')) {\n this.value = value;\n }\n if (this.equalsAttributeName(name, 'if')) {\n this.if = value;\n }\n if (this.equalsAttributeName(name, 'createArguments')) {\n this.createArguments = value;\n }\n }\n\n onCreatedThisChild(child: any, data: OnCreateRenderDataParams) {\n super.onCreatedThisChild(child, data);\n // console.log('outlet--oncreatedThisChild',child);\n }\n\n onCreatedThisChildDebounce(childrenSet: ChildrenSet[]) {\n super.onCreatedThisChildDebounce(childrenSet);\n let parentThis = this.getParentThis();\n // console.log('---', parentThis);\n if (isOnCreatedOutletDebounce(parentThis)) {\n parentThis.onCreatedOutletDebounce(this.value?.obj);\n }\n this.getAttribute('onCreatedDebounce')?.(this.value?.obj);\n }\n created(component: any) {\n component ??= this.value?.obj;\n this.getAttribute('onCreated')?.(component);\n }\n }\n}\n\nexport default {\n // TODO: \uC65C \uC774\uB188\uB9CC webpack\uC5D0\uC11C \uC21C\uD658\uCC38\uC870 \uC5D0\uB7EC\uB098\uB294\uC9C0\uBAA8\uB974\uACA0\uB2E4.. \uC65C \uC774\uB188\uB9CC.. \uADF8\uB798\uC11C \uC774\uB807\uAC8C \uD558\uAE34\uD568.\n routerOutlet: (config?: DomRenderRunConfig, executer?: { run: (...data: any[]) => any }) => {\n return RawSet.createComponentTargetElement({\n name: RouterOutlet.selector,\n template:\n '<div dr-this=\"@this@.value\" dr-detect-option-if=\"@this@?.value && @this@?.if\" dr-option-strip=\"true\" dr-on-create:arguments=\"@this@.createArguments\" dr-on-create:callback=\"@this@?.created?.($component)\">#innerHTML#</div>',\n objFactory: (e, o, r2, counstructorParam) => {\n return executer?.run({ rootObject: new RouterOutlet.RouterOutlet(...counstructorParam), config: config });\n }\n });\n }\n};\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,2BAA2C;AAE3C,oBAAuB;AAKvB,iCAA+D;AAGxD,IAAU;AAAA,CAAV,CAAU,kBAAV;AACE,EAAM,yBAAW;AAAA,EAUjB,MAAMA,sBAAqB,mCAAiD;AAAA,IAA5E;AAAA;AAEL,WAAQ,KAAsB;AAAA;AAAA,IAG9B,SAAS,OAAqB;AAC5B,WAAK,QAAQ;AAAA,IAEf;AAAA,IAEA,MAAM,aAAa,OAAY,QAAgB;AAC7C,YAAM,MAAM,aAAa,OAAO,MAAM;AACtC,YAAM,IAAI,KAAK,cAAc;AAC7B,YAAM,YAAY,KAAK,aAAa,OAAO;AAC3C,UAAI,WAAW;AACb,aAAK,QAAQ;AAAA,MACf,WAAW,aAAa,gDAAqB;AAC3C,aAAK,QAAQ,EAAE;AAAA,MACjB;AAAA,IAEF;AAAA,IAEA,gBAAgB,MAA6B;AAC3C,YAAM,gBAAgB,IAAI;AAAA,IAC5B;AAAA,IAEA,mBAAmB,MAAc,OAAY,OAAkB;AAC7D,YAAM,mBAAmB,MAAM,OAAO,KAAK;AAC3C,UAAI,KAAK,oBAAoB,MAAM,OAAO,GAAG;AAC3C,aAAK,QAAQ;AAAA,MACf;AACA,UAAI,KAAK,oBAAoB,MAAM,IAAI,GAAG;AACxC,aAAK,KAAK;AAAA,MACZ;AACA,UAAI,KAAK,oBAAoB,MAAM,iBAAiB,GAAG;AACrD,aAAK,kBAAkB;AAAA,MACzB;AAAA,IACF;AAAA,IAEA,mBAAmB,OAAY,MAAgC;AAC7D,YAAM,mBAAmB,OAAO,IAAI;AAAA,IAEtC;AAAA,IAEA,2BAA2B,aAA4B;AACrD,YAAM,2BAA2B,WAAW;AAC5C,UAAI,aAAa,KAAK,cAAc;AAEpC,cAAI,sDAA0B,UAAU,GAAG;AACzC,mBAAW,wBAAwB,KAAK,OAAO,GAAG;AAAA,MACpD;AACA,WAAK,aAAa,mBAAmB,IAAI,KAAK,OAAO,GAAG;AAAA,IAC1D;AAAA,IACA,QAAQ,WAAgB;AACtB,gCAAc,KAAK,OAAO;AAC1B,WAAK,aAAa,WAAW,IAAI,SAAS;AAAA,IAC5C;AAAA,EACF;AAzDO,gBAAM,eAAAA;AAAA,GAXE;AAuEjB,IAAO,uBAAQ;AAAA;AAAA,EAEb,cAAc,CAAC,QAA6B,aAAgD;AAC1F,WAAO,qBAAO,6BAA6B;AAAA,MACzC,MAAM,aAAa;AAAA,MACnB,UACE;AAAA,MACF,YAAY,CAAC,GAAG,GAAG,IAAI,sBAAsB;AAC3C,eAAO,UAAU,IAAI,EAAE,YAAY,IAAI,aAAa,aAAa,GAAG,iBAAiB,GAAG,OAAe,CAAC;AAAA,MAC1G;AAAA,IACF,CAAC;AAAA,EACH;AACF;",
|
|
6
6
|
"names": ["RouterOutlet"]
|
|
7
7
|
}
|
|
@@ -105,14 +105,17 @@ var Select;
|
|
|
105
105
|
this.disabled = false;
|
|
106
106
|
this.classAttr = null;
|
|
107
107
|
}
|
|
108
|
-
onInitRender(param, rawSet) {
|
|
109
|
-
super.onInitRender(param, rawSet);
|
|
108
|
+
async onInitRender(param, rawSet) {
|
|
109
|
+
await super.onInitRender(param, rawSet);
|
|
110
110
|
this.updateStatus();
|
|
111
111
|
}
|
|
112
112
|
// onCreatedThisChild(child: any, data: OnCreateRenderDataParams) {
|
|
113
113
|
// super.onCreatedThisChild(child, data);
|
|
114
114
|
// this.updateStatus();
|
|
115
115
|
// }
|
|
116
|
+
// async onRawSetRendered(rawSet:RawSet, otherData:OnRawSetRenderedOtherData):Promise<void>{
|
|
117
|
+
// await super.onRawSetRendered(rawSet, otherData);
|
|
118
|
+
// }
|
|
116
119
|
onCreatedThisChildDebounce(childrenSet) {
|
|
117
120
|
super.onCreatedThisChildDebounce(childrenSet);
|
|
118
121
|
this.updateStatus();
|
|
@@ -195,11 +198,14 @@ var Select;
|
|
|
195
198
|
Select_1.Option = Option;
|
|
196
199
|
class Summary extends import_ComponentBase.ComponentBase {
|
|
197
200
|
constructor() {
|
|
198
|
-
super(
|
|
201
|
+
super(...arguments);
|
|
199
202
|
this.classAttr = null;
|
|
200
203
|
this.options = [];
|
|
201
204
|
this.disabled = false;
|
|
202
205
|
}
|
|
206
|
+
// constructor() {
|
|
207
|
+
// super({ onlyParentType: Select });
|
|
208
|
+
// }
|
|
203
209
|
setDisabled(disabled) {
|
|
204
210
|
this.disabled = disabled;
|
|
205
211
|
this.getChildren(SummaryPlaceholder).forEach((it) => it.hidden = true);
|
|
@@ -224,8 +230,8 @@ var Select;
|
|
|
224
230
|
}
|
|
225
231
|
}
|
|
226
232
|
}
|
|
227
|
-
onInitRender(param, rawSet) {
|
|
228
|
-
super.onInitRender(param, rawSet);
|
|
233
|
+
async onInitRender(param, rawSet) {
|
|
234
|
+
await super.onInitRender(param, rawSet);
|
|
229
235
|
}
|
|
230
236
|
onInitSummaryElement(element, event) {
|
|
231
237
|
this.element = element;
|
|
@@ -237,9 +243,12 @@ var Select;
|
|
|
237
243
|
// onCreatedThisChild(child: any, data: OnCreateRenderDataParams) {
|
|
238
244
|
// super.onCreatedThisChild(child, data);
|
|
239
245
|
// }
|
|
246
|
+
// async onRawSetRendered(rawSet: RawSet, otherData: OnRawSetRenderedOtherData): Promise<void> {
|
|
247
|
+
// await super.onRawSetRendered(rawSet, otherData);
|
|
248
|
+
// }
|
|
240
249
|
onCreatedThisChildDebounce(childrenSet) {
|
|
241
250
|
super.onCreatedThisChildDebounce(childrenSet);
|
|
242
|
-
this.updateView(this.getParentThis()?.selectedValues
|
|
251
|
+
this.updateView(this.getParentThis()?.selectedValues?.length > 0);
|
|
243
252
|
}
|
|
244
253
|
onSummaryClick(element, event) {
|
|
245
254
|
if (this.getParentThis()?.disabled) {
|
|
@@ -260,7 +269,8 @@ var Select;
|
|
|
260
269
|
this.classAttr = null;
|
|
261
270
|
this.float = null;
|
|
262
271
|
}
|
|
263
|
-
|
|
272
|
+
async onRawSetRendered(rawSet, otherData) {
|
|
273
|
+
await super.onRawSetRendered(rawSet, otherData);
|
|
264
274
|
this.changeOptionState();
|
|
265
275
|
}
|
|
266
276
|
changeOptionState(option) {
|
|
@@ -268,13 +278,17 @@ var Select;
|
|
|
268
278
|
const select = this.getParentThis();
|
|
269
279
|
if (!select.multiple) {
|
|
270
280
|
if (option && option.selected) {
|
|
271
|
-
options.filter((it) => it !== option).forEach((it) =>
|
|
281
|
+
options.filter((it) => it !== option).forEach((it) => {
|
|
282
|
+
it.selected = false;
|
|
283
|
+
it.updateStatus();
|
|
284
|
+
});
|
|
272
285
|
} else {
|
|
273
286
|
const selectedOptions = options.filter((it) => it.selected && !it.disabled);
|
|
274
287
|
selectedOptions.forEach((opt, idx) => {
|
|
275
288
|
const isLast = idx === selectedOptions.length - 1;
|
|
276
289
|
if (!isLast) {
|
|
277
290
|
opt.selected = false;
|
|
291
|
+
opt.updateStatus();
|
|
278
292
|
}
|
|
279
293
|
});
|
|
280
294
|
}
|
|
@@ -308,8 +322,8 @@ var Select;
|
|
|
308
322
|
}
|
|
309
323
|
onCreateRenderData() {
|
|
310
324
|
}
|
|
311
|
-
onInitRender(param, rawSet) {
|
|
312
|
-
super.onInitRender(param, rawSet);
|
|
325
|
+
async onInitRender(param, rawSet) {
|
|
326
|
+
await super.onInitRender(param, rawSet);
|
|
313
327
|
if (import_ValidUtils.ValidUtils.isBrowser() && this.rawSet?.dataSet.config.window) {
|
|
314
328
|
const detailsElement = this.element;
|
|
315
329
|
const window = this.rawSet.dataSet.config.window;
|
|
@@ -417,7 +431,7 @@ var Select_default = {
|
|
|
417
431
|
select: (config) => {
|
|
418
432
|
return import_RawSet.RawSet.createComponentTargetElement({
|
|
419
433
|
name: Select.selector,
|
|
420
|
-
styles: ".dr-select-container {\n
|
|
434
|
+
styles: ".dr-select-container {\n position: relative;\n\n}\n.dr-select-options-container {\n display: none;\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n z-index: 10;\n}\n.dr-select-container.is-open .dr-select-options-container {\n display: block;\n}\nsummary::-webkit-details-marker {\n display: none;\n}\n/* Floating styles for dr-select-body */\n.dr-select-body-container {\n position: absolute;\n}\n\n.dr-select-body-bottom-left-container {\n position: absolute;\n left: 0;\n top: 100%;\n}\n\n.dr-select-body-bottom-right-container {\n position: absolute;\n right: 0;\n top: 100%;\n}\n\n.dr-select-body-top-left-container {\n position: absolute;\n left: 0;\n bottom: 100%;\n}\n\n.dr-select-body-top-right-container {\n position: absolute;\n right: 0;\n bottom: 100%;\n}\n\n/* Reset default details/summary styles */\n.dr-select-container details {\n display: block; /* Ensure it behaves like a block element */\n}\n\n.dr-select-container summary {\n display: block; /* Ensure it behaves like a block element */\n list-style: none; /* Remove default marker */\n cursor: pointer; /* Indicate it's clickable */\n}\n\n.dr-select-container summary::-webkit-details-marker,\n.dr-select-container summary::marker {\n display: none; /* Hide marker for Webkit and standard */\n}",
|
|
421
435
|
template: `<details dr-class="{
|
|
422
436
|
'dr-select-container': true,
|
|
423
437
|
'is-open': @this@.isOpen,
|
|
@@ -428,7 +442,7 @@ var Select_default = {
|
|
|
428
442
|
</details>
|
|
429
443
|
<select hidden="hidden" name="\${@this@.name}$" disabled="\${@this@.disabled ? 'disabled' : null}$" style="width: 1500px; height:500px" multiple>
|
|
430
444
|
<option dr-for-of="@this@.options" value="\${#it#.value}$" selected="\${#it#.selected ? 'selected' : null}$">#it# \${#it#.value}$</option>
|
|
431
|
-
</select
|
|
445
|
+
</select>`,
|
|
432
446
|
objFactory: (e, o, r2, constructorParam) => import_DomRender.DomRender.run({ rootObject: new Select.Select(config), config })
|
|
433
447
|
});
|
|
434
448
|
},
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/components/select/Select.ts"],
|
|
4
|
-
"sourcesContent": ["import { attribute, ChildrenSet, ComponentBase } from '../ComponentBase';\nimport { DomRender, DomRenderRunConfig } from '../../DomRender';\nimport { RawSet } from '../../rawsets/RawSet';\nimport { OnCreateRenderData, OnCreateRenderDataParams } from '../../lifecycle/OnCreateRenderData';\nimport { OnInitRender } from '../../lifecycle/OnInitRender';\nimport { OnDestroyRender } from '../../lifecycle/OnDestroyRender';\nimport { EventUtils } from '@dooboostore/core-web/event/EventUtils';\nimport { type Subscription } from '@dooboostore/core/message/Subscription';\nimport { ValidUtils } from '@dooboostore/core-web/valid/ValidUtils';\nimport { DomRenderNoProxy } from '../../decorators/DomRenderNoProxy';\nimport { OnCreateRender } from '../../lifecycle/OnCreateRender';\nimport { DomRenderConfig } from '../../configs/DomRenderConfig';\nimport { WindowUtils } from '@dooboostore/core-web/window/WindowUtils';\n\n/** 사용법\n <dr-select class=\"card-select-container\" changeSelected=\"${(data) => @this@.changeSelected(data)}$\"> <!-- multiple attribute optional-->\n <dr-select-summary class=\"card-select-summary-container\">\n <dr-select-summary-placeholder>\n <div class=\"card-select-summary-placeholder-container\">카드사별 사용처 안내 페이지 선택</div>\n </dr-select-summary-placeholder>\n <dr-select-summary-selected>\n <div dr-if=\"@this@.selectedCard\" class=\"card-select-summary-selected-container\">\n <img dr-attr=\"{src:@this@.selectedCard?.iconImg}\"> ${@this@.selectedCard?.name}$\n </div>\n </dr-select-summary-selected>\n </dr-select-summary>\n\n <dr-select-body float=\"bottom-left\" class=\"card-select-body-container\">\n <dr-select-option dr-for-of=\"@this@.cards\" value=\"${#it#.name}$\" selected=\"${#nearForOfIndex# === 0}$\" class=\"card-select-body-option-container\">\n <img dr-attr=\"{src:#it#.iconImg}\"> ${#it#.name}$\n </dr-select-option>\n </dr-select-body>\n </dr-select>\n */\n\nexport namespace Select {\n export const selector = 'dr-select';\n\n // Base for simple hide/show components\n class StateComponent extends ComponentBase {\n public hidden = true;\n public value: string | null = null;\n\n constructor(config: any) {\n super(config);\n }\n\n setValue(value: string | null) {\n this.value = value;\n }\n }\n\n // --- Option Child Components ---\n export class OptionSelected extends StateComponent {\n constructor() {\n super({onlyParentType: Option});\n }\n }\n\n export class OptionUnselected extends StateComponent {\n constructor() {\n super({onlyParentType: Option});\n }\n }\n\n export class OptionDisabled extends StateComponent {\n constructor() {\n super({onlyParentType: Option});\n }\n }\n\n // --- Summary Child Components ---\n export class SummaryPlaceholder extends StateComponent {\n constructor() {\n super({onlyParentType: Summary});\n }\n }\n\n export class SummarySelected extends StateComponent {\n private selectedOptions: Select.Option[] = [];\n\n constructor() {\n super({onlyParentType: Summary});\n }\n\n setOptions(options: Option[] = []) {\n this.selectedOptions = options.filter(it => it.selected);\n }\n }\n\n export class SummaryDisabled extends StateComponent {\n private selectedOptions: Select.Option[] = [];\n\n constructor() {\n super({onlyParentType: Summary});\n }\n\n setOptions(options: Option[] = []) {\n this.selectedOptions = options.filter(it => it.selected);\n }\n }\n\n // --- Select Body Component ---\n export type SelectBodyAttribute = {\n float?: 'bottom-left' | 'bottom-right' | 'top-left' | 'top-right';\n class?: string;\n }\n // --- Option Component ---\n export type OptionAttribute = { value: string; selected?: boolean | null; disabled?: boolean | null; class?: string; };\n\n export class Option extends ComponentBase<OptionAttribute> implements OnInitRender {\n public hidden = true;\n @attribute({name: 'value'}) public value: string | null = null;\n @attribute({name: 'selected', converter: v => v !== null && v === true}) public selected = false;\n @attribute({name: 'disabled', converter: v => v !== null && v === true}) public disabled = false;\n @attribute({name: 'class', converter: v => (v ? v : null)}) public classAttr: string | null = null;\n\n // public status: 'selected' | 'unselected' | 'disabled' = 'unselected';\n\n constructor() {\n super({onlyParentType: SelectBody});\n }\n\n onInitRender(param: any, rawSet: RawSet) {\n super.onInitRender(param, rawSet);\n // console.log('-----', this.value, this.selected)\n // this.getElement()?.addEventListener('click', (e) => {\n // e.stopPropagation();\n // if (!this.disabled) {\n // this.getParentThis<Select>().handleOptionClick(this);\n // }\n // });\n this.updateStatus();\n }\n\n // onCreatedThisChild(child: any, data: OnCreateRenderDataParams) {\n // super.onCreatedThisChild(child, data);\n // this.updateStatus();\n // }\n onCreatedThisChildDebounce(childrenSet: ChildrenSet[]) {\n super.onCreatedThisChildDebounce(childrenSet);\n this.updateStatus();\n }\n\n toggleSelected(event: Event) {\n // console.log('isMultiple', this.isMultiple())\n if (!this.disabled) {\n this.selected = this.isMultiple()? !this.selected : true;\n // this.selected = !this.selected;\n this.updateStatus();\n this.getParentThis<SelectBody>().changeOptionState(this);\n } else {\n event.stopPropagation();\n event.preventDefault();\n }\n }\n\n isMultiple() {\n return this.getParentThis<Select.SelectBody>()?.getParentThis<Select.Select>().multiple;\n }\n\n updateStatus() {\n if (this.disabled) {\n this.getChildren(OptionSelected).forEach(c => {\n c.hidden = true;\n c.setValue(this.value)\n });\n this.getChildren(OptionUnselected).forEach(c => {\n c.hidden = true;\n c.setValue(this.value)\n });\n this.getChildren(OptionDisabled).forEach(c => {\n c.hidden = false;\n c.setValue(this.value)\n });\n return;\n }\n\n if (this.selected) {\n this.getChildren(OptionSelected).forEach(c => {\n c.hidden = false;\n c.setValue(this.value)\n });\n this.getChildren(OptionUnselected).forEach(c => {\n c.hidden = true;\n c.setValue(this.value)\n });\n this.getChildren(OptionDisabled).forEach(c => {\n c.hidden = true;\n c.setValue(this.value)\n });\n }\n\n if (!this.selected) {\n this.getChildren(OptionSelected).forEach(c => {\n c.hidden = true;\n c.setValue(this.value)\n });\n this.getChildren(OptionUnselected).forEach(c => {\n c.hidden = false;\n c.setValue(this.value)\n });\n this.getChildren(OptionDisabled).forEach(c => {\n c.hidden = true;\n c.setValue(this.value)\n });\n }\n }\n }\n\n // --- Summary Component ---\n export class Summary extends ComponentBase implements OnInitRender {\n @attribute({name: 'class', converter: v => (v === '' ? null : v)}) public classAttr: string | null = null;\n private options: Select.Option[] = [];\n private disabled: boolean = false;\n public element?: HTMLElement;\n\n constructor() {\n super({onlyParentType: Select});\n }\n\n\n setDisabled(disabled: boolean) {\n this.disabled = disabled;\n this.getChildren(SummaryPlaceholder).forEach(it => it.hidden = true);\n this.getChildren(SummarySelected).forEach(it => it.hidden = true);\n this.getChildren(SummaryDisabled).forEach(it => it.hidden = false);\n\n }\n\n setOptions(options: Option[] = []): void {\n this.options = options;\n\n const selectedOptions = this.options.filter(it => it.selected && !it.disabled);\n if (!this.disabled) {\n if (selectedOptions.length > 0) {\n this.getChildren(SummaryPlaceholder).forEach(it => it.hidden = true);\n this.getChildren(SummarySelected).forEach(c => {\n c.setOptions(options);\n c.hidden = false;\n });\n this.getChildren(SummaryDisabled).forEach(it => it.hidden = true);\n } else {\n this.getChildren(SummaryDisabled).forEach(it => it.hidden = true);\n this.getChildren(SummaryPlaceholder).forEach(it => it.hidden = false);\n this.getChildren(SummarySelected).forEach(c => c.hidden = true);\n }\n }\n }\n\n onInitRender(param: any, rawSet: RawSet) {\n super.onInitRender(param, rawSet);\n // this.getElement()?.addEventListener('click', (e) => {\n // e.stopPropagation();\n // this.getParentThis<Select>().toggle();\n // });\n }\n\n onInitSummaryElement(element: HTMLElement, event: Event) {\n this.element = element;\n }\n\n updateView(hasSelection: boolean) {\n this.getChildren(SummaryPlaceholder).forEach(c => c.hidden = hasSelection);\n this.getChildren(SummarySelected).forEach(c => c.hidden = !hasSelection);\n }\n\n // onCreatedThisChild(child: any, data: OnCreateRenderDataParams) {\n // super.onCreatedThisChild(child, data);\n // }\n onCreatedThisChildDebounce(childrenSet: ChildrenSet[]) {\n super.onCreatedThisChildDebounce(childrenSet);\n this.updateView(this.getParentThis<Select>()?.selectedValues.length > 0);\n }\n\n\n onSummaryClick(element: HTMLElement, event: Event) {\n if (this.getParentThis<Select>()?.disabled) {\n event.stopPropagation();\n event.preventDefault();\n return;\n }\n }\n }\n\n\n export class SelectBody extends ComponentBase<SelectBodyAttribute> {\n @attribute({name: 'class', converter: v => (v === '' ? null : v)}) public classAttr: string | null = null;\n @attribute({name: 'float'}) public float: 'bottom-left' | 'bottom-right' | 'top-left' | 'top-right' | null = null;\n\n constructor() {\n super({onlyParentType: Select});\n }\n\n onCreatedThisChildDebounce(childrenSet: ChildrenSet[]) {\n this.changeOptionState();\n }\n\n changeOptionState(option?: Option) {\n const options = this.getChildren(Option);\n const select = this.getParentThis<Select>();\n // // 멀티플이 아닐때에는 마지막 선택된값으로 처리\n if (!select.multiple) {\n // 내가 선택한게 있으면\n if (option && option.selected) {\n options.filter(it => it !== option).forEach(it => it.selected = false);\n } else {\n const selectedOptions = options.filter(it => it.selected && !it.disabled)\n selectedOptions.forEach((opt, idx) => {\n const isLast = idx === selectedOptions.length - 1;\n if (!isLast) {\n opt.selected = false;\n }\n });\n }\n }\n // console.log('--------', options.map(it=>it.selected))\n select?.setOptions(options);\n }\n }\n\n\n // --- Main Select Component ---\n export type SelectAttribute = {\n multiple?: boolean | null; class?: string;\n changeSelected?: (value: (string | null)[]) => void;\n name?: string;\n float?: 'bottom-left' | 'bottom-right' | 'top-left' | 'top-right';\n disableOtherClickClose?: boolean;\n toggle?: (open: boolean) => void;\n disabled?: boolean | null;\n };\n\n export class Select extends ComponentBase<SelectAttribute> implements OnInitRender, OnCreateRender, OnCreateRenderData, OnDestroyRender {\n @attribute({name: 'multiple', converter: v => v !== null}) public multiple = false;\n @attribute({name: 'disabled', converter: v => v !== null}) public disabled = false;\n @attribute({name: 'class', converter: v => (v === '' ? null : v)}) public classAttr: string | null = null;\n @attribute({name: 'name', converter: v => (v === '' ? null : v)}) public name: string | null = null;\n\n // public isOpen = false;\n public selectedValues: (string | null)[] = [];\n public selectedOptions: Option[] = [];\n public value: string | (string | null)[] | null | undefined;\n\n @DomRenderNoProxy private element?: HTMLDetailsElement;\n @DomRenderNoProxy private documentClickSubscription?: Subscription;\n @DomRenderNoProxy private windowBlurSubscription?: Subscription;\n @DomRenderNoProxy public summaryComponent?: Summary;\n @DomRenderNoProxy public selectBodyComponent?: SelectBody;\n private options?: Select.Option[];\n\n constructor(config?: DomRenderConfig) {\n super();\n // console.log('----Select constructor')\n }\n\n get optionComponents(): Option[] {\n return this.getChildren(Option);\n }\n\n onCreateRender() {\n\n }\n\n onCreateRenderData() {\n\n }\n\n onInitRender(param: any, rawSet: RawSet) {\n super.onInitRender(param, rawSet);\n // console.log('select onInitRender', this.multiple)\n\n if (ValidUtils.isBrowser() && this.rawSet?.dataSet.config.window) {\n const detailsElement = this.element;\n\n const window = this.rawSet.dataSet!.config!.window!;\n const document = window.document;\n this.documentClickSubscription = EventUtils.htmlElementEventObservable(document, 'click').subscribe(event => {\n const isSummaryClick = this.getChildren(Summary).some(it => event.target && it.element?.contains(event.target as Node) || it.element === event.target)\n if (!isSummaryClick && this.getAttribute('disableOtherClickClose')) {\n return;\n }\n if (!isSummaryClick && !this.multiple && detailsElement) {\n detailsElement.open = false;\n return;\n }\n if (!isSummaryClick && detailsElement && !detailsElement?.contains(event?.target as Node)) {\n detailsElement.open = false;\n }\n })\n\n this.windowBlurSubscription = WindowUtils.eventObservable(window, 'blur').subscribe(() => {\n if (detailsElement?.open && window.document.activeElement?.tagName === 'IFRAME') {\n detailsElement.open = false;\n }\n });\n }\n }\n\n\n toggle(element: HTMLDetailsElement, event: Event) {\n // console.log('------>', this.disabled, event)\n // if (this.disabled) {\n // event.stopPropagation();\n // event.preventDefault();\n // return;\n // }\n const toggleAttribute = this.getAttribute('toggle');\n if (toggleAttribute) {\n toggleAttribute?.(element.open);\n }\n }\n\n setOptions(options: Option[]) {\n const summaries = this.getChildren(Summary);\n\n this.options = options;\n\n const values = this.options.filter(it => it.selected && !it.disabled).map(it => it.value)\n this.getAttribute('changeSelected')?.(values);\n summaries?.forEach(it => {\n it.setDisabled(this.disabled);\n if (!this.disabled) {\n it.setOptions(options);\n }\n })\n }\n\n onInitDetailsElement(detailsElement: HTMLDetailsElement) {\n // console.log('detailsElement oninit', detailsElement);\n this.element = detailsElement;\n }\n\n onDrThisUnBind() {\n super.onDrThisUnBind();\n this.onDestroyRender();\n }\n\n onDestroyRender() {\n super.onDestroyRender();\n this.documentClickSubscription?.unsubscribe();\n this.windowBlurSubscription?.unsubscribe();\n }\n\n test() {\n console.log('tttttttt')\n }\n }\n}\n\nconst stateComponentFactory = (name: string, type: any) => {\n return (config?: DomRenderRunConfig) =>\n RawSet.createComponentTargetElement({\n name,\n template: '<div dr-if=\"!@this@.hidden\" dr-option-strip=\"true\">#innerHTML#</div>\\n',\n objFactory: (e, o, r2, constructorParam) => DomRender.run({ rootObject: new type(), config })\n });\n};\n\nexport default {\n select: (config?: DomRenderConfig) => {\n return RawSet.createComponentTargetElement({\n name: Select.selector,\n styles:\n '.dr-select-container {\\n' +\n ' /*position: relative;*/\\n' +\n '\\n' +\n '}\\n' +\n '.dr-select-options-container {\\n' +\n ' display: none;\\n' +\n ' position: absolute;\\n' +\n ' top: 100%;\\n' +\n ' left: 0;\\n' +\n ' right: 0;\\n' +\n ' z-index: 10;\\n' +\n '}\\n' +\n '.dr-select-container.is-open .dr-select-options-container {\\n' +\n ' display: block;\\n' +\n '}\\n' +\n 'summary::-webkit-details-marker {\\n' +\n ' display: none;\\n' +\n '}\\n' +\n '/* Floating styles for dr-select-body */\\n' +\n '.dr-select-body-container {\\n' +\n ' position: absolute;\\n' +\n '}\\n' +\n '\\n' +\n '.dr-select-body-bottom-left-container {\\n' +\n ' position: absolute;\\n' +\n ' left: 0;\\n' +\n ' top: 100%;\\n' +\n '}\\n' +\n '\\n' +\n '.dr-select-body-bottom-right-container {\\n' +\n ' position: absolute;\\n' +\n ' right: 0;\\n' +\n ' top: 100%;\\n' +\n '}\\n' +\n '\\n' +\n '.dr-select-body-top-left-container {\\n' +\n ' position: absolute;\\n' +\n ' left: 0;\\n' +\n ' bottom: 100%;\\n' +\n '}\\n' +\n '\\n' +\n '.dr-select-body-top-right-container {\\n' +\n ' position: absolute;\\n' +\n ' right: 0;\\n' +\n ' bottom: 100%;\\n' +\n '}\\n' +\n '\\n' +\n '/* Reset default details/summary styles */\\n' +\n '.dr-select-container details {\\n' +\n ' display: block; /* Ensure it behaves like a block element */\\n' +\n '}\\n' +\n '\\n' +\n '.dr-select-container summary {\\n' +\n ' display: block; /* Ensure it behaves like a block element */\\n' +\n ' list-style: none; /* Remove default marker */\\n' +\n \" cursor: pointer; /* Indicate it's clickable */\\n\" +\n '}\\n' +\n '\\n' +\n '.dr-select-container summary::-webkit-details-marker,\\n' +\n '.dr-select-container summary::marker {\\n' +\n ' display: none; /* Hide marker for Webkit and standard */\\n' +\n '}',\n template:\n '<details dr-class=\"{\\n' +\n \" 'dr-select-container': true,\\n\" +\n \" 'is-open': @this@.isOpen,\\n\" +\n ' [@this@.classAttr]: @this@.classAttr\\n' +\n ' }\" dr-on-init=\"@this@.onInitDetailsElement($element)\" dr-option-complete=\"@this@.test()\" dr-event-toggle=\"@this@.toggle($element, $event)\">\\n' +\n '\\n' +\n ' #innerHTML#\\n' +\n '</details>\\n' +\n '<select hidden=\"hidden\" name=\"${@this@.name}$\" disabled=\"${@this@.disabled ? \\'disabled\\' : null}$\" style=\"width: 1500px; height:500px\" multiple>\\n' +\n ' <option dr-for-of=\"@this@.options\" value=\"${#it#.value}$\" selected=\"${#it#.selected ? \\'selected\\' : null}$\">#it# ${#it#.value}$</option>\\n' +\n '</select',\n objFactory: (e, o, r2, constructorParam) => DomRender.run({ rootObject: new Select.Select(config), config })\n });\n },\n selectSummary: (config?: DomRenderRunConfig) => {\n return RawSet.createComponentTargetElement({\n name: `${Select.selector}-summary`,\n template:\n '<summary dr-class=\"{[@this@.classAttr]: @this@.classAttr}\"\\n' +\n ' dr-on-init=\"@this@.onInitSummaryElement($element, $event)\"\\n' +\n ' dr-event-click=\"@this@.onSummaryClick($element, $event)\"\\n' +\n '>\\n' +\n '#innerHTML#\\n' +\n '</summary>',\n objFactory: (e, o, r2, constructorParam) => DomRender.run({ rootObject: new Select.Summary(), config })\n });\n },\n selectSummaryPlaceholder: stateComponentFactory(`${Select.selector}-summary-placeholder`, Select.SummaryPlaceholder),\n selectSummarySelected: stateComponentFactory(`${Select.selector}-summary-selected`, Select.SummarySelected),\n selectSummaryDisabled: stateComponentFactory(`${Select.selector}-summary-disabled`, Select.SummaryDisabled),\n\n selectBody: (config?: DomRenderRunConfig) => { // New export\n return RawSet.createComponentTargetElement({\n name: `${Select.selector}-body`,\n template: '<div dr-class=\"{[@this@.classAttr]: @this@.classAttr, \\'dr-select-body-container\\': true, [\\'dr-select-body-\\'+@this@.float+\\'-container\\']: @this@.float}\">#innerHTML#</div>',\n objFactory: (e, o, r2, constructorParam) => {\n return DomRender.run({rootObject: new Select.SelectBody(), config: config});\n }\n })\n },\n\n selectOption: (config?: DomRenderRunConfig) => {\n return RawSet.createComponentTargetElement({\n name: `${Select.selector}-option`,\n template:\n '<a dr-class=\"{[@this@.classAttr]: @this@.classAttr}\" dr-event-click=\"@this@.toggleSelected($event)\">#innerHTML#</a>\\n',\n objFactory: (e, o, r2, constructorParam) => DomRender.run({ rootObject: new Select.Option(), config })\n });\n },\n selectOptionSelected: stateComponentFactory(`${Select.selector}-option-selected`, Select.OptionSelected),\n selectOptionUnselected: stateComponentFactory(`${Select.selector}-option-unselected`, Select.OptionUnselected),\n selectOptionDisabled: stateComponentFactory(`${Select.selector}-option-disabled`, Select.OptionDisabled),\n};"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA,2BAAsD;AACtD,uBAA8C;AAC9C,oBAAuB;AAIvB,wBAA2B;AAE3B,wBAA2B;AAC3B,8BAAiC;AAGjC,yBAA4B;;;;;;;;;;
|
|
4
|
+
"sourcesContent": ["import { attribute, ChildrenSet, ComponentBase } from '../ComponentBase';\nimport { DomRender, DomRenderRunConfig } from '../../DomRender';\nimport { RawSet } from '../../rawsets/RawSet';\nimport { OnCreateRenderData } from '../../lifecycle/OnCreateRenderData';\nimport { OnInitRender } from '../../lifecycle/OnInitRender';\nimport { OnDestroyRender } from '../../lifecycle/OnDestroyRender';\nimport { EventUtils } from '@dooboostore/core-web/event/EventUtils';\nimport { type Subscription } from '@dooboostore/core/message/Subscription';\nimport { ValidUtils } from '@dooboostore/core-web/valid/ValidUtils';\nimport { DomRenderNoProxy } from '../../decorators/DomRenderNoProxy';\nimport { OnCreateRender } from '../../lifecycle/OnCreateRender';\nimport { DomRenderConfig } from '../../configs/DomRenderConfig';\nimport { WindowUtils } from '@dooboostore/core-web/window/WindowUtils';\nimport { OnRawSetRenderedOtherData } from 'src/lifecycle';\n\n/** 사용법\n <dr-select class=\"card-select-container\" changeSelected=\"${(data) => @this@.changeSelected(data)}$\"> <!-- multiple attribute optional-->\n <dr-select-summary class=\"card-select-summary-container\">\n <dr-select-summary-placeholder>\n <div class=\"card-select-summary-placeholder-container\">카드사별 사용처 안내 페이지 선택</div>\n </dr-select-summary-placeholder>\n <dr-select-summary-selected>\n <div dr-if=\"@this@.selectedCard\" class=\"card-select-summary-selected-container\">\n <img dr-attr=\"{src:@this@.selectedCard?.iconImg}\"> ${@this@.selectedCard?.name}$\n </div>\n </dr-select-summary-selected>\n </dr-select-summary>\n\n <dr-select-body float=\"bottom-left\" class=\"card-select-body-container\">\n <dr-select-option dr-for-of=\"@this@.cards\" value=\"${#it#.name}$\" selected=\"${#nearForOfIndex# === 0}$\" class=\"card-select-body-option-container\">\n <img dr-attr=\"{src:#it#.iconImg}\"> ${#it#.name}$\n </dr-select-option>\n </dr-select-body>\n </dr-select>\n */\n\nexport namespace Select {\n export const selector = 'dr-select';\n\n // Base for simple hide/show components\n class StateComponent extends ComponentBase {\n public hidden = true;\n public value: string | null = null;\n\n constructor(config: any) {\n super(config);\n }\n\n setValue(value: string | null) {\n this.value = value;\n }\n }\n\n // --- Option Child Components ---\n export class OptionSelected extends StateComponent {\n constructor() {\n super({onlyParentType: Option});\n }\n }\n\n export class OptionUnselected extends StateComponent {\n constructor() {\n super({onlyParentType: Option});\n }\n }\n\n export class OptionDisabled extends StateComponent {\n constructor() {\n super({onlyParentType: Option});\n }\n }\n\n // --- Summary Child Components ---\n export class SummaryPlaceholder extends StateComponent {\n constructor() {\n super({onlyParentType: Summary});\n }\n }\n\n export class SummarySelected extends StateComponent {\n private selectedOptions: Select.Option[] = [];\n\n constructor() {\n super({onlyParentType: Summary});\n }\n\n setOptions(options: Option[] = []) {\n this.selectedOptions = options.filter(it => it.selected);\n }\n }\n\n export class SummaryDisabled extends StateComponent {\n private selectedOptions: Select.Option[] = [];\n\n constructor() {\n super({onlyParentType: Summary});\n }\n\n setOptions(options: Option[] = []) {\n this.selectedOptions = options.filter(it => it.selected);\n }\n }\n\n // --- Select Body Component ---\n export type SelectBodyAttribute = {\n float?: 'bottom-left' | 'bottom-right' | 'top-left' | 'top-right';\n class?: string;\n }\n // --- Option Component ---\n export type OptionAttribute = { value: string; selected?: boolean | null; disabled?: boolean | null; class?: string; };\n\n export class Option extends ComponentBase<OptionAttribute> implements OnInitRender {\n public hidden = true;\n @attribute({name: 'value'}) public value: string | null = null;\n @attribute({name: 'selected', converter: v => v !== null && v === true}) public selected = false;\n @attribute({name: 'disabled', converter: v => v !== null && v === true}) public disabled = false;\n @attribute({name: 'class', converter: v => (v ? v : null)}) public classAttr: string | null = null;\n\n // public status: 'selected' | 'unselected' | 'disabled' = 'unselected';\n\n constructor() {\n super({onlyParentType: SelectBody});\n }\n\n async onInitRender(param: any, rawSet: RawSet) {\n await super.onInitRender(param, rawSet);\n // console.log('-----', this.value, this.selected)\n // this.getElement()?.addEventListener('click', (e) => {\n // e.stopPropagation();\n // if (!this.disabled) {\n // this.getParentThis<Select>().handleOptionClick(this);\n // }\n // });\n this.updateStatus();\n }\n\n // onCreatedThisChild(child: any, data: OnCreateRenderDataParams) {\n // super.onCreatedThisChild(child, data);\n // this.updateStatus();\n // }\n\n // async onRawSetRendered(rawSet:RawSet, otherData:OnRawSetRenderedOtherData):Promise<void>{\n // await super.onRawSetRendered(rawSet, otherData);\n // }\n onCreatedThisChildDebounce(childrenSet: ChildrenSet[]) {\n super.onCreatedThisChildDebounce(childrenSet);\n this.updateStatus();\n }\n\n toggleSelected(event: Event) {\n // console.log('isMultiple', this.isMultiple())\n if (!this.disabled) {\n this.selected = this.isMultiple()? !this.selected : true;\n // this.selected = !this.selected;\n this.updateStatus();\n this.getParentThis<SelectBody>().changeOptionState(this);\n } else {\n event.stopPropagation();\n event.preventDefault();\n }\n }\n\n isMultiple() {\n return this.getParentThis<Select.SelectBody>()?.getParentThis<Select.Select>().multiple;\n }\n\n updateStatus() {\n if (this.disabled) {\n this.getChildren(OptionSelected).forEach(c => {\n c.hidden = true;\n c.setValue(this.value)\n });\n this.getChildren(OptionUnselected).forEach(c => {\n c.hidden = true;\n c.setValue(this.value)\n });\n this.getChildren(OptionDisabled).forEach(c => {\n c.hidden = false;\n c.setValue(this.value)\n });\n return;\n }\n\n if (this.selected) {\n this.getChildren(OptionSelected).forEach(c => {\n c.hidden = false;\n c.setValue(this.value)\n });\n this.getChildren(OptionUnselected).forEach(c => {\n c.hidden = true;\n c.setValue(this.value)\n });\n this.getChildren(OptionDisabled).forEach(c => {\n c.hidden = true;\n c.setValue(this.value)\n });\n }\n\n if (!this.selected) {\n this.getChildren(OptionSelected).forEach(c => {\n c.hidden = true;\n c.setValue(this.value)\n });\n this.getChildren(OptionUnselected).forEach(c => {\n c.hidden = false;\n c.setValue(this.value)\n });\n this.getChildren(OptionDisabled).forEach(c => {\n c.hidden = true;\n c.setValue(this.value)\n });\n }\n }\n }\n\n // --- Summary Component ---\n export class Summary extends ComponentBase implements OnInitRender {\n @attribute({ name: 'class', converter: v => (v === '' ? null : v) }) public classAttr: string | null = null;\n private options: Select.Option[] = [];\n private disabled: boolean = false;\n public element?: HTMLElement;\n\n // constructor() {\n // super({ onlyParentType: Select });\n // }\n\n setDisabled(disabled: boolean) {\n this.disabled = disabled;\n this.getChildren(SummaryPlaceholder).forEach(it => (it.hidden = true));\n this.getChildren(SummarySelected).forEach(it => (it.hidden = true));\n this.getChildren(SummaryDisabled).forEach(it => (it.hidden = false));\n }\n\n setOptions(options: Option[] = []): void {\n this.options = options;\n\n const selectedOptions = this.options.filter(it => it.selected && !it.disabled);\n if (!this.disabled) {\n if (selectedOptions.length > 0) {\n this.getChildren(SummaryPlaceholder).forEach(it => (it.hidden = true));\n this.getChildren(SummarySelected).forEach(c => {\n c.setOptions(options);\n c.hidden = false;\n });\n this.getChildren(SummaryDisabled).forEach(it => (it.hidden = true));\n } else {\n this.getChildren(SummaryDisabled).forEach(it => (it.hidden = true));\n this.getChildren(SummaryPlaceholder).forEach(it => (it.hidden = false));\n this.getChildren(SummarySelected).forEach(c => (c.hidden = true));\n }\n }\n }\n\n async onInitRender(param: any, rawSet: RawSet) {\n await super.onInitRender(param, rawSet);\n // this.getElement()?.addEventListener('click', (e) => {\n // e.stopPropagation();\n // this.getParentThis<Select>().toggle();\n // });\n }\n\n onInitSummaryElement(element: HTMLElement, event: Event) {\n this.element = element;\n }\n\n updateView(hasSelection: boolean) {\n this.getChildren(SummaryPlaceholder).forEach(c => (c.hidden = hasSelection));\n this.getChildren(SummarySelected).forEach(c => (c.hidden = !hasSelection));\n }\n\n // onCreatedThisChild(child: any, data: OnCreateRenderDataParams) {\n // super.onCreatedThisChild(child, data);\n // }\n // async onRawSetRendered(rawSet: RawSet, otherData: OnRawSetRenderedOtherData): Promise<void> {\n // await super.onRawSetRendered(rawSet, otherData);\n // }\n onCreatedThisChildDebounce(childrenSet: ChildrenSet[]) {\n super.onCreatedThisChildDebounce(childrenSet);\n this.updateView(this.getParentThis<Select>()?.selectedValues?.length > 0);\n }\n\n onSummaryClick(element: HTMLElement, event: Event) {\n if (this.getParentThis<Select>()?.disabled) {\n event.stopPropagation();\n event.preventDefault();\n return;\n }\n }\n }\n\n\n export class SelectBody extends ComponentBase<SelectBodyAttribute> {\n @attribute({ name: 'class', converter: v => (v === '' ? null : v) }) public classAttr: string | null = null;\n @attribute({ name: 'float' }) public float: 'bottom-left' | 'bottom-right' | 'top-left' | 'top-right' | null = null;\n\n constructor() {\n super({ onlyParentType: Select });\n }\n\n async onRawSetRendered(rawSet: RawSet, otherData: OnRawSetRenderedOtherData): Promise<void> {\n await super.onRawSetRendered(rawSet, otherData);\n // }\n // onCreatedThisChildDebounce(childrenSet: ChildrenSet[]) {\n // super.onCreatedThisChildDebounce(childrenSet);\n this.changeOptionState();\n }\n\n changeOptionState(option?: Option) {\n const options = this.getChildren(Option);\n const select = this.getParentThis<Select>();\n // console.log('------opti',option, select);\n // // 멀티플이 아닐때에는 마지막 선택된값으로 처리\n if (!select.multiple) {\n // 내가 선택한게 있으면\n if (option && option.selected) {\n options.filter(it => it !== option).forEach(it => {\n it.selected = false;\n it.updateStatus();\n });\n } else {\n const selectedOptions = options.filter(it => it.selected && !it.disabled);\n selectedOptions.forEach((opt, idx) => {\n const isLast = idx === selectedOptions.length - 1;\n if (!isLast) {\n opt.selected = false;\n opt.updateStatus();\n }\n });\n }\n }\n // console.log('--------', options.map(it=>it.selected))\n select?.setOptions(options);\n }\n }\n\n\n // --- Main Select Component ---\n export type SelectAttribute = {\n multiple?: boolean | null; class?: string;\n changeSelected?: (value: (string | null)[]) => void;\n name?: string;\n float?: 'bottom-left' | 'bottom-right' | 'top-left' | 'top-right';\n disableOtherClickClose?: boolean;\n toggle?: (open: boolean) => void;\n disabled?: boolean | null;\n };\n\n export class Select extends ComponentBase<SelectAttribute> implements OnInitRender, OnCreateRender, OnCreateRenderData, OnDestroyRender {\n @attribute({name: 'multiple', converter: v => v !== null}) public multiple = false;\n @attribute({name: 'disabled', converter: v => v !== null}) public disabled = false;\n @attribute({name: 'class', converter: v => (v === '' ? null : v)}) public classAttr: string | null = null;\n @attribute({name: 'name', converter: v => (v === '' ? null : v)}) public name: string | null = null;\n\n // public isOpen = false;\n public selectedValues: (string | null)[] = [];\n public selectedOptions: Option[] = [];\n public value: string | (string | null)[] | null | undefined;\n\n @DomRenderNoProxy private element?: HTMLDetailsElement;\n @DomRenderNoProxy private documentClickSubscription?: Subscription;\n @DomRenderNoProxy private windowBlurSubscription?: Subscription;\n @DomRenderNoProxy public summaryComponent?: Summary;\n @DomRenderNoProxy public selectBodyComponent?: SelectBody;\n private options?: Select.Option[];\n\n constructor(config?: DomRenderConfig) {\n super();\n // console.log('----Select constructor')\n }\n\n get optionComponents(): Option[] {\n return this.getChildren(Option);\n }\n\n onCreateRender() {\n\n }\n\n onCreateRenderData() {\n\n }\n\n async onInitRender(param: any, rawSet: RawSet) {\n await super.onInitRender(param, rawSet);\n // console.log('select onInitRender', this.multiple)\n\n if (ValidUtils.isBrowser() && this.rawSet?.dataSet.config.window) {\n const detailsElement = this.element;\n\n const window = this.rawSet.dataSet!.config!.window!;\n const document = window.document;\n this.documentClickSubscription = EventUtils.htmlElementEventObservable(document, 'click').subscribe(event => {\n const isSummaryClick = this.getChildren(Summary).some(it => event.target && it.element?.contains(event.target as Node) || it.element === event.target)\n if (!isSummaryClick && this.getAttribute('disableOtherClickClose')) {\n return;\n }\n if (!isSummaryClick && !this.multiple && detailsElement) {\n detailsElement.open = false;\n return;\n }\n if (!isSummaryClick && detailsElement && !detailsElement?.contains(event?.target as Node)) {\n detailsElement.open = false;\n }\n })\n\n this.windowBlurSubscription = WindowUtils.eventObservable(window, 'blur').subscribe(() => {\n if (detailsElement?.open && window.document.activeElement?.tagName === 'IFRAME') {\n detailsElement.open = false;\n }\n });\n }\n }\n\n\n toggle(element: HTMLDetailsElement, event: Event) {\n // console.log('------>', this.disabled, event)\n // if (this.disabled) {\n // event.stopPropagation();\n // event.preventDefault();\n // return;\n // }\n const toggleAttribute = this.getAttribute('toggle');\n if (toggleAttribute) {\n toggleAttribute?.(element.open);\n }\n }\n\n setOptions(options: Option[]) {\n const summaries = this.getChildren(Summary);\n\n this.options = options;\n\n const values = this.options.filter(it => it.selected && !it.disabled).map(it => it.value)\n this.getAttribute('changeSelected')?.(values);\n summaries?.forEach(it => {\n it.setDisabled(this.disabled);\n if (!this.disabled) {\n it.setOptions(options);\n }\n })\n }\n\n onInitDetailsElement(detailsElement: HTMLDetailsElement) {\n // console.log('detailsElement oninit', detailsElement);\n this.element = detailsElement;\n }\n\n onDrThisUnBind() {\n super.onDrThisUnBind();\n this.onDestroyRender();\n }\n\n onDestroyRender() {\n super.onDestroyRender();\n this.documentClickSubscription?.unsubscribe();\n this.windowBlurSubscription?.unsubscribe();\n }\n\n test() {\n console.log('tttttttt')\n }\n }\n}\n\nconst stateComponentFactory = (name: string, type: any) => {\n return (config?: DomRenderRunConfig) =>\n RawSet.createComponentTargetElement({\n name,\n template: '<div dr-if=\"!@this@.hidden\" dr-option-strip=\"true\">#innerHTML#</div>\\n',\n objFactory: (e, o, r2, constructorParam) => DomRender.run({ rootObject: new type(), config })\n });\n};\n\nexport default {\n select: (config?: DomRenderConfig) => {\n return RawSet.createComponentTargetElement({\n name: Select.selector,\n styles:\n '.dr-select-container {\\n' +\n ' position: relative;\\n' +\n '\\n' +\n '}\\n' +\n '.dr-select-options-container {\\n' +\n ' display: none;\\n' +\n ' position: absolute;\\n' +\n ' top: 100%;\\n' +\n ' left: 0;\\n' +\n ' right: 0;\\n' +\n ' z-index: 10;\\n' +\n '}\\n' +\n '.dr-select-container.is-open .dr-select-options-container {\\n' +\n ' display: block;\\n' +\n '}\\n' +\n 'summary::-webkit-details-marker {\\n' +\n ' display: none;\\n' +\n '}\\n' +\n '/* Floating styles for dr-select-body */\\n' +\n '.dr-select-body-container {\\n' +\n ' position: absolute;\\n' +\n '}\\n' +\n '\\n' +\n '.dr-select-body-bottom-left-container {\\n' +\n ' position: absolute;\\n' +\n ' left: 0;\\n' +\n ' top: 100%;\\n' +\n '}\\n' +\n '\\n' +\n '.dr-select-body-bottom-right-container {\\n' +\n ' position: absolute;\\n' +\n ' right: 0;\\n' +\n ' top: 100%;\\n' +\n '}\\n' +\n '\\n' +\n '.dr-select-body-top-left-container {\\n' +\n ' position: absolute;\\n' +\n ' left: 0;\\n' +\n ' bottom: 100%;\\n' +\n '}\\n' +\n '\\n' +\n '.dr-select-body-top-right-container {\\n' +\n ' position: absolute;\\n' +\n ' right: 0;\\n' +\n ' bottom: 100%;\\n' +\n '}\\n' +\n '\\n' +\n '/* Reset default details/summary styles */\\n' +\n '.dr-select-container details {\\n' +\n ' display: block; /* Ensure it behaves like a block element */\\n' +\n '}\\n' +\n '\\n' +\n '.dr-select-container summary {\\n' +\n ' display: block; /* Ensure it behaves like a block element */\\n' +\n ' list-style: none; /* Remove default marker */\\n' +\n \" cursor: pointer; /* Indicate it's clickable */\\n\" +\n '}\\n' +\n '\\n' +\n '.dr-select-container summary::-webkit-details-marker,\\n' +\n '.dr-select-container summary::marker {\\n' +\n ' display: none; /* Hide marker for Webkit and standard */\\n' +\n '}',\n template:\n '<details dr-class=\"{\\n' +\n \" 'dr-select-container': true,\\n\" +\n \" 'is-open': @this@.isOpen,\\n\" +\n ' [@this@.classAttr]: @this@.classAttr\\n' +\n ' }\" dr-on-init=\"@this@.onInitDetailsElement($element)\" dr-option-complete=\"@this@.test()\" dr-event-toggle=\"@this@.toggle($element, $event)\">\\n' +\n '\\n' +\n ' #innerHTML#\\n' +\n '</details>\\n' +\n '<select hidden=\"hidden\" name=\"${@this@.name}$\" disabled=\"${@this@.disabled ? \\'disabled\\' : null}$\" style=\"width: 1500px; height:500px\" multiple>\\n' +\n ' <option dr-for-of=\"@this@.options\" value=\"${#it#.value}$\" selected=\"${#it#.selected ? \\'selected\\' : null}$\">#it# ${#it#.value}$</option>\\n' +\n '</select>',\n objFactory: (e, o, r2, constructorParam) => DomRender.run({ rootObject: new Select.Select(config), config })\n });\n },\n selectSummary: (config?: DomRenderRunConfig) => {\n return RawSet.createComponentTargetElement({\n name: `${Select.selector}-summary`,\n template:\n '<summary dr-class=\"{[@this@.classAttr]: @this@.classAttr}\"\\n' +\n ' dr-on-init=\"@this@.onInitSummaryElement($element, $event)\"\\n' +\n ' dr-event-click=\"@this@.onSummaryClick($element, $event)\"\\n' +\n '>\\n' +\n '#innerHTML#\\n' +\n '</summary>',\n objFactory: (e, o, r2, constructorParam) => DomRender.run({ rootObject: new Select.Summary(), config })\n });\n },\n selectSummaryPlaceholder: stateComponentFactory(`${Select.selector}-summary-placeholder`, Select.SummaryPlaceholder),\n selectSummarySelected: stateComponentFactory(`${Select.selector}-summary-selected`, Select.SummarySelected),\n selectSummaryDisabled: stateComponentFactory(`${Select.selector}-summary-disabled`, Select.SummaryDisabled),\n\n selectBody: (config?: DomRenderRunConfig) => { // New export\n return RawSet.createComponentTargetElement({\n name: `${Select.selector}-body`,\n template: '<div dr-class=\"{[@this@.classAttr]: @this@.classAttr, \\'dr-select-body-container\\': true, [\\'dr-select-body-\\'+@this@.float+\\'-container\\']: @this@.float}\">#innerHTML#</div>',\n objFactory: (e, o, r2, constructorParam) => {\n return DomRender.run({rootObject: new Select.SelectBody(), config: config});\n }\n })\n },\n\n selectOption: (config?: DomRenderRunConfig) => {\n return RawSet.createComponentTargetElement({\n name: `${Select.selector}-option`,\n template:\n '<a dr-class=\"{[@this@.classAttr]: @this@.classAttr}\" dr-event-click=\"@this@.toggleSelected($event)\">#innerHTML#</a>\\n',\n objFactory: (e, o, r2, constructorParam) => DomRender.run({ rootObject: new Select.Option(), config })\n });\n },\n selectOptionSelected: stateComponentFactory(`${Select.selector}-option-selected`, Select.OptionSelected),\n selectOptionUnselected: stateComponentFactory(`${Select.selector}-option-unselected`, Select.OptionUnselected),\n selectOptionDisabled: stateComponentFactory(`${Select.selector}-option-disabled`, Select.OptionDisabled),\n};"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["Select"]
|
|
7
7
|
}
|
|
@@ -32,8 +32,8 @@ var This;
|
|
|
32
32
|
super(...arguments);
|
|
33
33
|
this.if = null;
|
|
34
34
|
}
|
|
35
|
-
onInitRender(param, rawSet) {
|
|
36
|
-
super.onInitRender(param, rawSet);
|
|
35
|
+
async onInitRender(param, rawSet) {
|
|
36
|
+
await super.onInitRender(param, rawSet);
|
|
37
37
|
}
|
|
38
38
|
onDestroyRender(data) {
|
|
39
39
|
super.onDestroyRender(data);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/components/this/This.ts"],
|
|
4
|
-
"sourcesContent": ["import { ComponentBase } from '../ComponentBase';\nimport { DomRender, DomRenderRunConfig } from '../../DomRender';\nimport { RawSet } from '../../rawsets/RawSet';\nimport { OtherData } from '../../lifecycle/OnChangeAttrRender';\nimport { OnInitRender } from '../../lifecycle/OnInitRender';\nimport { ComponentSet } from '../../components/ComponentSet';\nimport { OnDestroyRenderParams } from '../../lifecycle/OnDestroyRender';\nexport namespace This {\n export const selector = 'dr-this';\n export type Attribute = {\n value: ComponentSet;\n if: boolean | null;\n createArguments: any[];\n onCreated?: (value: any) => void;\n onDestroyRender?: () => void;\n }
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,2BAA8B;AAC9B,uBAA8C;AAC9C,oBAAuB;
|
|
4
|
+
"sourcesContent": ["import { ComponentBase } from '../ComponentBase';\nimport { DomRender, DomRenderRunConfig } from '../../DomRender';\nimport { RawSet } from '../../rawsets/RawSet';\nimport { OtherData } from '../../lifecycle/OnChangeAttrRender';\nimport { OnInitRender } from '../../lifecycle/OnInitRender';\nimport { ComponentSet } from '../../components/ComponentSet';\nimport { OnDestroyRenderParams } from '../../lifecycle/OnDestroyRender';\n\nexport namespace This {\n export const selector = 'dr-this';\n export type Attribute = {\n value: ComponentSet;\n if: boolean | null;\n createArguments: any[];\n onCreated?: (value: any) => void;\n onDestroyRender?: () => void;\n };\n\n export class This extends ComponentBase<Attribute> implements OnInitRender {\n private value?: ComponentSet;\n private if?: boolean | null = null;\n private createArguments?: any[];\n\n async onInitRender(param: any, rawSet: RawSet) {\n await super.onInitRender(param, rawSet);\n }\n\n onDestroyRender(data: OnDestroyRenderParams) {\n super.onDestroyRender(data);\n }\n\n onChangeAttrRender(name: string, value: any, other: OtherData) {\n super.onChangeAttrRender(name, value, other);\n if (this.equalsAttributeName(name, 'value')) {\n this.value = value;\n }\n if (this.equalsAttributeName(name, 'if')) {\n this.if = value;\n }\n if (this.equalsAttributeName(name, 'createArguments')) {\n this.createArguments = value;\n }\n }\n\n created(component: any) {\n component ??= this.value?.obj;\n this.getAttribute('onCreated')?.(component);\n }\n }\n}\n\nexport default {\n this: (config?: DomRenderRunConfig) => {\n return RawSet.createComponentTargetElement({\n name: This.selector,\n template:\n '<div dr-this=\"@this@.value\" dr-detect-option-if=\"@this@?.value && @this@?.if\" dr-option-strip=\"true\" dr-on-create:arguments=\"@this@.createArguments\" dr-on-create:callback=\"@this@?.created?.($component)\">#innerHTML#</div>',\n objFactory: (e, o, r2, counstructorParam) => {\n return DomRender.run({ rootObject: new This.This(...counstructorParam), config: config });\n }\n });\n }\n};\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,2BAA8B;AAC9B,uBAA8C;AAC9C,oBAAuB;AAMhB,IAAU;AAAA,CAAV,CAAU,UAAV;AACE,EAAM,iBAAW;AAAA,EASjB,MAAMA,cAAa,mCAAiD;AAAA,IAApE;AAAA;AAEL,WAAQ,KAAsB;AAAA;AAAA,IAG9B,MAAM,aAAa,OAAY,QAAgB;AAC7C,YAAM,MAAM,aAAa,OAAO,MAAM;AAAA,IACxC;AAAA,IAEA,gBAAgB,MAA6B;AAC3C,YAAM,gBAAgB,IAAI;AAAA,IAC5B;AAAA,IAEA,mBAAmB,MAAc,OAAY,OAAkB;AAC7D,YAAM,mBAAmB,MAAM,OAAO,KAAK;AAC3C,UAAI,KAAK,oBAAoB,MAAM,OAAO,GAAG;AAC3C,aAAK,QAAQ;AAAA,MACf;AACA,UAAI,KAAK,oBAAoB,MAAM,IAAI,GAAG;AACxC,aAAK,KAAK;AAAA,MACZ;AACA,UAAI,KAAK,oBAAoB,MAAM,iBAAiB,GAAG;AACrD,aAAK,kBAAkB;AAAA,MACzB;AAAA,IACF;AAAA,IAEA,QAAQ,WAAgB;AACtB,gCAAc,KAAK,OAAO;AAC1B,WAAK,aAAa,WAAW,IAAI,SAAS;AAAA,IAC5C;AAAA,EACF;AA9BO,QAAM,OAAAA;AAAA,GAVE;AA2CjB,IAAO,eAAQ;AAAA,EACb,MAAM,CAAC,WAAgC;AACrC,WAAO,qBAAO,6BAA6B;AAAA,MACzC,MAAM,KAAK;AAAA,MACX,UACE;AAAA,MACF,YAAY,CAAC,GAAG,GAAG,IAAI,sBAAsB;AAC3C,eAAO,2BAAU,IAAI,EAAE,YAAY,IAAI,KAAK,KAAK,GAAG,iBAAiB,GAAG,OAAe,CAAC;AAAA,MAC1F;AAAA,IACF,CAAC;AAAA,EACH;AACF;",
|
|
6
6
|
"names": ["This"]
|
|
7
7
|
}
|
|
@@ -28,33 +28,35 @@ var Timer;
|
|
|
28
28
|
((_Timer) => {
|
|
29
29
|
_Timer.selector = "dr-timer";
|
|
30
30
|
class Timer2 extends import_ComponentBase.ComponentBase {
|
|
31
|
-
onInitRender(param, rawSet) {
|
|
32
|
-
super.onInitRender(param, rawSet);
|
|
33
|
-
|
|
31
|
+
async onInitRender(param, rawSet) {
|
|
32
|
+
await super.onInitRender(param, rawSet);
|
|
33
|
+
this.getAttribute("onCreated")?.(this);
|
|
34
34
|
}
|
|
35
35
|
isRunning() {
|
|
36
|
-
return this.
|
|
36
|
+
return this.value !== void 0;
|
|
37
37
|
}
|
|
38
38
|
start() {
|
|
39
|
-
const
|
|
40
|
-
if (
|
|
41
|
-
this.
|
|
39
|
+
const timems = this.getAttribute("value");
|
|
40
|
+
if (timems) {
|
|
41
|
+
this.value = parseInt(timems);
|
|
42
|
+
const intervalValue = this.getAttribute("interval") ?? 1e3;
|
|
43
|
+
console.log("int", this.value, intervalValue);
|
|
42
44
|
this.interval = setInterval(() => {
|
|
43
|
-
if (this.
|
|
44
|
-
this.
|
|
45
|
+
if (this.value) {
|
|
46
|
+
this.value--;
|
|
45
47
|
} else {
|
|
46
48
|
clearInterval(this.interval);
|
|
47
|
-
this.
|
|
49
|
+
this.value = void 0;
|
|
48
50
|
this.interval = void 0;
|
|
49
51
|
}
|
|
50
|
-
},
|
|
52
|
+
}, intervalValue);
|
|
51
53
|
}
|
|
52
54
|
}
|
|
53
55
|
stop() {
|
|
54
56
|
if (this.interval) {
|
|
55
57
|
clearInterval(this.interval);
|
|
56
58
|
this.interval = void 0;
|
|
57
|
-
this.
|
|
59
|
+
this.value = void 0;
|
|
58
60
|
}
|
|
59
61
|
}
|
|
60
62
|
onChangeAttrRender(name, val, other) {
|
|
@@ -71,7 +73,7 @@ var Timer;
|
|
|
71
73
|
_Timer.Timer = Timer2;
|
|
72
74
|
})(Timer || (Timer = {}));
|
|
73
75
|
var Timer_default = {
|
|
74
|
-
|
|
76
|
+
timer: (config) => {
|
|
75
77
|
return import_RawSet.RawSet.createComponentTargetElement({
|
|
76
78
|
name: `${Timer.selector}`,
|
|
77
79
|
template: "#innerHTML#",
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/components/timer/Timer.ts"],
|
|
4
|
-
"sourcesContent": ["import { ComponentBase } from '../ComponentBase';\nimport { DomRender, DomRenderRunConfig } from '../../DomRender';\nimport { RawSet } from '../../rawsets/RawSet';\nimport { OtherData } from '../../lifecycle/OnChangeAttrRender';\nimport { OnDestroyRenderParams } from '../../lifecycle/OnDestroyRender';\n\
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,2BAA8B;AAC9B,uBAA8C;AAC9C,oBAAuB;
|
|
4
|
+
"sourcesContent": ["import { ComponentBase } from '../ComponentBase';\nimport { DomRender, DomRenderRunConfig } from '../../DomRender';\nimport { RawSet } from '../../rawsets/RawSet';\nimport { OtherData } from '../../lifecycle/OnChangeAttrRender';\nimport { OnDestroyRenderParams } from '../../lifecycle/OnDestroyRender';\n\nexport namespace Timer {\n export const selector = 'dr-timer';\n export type Attribute = {\n value?: string;\n interval?: number;\n onCreated?: (timer: Timer) => void;\n };\n export class Timer extends ComponentBase<Attribute> {\n private interval?: any;\n private value?: number;\n\n async onInitRender(param: any, rawSet: RawSet) {\n await super.onInitRender(param, rawSet);\n this.getAttribute('onCreated')?.(this);\n // console.log('---2', this.getElement()?.isConnected)\n // const element = this.getElement();\n // if(element){\n // (element as any).component = this;\n // }\n }\n\n isRunning() {\n return this.value !== undefined;\n }\n\n start() {\n const timems = this.getAttribute('value');\n if (timems) {\n this.value = parseInt(timems);\n const intervalValue = this.getAttribute('interval') ?? 1000;\n console.log('int', this.value, intervalValue);\n this.interval = setInterval(() => {\n // console.log('--------->', this.value);\n if (this.value) {\n this.value--;\n } else {\n clearInterval(this.interval);\n this.value = undefined;\n this.interval = undefined;\n }\n }, intervalValue);\n }\n }\n\n stop() {\n if (this.interval) {\n clearInterval(this.interval);\n this.interval = undefined;\n this.value = undefined;\n }\n }\n\n onChangeAttrRender(name: string, val: any, other: OtherData) {\n super.onChangeAttrRender(name, val, other);\n console.log('-----', name, val, this.getElement());\n }\n\n onDestroyRender(data: OnDestroyRenderParams) {\n super.onDestroyRender(data);\n if (this.interval) {\n clearInterval(this.interval);\n }\n }\n }\n}\n\nexport default {\n timer: (config?: DomRenderRunConfig) => {\n return RawSet.createComponentTargetElement({\n name: `${Timer.selector}`,\n template: '#innerHTML#',\n objFactory: (e, o, r2, counstructorParam) => {\n return DomRender.run({ rootObject: new Timer.Timer(...counstructorParam), config: config });\n }\n });\n }\n};"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,2BAA8B;AAC9B,uBAA8C;AAC9C,oBAAuB;AAIhB,IAAU;AAAA,CAAV,CAAU,WAAV;AACE,EAAM,kBAAW;AAAA,EAMjB,MAAMA,eAAc,mCAAyB;AAAA,IAIlD,MAAM,aAAa,OAAY,QAAgB;AAC7C,YAAM,MAAM,aAAa,OAAO,MAAM;AACtC,WAAK,aAAa,WAAW,IAAI,IAAI;AAAA,IAMvC;AAAA,IAEA,YAAY;AACV,aAAO,KAAK,UAAU;AAAA,IACxB;AAAA,IAEA,QAAQ;AACN,YAAM,SAAS,KAAK,aAAa,OAAO;AACxC,UAAI,QAAQ;AACV,aAAK,QAAQ,SAAS,MAAM;AAC5B,cAAM,gBAAgB,KAAK,aAAa,UAAU,KAAK;AACvD,gBAAQ,IAAI,OAAO,KAAK,OAAO,aAAa;AAC5C,aAAK,WAAW,YAAY,MAAM;AAEhC,cAAI,KAAK,OAAO;AACd,iBAAK;AAAA,UACP,OAAO;AACL,0BAAc,KAAK,QAAQ;AAC3B,iBAAK,QAAQ;AACb,iBAAK,WAAW;AAAA,UAClB;AAAA,QACF,GAAG,aAAa;AAAA,MAClB;AAAA,IACF;AAAA,IAEA,OAAO;AACL,UAAI,KAAK,UAAU;AACjB,sBAAc,KAAK,QAAQ;AAC3B,aAAK,WAAW;AAChB,aAAK,QAAQ;AAAA,MACf;AAAA,IACF;AAAA,IAEA,mBAAmB,MAAc,KAAU,OAAkB;AAC3D,YAAM,mBAAmB,MAAM,KAAK,KAAK;AACzC,cAAQ,IAAI,SAAS,MAAM,KAAK,KAAK,WAAW,CAAC;AAAA,IACnD;AAAA,IAEA,gBAAgB,MAA6B;AAC3C,YAAM,gBAAgB,IAAI;AAC1B,UAAI,KAAK,UAAU;AACjB,sBAAc,KAAK,QAAQ;AAAA,MAC7B;AAAA,IACF;AAAA,EACF;AAxDO,SAAM,QAAAA;AAAA,GAPE;AAkEjB,IAAO,gBAAQ;AAAA,EACb,OAAO,CAAC,WAAgC;AACtC,WAAO,qBAAO,6BAA6B;AAAA,MACzC,MAAM,GAAG,MAAM,QAAQ;AAAA,MACvB,UAAU;AAAA,MACV,YAAY,CAAC,GAAG,GAAG,IAAI,sBAAsB;AAC3C,eAAO,2BAAU,IAAI,EAAE,YAAY,IAAI,MAAM,MAAM,GAAG,iBAAiB,GAAG,OAAe,CAAC;AAAA,MAC5F;AAAA,IACF,CAAC;AAAA,EACH;AACF;",
|
|
6
6
|
"names": ["Timer"]
|
|
7
7
|
}
|
|
@@ -23,6 +23,7 @@ __export(DomRenderNoProxy_exports, {
|
|
|
23
23
|
isDomRenderNoProxy: () => isDomRenderNoProxy
|
|
24
24
|
});
|
|
25
25
|
module.exports = __toCommonJS(DomRenderNoProxy_exports);
|
|
26
|
+
var import_ValidUtils = require("@dooboostore/core/valid/ValidUtils");
|
|
26
27
|
const DomRenderNoProxyKey = "DomRender:NoProxy";
|
|
27
28
|
const DomRenderNoProxy = (target, propertyKey) => {
|
|
28
29
|
if (propertyKey === void 0) {
|
|
@@ -38,6 +39,6 @@ const getDomRenderNoProxy = (target, propertyKey) => {
|
|
|
38
39
|
return Reflect.getMetadata(DomRenderNoProxyKey, target, propertyKey);
|
|
39
40
|
};
|
|
40
41
|
const isDomRenderNoProxy = (target, propertyKey) => {
|
|
41
|
-
return getDomRenderNoProxy(target, propertyKey) === true;
|
|
42
|
+
return import_ValidUtils.ValidUtils.isNullOrUndefined(target) || getDomRenderNoProxy(target, propertyKey) === true;
|
|
42
43
|
};
|
|
43
44
|
//# sourceMappingURL=DomRenderNoProxy.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/decorators/DomRenderNoProxy.ts"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;
|
|
4
|
+
"sourcesContent": ["import { ValidUtils } from '@dooboostore/core/valid/ValidUtils';\n\nexport const DomRenderNoProxyKey = 'DomRender:NoProxy'\nexport const DomRenderNoProxy = (target: any, propertyKey?: string | symbol) => {\n // \uD074\uB798\uC2A4 \uB370\uCF54\uB808\uC774\uD130\uB85C \uC0AC\uC6A9\uB41C \uACBD\uC6B0\n if (propertyKey === undefined) {\n // target\uC740 \uD074\uB798\uC2A4 \uC0DD\uC131\uC790\n Reflect.defineMetadata(DomRenderNoProxyKey, true, target);\n return;\n }\n\n // \uD504\uB85C\uD37C\uD2F0 \uB370\uCF54\uB808\uC774\uD130\uB85C \uC0AC\uC6A9\uB41C \uACBD\uC6B0\n // target\uC740 \uD504\uB85C\uD1A0\uD0C0\uC785, propertyKey\uB294 \uD504\uB85C\uD37C\uD2F0 \uC774\uB984\n Reflect.defineMetadata(DomRenderNoProxyKey, true, target, propertyKey);\n};\n\nexport const getDomRenderNoProxy = (target: any, propertyKey?: string | symbol) => {\n // if (ValidUtils.isNotNullUndefined(target)) {\n // \uD074\uB798\uC2A4 \uB370\uCF54\uB808\uC774\uD130\n if (propertyKey === undefined) {\n return Reflect.getMetadata(DomRenderNoProxyKey, target);\n }\n // \uD504\uB85C\uD37C\uD2F0 \uB370\uCF54\uB808\uC774\uD130\n return Reflect.getMetadata(DomRenderNoProxyKey, target, propertyKey);\n // } else {\n // return undefined;\n // }\n}\n\nexport const isDomRenderNoProxy = (target: any, propertyKey?: string | symbol) => {\n return ValidUtils.isNullOrUndefined(target) || getDomRenderNoProxy(target, propertyKey) === true;\n}"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAA2B;AAEpB,MAAM,sBAAsB;AAC5B,MAAM,mBAAmB,CAAC,QAAa,gBAAkC;AAE5E,MAAI,gBAAgB,QAAW;AAE7B,YAAQ,eAAe,qBAAqB,MAAM,MAAM;AACxD;AAAA,EACF;AAIA,UAAQ,eAAe,qBAAqB,MAAM,QAAQ,WAAW;AACzE;AAEO,MAAM,sBAAsB,CAAC,QAAa,gBAAkC;AAG/E,MAAI,gBAAgB,QAAW;AAC7B,WAAO,QAAQ,YAAY,qBAAqB,MAAM;AAAA,EACxD;AAEA,SAAO,QAAQ,YAAY,qBAAqB,QAAQ,WAAW;AAIvE;AAEO,MAAM,qBAAqB,CAAC,QAAa,gBAAkC;AAChF,SAAO,6BAAW,kBAAkB,MAAM,KAAK,oBAAoB,QAAQ,WAAW,MAAM;AAC9F;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|