@fmsim/board 1.0.88 → 2.0.0-beta.101

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.
Files changed (144) hide show
  1. package/custom-elements.json +7366 -3448
  2. package/demo/index-modeller.html +1 -1
  3. package/demo/index-player.html +2 -2
  4. package/demo/index-viewer.html +2 -2
  5. package/demo/index.html +2 -2
  6. package/dist/src/component/etc.js +36 -0
  7. package/dist/src/component/etc.js.map +1 -1
  8. package/dist/src/component/index.d.ts +1 -0
  9. package/dist/src/component/index.js +1 -0
  10. package/dist/src/component/index.js.map +1 -1
  11. package/dist/src/component/restful-attachment-creation-card.js +1 -1
  12. package/dist/src/component/restful-attachment-creation-card.js.map +1 -1
  13. package/dist/src/component/restful-attachment-selector.js +8 -9
  14. package/dist/src/component/restful-attachment-selector.js.map +1 -1
  15. package/dist/src/component/restful-input-attachment-selector.d.ts +1 -1
  16. package/dist/src/component/restful-input-attachment-selector.js +3 -3
  17. package/dist/src/component/restful-input-attachment-selector.js.map +1 -1
  18. package/dist/src/component/restful-input-fill-style.d.ts +13 -2
  19. package/dist/src/component/restful-input-fill-style.js.map +1 -1
  20. package/dist/src/component/restful-property-editor-backdrop-faces.d.ts +50 -0
  21. package/dist/src/component/restful-property-editor-backdrop-faces.js +524 -0
  22. package/dist/src/component/restful-property-editor-backdrop-faces.js.map +1 -0
  23. package/dist/src/index.d.ts +1 -0
  24. package/dist/src/index.js +1 -0
  25. package/dist/src/index.js.map +1 -1
  26. package/dist/src/layers/mcs-mouse-event-handler.js +8 -0
  27. package/dist/src/layers/mcs-mouse-event-handler.js.map +1 -1
  28. package/dist/src/layers/movement-layer.d.ts +7 -6
  29. package/dist/src/layers/movement-layer.js +56 -11
  30. package/dist/src/layers/movement-layer.js.map +1 -1
  31. package/dist/src/modeller/bulk-create-dialog.d.ts +51 -0
  32. package/dist/src/modeller/bulk-create-dialog.js +531 -0
  33. package/dist/src/modeller/bulk-create-dialog.js.map +1 -0
  34. package/dist/src/modeller/bulk-create.d.ts +101 -0
  35. package/dist/src/modeller/bulk-create.js +199 -0
  36. package/dist/src/modeller/bulk-create.js.map +1 -0
  37. package/dist/src/modeller/component-toolbar/component-menu.d.ts +1 -1
  38. package/dist/src/modeller/component-toolbar/component-toolbar.d.ts +4 -4
  39. package/dist/src/modeller/component-toolbar/component-toolbar.js.map +1 -1
  40. package/dist/src/modeller/edit-toolbar-style.js +43 -3
  41. package/dist/src/modeller/edit-toolbar-style.js.map +1 -1
  42. package/dist/src/modeller/edit-toolbar.d.ts +21 -14
  43. package/dist/src/modeller/edit-toolbar.js +371 -213
  44. package/dist/src/modeller/edit-toolbar.js.map +1 -1
  45. package/dist/src/modeller/property-sidebar/abstract-property.js +10 -2
  46. package/dist/src/modeller/property-sidebar/abstract-property.js.map +1 -1
  47. package/dist/src/modeller/property-sidebar/data-binding/data-binding-mapper.js +1 -1
  48. package/dist/src/modeller/property-sidebar/data-binding/data-binding-mapper.js.map +1 -1
  49. package/dist/src/modeller/property-sidebar/data-binding/data-binding.d.ts +2 -2
  50. package/dist/src/modeller/property-sidebar/data-binding/data-binding.js +18 -18
  51. package/dist/src/modeller/property-sidebar/data-binding/data-binding.js.map +1 -1
  52. package/dist/src/modeller/property-sidebar/effects/effects.d.ts +10 -1
  53. package/dist/src/modeller/property-sidebar/effects/effects.js +66 -1
  54. package/dist/src/modeller/property-sidebar/effects/effects.js.map +1 -1
  55. package/dist/src/modeller/property-sidebar/effects/event-handler-adapter.d.ts +44 -0
  56. package/dist/src/modeller/property-sidebar/effects/event-handler-adapter.js +70 -0
  57. package/dist/src/modeller/property-sidebar/effects/event-handler-adapter.js.map +1 -0
  58. package/dist/src/modeller/property-sidebar/effects/property-event-hover.js +3 -3
  59. package/dist/src/modeller/property-sidebar/effects/property-event-hover.js.map +1 -1
  60. package/dist/src/modeller/property-sidebar/effects/property-event.d.ts +13 -3
  61. package/dist/src/modeller/property-sidebar/effects/property-event.js +20 -11
  62. package/dist/src/modeller/property-sidebar/effects/property-event.js.map +1 -1
  63. package/dist/src/modeller/property-sidebar/inspector/inspector-controller.d.ts +62 -0
  64. package/dist/src/modeller/property-sidebar/inspector/inspector-controller.js +276 -0
  65. package/dist/src/modeller/property-sidebar/inspector/inspector-controller.js.map +1 -0
  66. package/dist/src/modeller/property-sidebar/inspector/inspector-group-view.d.ts +15 -0
  67. package/dist/src/modeller/property-sidebar/inspector/inspector-group-view.js +56 -0
  68. package/dist/src/modeller/property-sidebar/inspector/inspector-group-view.js.map +1 -0
  69. package/dist/src/modeller/property-sidebar/inspector/inspector-highlight.d.ts +7 -0
  70. package/dist/src/modeller/property-sidebar/inspector/inspector-highlight.js +25 -0
  71. package/dist/src/modeller/property-sidebar/inspector/inspector-highlight.js.map +1 -0
  72. package/dist/src/modeller/property-sidebar/inspector/inspector-model.d.ts +44 -0
  73. package/dist/src/modeller/property-sidebar/inspector/inspector-model.js +72 -0
  74. package/dist/src/modeller/property-sidebar/inspector/inspector-model.js.map +1 -0
  75. package/dist/src/modeller/property-sidebar/inspector/inspector-tree-view.d.ts +18 -0
  76. package/dist/src/modeller/property-sidebar/inspector/inspector-tree-view.js +61 -0
  77. package/dist/src/modeller/property-sidebar/inspector/inspector-tree-view.js.map +1 -0
  78. package/dist/src/modeller/property-sidebar/inspector/inspector.d.ts +17 -12
  79. package/dist/src/modeller/property-sidebar/inspector/inspector.js +281 -154
  80. package/dist/src/modeller/property-sidebar/inspector/inspector.js.map +1 -1
  81. package/dist/src/modeller/property-sidebar/property-sidebar.d.ts +2 -2
  82. package/dist/src/modeller/property-sidebar/property-sidebar.js +11 -24
  83. package/dist/src/modeller/property-sidebar/property-sidebar.js.map +1 -1
  84. package/dist/src/modeller/property-sidebar/shapes/ox-input-entity-id.d.ts +75 -0
  85. package/dist/src/modeller/property-sidebar/shapes/ox-input-entity-id.js +346 -0
  86. package/dist/src/modeller/property-sidebar/shapes/ox-input-entity-id.js.map +1 -0
  87. package/dist/src/modeller/property-sidebar/shapes/shapes.d.ts +23 -2
  88. package/dist/src/modeller/property-sidebar/shapes/shapes.js +96 -4
  89. package/dist/src/modeller/property-sidebar/shapes/shapes.js.map +1 -1
  90. package/dist/src/modeller/property-sidebar/specifics/specifics.d.ts +25 -1
  91. package/dist/src/modeller/property-sidebar/specifics/specifics.js +112 -2
  92. package/dist/src/modeller/property-sidebar/specifics/specifics.js.map +1 -1
  93. package/dist/src/modeller/property-sidebar/styles/styles.d.ts +6 -4
  94. package/dist/src/modeller/property-sidebar/styles/styles.js +140 -437
  95. package/dist/src/modeller/property-sidebar/styles/styles.js.map +1 -1
  96. package/dist/src/modeller/scene-viewer/ox-scene-layer.d.ts +4 -3
  97. package/dist/src/modeller/scene-viewer/ox-scene-layer.js +2 -1
  98. package/dist/src/modeller/scene-viewer/ox-scene-layer.js.map +1 -1
  99. package/dist/src/modeller/scene-viewer/ox-scene-viewer.d.ts +6 -5
  100. package/dist/src/modeller/scene-viewer/ox-scene-viewer.js +7 -3
  101. package/dist/src/modeller/scene-viewer/ox-scene-viewer.js.map +1 -1
  102. package/dist/src/ox-board-component-info.d.ts +3 -3
  103. package/dist/src/ox-board-component-info.js +58 -19
  104. package/dist/src/ox-board-component-info.js.map +1 -1
  105. package/dist/src/ox-board-list.js +12 -12
  106. package/dist/src/ox-board-list.js.map +1 -1
  107. package/dist/src/ox-board-modeller.d.ts +9 -6
  108. package/dist/src/ox-board-modeller.js +32 -33
  109. package/dist/src/ox-board-modeller.js.map +1 -1
  110. package/dist/src/ox-board-viewer.d.ts +129 -17
  111. package/dist/src/ox-board-viewer.js +804 -115
  112. package/dist/src/ox-board-viewer.js.map +1 -1
  113. package/dist/src/ox-editor-board-selector.d.ts +4 -1
  114. package/dist/src/ox-editor-board-selector.js +41 -12
  115. package/dist/src/ox-editor-board-selector.js.map +1 -1
  116. package/dist/src/ox-playback-controls.d.ts +157 -0
  117. package/dist/src/ox-playback-controls.js +1089 -0
  118. package/dist/src/ox-playback-controls.js.map +1 -0
  119. package/dist/src/ox-property-editor-theme.js +2 -2
  120. package/dist/src/ox-property-editor-theme.js.map +1 -1
  121. package/dist/src/playback/carrier-tracking-store.d.ts +51 -0
  122. package/dist/src/playback/carrier-tracking-store.js +115 -0
  123. package/dist/src/playback/carrier-tracking-store.js.map +1 -0
  124. package/dist/src/playback/playback-engine.d.ts +106 -0
  125. package/dist/src/playback/playback-engine.js +395 -0
  126. package/dist/src/playback/playback-engine.js.map +1 -0
  127. package/dist/src/selector/board-creation-popup.d.ts +4 -5
  128. package/dist/src/selector/board-creation-popup.js +16 -19
  129. package/dist/src/selector/board-creation-popup.js.map +1 -1
  130. package/dist/src/selector/board-thumbnail-card.js +8 -8
  131. package/dist/src/selector/board-thumbnail-card.js.map +1 -1
  132. package/dist/src/selector/ox-board-creation-card.d.ts +1 -1
  133. package/dist/src/selector/ox-board-creation-card.js +7 -7
  134. package/dist/src/selector/ox-board-creation-card.js.map +1 -1
  135. package/dist/src/selector/ox-board-selector.js +21 -10
  136. package/dist/src/selector/ox-board-selector.js.map +1 -1
  137. package/dist/tsconfig.tsbuildinfo +1 -1
  138. package/icons/components/text.png +0 -0
  139. package/icons/fab/mode-2d.svg +25 -0
  140. package/icons/fab/mode-3d.svg +25 -0
  141. package/icons/fab/playback-play.svg +49 -0
  142. package/icons/fab/playback-stop.svg +50 -0
  143. package/icons/icon-htoolbar.png +0 -0
  144. package/package.json +22 -21
@@ -21,8 +21,8 @@
21
21
  }
22
22
  </style>
23
23
 
24
- <link href="/node_modules/@material-design-icons/font/index.css" rel="stylesheet" />
25
24
  <link href="/node_modules/@fontsource/roboto/index.css" rel="stylesheet" />
25
+ <link href="/node_modules/material-symbols/index.css" rel="stylesheet" />
26
26
  </head>
27
27
  <body>
28
28
  <div id="demo"></div>
@@ -20,8 +20,8 @@
20
20
  height: 100dvh;
21
21
  }
22
22
  </style>
23
- <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" />
24
- <link href="/node_modules/@material-design-icons/font/index.css" rel="stylesheet" />
23
+ <link href="/node_modules/@fontsource/roboto/index.css" rel="stylesheet" />
24
+ <link href="/node_modules/material-symbols/index.css" rel="stylesheet" />
25
25
  </head>
26
26
  <body>
27
27
  <div id="demo"></div>
@@ -20,8 +20,8 @@
20
20
  height: 100dvh;
21
21
  }
22
22
  </style>
23
- <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" />
24
- <link href="/node_modules/@material-design-icons/font/index.css" rel="stylesheet" />
23
+ <link href="/node_modules/@fontsource/roboto/index.css" rel="stylesheet" />
24
+ <link href="/node_modules/material-symbols/index.css" rel="stylesheet" />
25
25
  </head>
26
26
  <body>
27
27
  <div id="demo"></div>
package/demo/index.html CHANGED
@@ -20,8 +20,8 @@
20
20
  height: 100dvh;
21
21
  }
22
22
  </style>
23
- <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" />
24
- <link href="/node_modules/@material-design-icons/font/index.css" rel="stylesheet" />
23
+ <link href="/node_modules/@fontsource/roboto/index.css" rel="stylesheet" />
24
+ <link href="/node_modules/material-symbols/index.css" rel="stylesheet" />
25
25
  </head>
26
26
  <body>
27
27
  <div id="demo"></div>
@@ -1,3 +1,4 @@
1
+ const text = new URL('../../../icons/components/text.png', import.meta.url).href;
1
2
  const rect = new URL('../../../icons/components/rect.png', import.meta.url).href;
2
3
  const ellipse = new URL('../../../icons/components/ellipse.png', import.meta.url).href;
3
4
  const lineIcon = new URL('../../../icons/components/line.png', import.meta.url).href;
