divhunt 2.0.5 → 2.0.9

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 (159) hide show
  1. package/addons/core/commands/back/functions/expose.js +14 -0
  2. package/addons/core/commands/back/functions/find.js +1 -1
  3. package/addons/core/commands/back/functions/grpc/client.js +1 -1
  4. package/addons/core/commands/back/functions/grpc/server.js +1 -1
  5. package/addons/core/commands/back/functions/hide.js +14 -0
  6. package/addons/core/commands/back/functions/http/server.js +1 -1
  7. package/addons/core/commands/back/items/{many.js → self/many.js} +2 -4
  8. package/addons/core/commands/back/items/{one.js → self/one.js} +2 -4
  9. package/addons/core/commands/back/items/{run.js → self/run.js} +3 -7
  10. package/addons/core/commands/core/functions/run.js +13 -0
  11. package/addons/core/commands/{back → core}/item/functions/run.js +1 -1
  12. package/addons/core/commands/core/load.js +25 -0
  13. package/addons/core/commands/front/directives/run.js +84 -0
  14. package/addons/core/commands/front/directives/submit.js +150 -0
  15. package/addons/core/commands/front/functions/api.js +30 -0
  16. package/addons/render/assets/back/functions/import.js +1 -1
  17. package/examples/basic-front/back/assets.js +11 -0
  18. package/examples/basic-front/back/index.js +13 -0
  19. package/examples/basic-front/back/items/commands/html.js +14 -0
  20. package/examples/basic-front/back/items/commands/test.js +19 -0
  21. package/examples/basic-front/back/items/html/fonts.js +12 -0
  22. package/examples/basic-front/front/pages/home.js +16 -0
  23. package/examples/basic-front/front/styles/main.css +31 -0
  24. package/examples/basic-front/front/test.js +7 -0
  25. package/examples/basic-front/package.json +7 -0
  26. package/lib/src/divhunt.js +2 -0
  27. package/lib/src/mixins/form.js +67 -0
  28. package/package.json +3 -3
  29. package/test/front/test.js +31 -0
  30. package/test.js +52 -0
  31. package/addons/core/commands/LICENSE.txt +0 -40
  32. package/addons/core/commands/README.md +0 -294
  33. package/addons/core/commands/back/load.js +0 -18
  34. package/addons/core/commands/front/#register/addon.js +0 -9
  35. package/addons/core/commands/front/functions/find.js +0 -22
  36. package/addons/core/commands/front/item/functions/run.js +0 -96
  37. package/addons/core/commands/front/items/elements/table/table.css +0 -18
  38. package/addons/core/commands/front/items/elements/table/table.js +0 -254
  39. package/addons/render/elements/front/items/self/base/menu/menu.js +0 -96
  40. package/addons/render/elements/front/items/self/base/menu/styles/base.css +0 -116
  41. package/addons/render/elements/front/items/self/base/menu/styles/sizes.css +0 -27
  42. package/addons/render/elements/front/items/self/base/menu/styles/variants.css +0 -99
  43. package/addons/render/elements/front/items/self/base/tag/tag.css +0 -199
  44. package/addons/render/elements/front/items/self/base/tag/tag.js +0 -37
  45. package/addons/render/elements/front/items/self/cards/basic/basic.js +0 -89
  46. package/addons/render/elements/front/items/self/cards/basic/styles/base.css +0 -66
  47. package/addons/render/elements/front/items/self/cards/basic/styles/sizes.css +0 -32
  48. package/addons/render/elements/front/items/self/cards/basic/styles/variants.css +0 -99
  49. package/addons/render/elements/front/items/self/cards/list/list.js +0 -108
  50. package/addons/render/elements/front/items/self/cards/list/styles/base.css +0 -96
  51. package/addons/render/elements/front/items/self/cards/list/styles/sizes.css +0 -32
  52. package/addons/render/elements/front/items/self/cards/list/styles/variants.css +0 -99
  53. package/addons/render/elements/front/items/self/cards/media/media.js +0 -116
  54. package/addons/render/elements/front/items/self/cards/media/styles/base.css +0 -126
  55. package/addons/render/elements/front/items/self/cards/media/styles/sizes.css +0 -49
  56. package/addons/render/elements/front/items/self/cards/media/styles/variants.css +0 -74
  57. package/addons/render/elements/front/items/self/cards/profile/profile.js +0 -95
  58. package/addons/render/elements/front/items/self/cards/profile/styles/base.css +0 -142
  59. package/addons/render/elements/front/items/self/cards/profile/styles/sizes.css +0 -43
  60. package/addons/render/elements/front/items/self/cards/profile/styles/variants.css +0 -131
  61. package/addons/render/elements/front/items/self/cards/stat/stat.js +0 -117
  62. package/addons/render/elements/front/items/self/cards/stat/styles/base.css +0 -97
  63. package/addons/render/elements/front/items/self/cards/stat/styles/sizes.css +0 -49
  64. package/addons/render/elements/front/items/self/cards/stat/styles/variants.css +0 -124
  65. package/addons/render/elements/front/items/self/content/html/html.css +0 -93
  66. package/addons/render/elements/front/items/self/content/html/html.js +0 -40
  67. package/addons/render/elements/front/items/self/content/markdown/markdown.css +0 -200
  68. package/addons/render/elements/front/items/self/content/markdown/markdown.js +0 -120
  69. package/addons/render/elements/front/items/self/data/comments/comments.css +0 -253
  70. package/addons/render/elements/front/items/self/data/comments/comments.js +0 -134
  71. package/addons/render/elements/front/items/self/data/files/files.css +0 -116
  72. package/addons/render/elements/front/items/self/data/files/files.js +0 -85
  73. package/addons/render/elements/front/items/self/data/folders/folders.css +0 -104
  74. package/addons/render/elements/front/items/self/data/folders/folders.js +0 -73
  75. package/addons/render/elements/front/items/self/data/inbox/inbox.css +0 -225
  76. package/addons/render/elements/front/items/self/data/inbox/inbox.js +0 -111
  77. package/addons/render/elements/front/items/self/data/logs/logs.css +0 -133
  78. package/addons/render/elements/front/items/self/data/logs/logs.js +0 -65
  79. package/addons/render/elements/front/items/self/data/plans/plans.css +0 -231
  80. package/addons/render/elements/front/items/self/data/plans/plans.js +0 -104
  81. package/addons/render/elements/front/items/self/data/properties/properties.css +0 -108
  82. package/addons/render/elements/front/items/self/data/properties/properties.js +0 -156
  83. package/addons/render/elements/front/items/self/data/table/table.css +0 -153
  84. package/addons/render/elements/front/items/self/data/table/table.js +0 -106
  85. package/addons/render/elements/front/items/self/data/timeline/timeline.css +0 -127
  86. package/addons/render/elements/front/items/self/data/timeline/timeline.js +0 -57
  87. package/addons/render/elements/front/items/self/feedback/alert/alert.css +0 -258
  88. package/addons/render/elements/front/items/self/feedback/alert/alert.js +0 -67
  89. package/addons/render/elements/front/items/self/feedback/confirm/confirm.css +0 -229
  90. package/addons/render/elements/front/items/self/feedback/confirm/confirm.js +0 -81
  91. package/addons/render/elements/front/items/self/feedback/loader/loader.css +0 -203
  92. package/addons/render/elements/front/items/self/feedback/loader/loader.js +0 -25
  93. package/addons/render/elements/front/items/self/feedback/progress/progress.css +0 -136
  94. package/addons/render/elements/front/items/self/feedback/progress/progress.js +0 -40
  95. package/addons/render/elements/front/items/self/form/button/button.js +0 -105
  96. package/addons/render/elements/front/items/self/form/button/styles/base.css +0 -176
  97. package/addons/render/elements/front/items/self/form/button/styles/sizes.css +0 -78
  98. package/addons/render/elements/front/items/self/form/button/styles/variants.css +0 -421
  99. package/addons/render/elements/front/items/self/form/checkbox/checkbox.js +0 -57
  100. package/addons/render/elements/front/items/self/form/checkbox/styles/base.css +0 -52
  101. package/addons/render/elements/front/items/self/form/checkbox/styles/sizes.css +0 -39
  102. package/addons/render/elements/front/items/self/form/checkbox/styles/variants.css +0 -121
  103. package/addons/render/elements/front/items/self/form/field/field.css +0 -96
  104. package/addons/render/elements/front/items/self/form/field/field.js +0 -39
  105. package/addons/render/elements/front/items/self/form/input/input.css +0 -111
  106. package/addons/render/elements/front/items/self/form/input/input.js +0 -78
  107. package/addons/render/elements/front/items/self/form/input/styles/base.css +0 -26
  108. package/addons/render/elements/front/items/self/form/input/styles/sizes.css +0 -15
  109. package/addons/render/elements/front/items/self/form/input/styles/variants.css +0 -98
  110. package/addons/render/elements/front/items/self/form/radio/radio.js +0 -57
  111. package/addons/render/elements/front/items/self/form/radio/styles/base.css +0 -48
  112. package/addons/render/elements/front/items/self/form/radio/styles/sizes.css +0 -36
  113. package/addons/render/elements/front/items/self/form/radio/styles/variants.css +0 -121
  114. package/addons/render/elements/front/items/self/form/rating/rating.css +0 -95
  115. package/addons/render/elements/front/items/self/form/rating/rating.js +0 -88
  116. package/addons/render/elements/front/items/self/form/section/section.css +0 -107
  117. package/addons/render/elements/front/items/self/form/section/section.js +0 -39
  118. package/addons/render/elements/front/items/self/form/slider/slider.css +0 -244
  119. package/addons/render/elements/front/items/self/form/slider/slider.js +0 -69
  120. package/addons/render/elements/front/items/self/form/textarea/textarea.css +0 -117
  121. package/addons/render/elements/front/items/self/form/textarea/textarea.js +0 -69
  122. package/addons/render/elements/front/items/self/layout/empty/empty.css +0 -154
  123. package/addons/render/elements/front/items/self/layout/empty/empty.js +0 -43
  124. package/addons/render/elements/front/items/self/layout/heading/heading.css +0 -117
  125. package/addons/render/elements/front/items/self/layout/heading/heading.js +0 -47
  126. package/addons/render/elements/front/items/self/layout/hero/hero.js +0 -88
  127. package/addons/render/elements/front/items/self/layout/hero/styles/base.css +0 -81
  128. package/addons/render/elements/front/items/self/layout/hero/styles/sizes.css +0 -24
  129. package/addons/render/elements/front/items/self/layout/hero/styles/variants.css +0 -98
  130. package/addons/render/elements/front/items/self/navigation/breadcrumb/addon/_class/addon.js +0 -9
  131. package/addons/render/elements/front/items/self/navigation/breadcrumb/addon/functions/get.js +0 -22
  132. package/addons/render/elements/front/items/self/navigation/breadcrumb/breadcrumb.css +0 -13
  133. package/addons/render/elements/front/items/self/navigation/breadcrumb/breadcrumb.js +0 -51
  134. package/addons/render/elements/front/items/self/navigation/footer/addon/_class/addon.js +0 -11
  135. package/addons/render/elements/front/items/self/navigation/footer/addon/functions/columns.js +0 -11
  136. package/addons/render/elements/front/items/self/navigation/footer/addon/functions/get.js +0 -34
  137. package/addons/render/elements/front/items/self/navigation/footer/footer.css +0 -283
  138. package/addons/render/elements/front/items/self/navigation/footer/footer.js +0 -139
  139. package/addons/render/elements/front/items/self/navigation/navbar/addon/_class/addon.js +0 -13
  140. package/addons/render/elements/front/items/self/navigation/navbar/addon/functions/active.js +0 -7
  141. package/addons/render/elements/front/items/self/navigation/navbar/addon/functions/get.js +0 -31
  142. package/addons/render/elements/front/items/self/navigation/navbar/navbar.css +0 -140
  143. package/addons/render/elements/front/items/self/navigation/navbar/navbar.js +0 -118
  144. package/addons/render/elements/front/items/self/navigation/pagination/pagination.css +0 -160
  145. package/addons/render/elements/front/items/self/navigation/pagination/pagination.js +0 -131
  146. package/addons/render/elements/front/items/self/navigation/sidebar/addon/_class/addon.js +0 -12
  147. package/addons/render/elements/front/items/self/navigation/sidebar/addon/functions/active.js +0 -7
  148. package/addons/render/elements/front/items/self/navigation/sidebar/addon/functions/get.js +0 -35
  149. package/addons/render/elements/front/items/self/navigation/sidebar/addon/functions/groups.js +0 -10
  150. package/addons/render/elements/front/items/self/navigation/sidebar/sidebar.css +0 -278
  151. package/addons/render/elements/front/items/self/navigation/sidebar/sidebar.js +0 -85
  152. package/addons/render/elements/front/items/self/navigation/stepper/stepper.css +0 -202
  153. package/addons/render/elements/front/items/self/navigation/stepper/stepper.js +0 -82
  154. package/addons/render/elements/front/items/self/navigation/tabs/addon.js +0 -32
  155. package/addons/render/elements/front/items/self/navigation/tabs/tabs.css +0 -239
  156. package/addons/render/elements/front/items/self/navigation/tabs/tabs.js +0 -76
  157. package/addons/render/elements/front/items/self/preview/html/html.css +0 -377
  158. package/addons/render/elements/front/items/self/preview/html/html.js +0 -107
  159. /package/addons/core/commands/{back → core}/addon.js +0 -0