@@ -22,6 +23,23 @@ export const etc = {
22
23
  description: 'a group of components that have not yet been defined.',
23
24
  icon,
24
25
  templates: [
26
+ {
27
+ type: 'text',
28
+ description: 'text',
29
+ icon: text,
30
+ group: 'shape',
31
+ model: {
32
+ type: 'text',
33
+ left: 100,
34
+ top: 100,
35
+ width: 200,
36
+ height: 50,
37
+ fillStyle: 'transparent',
38
+ fontColor: '#000',
39
+ fontSize: 16,
40
+ text: 'Text'
41
+ }
42
+ },
25
43
  {
26
44
  type: 'rect',
27
45
  description: 'rectangle shape',
@@ -158,6 +176,24 @@ export const etc = {
158
176
  fillStyle: '#fff',
159
177
  strokeStyle: 'DarkGoldenRod'
160
178
  }
179
+ },
180
+ {
181
+ type: 'floor-plate',
182
+ description: 'floor plate for multi-story layout',
183
+ icon: rect,
184
+ group: '3d',
185
+ model: {
186
+ type: 'floor-plate',
187
+ left: 100,
188
+ top: 100,
189
+ width: 500,
190
+ height: 500,
191
+ depth: 2,
192
+ fillStyle: 'rgba(232, 232, 232, 0.7)',
193
+ strokeStyle: '#999999',
194
+ // fmsim 기본 바닥 재질 = rubber 매트 (things-scene 글로벌 기본은 그대로).
195
+ material3d: { preset: 'rubber' }
196
+ }
161
197
  }
162
198
  ]
163
199
  };
@@ -1 +1 @@
1
- {"version":3,"file":"etc.js","sourceRoot":"","sources":["../../../src/component/etc.ts"],"names":[],"mappings":"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","sourcesContent":["import { ComponentGroup } from '../types'\n\nconst rect = new URL('../../../icons/components/rect.png', import.meta.url).href\nconst ellipse = new URL('../../../icons/components/ellipse.png', import.meta.url).href\nconst lineIcon = new URL('../../../icons/components/line.png', import.meta.url).href\nconst dash = new URL('../../../icons/components/dash.png', import.meta.url).href\nconst triangle = new URL('../../../icons/components/triangle.png', import.meta.url).href\nconst container = new URL('../../../icons/components/container.png', import.meta.url).href\nconst popup = new URL('../../../icons/components/popup.png', import.meta.url).href\n\nconst icon = `\n<svg version=\"1.1\" id=\"Layer_1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\" viewBox=\"0 0 30 30\" style=\"enable-background:new 0 0 30 30;\" xml:space=\"preserve\">\n <style type=\"text/css\">\n .st0{fill:{{strokeColor}};}\n </style>\n <g>\n <circle class=\"st0\" cx=\"7.1\" cy=\"15\" r=\"2\"/>\n <circle class=\"st0\" cx=\"15\" cy=\"15\" r=\"2\"/>\n <circle class=\"st0\" cx=\"22.9\" cy=\"15\" r=\"2\"/>\n </g>\n</svg>\n`\n\nexport const etc: ComponentGroup = {\n name: 'etc',\n description: 'a group of components that have not yet been defined.',\n icon,\n templates: [\n {\n type: 'rect',\n description: 'rectangle shape',\n icon: rect,\n group: 'shape',\n model: {\n type: 'rect',\n left: 100,\n top: 100,\n width: 100,\n height: 100,\n fillStyle: '#fff',\n strokeStyle: '#000',\n alpha: 1,\n hidden: false,\n lineWidth: 1,\n lineDash: 'solid',\n lineCap: 'butt'\n }\n },\n {\n type: 'ellipse',\n description: 'ellipse shape',\n icon: ellipse,\n group: 'shape',\n model: {\n type: 'ellipse',\n rx: 50,\n ry: 50,\n cx: 150,\n cy: 150,\n fillStyle: '#fff',\n strokeStyle: '#000',\n alpha: 1,\n hidden: false,\n lineWidth: 1,\n lineDash: 'solid',\n lineCap: 'butt'\n }\n },\n {\n type: 'triangle',\n description: 'triangle shape',\n icon: triangle,\n group: 'shape',\n model: {\n type: 'triangle',\n x1: 150,\n y1: 100,\n x2: 100,\n y2: 200,\n x3: 200,\n y3: 200,\n fillStyle: '#fff',\n strokeStyle: '#000',\n alpha: 1,\n hidden: false,\n lineWidth: 1,\n lineDash: 'solid',\n lineCap: 'butt'\n }\n },\n {\n type: 'line',\n description: 'simple line',\n icon: lineIcon,\n group: 'line',\n model: {\n type: 'line',\n x1: 100,\n y1: 100,\n x2: 200,\n y2: 200,\n fillStyle: '#fff',\n strokeStyle: '#000',\n alpha: 1,\n hidden: false,\n lineWidth: 3,\n lineDash: 'solid',\n lineCap: 'butt'\n }\n },\n {\n type: 'dash',\n description: 'dash line',\n icon: dash,\n group: 'line',\n model: {\n type: 'line',\n x1: 100,\n y1: 100,\n x2: 200,\n y2: 200,\n fillStyle: '#fff',\n strokeStyle: '#000',\n alpha: 1,\n hidden: false,\n lineWidth: 3,\n lineDash: 'round-dot',\n lineCap: 'butt'\n }\n },\n {\n type: 'container',\n description: 'container shape',\n icon: container,\n group: 'container',\n model: {\n type: 'container',\n left: 100,\n top: 100,\n width: 400,\n height: 300,\n fillStyle: '#fff',\n strokeStyle: '#999',\n alpha: 1,\n hidden: false,\n lineWidth: 1,\n lineDash: 'solid',\n lineCap: 'butt'\n }\n },\n {\n type: 'popup',\n description: 'popup window',\n icon: popup,\n group: 'container',\n model: {\n type: 'popup',\n left: 100,\n top: 100,\n width: 100,\n height: 100,\n fillStyle: '#fff',\n strokeStyle: 'DarkGoldenRod'\n }\n }\n ]\n}\n"]}
1
+ {"version":3,"file":"etc.js","sourceRoot":"","sources":["../../../src/component/etc.ts"],"names":[],"mappings":"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","sourcesContent":["import { ComponentGroup } from '../types'\n\nconst text = new URL('../../../icons/components/text.png', import.meta.url).href\nconst rect = new URL('../../../icons/components/rect.png', import.meta.url).href\nconst ellipse = new URL('../../../icons/components/ellipse.png', import.meta.url).href\nconst lineIcon = new URL('../../../icons/components/line.png', import.meta.url).href\nconst dash = new URL('../../../icons/components/dash.png', import.meta.url).href\nconst triangle = new URL('../../../icons/components/triangle.png', import.meta.url).href\nconst container = new URL('../../../icons/components/container.png', import.meta.url).href\nconst popup = new URL('../../../icons/components/popup.png', import.meta.url).href\n\nconst icon = `\n<svg version=\"1.1\" id=\"Layer_1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\" viewBox=\"0 0 30 30\" style=\"enable-background:new 0 0 30 30;\" xml:space=\"preserve\">\n <style type=\"text/css\">\n .st0{fill:{{strokeColor}};}\n </style>\n <g>\n <circle class=\"st0\" cx=\"7.1\" cy=\"15\" r=\"2\"/>\n <circle class=\"st0\" cx=\"15\" cy=\"15\" r=\"2\"/>\n <circle class=\"st0\" cx=\"22.9\" cy=\"15\" r=\"2\"/>\n </g>\n</svg>\n`\n\nexport const etc: ComponentGroup = {\n name: 'etc',\n description: 'a group of components that have not yet been defined.',\n icon,\n templates: [\n {\n type: 'text',\n description: 'text',\n icon: text,\n group: 'shape',\n model: {\n type: 'text',\n left: 100,\n top: 100,\n width: 200,\n height: 50,\n fillStyle: 'transparent',\n fontColor: '#000',\n fontSize: 16,\n text: 'Text'\n }\n },\n {\n type: 'rect',\n description: 'rectangle shape',\n icon: rect,\n group: 'shape',\n model: {\n type: 'rect',\n left: 100,\n top: 100,\n width: 100,\n height: 100,\n fillStyle: '#fff',\n strokeStyle: '#000',\n alpha: 1,\n hidden: false,\n lineWidth: 1,\n lineDash: 'solid',\n lineCap: 'butt'\n }\n },\n {\n type: 'ellipse',\n description: 'ellipse shape',\n icon: ellipse,\n group: 'shape',\n model: {\n type: 'ellipse',\n rx: 50,\n ry: 50,\n cx: 150,\n cy: 150,\n fillStyle: '#fff',\n strokeStyle: '#000',\n alpha: 1,\n hidden: false,\n lineWidth: 1,\n lineDash: 'solid',\n lineCap: 'butt'\n }\n },\n {\n type: 'triangle',\n description: 'triangle shape',\n icon: triangle,\n group: 'shape',\n model: {\n type: 'triangle',\n x1: 150,\n y1: 100,\n x2: 100,\n y2: 200,\n x3: 200,\n y3: 200,\n fillStyle: '#fff',\n strokeStyle: '#000',\n alpha: 1,\n hidden: false,\n lineWidth: 1,\n lineDash: 'solid',\n lineCap: 'butt'\n }\n },\n {\n type: 'line',\n description: 'simple line',\n icon: lineIcon,\n group: 'line',\n model: {\n type: 'line',\n x1: 100,\n y1: 100,\n x2: 200,\n y2: 200,\n fillStyle: '#fff',\n strokeStyle: '#000',\n alpha: 1,\n hidden: false,\n lineWidth: 3,\n lineDash: 'solid',\n lineCap: 'butt'\n }\n },\n {\n type: 'dash',\n description: 'dash line',\n icon: dash,\n group: 'line',\n model: {\n type: 'line',\n x1: 100,\n y1: 100,\n x2: 200,\n y2: 200,\n fillStyle: '#fff',\n strokeStyle: '#000',\n alpha: 1,\n hidden: false,\n lineWidth: 3,\n lineDash: 'round-dot',\n lineCap: 'butt'\n }\n },\n {\n type: 'container',\n description: 'container shape',\n icon: container,\n group: 'container',\n model: {\n type: 'container',\n left: 100,\n top: 100,\n width: 400,\n height: 300,\n fillStyle: '#fff',\n strokeStyle: '#999',\n alpha: 1,\n hidden: false,\n lineWidth: 1,\n lineDash: 'solid',\n lineCap: 'butt'\n }\n },\n {\n type: 'popup',\n description: 'popup window',\n icon: popup,\n group: 'container',\n model: {\n type: 'popup',\n left: 100,\n top: 100,\n width: 100,\n height: 100,\n fillStyle: '#fff',\n strokeStyle: 'DarkGoldenRod'\n }\n },\n {\n type: 'floor-plate',\n description: 'floor plate for multi-story layout',\n icon: rect,\n group: '3d',\n model: {\n type: 'floor-plate',\n left: 100,\n top: 100,\n width: 500,\n height: 500,\n depth: 2,\n fillStyle: 'rgba(232, 232, 232, 0.7)',\n strokeStyle: '#999999',\n // fmsim 기본 바닥 재질 = rubber 매트 (things-scene 글로벌 기본은 그대로).\n material3d: { preset: 'rubber' }\n }\n }\n ]\n}\n"]}
@@ -1,3 +1,4 @@
1
1
  export * from './restful-attachment-selector.js';
2
2
  export * from './restful-input-fill-style.js';
3
+ export * from './restful-property-editor-backdrop-faces.js';
3
4
  export * from './etc.js';
@@ -1,4 +1,5 @@
1
1
  export * from './restful-attachment-selector.js';
2
2
  export * from './restful-input-fill-style.js';
3
+ export * from './restful-property-editor-backdrop-faces.js';
3
4
  export * from './etc.js';
4
5
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/component/index.ts"],"names":[],"mappings":"AAAA,cAAc,kCAAkC,CAAA;AAChD,cAAc,+BAA+B,CAAA;AAC7C,cAAc,UAAU,CAAA","sourcesContent":["export * from './restful-attachment-selector.js'\nexport * from './restful-input-fill-style.js'\nexport * from './etc.js'\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/component/index.ts"],"names":[],"mappings":"AAAA,cAAc,kCAAkC,CAAA;AAChD,cAAc,+BAA+B,CAAA;AAC7C,cAAc,6CAA6C,CAAA;AAC3D,cAAc,UAAU,CAAA","sourcesContent":["export * from './restful-attachment-selector.js'\nexport * from './restful-input-fill-style.js'\nexport * from './restful-property-editor-backdrop-faces.js'\nexport * from './etc.js'\n"]}
@@ -156,7 +156,7 @@ RestfulAttachmentCreationCard.styles = [
156
156
  background-color: #fffde9;
157
157
  }
158
158
 
159
- [front] mwc-icon {
159
+ [front] md-icon {
160
160
  margin-top: 55px;
161
161
  display: block;
162
162
  font-size: 3.5em;
@@ -1 +1 @@
1
- {"version":3,"file":"restful-attachment-creation-card.js","sourceRoot":"","sources":["../../../src/component/restful-attachment-creation-card.ts"],"names":[],"mappings":";AAAA,OAAO,iEAAiE,CAAA;AACxE,OAAO,yBAAyB,CAAA;AAEhC,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,KAAK,CAAA;AACtD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAE/C,MAAM,WAAW,GAAG,OAAO,CAAC,wCAAwC,CAAC,CAAA;AAG9D,IAAM,6BAA6B,GAAnC,MAAM,6BAA8B,SAAQ,QAAQ,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;IAAzE;;QA6IsB,eAAU,GAAa,EAAE,CAAA;QACzB,WAAM,GAAU,EAAE,CAAA;IAmH/C,CAAC;IA/GC,MAAM;QACJ,IAAI,UAAU,GAAG,IAAI,CAAC,UAAU,IAAI,EAAE,CAAA;QAEtC,OAAO,IAAI,CAAA;oBACK,CAAC,CAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC;;UAE3C,OAAO,CAAC,CAAC,CAAC,wBAAwB,CAAC;;;oBAGzB,CAAC,CAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC;wBAC7B,CAAC,CAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC;mBACxC,OAAO,CAAC,CAAC,CAAC,gBAAgB,CAAC;;qBAEzB,MAAM,CAAC,IAAI,CAAC,eAAe,CAAC;;sBAE3B,CAAC,CAAQ,EAAE,EAAE;YACrB,IAAI,CAAC,gBAAgB,GAAI,CAAC,CAAC,aAAmC,CAAC,KAAK,CAAA;QACtE,CAAC;;iCAEoB,OAAO,CAAC,CAAC,CAAC,+BAA+B,CAAC;cAC7D,UAAU,CAAC,GAAG,CACd,QAAQ,CAAC,EAAE,CAAC,IAAI,CAAA;gCACE,QAAQ,cAAc,IAAI,CAAC,eAAe,IAAI,QAAQ,IAAI,QAAQ;eACnF,CACF;;;mBAGM,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC;;;oBAGtB,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC;sBACpC,IAAI,CAAC,gBAAgB,IAAI,GAAG;;2BAEvB,CAAC,CAAQ,EAAE,EAAE;YAC1B,IAAI,CAAC,MAAM,GAAI,CAAiB,CAAC,MAAM,CAAC,MAAM,CAAA;YAC9C,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC,IAAI,CAAE,CAAiB,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;QAC3D,CAAC;;;;cAIC,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAA,kCAAkC,IAAI,6BAA6B,CAAC;;;uCAGvE,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC;;;KAGpE,CAAA;IACH,CAAC;IAED,YAAY;QACV,cAAc,CAAC,GAAG,CAAC,IAAI,CAAC,CAAA;IAC1B,CAAC;IAED,WAAW,CAAC,CAAQ;QAClB,MAAM,aAAa,GAAG,CAAC,CAAC,aAA4B,CAAA;QACpD,MAAM,MAAM,GAAG,CAAC,CAAC,MAAqB,CAAA;QAEtC,IACE,aAAa,CAAC,YAAY,CAAC,OAAO,CAAC;YACnC,CAAC,aAAa,CAAC,YAAY,CAAC,MAAM,CAAC,IAAI,MAAM,CAAC,OAAO,IAAI,OAAO,IAAI,MAAM,CAAC,OAAO,IAAI,QAAQ,CAAC,EAC/F,CAAC;YACD,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,SAAS,CAAC,CAAA;QAClC,CAAC;QAED,CAAC,CAAC,eAAe,EAAE,CAAA;IACrB,CAAC;IAED,aAAa,CAAC,CAAQ;QACpB,CAAC,CAAC,cAAc,EAAE,CAAA;QAClB,CAAC,CAAC,eAAe,EAAE,CAAA;QAEnB,IAAI,IAAI,GAAG,CAAC,CAAC,MAAyB,CAAA;QAEtC,IAAI,QAAQ,GAAK,IAAI,CAAC,QAAgB,CAAC,UAAU,CAAuB,CAAC,KAAK,CAAA;QAC9E,IAAI,KAAK,GAAG,IAAI,CAAC,MAAM,CAAA;QACvB,IAAI,MAAM,GAAG,IAAI,CAAC,MAAM,CAAA;QAExB,MAAM,SAAS,GAAG,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,SAAS,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAA;QACtD,IAAI,CAAC,SAAS,IAAI,SAAS,MAAK,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,WAAW,EAAE,CAAA,EAAE,CAAC;YACzD,QAAQ,CAAC,aAAa,CACpB,IAAI,WAAW,CAAC,QAAQ,EAAE;gBACxB,MAAM,EAAE;oBACN,KAAK,EAAE,OAAO;oBACd,OAAO,EAAE,0CAA0C;oBACnD,EAAE,EAAE,0CAA0C;iBAC/C;aACF,CAAC,CACH,CAAA;YACD,OAAM;QACR,CAAC;QAED,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,mBAAmB,EAAE;YACnC,MAAM,EAAE;gBACN,QAAQ;gBACR,KAAK;gBACL,MAAM;aACP;SACF,CAAC,CACH,CAAA;IACH,CAAC;IAED,KAAK;QACH,IAAI,IAAI,GAAG,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,MAAM,CAAC,CAAA;QAChD,IAAI,IAAI,EAAE,CAAC;YACT,IAAI,CAAC,KAAK,EAAE,CAAA;YACZ,IAAI,CAAC,MAAM,GAAG,EAAE,CAAA;QAClB,CAAC;QAED,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,SAAS,CAAC,CAAA;IAClC,CAAC;;AA/PM,oCAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;0BAoImB,SAAS,CAAC,WAAW,CAAC;;;KAG3C;CACF,AAzIY,CAyIZ;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;sEAAyB;AACzB;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;iEAA0B;AACzB;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;6DAAmB;AACjB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uEAA0B;AACzB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6DAAgB;AAhJhC,6BAA6B;IADzC,aAAa,CAAC,kCAAkC,CAAC;GACrC,6BAA6B,CAiQzC","sourcesContent":["import '@things-factory/image-uploader-ui/client/image-upload-previewer'\nimport './restful-file-selector'\n\nimport { LitElement, html, css, unsafeCSS } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { FileDropHelper } from '@operato/utils'\n\nconst btnAddBoard = require('../../../icons/board/btn-add-board.svg')\n\n@customElement('restful-attachment-creation-card')\nexport class RestfulAttachmentCreationCard extends localize(i18next)(LitElement) {\n static styles = [\n css`\n :host {\n position: relative;\n\n padding: 0;\n margin: 0;\n height: 100%;\n\n -webkit-transform-style: preserve-3d;\n transform-style: preserve-3d;\n -webkit-transition: all 0.5s ease-in-out;\n transition: all 0.5s ease-in-out;\n box-shadow: var(--box-shadow);\n }\n\n :host(.flipped) {\n -webkit-transform: var(--card-list-flip-transform);\n transform: var(--card-list-flip-transform);\n }\n\n [front],\n [back] {\n position: absolute;\n\n width: 100%;\n height: 100%;\n margin: 0;\n padding: 0;\n\n border: var(--card-list-create-border);\n border-radius: var(--card-list-create-border-radius);\n\n background-color: #fff;\n\n -webkit-backface-visibility: hidden;\n backface-visibility: hidden;\n }\n\n [front] {\n text-align: center;\n font-size: 0.8em;\n color: var(--card-list-create-color);\n text-transform: capitalize;\n }\n\n :host(.candrop) [front],\n :host(.candrop) [back] {\n border-width: 2px;\n background-color: #fffde9;\n }\n\n [front] mwc-icon {\n margin-top: 55px;\n display: block;\n font-size: 3.5em;\n color: var(--card-list-create-icon-color);\n }\n\n [back] {\n -webkit-transform: var(--card-list-flip-transform);\n transform: var(--card-list-flip-transform);\n }\n\n [back] form {\n padding: var(--card-list-create-form-padding);\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n display: grid;\n grid-template-columns: repeat(10, 1fr);\n grid-template-rows: min-content min-content 1fr min-content;\n grid-row-gap: 7px;\n justify-content: center;\n align-items: center;\n }\n\n [back] form label {\n grid-column: span 4;\n font: var(--card-list-create-label-font);\n color: var(--card-list-create-label-color);\n }\n\n [back] form input,\n [back] form select {\n grid-column: span 6;\n background-color: #fff;\n border: var(--card-list-create-input-border);\n border-radius: var(--card-list-create-input-border-radius);\n padding: var(--card-list-create-input-padding);\n font: var(--card-list-create-input-font);\n color: var(--card-list-create-input-color);\n }\n\n restful-file-selector {\n grid-column: span 6;\n font: var(--card-list-create-input-font);\n border: none;\n box-sizing: border-box;\n padding: 0;\n }\n\n #thumbnail-area {\n grid-column: span 10;\n align-self: stretch;\n text-align: center;\n overflow: hidden;\n overflow-x: auto;\n white-space: nowrap;\n }\n\n image-upload-previewer {\n display: inline-block;\n height: 100%;\n }\n\n [back] input[type='submit'] {\n background-color: var(--button-background-color) !important;\n margin: var(--button-margin);\n font: var(--button-font);\n color: var(--button-color) !important;\n border-radius: var(--button-radius);\n border: var(--button-border);\n grid-column: span 10;\n grid-row: auto / -1;\n margin: 0;\n }\n\n .btn-add-board {\n width: 3.8em;\n height: 3.8em;\n margin: auto;\n margin-top: 20%;\n background: url(${unsafeCSS(btnAddBoard)}) no-repeat;\n display: block;\n }\n `\n ]\n\n @property({ type: String }) defaultCategory?: string\n @property({ type: Array }) categories: string[] = []\n @property({ type: Array }) _files: any[] = []\n @property({ type: String }) _currentCategory?: string\n @property({ type: String }) fileId?: string\n\n render() {\n var categories = this.categories || []\n\n return html`\n <div @click=${(e: Event) => this.onClickFlip(e)} front>\n <i class=\"btn-add-board\"></i>\n ${i18next.t('text.create attachment')}\n </div>\n\n <div @click=${(e: Event) => this.onClickFlip(e)} back>\n <form @submit=${(e: Event) => this.onClickSubmit(e)}>\n <label>${i18next.t('label.category')}</label>\n <select\n .value=${String(this.defaultCategory)}\n name=\"category\"\n @change=${(e: Event) => {\n this._currentCategory = (e.currentTarget as HTMLSelectElement).value\n }}\n >\n <option value=\"\">--${i18next.t('text.please choose a category')}--</option>\n ${categories.map(\n category => html`\n <option value=${category} ?selected=${this.defaultCategory == category}>${category}</option>\n `\n )}\n </select>\n\n <label>${i18next.t('label.file')}</label>\n <restful-file-selector\n name=\"file\"\n label=${String(i18next.t('label.select file'))}\n accept=\"${this._currentCategory || '*'}/*\"\n multiple\n @file-change=${(e: Event) => {\n this.fileId = (e as CustomEvent).detail.fileId\n this._files = Array.from((e as CustomEvent).detail.files)\n }}\n ></restful-file-selector>\n\n <div id=\"thumbnail-area\">\n ${this._files.map(file => html` <image-upload-previewer .file=${file}></image-upload-previewer> `)}\n </div>\n\n <input type=\"submit\" value=${String(i18next.t('button.create'))} />\n </form>\n </div>\n `\n }\n\n firstUpdated() {\n FileDropHelper.set(this)\n }\n\n onClickFlip(e: Event) {\n const currentTarget = e.currentTarget as HTMLElement\n const target = e.target as HTMLElement\n\n if (\n currentTarget.hasAttribute('front') ||\n (currentTarget.hasAttribute('back') && target.tagName != 'INPUT' && target.tagName != 'SELECT')\n ) {\n this.classList.toggle('flipped')\n }\n\n e.stopPropagation()\n }\n\n onClickSubmit(e: Event) {\n e.preventDefault()\n e.stopPropagation()\n\n var form = e.target as HTMLFormElement\n\n var category = ((form.elements as any)['category'] as HTMLSelectElement).value\n var files = this._files\n var fileId = this.fileId\n\n const extension = fileId?.substring(fileId.length - 3)\n if (!extension || extension !== extension?.toLowerCase()) {\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n level: 'error',\n message: 'Error : File extension is not available.',\n ex: 'Error : File extension is not available.'\n }\n })\n )\n return\n }\n\n this.dispatchEvent(\n new CustomEvent('create-attachment', {\n detail: {\n category,\n files,\n fileId\n }\n })\n )\n }\n\n reset() {\n var form = this.renderRoot.querySelector('form')\n if (form) {\n form.reset()\n this._files = []\n }\n\n this.classList.remove('flipped')\n }\n}\n"]}
1
+ {"version":3,"file":"restful-attachment-creation-card.js","sourceRoot":"","sources":["../../../src/component/restful-attachment-creation-card.ts"],"names":[],"mappings":"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","sourcesContent":["import '@things-factory/image-uploader-ui/client/image-upload-previewer'\nimport './restful-file-selector'\n\nimport { LitElement, html, css, unsafeCSS } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { FileDropHelper } from '@operato/utils'\n\nconst btnAddBoard = require('../../../icons/board/btn-add-board.svg')\n\n@customElement('restful-attachment-creation-card')\nexport class RestfulAttachmentCreationCard extends localize(i18next)(LitElement) {\n static styles = [\n css`\n :host {\n position: relative;\n\n padding: 0;\n margin: 0;\n height: 100%;\n\n -webkit-transform-style: preserve-3d;\n transform-style: preserve-3d;\n -webkit-transition: all 0.5s ease-in-out;\n transition: all 0.5s ease-in-out;\n box-shadow: var(--box-shadow);\n }\n\n :host(.flipped) {\n -webkit-transform: var(--card-list-flip-transform);\n transform: var(--card-list-flip-transform);\n }\n\n [front],\n [back] {\n position: absolute;\n\n width: 100%;\n height: 100%;\n margin: 0;\n padding: 0;\n\n border: var(--card-list-create-border);\n border-radius: var(--card-list-create-border-radius);\n\n background-color: #fff;\n\n -webkit-backface-visibility: hidden;\n backface-visibility: hidden;\n }\n\n [front] {\n text-align: center;\n font-size: 0.8em;\n color: var(--card-list-create-color);\n text-transform: capitalize;\n }\n\n :host(.candrop) [front],\n :host(.candrop) [back] {\n border-width: 2px;\n background-color: #fffde9;\n }\n\n [front] md-icon {\n margin-top: 55px;\n display: block;\n font-size: 3.5em;\n color: var(--card-list-create-icon-color);\n }\n\n [back] {\n -webkit-transform: var(--card-list-flip-transform);\n transform: var(--card-list-flip-transform);\n }\n\n [back] form {\n padding: var(--card-list-create-form-padding);\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n display: grid;\n grid-template-columns: repeat(10, 1fr);\n grid-template-rows: min-content min-content 1fr min-content;\n grid-row-gap: 7px;\n justify-content: center;\n align-items: center;\n }\n\n [back] form label {\n grid-column: span 4;\n font: var(--card-list-create-label-font);\n color: var(--card-list-create-label-color);\n }\n\n [back] form input,\n [back] form select {\n grid-column: span 6;\n background-color: #fff;\n border: var(--card-list-create-input-border);\n border-radius: var(--card-list-create-input-border-radius);\n padding: var(--card-list-create-input-padding);\n font: var(--card-list-create-input-font);\n color: var(--card-list-create-input-color);\n }\n\n restful-file-selector {\n grid-column: span 6;\n font: var(--card-list-create-input-font);\n border: none;\n box-sizing: border-box;\n padding: 0;\n }\n\n #thumbnail-area {\n grid-column: span 10;\n align-self: stretch;\n text-align: center;\n overflow: hidden;\n overflow-x: auto;\n white-space: nowrap;\n }\n\n image-upload-previewer {\n display: inline-block;\n height: 100%;\n }\n\n [back] input[type='submit'] {\n background-color: var(--button-background-color) !important;\n margin: var(--button-margin);\n font: var(--button-font);\n color: var(--button-color) !important;\n border-radius: var(--button-radius);\n border: var(--button-border);\n grid-column: span 10;\n grid-row: auto / -1;\n margin: 0;\n }\n\n .btn-add-board {\n width: 3.8em;\n height: 3.8em;\n margin: auto;\n margin-top: 20%;\n background: url(${unsafeCSS(btnAddBoard)}) no-repeat;\n display: block;\n }\n `\n ]\n\n @property({ type: String }) defaultCategory?: string\n @property({ type: Array }) categories: string[] = []\n @property({ type: Array }) _files: any[] = []\n @property({ type: String }) _currentCategory?: string\n @property({ type: String }) fileId?: string\n\n render() {\n var categories = this.categories || []\n\n return html`\n <div @click=${(e: Event) => this.onClickFlip(e)} front>\n <i class=\"btn-add-board\"></i>\n ${i18next.t('text.create attachment')}\n </div>\n\n <div @click=${(e: Event) => this.onClickFlip(e)} back>\n <form @submit=${(e: Event) => this.onClickSubmit(e)}>\n <label>${i18next.t('label.category')}</label>\n <select\n .value=${String(this.defaultCategory)}\n name=\"category\"\n @change=${(e: Event) => {\n this._currentCategory = (e.currentTarget as HTMLSelectElement).value\n }}\n >\n <option value=\"\">--${i18next.t('text.please choose a category')}--</option>\n ${categories.map(\n category => html`\n <option value=${category} ?selected=${this.defaultCategory == category}>${category}</option>\n `\n )}\n </select>\n\n <label>${i18next.t('label.file')}</label>\n <restful-file-selector\n name=\"file\"\n label=${String(i18next.t('label.select file'))}\n accept=\"${this._currentCategory || '*'}/*\"\n multiple\n @file-change=${(e: Event) => {\n this.fileId = (e as CustomEvent).detail.fileId\n this._files = Array.from((e as CustomEvent).detail.files)\n }}\n ></restful-file-selector>\n\n <div id=\"thumbnail-area\">\n ${this._files.map(file => html` <image-upload-previewer .file=${file}></image-upload-previewer> `)}\n </div>\n\n <input type=\"submit\" value=${String(i18next.t('button.create'))} />\n </form>\n </div>\n `\n }\n\n firstUpdated() {\n FileDropHelper.set(this)\n }\n\n onClickFlip(e: Event) {\n const currentTarget = e.currentTarget as HTMLElement\n const target = e.target as HTMLElement\n\n if (\n currentTarget.hasAttribute('front') ||\n (currentTarget.hasAttribute('back') && target.tagName != 'INPUT' && target.tagName != 'SELECT')\n ) {\n this.classList.toggle('flipped')\n }\n\n e.stopPropagation()\n }\n\n onClickSubmit(e: Event) {\n e.preventDefault()\n e.stopPropagation()\n\n var form = e.target as HTMLFormElement\n\n var category = ((form.elements as any)['category'] as HTMLSelectElement).value\n var files = this._files\n var fileId = this.fileId\n\n const extension = fileId?.substring(fileId.length - 3)\n if (!extension || extension !== extension?.toLowerCase()) {\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n level: 'error',\n message: 'Error : File extension is not available.',\n ex: 'Error : File extension is not available.'\n }\n })\n )\n return\n }\n\n this.dispatchEvent(\n new CustomEvent('create-attachment', {\n detail: {\n category,\n files,\n fileId\n }\n })\n )\n }\n\n reset() {\n var form = this.renderRoot.querySelector('form')\n if (form) {\n form.reset()\n this._files = []\n }\n\n this.classList.remove('flipped')\n }\n}\n"]}
@@ -3,7 +3,7 @@ import './restful-attachment-creation-card.js';
3
3
  import { css, html, LitElement, unsafeCSS } from 'lit';
4
4
  import { customElement, property, query } from 'lit/decorators.js';
5
5
  import { i18next, localize } from '@operato/i18n';
6
- import { ScrollbarStyles, TooltipStyles } from '@operato/styles';
6
+ import { ScrollbarStyles } from '@operato/styles';
7
7
  import { sleep } from '@operato/utils';
8
8
  import { fetchAttachmentList, getRestServiceFullPath, createAttachment, deleteAttachment, deleteFile } from '@fmsim/api/restful.js';
9
9
  const btnOpenDropboxColor = require('../../../icons/group-bar/btn-open-dropbox-color.png');
@@ -265,7 +265,6 @@ let RestfulAttachmentSelector = class RestfulAttachmentSelector extends localize
265
265
  };
266
266
  RestfulAttachmentSelector.styles = [
267
267
  ScrollbarStyles,
268
- TooltipStyles,
269
268
  css `
270
269
  :host {
271
270
  display: flex;
@@ -336,7 +335,7 @@ RestfulAttachmentSelector.styles = [
336
335
  max-width: 100%;
337
336
  }
338
337
 
339
- mwc-icon {
338
+ md-icon {
340
339
  position: absolute;
341
340
  right: 0px;
342
341
  text-align: center;
@@ -348,8 +347,8 @@ RestfulAttachmentSelector.styles = [
348
347
  color: var(--attachment-selector-icon-color);
349
348
  }
350
349
 
351
- mwc-icon:hover,
352
- mwc-icon:active,
350
+ md-icon:hover,
351
+ md-icon:active,
353
352
  span:hover,
354
353
  span:active {
355
354
  background-color: var(--primary-color);
@@ -381,8 +380,8 @@ RestfulAttachmentSelector.styles = [
381
380
  float: right;
382
381
  }
383
382
 
384
- [etc] mwc-icon:hover,
385
- [etc] mwc-icon:active {
383
+ [etc] md-icon:hover,
384
+ [etc] md-icon:active {
386
385
  background-color: initial;
387
386
  color: initial;
388
387
  }
@@ -393,7 +392,7 @@ RestfulAttachmentSelector.styles = [
393
392
  position: relative;
394
393
  }
395
394
 
396
- [etc] mwc-icon {
395
+ [etc] md-icon {
397
396
  position: initial;
398
397
  opacity: 0.2;
399
398
  width: initial;
@@ -459,7 +458,7 @@ RestfulAttachmentSelector.styles = [
459
458
  background-color: #f8c2cc;
460
459
  }
461
460
 
462
- mwc-icon {
461
+ md-icon {
463
462
  vertical-align: middle;
464
463
  }
465
464
 
@@ -1 +1 @@
1
- {"version":3,"file":"restful-attachment-selector.js","sourceRoot":"","sources":["../../../src/component/restful-attachment-selector.ts"],"names":[],"mappings":";AAAA,OAAO,uCAAuC,CAAA;AAE9C,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAkB,SAAS,EAAE,MAAM,KAAK,CAAA;AACtE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAS,MAAM,mBAAmB,CAAA;AAEzE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACjD,OAAO,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAChE,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAA;AAEtC,OAAO,EACL,mBAAmB,EACnB,sBAAsB,EACtB,gBAAgB,EAChB,gBAAgB,EAChB,UAAU,EACX,MAAM,uBAAuB,CAAA;AAI9B,MAAM,mBAAmB,GAAG,OAAO,CAAC,qDAAqD,CAAC,CAAA;AAC1F,MAAM,eAAe,GAAG,OAAO,CAAC,gDAAgD,CAAC,CAAA;AACjF,MAAM,UAAU,GAAG,OAAO,CAAC,2CAA2C,CAAC,CAAA;AACvE,MAAM,OAAO,GAAG,OAAO,CAAC,wCAAwC,CAAC,CAAA;AACjE,MAAM,YAAY,GAAG,OAAO,CAAC,8CAA8C,CAAC,CAAA;AAC5E,MAAM,WAAW,GAAG,OAAO,CAAC,6CAA6C,CAAC,CAAA;AAC1E,MAAM,gBAAgB,GAAG,OAAO,CAAC,mDAAmD,CAAC,CAAA;AACrF,MAAM,SAAS,GAAG,OAAO,CAAC,0CAA0C,CAAC,CAAA;AACrE,MAAM,cAAc,GAAG,OAAO,CAAC,gDAAgD,CAAC,CAAA;AAChF,MAAM,WAAW,GAAG,OAAO,CAAC,4CAA4C,CAAC,CAAA;AACzE,MAAM,gBAAgB,GAAG,OAAO,CAAC,kDAAkD,CAAC,CAAA;AACpF,MAAM,IAAI,GAAG,OAAO,CAAC,oCAAoC,CAAC,CAAA;AAGnD,IAAM,yBAAyB,GAA/B,MAAM,yBAA0B,SAAQ,QAAQ,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;IAArE;;QAmWsB,eAAU,GAAa,CAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,CAAC,CAAA;QACzE,gBAAW,GAAU,EAAE,CAAA;QAEtB,UAAK,GAAW,CAAC,CAAA;QACjB,WAAM,GAAW,CAAC,CAAA;QAGlB,mBAAc,GAAW,kBAAkB,CAAA;QAC3C,aAAQ,GAAY,YAAY,CAAC,OAAO,CAAC,YAAY,CAAC,IAAI,EAAE,CAAA;IA2Q1F,CAAC;IAtQC,MAAM;QACJ,OAAO,IAAI,CAAA;;+CAEgC,IAAI,CAAC,eAAe;YACvD,IAAI,CAAC,QAAQ;YACb,CAAC,CAAC,IAAI,CAAA,UAAU,IAAI,CAAC,QAAQ,UAAU;YACvC,CAAC,CAAC,IAAI,CAAA,UAAU,OAAO,CAAC,CAAC,CAAC,+BAA+B,CAAC,UAAU;2BACrD,IAAI,CAAC,cAAc;sBACxB,cAAc,IAAI,CAAC,eAAe,EAAE;;;uBAGnC,CAAC,CAAQ,EAAE,EAAE;YACpB,IAAI,CAAC,QAAQ,GAAG,EAAE,CAAA;YAClB,IAAI,CAAC,aAAa,EAAE,CAAA;QACtB,CAAC;;mBAEI,OAAO,CAAC,CAAC,CAAC,+BAA+B,CAAC;;cAE/C,IAAI,CAAC,UAAU,CAAC,GAAG,CACnB,QAAQ,CAAC,EAAE,CACT,IAAI,CAAA;0BACM,QAAQ;2BACP,CAAC,CAAQ,EAAE,EAAE;YACpB,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAA;YACxB,IAAI,CAAC,aAAa,EAAE,CAAA;QACtB,CAAC;;uBAEI,QAAQ;sBACT,CACT;;;;;;UAMH,IAAI,CAAC,SAAS;YACd,CAAC,CAAC,IAAI,CAAA;;;8BAGc,IAAI,CAAC,UAAU;mCACV,IAAI,CAAC,QAAQ;qCACX,CAAC,CAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC;6BAChD,CAAC,CAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAC,CAAC;;aAEzD;YACH,CAAC,CAAC,IAAI,CAAA,EAAE;UACR,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE;;YAClC,IAAI,GAAG,GAAG,sBAAsB,EAAE,GAAG,UAAU,CAAC,QAAQ,CAAA;YACxD,OAAO,IAAI,CAAA;uCACkB,CAAC,CAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,UAAU,CAAC;;kBAEjE,UAAU,CAAC,QAAQ,IAAI,OAAO;gBAC9B,CAAC,CAAC,IAAI,CAAA,aAAa,GAAG,MAAM;gBAC5B,CAAC,CAAC,UAAU,CAAC,QAAQ,IAAI,OAAO;oBAC9B,CAAC,CAAC,IAAI,CAAA,eAAe,GAAG,qBAAqB;oBAC7C,CAAC,CAAC,IAAI,CAAA;;;kCAGQ,MAAA,UAAU,CAAC,IAAI,0CAAE,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC;;uBAEpE;;wCAEiB,GAAG;;;kCAGT,UAAU,CAAC,IAAI;6BACpB,CAAC,CAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC,UAAU,CAAC,EAAE,CAAC;;;wBAGzD,sBAAsB,EAAE,GAAG,UAAU,CAAC,QAAQ,aAAa,UAAU,CAAC,IAAI;;;;WAIvF,CAAA;QACH,CAAC,CAAC;;KAEL,CAAA;IACH,CAAC;IAED,eAAe;QACb,IAAI,IAAI,CAAC,eAAe,KAAK,IAAI,EAAE,CAAC;YAClC,IAAI,CAAC,eAAe,GAAG,IAAI,CAAA;YAC3B,IAAI,CAAC,cAAc,GAAG,mBAAmB,CAAA;QAC3C,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,eAAe,GAAG,IAAI,CAAA;YAC3B,IAAI,CAAC,cAAc,GAAG,kBAAkB,CAAA;QAC1C,CAAC;IACH,CAAC;IAED,KAAK,CAAC,YAAY;QAChB,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAAC,OAAO,EAAE,KAAK,EAAC,CAAC,EAAC,EAAE;YAClD,IAAI,MAAM,GAAG,CAAC,CAAC,MAAqB,CAAA;YACpC,IAAI,GAAG,GAAG,MAAM,CAAC,YAAY,CAAC,oBAAoB,CAAC,CAAA;YACnD,IAAI,GAAG,EAAE,CAAC;gBACR,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,IAAI,EAAE,GAAG,QAAQ,CAAA;gBAC3C,MAAM,IAAI,CAAC,IAAI,CAAC,GAAG,QAAQ,KAAK,QAAQ,IAAI,IAAI,GAAG,GAAG,EAAE,CAAC,CAAA;gBAEzD,MAAM,CAAC,YAAY,CAAC,cAAc,EAAE,aAAa,CAAC,CAAA;gBAClD,MAAM,KAAK,CAAC,IAAI,CAAC,CAAA;gBACjB,MAAM,CAAC,eAAe,CAAC,cAAc,CAAC,CAAA;YACxC,CAAC;QACH,CAAC,CAAC,CAAA;QAEF,IAAI,CAAC,kBAAkB,EAAE,CAAA;IAC3B,CAAC;IAED,OAAO,CAAC,OAA6B;QACnC,IAAI,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE,CAAC;YAC5B,IAAI,CAAC,kBAAkB,EAAE,CAAA;QAC3B,CAAC;IACH,CAAC;IAED,aAAa,CAAC,UAAe;QAC3B,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,qBAAqB,EAAE;YACrC,QAAQ,EAAE,IAAI;YACd,OAAO,EAAE,IAAI;YACb,MAAM,EAAE;gBACN,UAAU;aACX;SACF,CAAC,CACH,CAAA;IACH,CAAC;IAED,KAAK,CAAC,mBAAmB,CAAC,CAAQ;QAChC,IAAI,KAAK,GAAI,CAAiB,CAAC,MAAM,CAAA;QAErC,MAAM,IAAI,CAAC,iBAAiB,CAAC,EAAE,EAAE,KAAK,CAAC,CAAA;QACvC,IAAI,CAAC,kBAAkB,EAAE,CAAA;IAC3B,CAAC;IAED,KAAK,CAAC,kBAAkB,CAAC,CAAQ;QAC/B,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,EAAE,GAAI,CAAiB,CAAC,MAAM,CAAA;QAE3D,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACzB,MAAM,IAAI,CAAC,iBAAiB,CAAC,QAAQ,EAAE,KAAK,EAAE,MAAM,CAAC,CAAA;QACrD,IAAI,CAAC,kBAAkB,EAAE,CAAA;IAC3B,CAAC;IAED,KAAK,CAAC,kBAAkB,CAAC,EAAU;QACjC,MAAM,IAAI,CAAC,gBAAgB,CAAC,EAAE,CAAC,CAAA;QAE/B,IAAI,CAAC,kBAAkB,EAAE,CAAA;IAC3B,CAAC;IAED,KAAK,CAAC,kBAAkB;QACtB,IAAI,WAAW,GAAG,MAAM,IAAI,CAAC,cAAc,EAAE,CAAA;QAC7C,IAAI,CAAC,WAAW,GAAG,CAAC,GAAG,WAAW,CAAC,CAAA;QAEnC,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;YACtB,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,CAAA;QAC3B,CAAC;IACH,CAAC;IAED,KAAK,CAAC,iBAAiB;QACrB,IAAI,WAAW,GAAG,MAAM,IAAI,CAAC,cAAc,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,GAAG,CAAC,EAAE,CAAC,CAAA;QACrE,IAAI,CAAC,WAAW,GAAG,CAAC,GAAG,IAAI,CAAC,WAAW,EAAE,GAAG,WAAW,CAAC,CAAA;IAC1D,CAAC;IAED,KAAK,CAAC,cAAc,CAAC,EAAE,IAAI,GAAG,CAAC,EAAE,KAAK,GAAG,IAAI,EAAE,GAAG,EAAE;;QAClD,IAAI,OAAO,GAAG,EAAW,CAAA;QACzB,IAAI,QAAQ,GAAG,EAAW,CAAA;QAC1B,IAAI,UAAU,GAAG;YACf,KAAK;YACL,IAAI;SACL,CAAA;QAED,IAAI,IAAI,CAAC,QAAQ;YACf,OAAO,CAAC,IAAI,CAAC;gBACX,IAAI,EAAE,UAAU;gBAChB,QAAQ,EAAE,IAAI;gBACd,KAAK,EAAE,IAAI,CAAC,QAAQ;aACrB,CAAC,CAAA;QAEJ,IAAI,MAAM,GAAG;YACX,OAAO;YACP,QAAQ;YACR,UAAU;SACX,CAAA;QAED,IAAI,QAAQ,GAAG,MAAA,CAAC,MAAM,mBAAmB,CAAC,MAAM,CAAC,CAAC,0CAAE,IAAI,CAAA;QACxD,IAAI,CAAC,QAAQ,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC;YAClC,MAAM,IAAI,KAAK,CAAC,6BAA6B,CAAC,CAAA;QAChD,CAAC;QAED,IAAI,sBAAsB,GAAG,QAAQ,CAAC,WAAW,CAAA;QAEjD,IAAI,CAAC,sBAAsB,IAAI,CAAC,sBAAsB,CAAC,KAAK,CAAC,MAAM;YAAE,OAAO,EAAE,CAAA;QAC9E,sBAAsB,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,UAAe,EAAE,EAAE;YACvD,UAAU,CAAC,QAAQ,GAAG,UAAU,GAAG,UAAU,CAAC,IAAI,CAAA;YAClD,UAAU,CAAC,QAAQ,GAAG,gBAAgB,GAAG,UAAU,CAAC,IAAI,GAAG,GAAG,GAAG,kBAAkB,CAAC,UAAU,CAAC,IAAI,CAAC,CAAA;QACtG,CAAC,CAAC,CAAA;QACF,IAAI,CAAC,MAAM,GAAG,sBAAsB,CAAC,KAAK,CAAA;QAC1C,IAAI,CAAC,KAAK,GAAG,IAAI,CAAA;QAEjB,OAAO,sBAAsB,CAAC,KAAK,CAAA;IACrC,CAAC;IAED,KAAK,CAAC,iBAAiB,CAAC,QAAgB,EAAE,KAAY,EAAE,MAAe;;QACrE,IAAI,CAAC;YACH,KAAK,CAAC,CAAC,CAAC,CAAC,QAAQ,GAAG,QAAQ,CAAA;YAC5B,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,GAAG,MAAM,CAAA;YACxB,MAAM,IAAI,GAAG;gBACX,QAAQ,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,QAAQ;gBAC3B,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI;gBACnB,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI;gBACnB,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI;gBACnB,MAAM,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM;gBACvB,QAAQ,EAAE,IAAI,CAAC,QAAQ;aACxB,CAAA;YACD,IAAI,MAAM,GAAG,MAAA,CAAC,MAAM,gBAAgB,CAAC,IAAI,CAAC,CAAC,0CAAE,IAAI,CAAA;YACjD,IAAI,CAAC,MAAM,IAAI,CAAC,MAAM,CAAC,MAAM;gBAAE,MAAM,IAAI,KAAK,CAAC,cAAc,CAAC,CAAA;QAChE,CAAC;QAAC,OAAO,EAAE,EAAE,CAAC;YACZ,QAAQ,CAAC,aAAa,CACpB,IAAI,WAAW,CAAC,QAAQ,EAAE;gBACxB,MAAM,EAAE;oBACN,KAAK,EAAE,OAAO;oBACd,OAAO,EAAE,EAAE;oBACX,EAAE,EAAE,EAAE;iBACP;aACF,CAAC,CACH,CAAA;QACH,CAAC;IACH,CAAC;IAED,KAAK,CAAC,gBAAgB,CAAC,EAAU;;QAC/B,IAAI,MAAM,GAAG,SAAS,CAAA;QACtB,IAAI,CAAC;YACH,MAAM,MAAM,GAAG,MAAA,CAAC,MAAM,gBAAgB,CAAC,EAAE,CAAC,CAAC,0CAAE,IAAI,CAAA;YACjD,IAAI,CAAC,MAAM,IAAI,CAAC,MAAM,CAAC,MAAM;gBAAE,MAAM,IAAI,KAAK,CAAC,UAAU,CAAC,CAAA;YAE1D,MAAM,gBAAgB,GAAG,MAAA,CAAC,MAAM,UAAU,CAAC,MAAM,CAAC,UAAU,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC,0CAAE,IAAI,CAAA;YACpF,IAAI,CAAC,gBAAgB,IAAI,CAAC,gBAAgB,CAAC,MAAM,EAAE,CAAC;gBAClD,MAAM,IAAI,KAAK,CAAC,kCAAkC,CAAC,CAAA;YACrD,CAAC;QACH,CAAC;QAAC,OAAO,EAAE,EAAE,CAAC;YACZ,QAAQ,CAAC,aAAa,CACpB,IAAI,WAAW,CAAC,QAAQ,EAAE;gBACxB,MAAM,EAAE;oBACN,KAAK,EAAE,OAAO;oBACd,OAAO,EAAE,MAAM,GAAG,+BAA+B,GAAG,EAAE;oBACtD,EAAE,EAAE,EAAE;iBACP;aACF,CAAC,CACH,CAAA;QACH,CAAC;IACH,CAAC;IAED,KAAK,CAAC,IAAI,CAAC,MAAW;QACpB,IAAI,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAA;QACjD,QAAQ,CAAC,KAAK,CAAC,QAAQ,GAAG,UAAU,CAAA;QACpC,QAAQ,CAAC,KAAK,CAAC,OAAO,GAAG,GAAG,CAAA;QAC5B,QAAQ,CAAC,KAAK,GAAG,MAAM,CAAA;QACvB,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAA;QAEnC,MAAM,KAAK,CAAC,GAAG,CAAC,CAAA;QAEhB,QAAQ,CAAC,MAAM,EAAE,CAAA;QAEjB,QAAQ,CAAC,WAAW,CAAC,MAAM,CAAC,CAAA;QAC5B,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAA;IACrC,CAAC;;AApnBM,gCAAM,GAAG;IACd,eAAe;IACf,aAAa;IACb,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;0BAwPmB,SAAS,CAAC,mBAAmB,CAAC;;;;;;;0BAO9B,SAAS,CAAC,eAAe,CAAC;;;;;;;;;;;;;0BAa1B,SAAS,CAAC,UAAU,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;0BAkCrB,SAAS,CAAC,OAAO,CAAC;;;;0BAIlB,SAAS,CAAC,YAAY,CAAC;;;;;;;0BAOvB,SAAS,CAAC,WAAW,CAAC;;;;0BAItB,SAAS,CAAC,gBAAgB,CAAC;;;;;;;0BAO3B,SAAS,CAAC,SAAS,CAAC;;;;0BAIpB,SAAS,CAAC,cAAc,CAAC;;;;;;;0BAOzB,SAAS,CAAC,WAAW,CAAC;;;;0BAItB,SAAS,CAAC,gBAAgB,CAAC;;;;;;0BAM3B,SAAS,CAAC,IAAI,CAAC;;;KAGpC;CACF,AAhWY,CAgWZ;AAE0B;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;6DAA0E;AACzE;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;8DAAwB;AACtB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2DAAkB;AACjB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wDAAkB;AACjB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;yDAAmB;AACjB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;4DAAoB;AACpB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kEAAgC;AAC/B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;iEAA4C;AAC3C;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2DAA6D;AAExE;IAAf,KAAK,CAAC,OAAO,CAAC;uDAAsB;AACF;IAAlC,KAAK,CAAC,0BAA0B,CAAC;+DAA6C;AA9WpE,yBAAyB;IADrC,aAAa,CAAC,6BAA6B,CAAC;GAChC,yBAAyB,CAsnBrC","sourcesContent":["import './restful-attachment-creation-card.js'\n\nimport { css, html, LitElement, PropertyValues, unsafeCSS } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { ScrollbarStyles, TooltipStyles } from '@operato/styles'\nimport { sleep } from '@operato/utils'\n\nimport {\n fetchAttachmentList,\n getRestServiceFullPath,\n createAttachment,\n deleteAttachment,\n deleteFile\n} from '@fmsim/api/restful.js'\n\nimport { RestfulAttachmentCreationCard } from './restful-attachment-creation-card.js'\n\nconst btnOpenDropboxColor = require('../../../icons/group-bar/btn-open-dropbox-color.png')\nconst btnCloseDropbox = require('../../../icons/group-bar/btn-close-dropbox.png')\nconst btnAddList = require('../../../icons/group-bar/btn-add-list.png')\nconst btnZoom = require('../../../icons/attachment/btn-zoom.svg')\nconst btnZoomHover = require('../../../icons/attachment/btn-zoom-hover.svg')\nconst btnCopyLink = require('../../../icons/attachment/btn-copy-link.svg')\nconst btnCopyLinkHover = require('../../../icons/attachment/btn-copy-link-hover.svg')\nconst btnDelete = require('../../../icons/attachment/btn-delete.svg')\nconst btnDeleteHover = require('../../../icons/attachment/btn-delete-hover.svg')\nconst btnDownload = require('../../../icons/attachment/btn-download.svg')\nconst btnDownloadHover = require('../../../icons/attachment/btn-download-hover.svg')\nconst file = require('../../../icons/attachment/file.svg')\n\n@customElement('restful-attachment-selector')\nexport class RestfulAttachmentSelector extends localize(i18next)(LitElement) {\n static styles = [\n ScrollbarStyles,\n TooltipStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n overflow: hidden;\n background-color: #fff;\n /* --card-list-create-color: var(--primary-color); */\n\n position: relative;\n }\n\n :host(.candrop) {\n background: orange;\n cursor: pointer;\n }\n\n #main {\n overflow: auto;\n padding: var(--popup-content-padding);\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));\n grid-auto-rows: var(--card-list-rows-height);\n grid-gap: 20px;\n padding-top: 10px !important;\n }\n\n #main .card {\n display: flex;\n flex-direction: column;\n align-items: center;\n overflow: hidden;\n border-radius: var(--card-list-border-radius);\n border: var(--attachment-selector-border);\n background-color: var(--attachment-selector-background-color);\n\n position: relative;\n }\n\n #main .card.create {\n overflow: visible;\n background-color: initial;\n min-height: 120px;\n }\n\n #main .card:hover {\n cursor: pointer;\n }\n\n .name {\n background-color: var(--primary-color);\n opacity: 0.8;\n position: absolute;\n bottom: 0px;\n width: 100%;\n padding: 2px 5px;\n font: var(--attachment-selector-name-font);\n color: #fff;\n text-indent: 7px;\n }\n\n [show] {\n height: 100%;\n }\n\n .card img,\n .card video {\n max-height: 100%;\n max-width: 100%;\n }\n\n mwc-icon {\n position: absolute;\n right: 0px;\n text-align: center;\n\n background-color: var(--attachment-selector-icon-background-color);\n width: var(--attachment-selector-icon-size);\n height: var(--attachment-selector-icon-size);\n font: var(--attachment-selector-icon-font);\n color: var(--attachment-selector-icon-color);\n }\n\n mwc-icon:hover,\n mwc-icon:active,\n span:hover,\n span:active {\n background-color: var(--primary-color);\n color: #fff;\n }\n\n [open-in-new] {\n top: 0px;\n }\n\n [delete] {\n top: 35px;\n }\n\n [download] {\n top: 70px;\n border-bottom-left-radius: 12px;\n }\n\n #filter {\n padding: 12px 12px 12px 20px;\n background-color: var(--group-bar-background-color);\n height: 28px;\n z-index: 1;\n }\n\n select {\n text-transform: capitalize;\n float: right;\n }\n\n [etc] mwc-icon:hover,\n [etc] mwc-icon:active {\n background-color: initial;\n color: initial;\n }\n\n [etc] {\n margin: auto;\n margin-top: 45px;\n position: relative;\n }\n\n [etc] mwc-icon {\n position: initial;\n opacity: 0.2;\n width: initial;\n height: initial;\n\n font: var(--attachment-selector-etc-icon-font);\n color: var(--attachment-selector-etc-icon-color);\n }\n\n [etc] span {\n position: absolute;\n bottom: 25px;\n right: 8px;\n padding: 1px 2px;\n color: #fff;\n text-transform: uppercase;\n opacity: 0.8;\n\n background-color: var(--attachment-selector-etc-background-color);\n font: var(--attachment-selector-etc-font);\n }\n\n ul {\n display: flex;\n list-style: none;\n margin: 0;\n padding: 0;\n white-space: nowrap;\n clear: both;\n }\n\n li {\n padding: 0px 3px;\n }\n\n li:hover {\n background-color: rgba(255, 180, 180, 1);\n }\n\n li a {\n width: calc(100% - 24px);\n padding: 5px 4px 1px 4px;\n text-decoration: none;\n font-size: 12px;\n font-weight: bold;\n color: rgb(233, 103, 128);\n display: inline-block;\n }\n\n li span {\n height: 16px;\n margin-top: 4px;\n border-radius: 2px;\n float: right;\n display: none;\n }\n\n li:hover span {\n display: inline-block;\n }\n\n li span:hover {\n background-color: #f8c2cc;\n }\n\n mwc-icon {\n vertical-align: middle;\n }\n\n .group-select-box {\n position: absolute;\n width: 200px;\n min-height: 22px;\n font-size: 12px;\n font-weight: bold;\n color: #e96780;\n border: 1px solid #ccc;\n padding: 5px;\n background-color: #fff;\n float: left;\n cursor: pointer;\n display: inline-block;\n }\n\n .group-select-box span {\n background-color: #fff !important;\n color: #e96780 !important;\n }\n\n .group-select-box > span:nth-child(1) {\n padding: 4px 0 0 6px;\n float: left;\n }\n\n .group-select-box > span:nth-child(2) {\n float: right;\n margin-top: 1px;\n }\n\n .select-box {\n display: none;\n }\n\n .select-box.on {\n display: block;\n padding-top: 2px;\n }\n\n .select-box.active {\n background-color: #1344;\n }\n\n .add-group {\n cursor: pointer;\n }\n\n .btn-open-dropbox {\n width: 8px;\n height: 5px;\n display: inline-block;\n background: url(${unsafeCSS(btnOpenDropboxColor)}) no-repeat;\n }\n\n .btn-close-dropbox {\n width: 8px;\n height: 5px;\n display: inline-block;\n background: url(${unsafeCSS(btnCloseDropbox)}) no-repeat;\n }\n\n .btn-add-list-wrap {\n margin: 5px 0 0 172px;\n cursor: pointer;\n display: inline-block;\n }\n\n .btn-add-list {\n width: 9px;\n height: 9px;\n display: inline-block;\n background: url(${unsafeCSS(btnAddList)}) no-repeat;\n }\n\n select {\n position: absolute;\n width: 150px;\n min-height: 22px;\n font-size: 12px;\n font-weight: bold;\n color: #e96780;\n border: 1px solid #ccc;\n padding: 5px;\n background-color: #fff;\n z-index: 1;\n float: left;\n cursor: pointer;\n display: inline-block;\n }\n\n .card > span,\n .card > a > span {\n position: absolute;\n width: 35px;\n height: 35px;\n right: 0px;\n }\n\n .btn-zoom-cover {\n top: 0px;\n }\n .btn-zoom {\n width: 20px;\n height: 20px;\n margin: 7px;\n background: url(${unsafeCSS(btnZoom)}) no-repeat;\n display: inline-block;\n }\n .btn-zoom-cover:hover > .btn-zoom {\n background: url(${unsafeCSS(btnZoomHover)}) no-repeat;\n }\n\n .btn-copy-link {\n width: 20px;\n height: 20px;\n margin: 7px;\n background: url(${unsafeCSS(btnCopyLink)}) no-repeat;\n display: inline-block;\n }\n .card > span:hover > .btn-copy-link {\n background: url(${unsafeCSS(btnCopyLinkHover)}) no-repeat;\n }\n\n .btn-delete {\n width: 20px;\n height: 20px;\n margin: 7px;\n background: url(${unsafeCSS(btnDelete)}) no-repeat;\n display: inline-block;\n }\n .card > span:hover > .btn-delete {\n background: url(${unsafeCSS(btnDeleteHover)}) no-repeat;\n }\n\n .btn-download {\n width: 20px;\n height: 20px;\n margin: 7px;\n background: url(${unsafeCSS(btnDownload)}) no-repeat;\n display: inline-block;\n }\n .btn-download-cover:hover > .btn-download {\n background: url(${unsafeCSS(btnDownloadHover)}) no-repeat;\n }\n\n .file {\n width: 52px;\n height: 65px;\n background: url(${unsafeCSS(file)}) no-repeat;\n display: inline-block;\n }\n `\n ]\n\n @property({ type: Array }) categories: string[] = ['audio', 'video', 'image', 'text', 'application']\n @property({ type: Array }) attachments: any[] = []\n @property({ type: String }) category?: string\n @property({ type: Number }) _page: number = 1\n @property({ type: Number }) _total: number = 0\n @property({ type: Boolean }) creatable?: boolean\n @property({ type: String }) selectBoxToggle?: string | null\n @property({ type: String }) btnDropBoxIcon: string = 'btn-open-dropbox'\n @property({ type: String }) userName?: string = localStorage.getItem('FMB_userNM') || ''\n\n @query('#main') main!: HTMLDivElement\n @query('attachment-creation-card') creationCard!: RestfulAttachmentCreationCard\n\n render() {\n return html`\n <div id=\"filter\">\n <div class=\"group-select-box\" @click=${this.toggleSelectBox}>\n ${this.category\n ? html` <span>${this.category}</span> `\n : html` <span>${i18next.t('text.please choose a category')}</span> `}\n <span><i class=${this.btnDropBoxIcon}></i></span>\n <ul class=${`select-box ${this.selectBoxToggle}`}>\n <li\n value=\"\"\n @click=${(e: Event) => {\n this.category = ''\n this.requestUpdate()\n }}\n >\n <a>${i18next.t('text.please choose a category')}</a>\n </li>\n ${this.categories.map(\n category =>\n html` <li\n value=${category}\n @click=${(e: Event) => {\n this.category = category\n this.requestUpdate()\n }}\n >\n <a>${category}</a>\n </li>`\n )}\n </ul>\n </div>\n </div>\n\n <div id=\"main\">\n ${this.creatable\n ? html`\n <restful-attachment-creation-card\n class=\"card create\"\n .categories=${this.categories}\n .defaultCategory=${this.category}\n @create-attachment=${(e: Event) => this.onCreateAttachment(e)}\n @file-drop=${(e: Event) => this.onAttachmentDropped(e)}\n ></restful-attachment-creation-card>\n `\n : html``}\n ${this.attachments.map(attachment => {\n var url = getRestServiceFullPath() + attachment.fullpath\n return html`\n <div class=\"card\" @click=${(e: Event) => this.onClickSelect(attachment)}>\n <div show>\n ${attachment.category == 'image'\n ? html` <img src=${url} /> `\n : attachment.category == 'video'\n ? html` <video src=${url} controls></video> `\n : html`\n <div etc>\n <i class=\"file\"></i>\n <span>${attachment.path?.substr(attachment.path.lastIndexOf('.'))}</span>\n </div>\n `}\n </div>\n <a target=\"_blank\" href=${url}>\n <span class=\"btn-zoom-cover\"><i class=\"btn-zoom\"></i></span>\n </a>\n <div class=\"name\">${attachment.name}</div>\n <span @click=${(e: Event) => this.onDeleteAttachment(attachment.id)} delete>\n <i class=\"btn-delete\"></i>\n </span>\n <a href=${getRestServiceFullPath() + attachment.download} download=${attachment.name}>\n <span class=\"btn-download-cover\" download><i class=\"btn-download\"></i></span>\n </a>\n </div>\n `\n })}\n </div>\n `\n }\n\n toggleSelectBox() {\n if (this.selectBoxToggle === 'on') {\n this.selectBoxToggle = null\n this.btnDropBoxIcon = 'btn-close-dropbox'\n } else {\n this.selectBoxToggle = 'on'\n this.btnDropBoxIcon = 'btn-open-dropbox'\n }\n }\n\n async firstUpdated() {\n this.renderRoot.addEventListener('click', async e => {\n var target = e.target as HTMLElement\n var url = target.getAttribute('data-clipboard-url')\n if (url) {\n var { protocol, hostname, port } = location\n await this.copy(`${protocol}//${hostname}:${port}${url}`)\n\n target.setAttribute('data-tooltip', 'url copied!')\n await sleep(2000)\n target.removeAttribute('data-tooltip')\n }\n })\n\n this.refreshAttachments()\n }\n\n updated(changed: PropertyValues<this>) {\n if (changed.has('category')) {\n this.refreshAttachments()\n }\n }\n\n onClickSelect(attachment: any) {\n this.dispatchEvent(\n new CustomEvent('attachment-selected', {\n composed: true,\n bubbles: true,\n detail: {\n attachment\n }\n })\n )\n }\n\n async onAttachmentDropped(e: Event) {\n var files = (e as CustomEvent).detail\n\n await this.createAttachments('', files)\n this.refreshAttachments()\n }\n\n async onCreateAttachment(e: Event) {\n var { category, files, fileId } = (e as CustomEvent).detail\n\n files = Array.from(files)\n await this.createAttachments(category, files, fileId)\n this.refreshAttachments()\n }\n\n async onDeleteAttachment(id: string) {\n await this.deleteAttachment(id)\n\n this.refreshAttachments()\n }\n\n async refreshAttachments() {\n var attachments = await this.getAttachments()\n this.attachments = [...attachments]\n\n if (this.creationCard) {\n this.creationCard.reset()\n }\n }\n\n async appendAttachments() {\n var attachments = await this.getAttachments({ page: this._page + 1 })\n this.attachments = [...this.attachments, ...attachments]\n }\n\n async getAttachments({ page = 1, limit = 1000 } = {}) {\n var filters = [] as any[]\n var sortings = [] as any[]\n var pagination = {\n limit,\n page\n }\n\n if (this.category)\n filters.push({\n name: 'category',\n operator: 'eq',\n value: this.category\n })\n\n var params = {\n filters,\n sortings,\n pagination\n }\n\n let response = (await fetchAttachmentList(params))?.data\n if (!response || !response.status) {\n throw new Error('Error : fetchAttachmentList')\n }\n\n let attachmentListResponse = response.attachments\n\n if (!attachmentListResponse || !attachmentListResponse.items.length) return []\n attachmentListResponse.items.forEach((attachment: any) => {\n attachment.fullpath = '/images/' + attachment.path\n attachment.download = '/downloadFile/' + attachment.path + '/' + encodeURIComponent(attachment.name)\n })\n this._total = attachmentListResponse.total\n this._page = page\n\n return attachmentListResponse.items\n }\n\n async createAttachments(category: string, files: any[], fileId?: string) {\n try {\n files[0].category = category\n files[0].fileId = fileId\n const body = {\n category: files[0].category,\n name: files[0].name,\n size: files[0].size,\n type: files[0].type,\n fileId: files[0].fileId,\n userName: this.userName\n }\n let result = (await createAttachment(body))?.data\n if (!result || !result.status) throw new Error('Create Error')\n } catch (ex) {\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n level: 'error',\n message: ex,\n ex: ex\n }\n })\n )\n }\n }\n\n async deleteAttachment(id: string) {\n let server = 'Primary'\n try {\n const result = (await deleteAttachment(id))?.data\n if (!result || !result.status) throw new Error('DB Error')\n\n const deleteFileResult = (await deleteFile(result.attachment.path, 'primary'))?.data\n if (!deleteFileResult || !deleteFileResult.status) {\n throw new Error('Primary Server File Delete Error')\n }\n } catch (ex) {\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n level: 'error',\n message: server + ' Server File Delete Error // ' + ex,\n ex: ex\n }\n })\n )\n }\n }\n\n async copy(copied: any) {\n var textArea = document.createElement('textarea')\n textArea.style.position = 'absolute'\n textArea.style.opacity = '0'\n textArea.value = copied\n document.body.appendChild(textArea)\n\n await sleep(100)\n\n textArea.select()\n\n document.execCommand('copy')\n document.body.removeChild(textArea)\n }\n}\n"]}
1
+ {"version":3,"file":"restful-attachment-selector.js","sourceRoot":"","sources":["../../../src/component/restful-attachment-selector.ts"],"names":[],"mappings":"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","sourcesContent":["import './restful-attachment-creation-card.js'\n\nimport { css, html, LitElement, PropertyValues, unsafeCSS } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { ScrollbarStyles } from '@operato/styles'\nimport { sleep } from '@operato/utils'\n\nimport {\n fetchAttachmentList,\n getRestServiceFullPath,\n createAttachment,\n deleteAttachment,\n deleteFile\n} from '@fmsim/api/restful.js'\n\nimport { RestfulAttachmentCreationCard } from './restful-attachment-creation-card.js'\n\nconst btnOpenDropboxColor = require('../../../icons/group-bar/btn-open-dropbox-color.png')\nconst btnCloseDropbox = require('../../../icons/group-bar/btn-close-dropbox.png')\nconst btnAddList = require('../../../icons/group-bar/btn-add-list.png')\nconst btnZoom = require('../../../icons/attachment/btn-zoom.svg')\nconst btnZoomHover = require('../../../icons/attachment/btn-zoom-hover.svg')\nconst btnCopyLink = require('../../../icons/attachment/btn-copy-link.svg')\nconst btnCopyLinkHover = require('../../../icons/attachment/btn-copy-link-hover.svg')\nconst btnDelete = require('../../../icons/attachment/btn-delete.svg')\nconst btnDeleteHover = require('../../../icons/attachment/btn-delete-hover.svg')\nconst btnDownload = require('../../../icons/attachment/btn-download.svg')\nconst btnDownloadHover = require('../../../icons/attachment/btn-download-hover.svg')\nconst file = require('../../../icons/attachment/file.svg')\n\n@customElement('restful-attachment-selector')\nexport class RestfulAttachmentSelector extends localize(i18next)(LitElement) {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n overflow: hidden;\n background-color: #fff;\n /* --card-list-create-color: var(--primary-color); */\n\n position: relative;\n }\n\n :host(.candrop) {\n background: orange;\n cursor: pointer;\n }\n\n #main {\n overflow: auto;\n padding: var(--popup-content-padding);\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));\n grid-auto-rows: var(--card-list-rows-height);\n grid-gap: 20px;\n padding-top: 10px !important;\n }\n\n #main .card {\n display: flex;\n flex-direction: column;\n align-items: center;\n overflow: hidden;\n border-radius: var(--card-list-border-radius);\n border: var(--attachment-selector-border);\n background-color: var(--attachment-selector-background-color);\n\n position: relative;\n }\n\n #main .card.create {\n overflow: visible;\n background-color: initial;\n min-height: 120px;\n }\n\n #main .card:hover {\n cursor: pointer;\n }\n\n .name {\n background-color: var(--primary-color);\n opacity: 0.8;\n position: absolute;\n bottom: 0px;\n width: 100%;\n padding: 2px 5px;\n font: var(--attachment-selector-name-font);\n color: #fff;\n text-indent: 7px;\n }\n\n [show] {\n height: 100%;\n }\n\n .card img,\n .card video {\n max-height: 100%;\n max-width: 100%;\n }\n\n md-icon {\n position: absolute;\n right: 0px;\n text-align: center;\n\n background-color: var(--attachment-selector-icon-background-color);\n width: var(--attachment-selector-icon-size);\n height: var(--attachment-selector-icon-size);\n font: var(--attachment-selector-icon-font);\n color: var(--attachment-selector-icon-color);\n }\n\n md-icon:hover,\n md-icon:active,\n span:hover,\n span:active {\n background-color: var(--primary-color);\n color: #fff;\n }\n\n [open-in-new] {\n top: 0px;\n }\n\n [delete] {\n top: 35px;\n }\n\n [download] {\n top: 70px;\n border-bottom-left-radius: 12px;\n }\n\n #filter {\n padding: 12px 12px 12px 20px;\n background-color: var(--group-bar-background-color);\n height: 28px;\n z-index: 1;\n }\n\n select {\n text-transform: capitalize;\n float: right;\n }\n\n [etc] md-icon:hover,\n [etc] md-icon:active {\n background-color: initial;\n color: initial;\n }\n\n [etc] {\n margin: auto;\n margin-top: 45px;\n position: relative;\n }\n\n [etc] md-icon {\n position: initial;\n opacity: 0.2;\n width: initial;\n height: initial;\n\n font: var(--attachment-selector-etc-icon-font);\n color: var(--attachment-selector-etc-icon-color);\n }\n\n [etc] span {\n position: absolute;\n bottom: 25px;\n right: 8px;\n padding: 1px 2px;\n color: #fff;\n text-transform: uppercase;\n opacity: 0.8;\n\n background-color: var(--attachment-selector-etc-background-color);\n font: var(--attachment-selector-etc-font);\n }\n\n ul {\n display: flex;\n list-style: none;\n margin: 0;\n padding: 0;\n white-space: nowrap;\n clear: both;\n }\n\n li {\n padding: 0px 3px;\n }\n\n li:hover {\n background-color: rgba(255, 180, 180, 1);\n }\n\n li a {\n width: calc(100% - 24px);\n padding: 5px 4px 1px 4px;\n text-decoration: none;\n font-size: 12px;\n font-weight: bold;\n color: rgb(233, 103, 128);\n display: inline-block;\n }\n\n li span {\n height: 16px;\n margin-top: 4px;\n border-radius: 2px;\n float: right;\n display: none;\n }\n\n li:hover span {\n display: inline-block;\n }\n\n li span:hover {\n background-color: #f8c2cc;\n }\n\n md-icon {\n vertical-align: middle;\n }\n\n .group-select-box {\n position: absolute;\n width: 200px;\n min-height: 22px;\n font-size: 12px;\n font-weight: bold;\n color: #e96780;\n border: 1px solid #ccc;\n padding: 5px;\n background-color: #fff;\n float: left;\n cursor: pointer;\n display: inline-block;\n }\n\n .group-select-box span {\n background-color: #fff !important;\n color: #e96780 !important;\n }\n\n .group-select-box > span:nth-child(1) {\n padding: 4px 0 0 6px;\n float: left;\n }\n\n .group-select-box > span:nth-child(2) {\n float: right;\n margin-top: 1px;\n }\n\n .select-box {\n display: none;\n }\n\n .select-box.on {\n display: block;\n padding-top: 2px;\n }\n\n .select-box.active {\n background-color: #1344;\n }\n\n .add-group {\n cursor: pointer;\n }\n\n .btn-open-dropbox {\n width: 8px;\n height: 5px;\n display: inline-block;\n background: url(${unsafeCSS(btnOpenDropboxColor)}) no-repeat;\n }\n\n .btn-close-dropbox {\n width: 8px;\n height: 5px;\n display: inline-block;\n background: url(${unsafeCSS(btnCloseDropbox)}) no-repeat;\n }\n\n .btn-add-list-wrap {\n margin: 5px 0 0 172px;\n cursor: pointer;\n display: inline-block;\n }\n\n .btn-add-list {\n width: 9px;\n height: 9px;\n display: inline-block;\n background: url(${unsafeCSS(btnAddList)}) no-repeat;\n }\n\n select {\n position: absolute;\n width: 150px;\n min-height: 22px;\n font-size: 12px;\n font-weight: bold;\n color: #e96780;\n border: 1px solid #ccc;\n padding: 5px;\n background-color: #fff;\n z-index: 1;\n float: left;\n cursor: pointer;\n display: inline-block;\n }\n\n .card > span,\n .card > a > span {\n position: absolute;\n width: 35px;\n height: 35px;\n right: 0px;\n }\n\n .btn-zoom-cover {\n top: 0px;\n }\n .btn-zoom {\n width: 20px;\n height: 20px;\n margin: 7px;\n background: url(${unsafeCSS(btnZoom)}) no-repeat;\n display: inline-block;\n }\n .btn-zoom-cover:hover > .btn-zoom {\n background: url(${unsafeCSS(btnZoomHover)}) no-repeat;\n }\n\n .btn-copy-link {\n width: 20px;\n height: 20px;\n margin: 7px;\n background: url(${unsafeCSS(btnCopyLink)}) no-repeat;\n display: inline-block;\n }\n .card > span:hover > .btn-copy-link {\n background: url(${unsafeCSS(btnCopyLinkHover)}) no-repeat;\n }\n\n .btn-delete {\n width: 20px;\n height: 20px;\n margin: 7px;\n background: url(${unsafeCSS(btnDelete)}) no-repeat;\n display: inline-block;\n }\n .card > span:hover > .btn-delete {\n background: url(${unsafeCSS(btnDeleteHover)}) no-repeat;\n }\n\n .btn-download {\n width: 20px;\n height: 20px;\n margin: 7px;\n background: url(${unsafeCSS(btnDownload)}) no-repeat;\n display: inline-block;\n }\n .btn-download-cover:hover > .btn-download {\n background: url(${unsafeCSS(btnDownloadHover)}) no-repeat;\n }\n\n .file {\n width: 52px;\n height: 65px;\n background: url(${unsafeCSS(file)}) no-repeat;\n display: inline-block;\n }\n `\n ]\n\n @property({ type: Array }) categories: string[] = ['audio', 'video', 'image', 'text', 'application']\n @property({ type: Array }) attachments: any[] = []\n @property({ type: String }) category?: string\n @property({ type: Number }) _page: number = 1\n @property({ type: Number }) _total: number = 0\n @property({ type: Boolean }) creatable?: boolean\n @property({ type: String }) selectBoxToggle?: string | null\n @property({ type: String }) btnDropBoxIcon: string = 'btn-open-dropbox'\n @property({ type: String }) userName?: string = localStorage.getItem('FMB_userNM') || ''\n\n @query('#main') main!: HTMLDivElement\n @query('attachment-creation-card') creationCard!: RestfulAttachmentCreationCard\n\n render() {\n return html`\n <div id=\"filter\">\n <div class=\"group-select-box\" @click=${this.toggleSelectBox}>\n ${this.category\n ? html` <span>${this.category}</span> `\n : html` <span>${i18next.t('text.please choose a category')}</span> `}\n <span><i class=${this.btnDropBoxIcon}></i></span>\n <ul class=${`select-box ${this.selectBoxToggle}`}>\n <li\n value=\"\"\n @click=${(e: Event) => {\n this.category = ''\n this.requestUpdate()\n }}\n >\n <a>${i18next.t('text.please choose a category')}</a>\n </li>\n ${this.categories.map(\n category =>\n html` <li\n value=${category}\n @click=${(e: Event) => {\n this.category = category\n this.requestUpdate()\n }}\n >\n <a>${category}</a>\n </li>`\n )}\n </ul>\n </div>\n </div>\n\n <div id=\"main\">\n ${this.creatable\n ? html`\n <restful-attachment-creation-card\n class=\"card create\"\n .categories=${this.categories}\n .defaultCategory=${this.category}\n @create-attachment=${(e: Event) => this.onCreateAttachment(e)}\n @file-drop=${(e: Event) => this.onAttachmentDropped(e)}\n ></restful-attachment-creation-card>\n `\n : html``}\n ${this.attachments.map(attachment => {\n var url = getRestServiceFullPath() + attachment.fullpath\n return html`\n <div class=\"card\" @click=${(e: Event) => this.onClickSelect(attachment)}>\n <div show>\n ${attachment.category == 'image'\n ? html` <img src=${url} /> `\n : attachment.category == 'video'\n ? html` <video src=${url} controls></video> `\n : html`\n <div etc>\n <i class=\"file\"></i>\n <span>${attachment.path?.substr(attachment.path.lastIndexOf('.'))}</span>\n </div>\n `}\n </div>\n <a target=\"_blank\" href=${url}>\n <span class=\"btn-zoom-cover\"><i class=\"btn-zoom\"></i></span>\n </a>\n <div class=\"name\">${attachment.name}</div>\n <span @click=${(e: Event) => this.onDeleteAttachment(attachment.id)} delete>\n <i class=\"btn-delete\"></i>\n </span>\n <a href=${getRestServiceFullPath() + attachment.download} download=${attachment.name}>\n <span class=\"btn-download-cover\" download><i class=\"btn-download\"></i></span>\n </a>\n </div>\n `\n })}\n </div>\n `\n }\n\n toggleSelectBox() {\n if (this.selectBoxToggle === 'on') {\n this.selectBoxToggle = null\n this.btnDropBoxIcon = 'btn-close-dropbox'\n } else {\n this.selectBoxToggle = 'on'\n this.btnDropBoxIcon = 'btn-open-dropbox'\n }\n }\n\n async firstUpdated() {\n this.renderRoot.addEventListener('click', async e => {\n var target = e.target as HTMLElement\n var url = target.getAttribute('data-clipboard-url')\n if (url) {\n var { protocol, hostname, port } = location\n await this.copy(`${protocol}//${hostname}:${port}${url}`)\n\n target.setAttribute('data-tooltip', 'url copied!')\n await sleep(2000)\n target.removeAttribute('data-tooltip')\n }\n })\n\n this.refreshAttachments()\n }\n\n updated(changed: PropertyValues<this>) {\n if (changed.has('category')) {\n this.refreshAttachments()\n }\n }\n\n onClickSelect(attachment: any) {\n this.dispatchEvent(\n new CustomEvent('attachment-selected', {\n composed: true,\n bubbles: true,\n detail: {\n attachment\n }\n })\n )\n }\n\n async onAttachmentDropped(e: Event) {\n var files = (e as CustomEvent).detail\n\n await this.createAttachments('', files)\n this.refreshAttachments()\n }\n\n async onCreateAttachment(e: Event) {\n var { category, files, fileId } = (e as CustomEvent).detail\n\n files = Array.from(files)\n await this.createAttachments(category, files, fileId)\n this.refreshAttachments()\n }\n\n async onDeleteAttachment(id: string) {\n await this.deleteAttachment(id)\n\n this.refreshAttachments()\n }\n\n async refreshAttachments() {\n var attachments = await this.getAttachments()\n this.attachments = [...attachments]\n\n if (this.creationCard) {\n this.creationCard.reset()\n }\n }\n\n async appendAttachments() {\n var attachments = await this.getAttachments({ page: this._page + 1 })\n this.attachments = [...this.attachments, ...attachments]\n }\n\n async getAttachments({ page = 1, limit = 1000 } = {}) {\n var filters = [] as any[]\n var sortings = [] as any[]\n var pagination = {\n limit,\n page\n }\n\n if (this.category)\n filters.push({\n name: 'category',\n operator: 'eq',\n value: this.category\n })\n\n var params = {\n filters,\n sortings,\n pagination\n }\n\n let response = (await fetchAttachmentList(params))?.data\n if (!response || !response.status) {\n throw new Error('Error : fetchAttachmentList')\n }\n\n let attachmentListResponse = response.attachments\n\n if (!attachmentListResponse || !attachmentListResponse.items.length) return []\n attachmentListResponse.items.forEach((attachment: any) => {\n attachment.fullpath = '/images/' + attachment.path\n attachment.download = '/downloadFile/' + attachment.path + '/' + encodeURIComponent(attachment.name)\n })\n this._total = attachmentListResponse.total\n this._page = page\n\n return attachmentListResponse.items\n }\n\n async createAttachments(category: string, files: any[], fileId?: string) {\n try {\n files[0].category = category\n files[0].fileId = fileId\n const body = {\n category: files[0].category,\n name: files[0].name,\n size: files[0].size,\n type: files[0].type,\n fileId: files[0].fileId,\n userName: this.userName\n }\n let result = (await createAttachment(body))?.data\n if (!result || !result.status) throw new Error('Create Error')\n } catch (ex) {\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n level: 'error',\n message: ex,\n ex: ex\n }\n })\n )\n }\n }\n\n async deleteAttachment(id: string) {\n let server = 'Primary'\n try {\n const result = (await deleteAttachment(id))?.data\n if (!result || !result.status) throw new Error('DB Error')\n\n const deleteFileResult = (await deleteFile(result.attachment.path, 'primary'))?.data\n if (!deleteFileResult || !deleteFileResult.status) {\n throw new Error('Primary Server File Delete Error')\n }\n } catch (ex) {\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n level: 'error',\n message: server + ' Server File Delete Error // ' + ex,\n ex: ex\n }\n })\n )\n }\n }\n\n async copy(copied: any) {\n var textArea = document.createElement('textarea')\n textArea.style.position = 'absolute'\n textArea.style.opacity = '0'\n textArea.value = copied\n document.body.appendChild(textArea)\n\n await sleep(100)\n\n textArea.select()\n\n document.execCommand('copy')\n document.body.removeChild(textArea)\n }\n}\n"]}
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * @license Copyright © HatioLab Inc. All rights reserved.
3
3
  */