@@ -1,93 +0,0 @@
1
- /* Base */
2
- .e-10533634 > .holder
3
- {
4
- display: flex;
5
- align-items: center;
6
- justify-content: center;
7
- overflow: auto;
8
- background: transparent;
9
- }
10
-
11
- .e-10533634 > .holder > .preview *
12
- {
13
- pointer-events: none;
14
- }
15
-
16
- /* Variants - Background */
17
- .e-10533634 > .holder[variant*="bg-1"]
18
- {
19
- background: var(--dh-bg-1);
20
- }
21
-
22
- .e-10533634 > .holder[variant*="bg-2"]
23
- {
24
- background: var(--dh-bg-2);
25
- }
26
-
27
- .e-10533634 > .holder[variant*="bg-3"]
28
- {
29
- background: var(--dh-bg-3);
30
- }
31
-
32
- .e-10533634 > .holder[variant*="bg-4"]
33
- {
34
- background: var(--dh-bg-4);
35
- }
36
-
37
- /* Variants - Border */
38
- .e-10533634 > .holder[variant*="border-full"]
39
- {
40
- border: 1px solid var(--dh-bg-2-border);
41
- }
42
-
43
- .e-10533634 > .holder[variant*="bg-1"][variant*="border-full"]
44
- {
45
- border: 1px solid var(--dh-bg-1-border);
46
- }
47
-
48
- .e-10533634 > .holder[variant*="bg-2"][variant*="border-full"]
49
- {
50
- border: 1px solid var(--dh-bg-2-border);
51
- }
52
-
53
- .e-10533634 > .holder[variant*="bg-3"][variant*="border-full"]
54
- {
55
- border: 1px solid var(--dh-bg-3-border);
56
- }
57
-
58
- .e-10533634 > .holder[variant*="bg-4"][variant*="border-full"]
59
- {
60
- border: 1px solid var(--dh-bg-4-border);
61
- }
62
-
63
- /* Variants - Radius */
64
- .e-10533634 > .holder[variant*="radius-s"]
65
- {
66
- border-radius: var(--dh-radius-s);
67
- }
68
-
69
- .e-10533634 > .holder[variant*="radius-m"]
70
- {
71
- border-radius: var(--dh-radius-m);
72
- }
73
-
74
- .e-10533634 > .holder[variant*="radius-l"]
75
- {
76
- border-radius: var(--dh-radius-l);
77
- }
78
-
79
- /* Size */
80
- .e-10533634 > .holder[size="s"]
81
- {
82
- height: 150px;
83
- }
84
-
85
- .e-10533634 > .holder[size="m"]
86
- {
87
- height: 300px;
88
- }
89
-
90
- .e-10533634 > .holder[size="l"]
91
- {
92
- height: 600px;
93
- }
@@ -1,40 +0,0 @@
1
- import elements from '#elements/load.js';
2
-
3
- elements.ItemAdd({
4
- id: 'interactive-html',
5
- icon: 'code',
6
- name: 'HTML Preview',
7
- description: 'Displays HTML content in a scaled-down preview container. Perfect for showcasing elements and components in a thumbnail view.',
8
- category: 'Content',
9
- author: 'Divhunt',
10
- config: {
11
- html: {
12
- type: 'string',
13
- value: '<div>Preview</div>'
14
- },
15
- zoom: {
16
- type: 'number',
17
- value: 0.5
18
- },
19
- size: {
20
- type: 'string',
21
- value: 'm',
22
- options: ['s', 'm', 'l']
23
- },
24
- variant: {
25
- type: 'array',
26
- value: [],
27
- options: ['bg-1', 'bg-2', 'bg-3', 'bg-4', 'border-full', 'radius-s', 'radius-m', 'radius-l']
28
- }
29
- },
30
- render: function()
31
- {
32
- return `
33
- <div class="holder" :variant="variant.join(' ')" :size="size">
34
- <div class="preview" :style="'zoom: ' + zoom">
35
- <div dh-html="html"></div>
36
- </div>
37
- </div>
38
- `;
39
- }
40
- });
@@ -1,200 +0,0 @@
1
- .e-56f2e505 .holder
2
- {
3
- color: var(--dh-text-1);
4
- font-family: var(--dh-font-primary);
5
- line-height: 1.6;
6
- }
7
-
8
- /* Size variants */
9
- .e-56f2e505 .holder[variant~="size-s"] { font-size: var(--dh-size-s); }
10
- .e-56f2e505 .holder[variant~="size-m"] { font-size: var(--dh-size-m); }
11
- .e-56f2e505 .holder[variant~="size-l"] { font-size: 16px; }
12
-
13
- /* Prose variant - optimized reading */
14
- .e-56f2e505 .holder[variant~="prose"]
15
- {
16
- max-width: 768px;
17
- line-height: 1.75;
18
- }
19
-
20
- /* Headings */
21
- .e-56f2e505 .holder h1
22
- {
23
- font-size: 2em;
24
- font-weight: 700;
25
- margin: var(--dh-spacing-l) 0 var(--dh-spacing-m);
26
- color: var(--dh-text-1);
27
- }
28
-
29
- .e-56f2e505 .holder h2
30
- {
31
- font-size: 1.5em;
32
- font-weight: 600;
33
- margin: var(--dh-spacing-l) 0 var(--dh-spacing-m);
34
- color: var(--dh-text-1);
35
- }
36
-
37
- .e-56f2e505 .holder h3
38
- {
39
- font-size: 1.25em;
40
- font-weight: 600;
41
- margin: var(--dh-spacing-m) 0 var(--dh-spacing-s);
42
- color: var(--dh-text-1);
43
- }
44
-
45
- .e-56f2e505 .holder h4,
46
- .e-56f2e505 .holder h5,
47
- .e-56f2e505 .holder h6
48
- {
49
- font-size: 1em;
50
- font-weight: 600;
51
- margin: var(--dh-spacing-m) 0 var(--dh-spacing-s);
52
- color: var(--dh-text-1);
53
- }
54
-
55
- .e-56f2e505 .holder h1:first-child,
56
- .e-56f2e505 .holder h2:first-child,
57
- .e-56f2e505 .holder h3:first-child
58
- {
59
- margin-top: 0;
60
- }
61
-
62
- /* Paragraphs */
63
- .e-56f2e505 .holder p
64
- {
65
- margin: 0 0 var(--dh-spacing-m);
66
- color: var(--dh-text-1);
67
- }
68
-
69
- .e-56f2e505 .holder p:last-child
70
- {
71
- margin-bottom: 0;
72
- }
73
-
74
- /* Lists */
75
- .e-56f2e505 .holder ul,
76
- .e-56f2e505 .holder ol
77
- {
78
- margin: 0 0 var(--dh-spacing-m);
79
- padding-left: var(--dh-spacing-l);
80
- }
81
-
82
- .e-56f2e505 .holder li
83
- {
84
- margin-bottom: var(--dh-spacing-s);
85
- }
86
-
87
- .e-56f2e505 .holder li:last-child
88
- {
89
- margin-bottom: 0;
90
- }
91
-
92
- /* Links */
93
- .e-56f2e505 .holder a
94
- {
95
- color: var(--dh-brand);
96
- text-decoration: none;
97
- transition: color 0.15s ease;
98
- }
99
-
100
- .e-56f2e505 .holder a:hover
101
- {
102
- text-decoration: underline;
103
- }
104
-
105
- /* Code blocks */
106
- .e-56f2e505 .holder .code-block
107
- {
108
- background: var(--dh-bg-3);
109
- border: 1px solid var(--dh-bg-3-border);
110
- border-radius: var(--dh-radius-m);
111
- padding: var(--dh-spacing-m);
112
- margin: var(--dh-spacing-m) 0;
113
- overflow-x: auto;
114
- font-family: 'SF Mono', 'Monaco', 'Inconsolata', 'Fira Code', monospace;
115
- font-size: 0.9em;
116
- line-height: 1.5;
117
- }
118
-
119
- .e-56f2e505 .holder .code-block code
120
- {
121
- background: none;
122
- padding: 0;
123
- border-radius: 0;
124
- }
125
-
126
- /* Inline code */
127
- .e-56f2e505 .holder .code-inline
128
- {
129
- background: var(--dh-bg-3);
130
- padding: 2px var(--dh-spacing-x);
131
- border-radius: var(--dh-radius-s);
132
- font-family: 'SF Mono', 'Monaco', 'Inconsolata', 'Fira Code', monospace;
133
- font-size: 0.9em;
134
- }
135
-
136
- /* Blockquotes */
137
- .e-56f2e505 .holder blockquote
138
- {
139
- border-left: 3px solid var(--dh-brand);
140
- padding-left: var(--dh-spacing-m);
141
- margin: var(--dh-spacing-m) 0;
142
- color: var(--dh-text-2);
143
- font-style: italic;
144
- }
145
-
146
- /* Horizontal rule */
147
- .e-56f2e505 .holder hr
148
- {
149
- border: none;
150
- border-top: 1px solid var(--dh-bg-3-border);
151
- margin: var(--dh-spacing-l) 0;
152
- }
153
-
154
- /* Tables */
155
- .e-56f2e505 .holder table
156
- {
157
- width: 100%;
158
- border-collapse: collapse;
159
- margin: var(--dh-spacing-m) 0;
160
- }
161
-
162
- .e-56f2e505 .holder th,
163
- .e-56f2e505 .holder td
164
- {
165
- padding: var(--dh-spacing-s) var(--dh-spacing-m);
166
- border: 1px solid var(--dh-bg-3-border);
167
- text-align: left;
168
- }
169
-
170
- .e-56f2e505 .holder th
171
- {
172
- background: var(--dh-bg-3);
173
- font-weight: 600;
174
- }
175
-
176
- .e-56f2e505 .holder tr:nth-child(even)
177
- {
178
- background: var(--dh-bg-2);
179
- }
180
-
181
- /* Images */
182
- .e-56f2e505 .holder img
183
- {
184
- max-width: 100%;
185
- height: auto;
186
- border-radius: var(--dh-radius-m);
187
- margin: var(--dh-spacing-m) 0;
188
- }
189
-
190
- /* Strong & emphasis */
191
- .e-56f2e505 .holder strong
192
- {
193
- font-weight: 600;
194
- color: var(--dh-text-1);
195
- }
196
-
197
- .e-56f2e505 .holder em
198
- {
199
- font-style: italic;
200
- }
@@ -1,120 +0,0 @@
1
- import elements from '#elements/load.js';
2
-
3
- const parseMarkdown = function(md)
4
- {
5
- if (!md) return '';
6
-
7
- let html = md;
8
-
9
- // Escape HTML
10
- html = html.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
11
-
12
- // Code blocks (``` ```)
13
- html = html.replace(/```(\w*)\n([\s\S]*?)```/g, (match, lang, code) =>
14
- {
15
- return `<pre class="code-block" data-lang="${lang}"><code>${code.trim()}</code></pre>`;
16
- });
17
-
18
- // Inline code (`)
19
- html = html.replace(/`([^`]+)`/g, '<code class="code-inline">$1</code>');
20
-
21
- // Headings
22
- html = html.replace(/^######\s+(.+)$/gm, '<h6>$1</h6>');
23
- html = html.replace(/^#####\s+(.+)$/gm, '<h5>$1</h5>');
24
- html = html.replace(/^####\s+(.+)$/gm, '<h4>$1</h4>');
25
- html = html.replace(/^###\s+(.+)$/gm, '<h3>$1</h3>');
26
- html = html.replace(/^##\s+(.+)$/gm, '<h2>$1</h2>');
27
- html = html.replace(/^#\s+(.+)$/gm, '<h1>$1</h1>');
28
-
29
- // Blockquotes
30
- html = html.replace(/^>\s+(.+)$/gm, '<blockquote>$1</blockquote>');
31
-
32
- // Horizontal rule
33
- html = html.replace(/^---$/gm, '<hr>');
34
- html = html.replace(/^\*\*\*$/gm, '<hr>');
35
-
36
- // Bold
37
- html = html.replace(/\*\*([^*]+)\*\*/g, '<strong>$1</strong>');
38
- html = html.replace(/__([^_]+)__/g, '<strong>$1</strong>');
39
-
40
- // Italic
41
- html = html.replace(/\*([^*]+)\*/g, '<em>$1</em>');
42
- html = html.replace(/_([^_]+)_/g, '<em>$1</em>');
43
-
44
- // Links
45
- html = html.replace(/\[([^\]]+)\]\(([^)]+)\)/g, '<a href="$2">$1</a>');
46
-
47
- // Images
48
- html = html.replace(/!\[([^\]]*)\]\(([^)]+)\)/g, '<img src="$2" alt="$1">');
49
-
50
- // Unordered lists
51
- html = html.replace(/^[\*\-]\s+(.+)$/gm, '<li>$1</li>');
52
- html = html.replace(/(<li>.*<\/li>\n?)+/g, '<ul>$&</ul>');
53
-
54
- // Ordered lists
55
- html = html.replace(/^\d+\.\s+(.+)$/gm, '<li>$1</li>');
56
-
57
- // Tables
58
- html = html.replace(/^\|(.+)\|$/gm, (match, content) =>
59
- {
60
- const cells = content.split('|').map(cell => cell.trim());
61
- if (cells.every(cell => /^[\-:]+$/.test(cell)))
62
- {
63
- return '<!-- table separator -->';
64
- }
65
- const cellTags = cells.map(cell => `<td>${cell}</td>`).join('');
66
- return `<tr>${cellTags}</tr>`;
67
- });
68
- html = html.replace(/(<tr>.*<\/tr>\n?)+/g, '<table>$&</table>');
69
- html = html.replace(/<!-- table separator -->\n?/g, '');
70
-
71
- // Paragraphs - wrap remaining text blocks
72
- html = html.split('\n\n').map(block =>
73
- {
74
- block = block.trim();
75
- if (!block) return '';
76
- if (block.startsWith('<h') ||
77
- block.startsWith('<ul') ||
78
- block.startsWith('<ol') ||
79
- block.startsWith('<blockquote') ||
80
- block.startsWith('<pre') ||
81
- block.startsWith('<table') ||
82
- block.startsWith('<hr'))
83
- {
84
- return block;
85
- }
86
- return `<p>${block.replace(/\n/g, '<br>')}</p>`;
87
- }).join('\n');
88
-
89
- return html;
90
- };
91
-
92
- elements.ItemAdd({
93
- id: 'markdown',
94
- icon: 'article',
95
- name: 'Markdown',
96
- description: 'Renders markdown content as styled HTML. Supports headings, paragraphs, lists, code blocks, blockquotes, tables, and links.',
97
- category: 'Content',
98
- author: 'Divhunt',
99
- config: {
100
- content: {
101
- type: 'string',
102
- value: ''
103
- },
104
- variant: {
105
- type: 'array',
106
- value: ['size-m'],
107
- options: ['size-s', 'size-m', 'size-l', 'prose']
108
- }
109
- },
110
- render: function()
111
- {
112
- this.parsedContent = parseMarkdown(this.content);
113
-
114
- return `
115
- <div class="holder" :variant="variant.join(' ')">
116
- <div dh-html="parsedContent"></div>
117
- </div>
118
- `;
119
- },
120
- });
@@ -1,253 +0,0 @@
1
- /* Base */
2
- .e-2452c60a> .holder
3
- {
4
- display: flex;
5
- flex-direction: column;
6
- background: var(--dh-bg-1);
7
- border-radius: var(--dh-radius-l);
8
- overflow: hidden;
9
- }
10
-
11
- .e-2452c60a> .holder > .comment-wrapper
12
- {
13
- display: flex;
14
- flex-direction: column;
15
- border-bottom: 1px solid var(--dh-bg-2-border);
16
- }
17
-
18
- .e-2452c60a> .holder > .comment-wrapper:last-child
19
- {
20
- border-bottom: none;
21
- }
22
-
23
- .e-2452c60a> .holder > .comment-wrapper > .comment
24
- {
25
- display: flex;
26
- gap: var(--dh-spacing-m);
27
- padding: var(--dh-spacing-l);
28
- }
29
-
30
- .e-2452c60a> .holder > .comment-wrapper > .comment > .avatar
31
- {
32
- width: 40px;
33
- height: 40px;
34
- border-radius: 50%;
35
- background: var(--dh-bg-3);
36
- display: flex;
37
- align-items: center;
38
- justify-content: center;
39
- flex-shrink: 0;
40
- }
41
-
42
- .e-2452c60a> .holder > .comment-wrapper > .comment > .avatar > .icon
43
- {
44
- font-size: 24px;
45
- color: var(--dh-text-2);
46
- }
47
-
48
- .e-2452c60a> .holder > .comment-wrapper > .comment > .avatar > img
49
- {
50
- width: 100%;
51
- height: 100%;
52
- object-fit: cover;
53
- border-radius: 50%;
54
- }
55
-
56
- .e-2452c60a> .holder > .comment-wrapper > .comment > .content
57
- {
58
- display: flex;
59
- flex-direction: column;
60
- gap: var(--dh-spacing-s);
61
- flex: 1;
62
- }
63
-
64
- .e-2452c60a> .holder > .comment-wrapper > .comment > .content > .header
65
- {
66
- display: flex;
67
- align-items: center;
68
- gap: var(--dh-spacing-s);
69
- }
70
-
71
- .e-2452c60a> .holder > .comment-wrapper > .comment > .content > .header > .author
72
- {
73
- font-weight: 600;
74
- color: var(--dh-text-1);
75
- font-size: var(--dh-size-m);
76
- }
77
-
78
- .e-2452c60a> .holder > .comment-wrapper > .comment > .content > .header > .time
79
- {
80
- font-size: var(--dh-size-s);
81
- color: var(--dh-text-2);
82
- }
83
-
84
- .e-2452c60a> .holder > .comment-wrapper > .comment > .content > .text
85
- {
86
- color: var(--dh-text-1);
87
- font-size: var(--dh-size-m);
88
- line-height: 1.6;
89
- }
90
-
91
- .e-2452c60a> .holder > .comment-wrapper > .comment > .content > .actions
92
- {
93
- display: flex;
94
- align-items: center;
95
- gap: var(--dh-spacing-m);
96
- margin-top: var(--dh-spacing-x);
97
- }
98
-
99
- .e-2452c60a> .holder > .comment-wrapper > .comment > .content > .actions > .action
100
- {
101
- display: flex;
102
- align-items: center;
103
- gap: var(--dh-spacing-x);
104
- padding: var(--dh-spacing-x) var(--dh-spacing-s);
105
- border-radius: var(--dh-radius-s);
106
- color: var(--dh-text-2);
107
- font-size: var(--dh-size-s);
108
- cursor: pointer;
109
- transition: all 0.2s ease;
110
- }
111
-
112
- .e-2452c60a> .holder > .comment-wrapper > .comment > .content > .actions > .action:hover
113
- {
114
- background: var(--dh-bg-2);
115
- color: var(--dh-brand);
116
- }
117
-
118
- .e-2452c60a> .holder > .comment-wrapper > .comment > .content > .actions > .action > .icon
119
- {
120
- font-size: 18px;
121
- }
122
-
123
- /* Replies */
124
- .e-2452c60a> .holder > .comment-wrapper > .replies
125
- {
126
- display: flex;
127
- flex-direction: column;
128
- gap: var(--dh-spacing-m);
129
- padding: var(--dh-spacing-m) var(--dh-spacing-l) var(--dh-spacing-l) calc(var(--dh-spacing-l) + 40px + var(--dh-spacing-m));
130
- background: var(--dh-bg-2);
131
- }
132
-
133
- .e-2452c60a> .holder > .comment-wrapper > .replies > .reply
134
- {
135
- display: flex;
136
- gap: var(--dh-spacing-m);
137
- }
138
-
139
- .e-2452c60a> .holder > .comment-wrapper > .replies > .reply > .avatar
140
- {
141
- width: 32px;
142
- height: 32px;
143
- border-radius: 50%;
144
- background: var(--dh-bg-3);
145
- display: flex;
146
- align-items: center;
147
- justify-content: center;
148
- flex-shrink: 0;
149
- }
150
-
151
- .e-2452c60a> .holder > .comment-wrapper > .replies > .reply > .avatar > .icon
152
- {
153
- font-size: 18px;
154
- color: var(--dh-text-2);
155
- }
156
-
157
- .e-2452c60a> .holder > .comment-wrapper > .replies > .reply > .avatar > img
158
- {
159
- width: 100%;
160
- height: 100%;
161
- object-fit: cover;
162
- border-radius: 50%;
163
- }
164
-
165
- .e-2452c60a> .holder > .comment-wrapper > .replies > .reply > .content
166
- {
167
- display: flex;
168
- flex-direction: column;
169
- gap: var(--dh-spacing-x);
170
- flex: 1;
171
- }
172
-
173
- .e-2452c60a> .holder > .comment-wrapper > .replies > .reply > .content > .header
174
- {
175
- display: flex;
176
- align-items: center;
177
- gap: var(--dh-spacing-x);
178
- }
179
-
180
- .e-2452c60a> .holder > .comment-wrapper > .replies > .reply > .content > .header > .author
181
- {
182
- font-weight: 600;
183
- color: var(--dh-text-1);
184
- font-size: var(--dh-size-s);
185
- }
186
-
187
- .e-2452c60a> .holder > .comment-wrapper > .replies > .reply > .content > .header > .time
188
- {
189
- font-size: 12px;
190
- color: var(--dh-text-2);
191
- }
192
-
193
- .e-2452c60a> .holder > .comment-wrapper > .replies > .reply > .content > .text
194
- {
195
- color: var(--dh-text-1);
196
- font-size: var(--dh-size-s);
197
- line-height: 1.6;
198
- }
199
-
200
- .e-2452c60a> .holder > .comment-wrapper > .replies > .reply > .content > .actions
201
- {
202
- display: flex;
203
- align-items: center;
204
- gap: var(--dh-spacing-m);
205
- margin-top: var(--dh-spacing-x);
206
- }
207
-
208
- .e-2452c60a> .holder > .comment-wrapper > .replies > .reply > .content > .actions > .action
209
- {
210
- display: flex;
211
- align-items: center;
212
- gap: var(--dh-spacing-x);
213
- padding: var(--dh-spacing-x) var(--dh-spacing-s);
214
- border-radius: var(--dh-radius-s);
215
- color: var(--dh-text-2);
216
- font-size: 12px;
217
- cursor: pointer;
218
- transition: all 0.2s ease;
219
- }
220
-
221
- .e-2452c60a> .holder > .comment-wrapper > .replies > .reply > .content > .actions > .action:hover
222
- {
223
- background: var(--dh-bg-3);
224
- color: var(--dh-brand);
225
- }
226
-
227
- .e-2452c60a> .holder > .comment-wrapper > .replies > .reply > .content > .actions > .action > .icon
228
- {
229
- font-size: 16px;
230
- }
231
-
232
- /* Variants - Border */
233
- .e-2452c60a> .holder[variant*="border"]
234
- {
235
- border: 1px solid var(--dh-bg-2-border);
236
- }
237
-
238
- /* Variants - Background */
239
- .e-2452c60a> .holder[variant*="bg-1"] { background: var(--dh-bg-1); }
240
- .e-2452c60a> .holder[variant*="bg-2"] { background: var(--dh-bg-2); }
241
- .e-2452c60a> .holder[variant*="bg-3"] { background: var(--dh-bg-3); }
242
-
243
- /* Variants - Compact */
244
- .e-2452c60a> .holder[variant*="compact"] > .comment-wrapper > .comment { padding: var(--dh-spacing-m); gap: var(--dh-spacing-s); }
245
- .e-2452c60a> .holder[variant*="compact"] > .comment-wrapper > .comment > .avatar { width: 32px; height: 32px; }
246
- .e-2452c60a> .holder[variant*="compact"] > .comment-wrapper > .comment > .avatar > .icon { font-size: 18px; }
247
- .e-2452c60a> .holder[variant*="compact"] > .comment-wrapper > .comment > .content > .header > .author,
248
- .e-2452c60a> .holder[variant*="compact"] > .comment-wrapper > .comment > .content > .text { font-size: var(--dh-size-s); }
249
- .e-2452c60a> .holder[variant*="compact"] > .comment-wrapper > .comment > .content > .actions > .action { padding: var(--dh-spacing-x); }
250
- .e-2452c60a> .holder[variant*="compact"] > .comment-wrapper > .comment > .content > .actions > .action > .icon { font-size: 16px; }
251
- .e-2452c60a> .holder[variant*="compact"] > .comment-wrapper > .replies { padding: var(--dh-spacing-s) var(--dh-spacing-m) var(--dh-spacing-m) calc(var(--dh-spacing-m) + 32px + var(--dh-spacing-s)); }
252
- .e-2452c60a> .holder[variant*="compact"] > .comment-wrapper > .replies > .reply > .avatar { width: 28px; height: 28px; }
253
- .e-2452c60a> .holder[variant*="compact"] > .comment-wrapper > .replies > .reply > .avatar > .icon { font-size: 16px; }