4
- import '@material/mwc-icon';
4
+ import '@material/web/icon/icon.js';
5
5
  import './restful-attachment-selector.js';
6
6
  import { LitElement } from 'lit';
7
7
  export declare class RestfulInputAttachmentSelector extends LitElement {
@@ -2,7 +2,7 @@
2
2
  * @license Copyright © HatioLab Inc. All rights reserved.
3
3
  */
4
4
  import { __decorate } from "tslib";
5
- import '@material/mwc-icon';
5
+ import '@material/web/icon/icon.js';
6
6
  import './restful-attachment-selector.js';
7
7
  import { LitElement, css, html } from 'lit';
8
8
  import { openPopup } from '@operato/layout';
@@ -22,7 +22,7 @@ let RestfulInputAttachmentSelector = class RestfulInputAttachmentSelector extend
22
22
  @change=${(e) => this._onInputChanged(e)}
23
23
  />
24
24
 
25
- <mwc-icon @click=${() => this.openSelector()}>${this.getIconByCategory()}</mwc-icon>
25
+ <md-icon @click=${() => this.openSelector()}>${this.getIconByCategory()}</md-icon>
26
26
  `;
27
27
  }
28
28
  getIconByCategory() {
@@ -88,7 +88,7 @@ RestfulInputAttachmentSelector.styles = [
88
88
  border: 1px solid rgba(0, 0, 0, 0.2);
89
89
  }
90
90
 
91
- mwc-icon {
91
+ md-icon {
92
92
  position: absolute;
93
93
  top: 0;
94
94
  right: 3px;
@@ -1 +1 @@
1
- {"version":3,"file":"restful-input-attachment-selector.js","sourceRoot":"","sources":["../../../src/component/restful-input-attachment-selector.ts"],"names":[],"mappings":"AAAA;;GAEG;;AAEH,OAAO,oBAAoB,CAAA;AAC3B,OAAO,kCAAkC,CAAA;AAEzC,OAAO,EAAE,UAAU,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAe,SAAS,EAAE,MAAM,iBAAiB,CAAA;AACxD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AAGhC,IAAM,8BAA8B,GAApC,MAAM,8BAA+B,SAAQ,UAAU;IAAvD;;QAuBuB,UAAK,GAAW,EAAE,CAAA;IAyEhD,CAAC;IApEC,MAAM;QACJ,OAAO,IAAI,CAAA;;;;iBAIE,IAAI,CAAC,KAAK,IAAI,EAAE;kBACf,CAAC,CAAgB,EAAE,EAAE,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC;;;yBAGtC,GAAG,EAAE,CAAC,IAAI,CAAC,YAAY,EAAE,IAAI,IAAI,CAAC,iBAAiB,EAAE;KACzE,CAAA;IACH,CAAC;IAED,iBAAiB;QACf,IAAI,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,UAAU,IAAI,EAAE,CAAA;QACxC,QAAQ,QAAQ,EAAE,CAAC;YACjB,KAAK,OAAO;gBACV,OAAO,eAAe,CAAA;YACxB,KAAK,OAAO;gBACV,OAAO,eAAe,CAAA;YACxB,KAAK,OAAO;gBACV,OAAO,OAAO,CAAA;YAChB,KAAK,MAAM,CAAC;YACZ,KAAK,aAAa,CAAC;YACnB;gBACE,OAAO,YAAY,CAAA;QACvB,CAAC;IACH,CAAC;IAED,eAAe,CAAC,CAAgB;QAC9B,IAAI,CAAC,KAAK,GAAI,CAAC,CAAC,MAA2B,CAAC,KAAK,CAAA;QACjD,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAA;IAClF,CAAC;IAED,YAAY;QACV,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACf,OAAO,IAAI,CAAC,KAAK,CAAA;QACnB,CAAC;QAED;;;;WAIG;QACH,IAAI,KAAK,GAAG,IAAI,CAAC,KAAK,IAAI,EAAE,CAAA;QAC5B,IAAI,EAAE,QAAQ,GAAG,aAAa,EAAE,GAAG,IAAI,CAAC,UAAU,IAAI,EAAE,CAAA;QAExD,IAAI,QAAQ,GAAG,IAAI,CAAA;;qBAEF,IAAI;oBACL,QAAQ;+BACG,KAAK,EAAE,CAAc,EAAE,EAAE;YAC9C,IAAI,UAAU,GAAG,CAAC,CAAC,MAAM,CAAC,UAAU,CAAA;YACpC,IAAI,CAAC,KAAK,GAAG,YAAY,UAAU,CAAC,QAAQ,EAAE,CAAA;YAE9C,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAA;YAEhF,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAA;QAClC,CAAC;;KAEJ,CAAA;QAED,IAAI,CAAC,KAAK,GAAG,SAAS,CAAC,QAAQ,EAAE;YAC/B,QAAQ,EAAE,IAAI;YACd,IAAI,EAAE,OAAO;YACb,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,yBAAyB,CAAC;SAC5C,CAAC,CAAA;IACJ,CAAC;;AA9FM,qCAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;KAkBF;CACF,AApBY,CAoBZ;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6DAAmB;AAClB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kEAAgB;AAxBhC,8BAA8B;IAD1C,aAAa,CAAC,mCAAmC,CAAC;GACtC,8BAA8B,CAgG1C","sourcesContent":["/**\n * @license Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport '@material/mwc-icon'\nimport './restful-attachment-selector.js'\n\nimport { LitElement, css, html } from 'lit'\nimport { PopupHandle, openPopup } from '@operato/layout'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next } from '@operato/i18n'\n\n@customElement('restful-input-attachment-selector')\nexport class RestfulInputAttachmentSelector extends LitElement {\n static styles = [\n css`\n :host {\n position: relative;\n display: inline-block;\n }\n\n input[type='text'] {\n box-sizing: border-box;\n width: 100%;\n height: 100%;\n border: 1px solid rgba(0, 0, 0, 0.2);\n }\n\n mwc-icon {\n position: absolute;\n top: 0;\n right: 3px;\n }\n `\n ]\n\n @property({ type: String }) value: string = ''\n @property({ type: Object }) properties: any\n\n private popup?: PopupHandle\n\n render() {\n return html`\n <input\n id=\"text\"\n type=\"text\"\n .value=${this.value || ''}\n @change=${(e: KeyboardEvent) => this._onInputChanged(e)}\n />\n\n <mwc-icon @click=${() => this.openSelector()}>${this.getIconByCategory()}</mwc-icon>\n `\n }\n\n getIconByCategory() {\n var { category } = this.properties || {}\n switch (category) {\n case 'audio':\n return 'library_music'\n case 'video':\n return 'video_library'\n case 'image':\n return 'image'\n case 'text':\n case 'application':\n default:\n return 'attachment'\n }\n }\n\n _onInputChanged(e: KeyboardEvent) {\n this.value = (e.target as HTMLInputElement).value\n this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }))\n }\n\n openSelector() {\n if (this.popup) {\n delete this.popup\n }\n\n /*\n * 기존 설정된 이미지가 선택된 상태가 되게 하기 위해서는 selector에 value를 전달해줄 필요가 있음.\n * 주의. value는 object일 수도 있고, string일 수도 있다.\n * string인 경우에는 해당 보드의 id로 해석한다.\n */\n var value = this.value || {}\n var { category = 'application' } = this.properties || {}\n\n var template = html`\n <restful-attachment-selector\n .creatable=${true}\n .category=${category}\n @attachment-selected=${async (e: CustomEvent) => {\n var attachment = e.detail.attachment\n this.value = `$base_url${attachment.download}`\n\n this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }))\n\n this.popup && this.popup.close()\n }}\n ></restful-attachment-selector>\n `\n\n this.popup = openPopup(template, {\n backdrop: true,\n size: 'large',\n title: i18next.t('title.select attachment')\n })\n }\n}\n"]}
1
+ {"version":3,"file":"restful-input-attachment-selector.js","sourceRoot":"","sources":["../../../src/component/restful-input-attachment-selector.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport '@material/web/icon/icon.js'\nimport './restful-attachment-selector.js'\n\nimport { LitElement, css, html } from 'lit'\nimport { PopupHandle, openPopup } from '@operato/layout'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next } from '@operato/i18n'\n\n@customElement('restful-input-attachment-selector')\nexport class RestfulInputAttachmentSelector extends LitElement {\n static styles = [\n css`\n :host {\n position: relative;\n display: inline-block;\n }\n\n input[type='text'] {\n box-sizing: border-box;\n width: 100%;\n height: 100%;\n border: 1px solid rgba(0, 0, 0, 0.2);\n }\n\n md-icon {\n position: absolute;\n top: 0;\n right: 3px;\n }\n `\n ]\n\n @property({ type: String }) value: string = ''\n @property({ type: Object }) properties: any\n\n private popup?: PopupHandle\n\n render() {\n return html`\n <input\n id=\"text\"\n type=\"text\"\n .value=${this.value || ''}\n @change=${(e: KeyboardEvent) => this._onInputChanged(e)}\n />\n\n <md-icon @click=${() => this.openSelector()}>${this.getIconByCategory()}</md-icon>\n `\n }\n\n getIconByCategory() {\n var { category } = this.properties || {}\n switch (category) {\n case 'audio':\n return 'library_music'\n case 'video':\n return 'video_library'\n case 'image':\n return 'image'\n case 'text':\n case 'application':\n default:\n return 'attachment'\n }\n }\n\n _onInputChanged(e: KeyboardEvent) {\n this.value = (e.target as HTMLInputElement).value\n this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }))\n }\n\n openSelector() {\n if (this.popup) {\n delete this.popup\n }\n\n /*\n * 기존 설정된 이미지가 선택된 상태가 되게 하기 위해서는 selector에 value를 전달해줄 필요가 있음.\n * 주의. value는 object일 수도 있고, string일 수도 있다.\n * string인 경우에는 해당 보드의 id로 해석한다.\n */\n var value = this.value || {}\n var { category = 'application' } = this.properties || {}\n\n var template = html`\n <restful-attachment-selector\n .creatable=${true}\n .category=${category}\n @attachment-selected=${async (e: CustomEvent) => {\n var attachment = e.detail.attachment\n this.value = `$base_url${attachment.download}`\n\n this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }))\n\n this.popup && this.popup.close()\n }}\n ></restful-attachment-selector>\n `\n\n this.popup = openPopup(template, {\n backdrop: true,\n size: 'large',\n title: i18next.t('title.select attachment')\n })\n }\n}\n"]}
@@ -7,14 +7,24 @@ import '@operato/input/ox-input-color-stops.js';
7
7
  import '@operato/input/ox-input-color-gradient.js';
8
8
  import './restrul-input-background-pattern.js';
9
9
  import { PropertyValues } from 'lit';
10
- import { ColorStop, GradientOption, OxFormField } from '@operato/input';
10
+ import { OxFormField } from '@operato/input';
11
+ type ColorStop = {
12
+ color: string;
13
+ position: number;
14
+ };
15
+ type GradientOption = {
16
+ type?: 'linear' | 'radial';
17
+ colorStops?: ColorStop[];
18
+ rotation?: number;
19
+ center?: string;
20
+ };
11
21
  import { BackgroundPatternOption } from './restrul-input-background-pattern.js';
12
22
  export type FillStyle = {
13
23
  type?: 'no' | 'solid' | 'gradient' | 'pattern';
14
24
  gradientType?: 'linear' | 'radial';
15
25
  colorStops?: ColorStop[];
16
26
  rotation?: number;
17
- center?: 'center' | 'left-top' | 'right-top' | 'right-bottom' | 'left-bottom';
27
+ center?: string;
18
28
  image?: HTMLImageElement | string;
19
29
  offsetX?: number;
20
30
  offsetY?: number;
@@ -43,3 +53,4 @@ export declare class RestfulInputColorStyle extends OxFormField {
43
53
  _onChandedGradient(e: Event): void;
44
54
  _onChangedPattern(e: Event): void;
45
55
  }
56
+ export {};