├── .gitattributes ├── .gitignore ├── CHANGELOG.md ├── LICENSE ├── README.md ├── analysis_options.yaml ├── example ├── README.md ├── build.yaml ├── pubspec.lock ├── pubspec.yaml └── web │ ├── components │ ├── hello_world.dart │ ├── md_editor.dart │ ├── md_viewer.dart │ └── x_counter.dart │ ├── css │ └── styles.css │ ├── index.html │ └── main.dart ├── lib ├── helpers.dart ├── html_web_components.dart └── src │ ├── mixins │ ├── adopted_styles.dart │ ├── cleanup.dart │ ├── reactive_attributes.dart │ └── shadow_dom.dart │ └── web_component.dart ├── peanut.yaml ├── pubspec.lock └── pubspec.yaml /.gitattributes: -------------------------------------------------------------------------------- 1 | # Auto detect text files and perform LF normalization 2 | * text=auto 3 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # https://dart.dev/guides/libraries/private-files 2 | # Created by `dart pub` 3 | .dart_tool/ 4 | build/ 5 | -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | ## 0.1.0 2 | 3 | - Adding base web component factory 4 | - Adding mixins for reactive attributes, shadow dom, adopted styles and cleanup 5 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | 2 | Apache License 3 | Version 2.0, January 2004 4 | http://www.apache.org/licenses/ 5 | 6 | TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION 7 | 8 | 1. Definitions. 9 | 10 | "License" shall mean the terms and conditions for use, reproduction, 11 | and distribution as defined by Sections 1 through 9 of this document. 12 | 13 | "Licensor" shall mean the copyright owner or entity authorized by 14 | the copyright owner that is granting the License. 15 | 16 | "Legal Entity" shall mean the union of the acting entity and all 17 | other entities that control, are controlled by, or are under common 18 | control with that entity. For the purposes of this definition, 19 | "control" means (i) the power, direct or indirect, to cause the 20 | direction or management of such entity, whether by contract or 21 | otherwise, or (ii) ownership of fifty percent (50%) or more of the 22 | outstanding shares, or (iii) beneficial ownership of such entity. 23 | 24 | "You" (or "Your") shall mean an individual or Legal Entity 25 | exercising permissions granted by this License. 26 | 27 | "Source" form shall mean the preferred form for making modifications, 28 | including but not limited to software source code, documentation 29 | source, and configuration files. 30 | 31 | "Object" form shall mean any form resulting from mechanical 32 | transformation or translation of a Source form, including but 33 | not limited to compiled object code, generated documentation, 34 | and conversions to other media types. 35 | 36 | "Work" shall mean the work of authorship, whether in Source or 37 | Object form, made available under the License, as indicated by a 38 | copyright notice that is included in or attached to the work 39 | (an example is provided in the Appendix below). 40 | 41 | "Derivative Works" shall mean any work, whether in Source or Object 42 | form, that is based on (or derived from) the Work and for which the 43 | editorial revisions, annotations, elaborations, or other modifications 44 | represent, as a whole, an original work of authorship. For the purposes 45 | of this License, Derivative Works shall not include works that remain 46 | separable from, or merely link (or bind by name) to the interfaces of, 47 | the Work and Derivative Works thereof. 48 | 49 | "Contribution" shall mean any work of authorship, including 50 | the original version of the Work and any modifications or additions 51 | to that Work or Derivative Works thereof, that is intentionally 52 | submitted to Licensor for inclusion in the Work by the copyright owner 53 | or by an individual or Legal Entity authorized to submit on behalf of 54 | the copyright owner. For the purposes of this definition, "submitted" 55 | means any form of electronic, verbal, or written communication sent 56 | to the Licensor or its representatives, including but not limited to 57 | communication on electronic mailing lists, source code control systems, 58 | and issue tracking systems that are managed by, or on behalf of, the 59 | Licensor for the purpose of discussing and improving the Work, but 60 | excluding communication that is conspicuously marked or otherwise 61 | designated in writing by the copyright owner as "Not a Contribution." 62 | 63 | "Contributor" shall mean Licensor and any individual or Legal Entity 64 | on behalf of whom a Contribution has been received by Licensor and 65 | subsequently incorporated within the Work. 66 | 67 | 2. Grant of Copyright License. Subject to the terms and conditions of 68 | this License, each Contributor hereby grants to You a perpetual, 69 | worldwide, non-exclusive, no-charge, royalty-free, irrevocable 70 | copyright license to reproduce, prepare Derivative Works of, 71 | publicly display, publicly perform, sublicense, and distribute the 72 | Work and such Derivative Works in Source or Object form. 73 | 74 | 3. Grant of Patent License. Subject to the terms and conditions of 75 | this License, each Contributor hereby grants to You a perpetual, 76 | worldwide, non-exclusive, no-charge, royalty-free, irrevocable 77 | (except as stated in this section) patent license to make, have made, 78 | use, offer to sell, sell, import, and otherwise transfer the Work, 79 | where such license applies only to those patent claims licensable 80 | by such Contributor that are necessarily infringed by their 81 | Contribution(s) alone or by combination of their Contribution(s) 82 | with the Work to which such Contribution(s) was submitted. If You 83 | institute patent litigation against any entity (including a 84 | cross-claim or counterclaim in a lawsuit) alleging that the Work 85 | or a Contribution incorporated within the Work constitutes direct 86 | or contributory patent infringement, then any patent licenses 87 | granted to You under this License for that Work shall terminate 88 | as of the date such litigation is filed. 89 | 90 | 4. Redistribution. You may reproduce and distribute copies of the 91 | Work or Derivative Works thereof in any medium, with or without 92 | modifications, and in Source or Object form, provided that You 93 | meet the following conditions: 94 | 95 | (a) You must give any other recipients of the Work or 96 | Derivative Works a copy of this License; and 97 | 98 | (b) You must cause any modified files to carry prominent notices 99 | stating that You changed the files; and 100 | 101 | (c) You must retain, in the Source form of any Derivative Works 102 | that You distribute, all copyright, patent, trademark, and 103 | attribution notices from the Source form of the Work, 104 | excluding those notices that do not pertain to any part of 105 | the Derivative Works; and 106 | 107 | (d) If the Work includes a "NOTICE" text file as part of its 108 | distribution, then any Derivative Works that You distribute must 109 | include a readable copy of the attribution notices contained 110 | within such NOTICE file, excluding those notices that do not 111 | pertain to any part of the Derivative Works, in at least one 112 | of the following places: within a NOTICE text file distributed 113 | as part of the Derivative Works; within the Source form or 114 | documentation, if provided along with the Derivative Works; or, 115 | within a display generated by the Derivative Works, if and 116 | wherever such third-party notices normally appear. The contents 117 | of the NOTICE file are for informational purposes only and 118 | do not modify the License. You may add Your own attribution 119 | notices within Derivative Works that You distribute, alongside 120 | or as an addendum to the NOTICE text from the Work, provided 121 | that such additional attribution notices cannot be construed 122 | as modifying the License. 123 | 124 | You may add Your own copyright statement to Your modifications and 125 | may provide additional or different license terms and conditions 126 | for use, reproduction, or distribution of Your modifications, or 127 | for any such Derivative Works as a whole, provided Your use, 128 | reproduction, and distribution of the Work otherwise complies with 129 | the conditions stated in this License. 130 | 131 | 5. Submission of Contributions. Unless You explicitly state otherwise, 132 | any Contribution intentionally submitted for inclusion in the Work 133 | by You to the Licensor shall be under the terms and conditions of 134 | this License, without any additional terms or conditions. 135 | Notwithstanding the above, nothing herein shall supersede or modify 136 | the terms of any separate license agreement you may have executed 137 | with Licensor regarding such Contributions. 138 | 139 | 6. Trademarks. This License does not grant permission to use the trade 140 | names, trademarks, service marks, or product names of the Licensor, 141 | except as required for reasonable and customary use in describing the 142 | origin of the Work and reproducing the content of the NOTICE file. 143 | 144 | 7. Disclaimer of Warranty. Unless required by applicable law or 145 | agreed to in writing, Licensor provides the Work (and each 146 | Contributor provides its Contributions) on an "AS IS" BASIS, 147 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or 148 | implied, including, without limitation, any warranties or conditions 149 | of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A 150 | PARTICULAR PURPOSE. You are solely responsible for determining the 151 | appropriateness of using or redistributing the Work and assume any 152 | risks associated with Your exercise of permissions under this License. 153 | 154 | 8. Limitation of Liability. In no event and under no legal theory, 155 | whether in tort (including negligence), contract, or otherwise, 156 | unless required by applicable law (such as deliberate and grossly 157 | negligent acts) or agreed to in writing, shall any Contributor be 158 | liable to You for damages, including any direct, indirect, special, 159 | incidental, or consequential damages of any character arising as a 160 | result of this License or out of the use or inability to use the 161 | Work (including but not limited to damages for loss of goodwill, 162 | work stoppage, computer failure or malfunction, or any and all 163 | other commercial damages or losses), even if such Contributor 164 | has been advised of the possibility of such damages. 165 | 166 | 9. Accepting Warranty or Additional Liability. While redistributing 167 | the Work or Derivative Works thereof, You may choose to offer, 168 | and charge a fee for, acceptance of support, warranty, indemnity, 169 | or other liability obligations and/or rights consistent with this 170 | License. However, in accepting such obligations, You may act only 171 | on Your own behalf and on Your sole responsibility, not on behalf 172 | of any other Contributor, and only if You agree to indemnify, 173 | defend, and hold each Contributor harmless for any liability 174 | incurred by, or claims asserted against, such Contributor by reason 175 | of your accepting any such warranty or additional liability. 176 | 177 | END OF TERMS AND CONDITIONS 178 | 179 | APPENDIX: How to apply the Apache License to your work. 180 | 181 | To apply the Apache License to your work, attach the following 182 | boilerplate notice, with the fields enclosed by brackets "[]" 183 | replaced with your own identifying information. (Don't include 184 | the brackets!) The text should be enclosed in the appropriate 185 | comment syntax for the file format. We also recommend that a 186 | file or class name and description of purpose be included on the 187 | same "printed page" as the copyright notice for easier 188 | identification within third-party archives. 189 | 190 | Copyright [yyyy] [name of copyright owner] 191 | 192 | Licensed under the Apache License, Version 2.0 (the "License"); 193 | you may not use this file except in compliance with the License. 194 | You may obtain a copy of the License at 195 | 196 | http://www.apache.org/licenses/LICENSE-2.0 197 | 198 | Unless required by applicable law or agreed to in writing, software 199 | distributed under the License is distributed on an "AS IS" BASIS, 200 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 201 | See the License for the specific language governing permissions and 202 | limitations under the License. 203 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Dart Web Components 2 | 3 | How to create [web components](https://developer.mozilla.org/en-US/docs/Web/API/Web_components) with Dart that compile to WASM and JS. 4 | 5 | You can use them in any framework or library that supports HTML. 6 | 7 | > Disclaimer: This is not an official Google project. 8 | 9 | ## Getting Started 10 | 11 | ### 1. Extend the WebComponent class 12 | 13 | ```dart 14 | import 'package:html_web_components/html_web_components.dart'; 15 | 16 | class MyComponent extends WebComponent { 17 | ... 18 | } 19 | ``` 20 | 21 | ### 2. Define the component 22 | 23 | Use the connectedCallback to define the component setup logic instead of the constructor. 24 | 25 | ```dart 26 | import 'package:html_web_components/html_web_components.dart'; 27 | 28 | class MyComponent extends WebComponent { 29 | @override 30 | void connectedCallback() { 31 | element.innerText = "Hello World!"; 32 | } 33 | } 34 | ``` 35 | 36 | ### 3. Register the component 37 | 38 | ```dart 39 | import 'package:html_web_components/html_web_components.dart'; 40 | ... 41 | 42 | void main() { 43 | WebComponent.define('my-component', MyComponent.new); 44 | } 45 | ``` 46 | 47 | ## Mixins 48 | 49 | There are some helper mixins to make it easier to work with web components. 50 | 51 | ### WebComponentCleanupMixin 52 | 53 | This mixin adds an array of callbacks that will be disposed when the component is disconnected. 54 | 55 | ```dart 56 | import 'package:html_web_components/html_web_components.dart'; 57 | import 'package:html_web_components/helpers.dart'; 58 | 59 | class MyComponent extends WebComponent with WebComponentCleanupMixin { 60 | @override 61 | void connectedCallback() { 62 | this.cleanup.add(() => print('cleaned up!')); 63 | } 64 | } 65 | ``` 66 | 67 | ### WebComponentShadowDomMixin 68 | 69 | This mixin adds a shadow root to the component. 70 | 71 | ```dart 72 | import 'package:html_web_components/html_web_components.dart'; 73 | import 'package:html_web_components/helpers.dart'; 74 | 75 | class MyComponent extends WebComponent with WebComponentShadowDomMixin { 76 | @override 77 | void connectedCallback() { 78 | getRoot().innerHtml = '

Hello World

'; 79 | } 80 | } 81 | ``` 82 | 83 | ### WebComponentAdoptedStylesMixin 84 | 85 | This mixin adds adopted styles to the component. This only works with the shadow dom. 86 | 87 | ```dart 88 | import 'package:html_web_components/html_web_components.dart'; 89 | import 'package:html_web_components/helpers.dart'; 90 | import 'package:signals_core/signals_core.dart'; 91 | 92 | class MyComponent extends WebComponent with WebComponentShadowDomMixin, WebComponentAdoptedStylesMixin { 93 | @override 94 | final sheets = computed>(() { 95 | final sheet = CSSStyleSheet(); 96 | sheet.replaceSync('h1 { color: red; }'); 97 | return [sheet]; 98 | }); 99 | 100 | @override 101 | void connectedCallback() { 102 | getRoot().innerHtml = '

Hello World

'; 103 | } 104 | } 105 | ``` 106 | 107 | ### WebComponentReactiveAttributesMixin 108 | 109 | This mixin adds reactive attributes to the component. 110 | 111 | ```dart 112 | import 'package:html_web_components/html_web_components.dart'; 113 | import 'package:html_web_components/helpers.dart'; 114 | import 'package:signals_core/signals_core.dart'; 115 | 116 | class MyComponent extends WebComponent with WebComponentReactiveAttributesMixin { 117 | @override 118 | List observedAttributes = ['name']; 119 | 120 | final src = attr('name'); 121 | 122 | @override 123 | void connectedCallback() { 124 | cleanup.add(effect((){ 125 | element.innerHtml = '

Hello $src

'; 126 | })); 127 | } 128 | } 129 | ``` 130 | 131 | ## Links 132 | 133 | - [Web Components](https://developer.mozilla.org/en-US/docs/Web/Web_Components) 134 | - [Are web components used a lot?](https://arewebcomponentsathingyet.com) 135 | - [Dart Web Components](https://github.com/dart-archive/web-components) 136 | -------------------------------------------------------------------------------- /analysis_options.yaml: -------------------------------------------------------------------------------- 1 | # This file configures the static analysis results for your project (errors, 2 | # warnings, and lints). 3 | # 4 | # This enables the 'recommended' set of lints from `package:lints`. 5 | # This set helps identify many issues that may lead to problems when running 6 | # or consuming Dart code, and enforces writing Dart using a single, idiomatic 7 | # style and format. 8 | # 9 | # If you want a smaller set of lints you can change this to specify 10 | # 'package:lints/core.yaml'. These are just the most critical lints 11 | # (the recommended set includes the core lints). 12 | # The core lints are also what is used by pub.dev for scoring packages. 13 | 14 | include: package:lints/recommended.yaml 15 | analyzer: 16 | errors: 17 | overridden_fields: ignore 18 | 19 | # Uncomment the following section to specify additional rules. 20 | 21 | # linter: 22 | # rules: 23 | # - camel_case_types 24 | 25 | # analyzer: 26 | # exclude: 27 | # - path/to/excluded/files/** 28 | 29 | # For more information about the core and recommended set of lints, see 30 | # https://dart.dev/go/core-lints 31 | 32 | # For additional information about configuring this file, see 33 | # https://dart.dev/guides/language/analysis-options 34 | -------------------------------------------------------------------------------- /example/README.md: -------------------------------------------------------------------------------- 1 | # Example of Dart Web Components 2 | 3 | Simple example with using Dart to create web components and compiling Dart to WASM and JS. 4 | 5 | ## Build 6 | 7 | ```bash 8 | dart run build_runner build -o web:build --release 9 | ``` 10 | 11 | ## Serve 12 | 13 | ```bash 14 | dart run build_runner serve web 15 | ``` 16 | 17 | Open http://localhost:8080 18 | -------------------------------------------------------------------------------- /example/build.yaml: -------------------------------------------------------------------------------- 1 | # See https://github.com/dart-lang/build/tree/master/build_web_compilers#configuration 2 | targets: 3 | $default: 4 | builders: 5 | build_web_compilers|entrypoint: 6 | generate_for: 7 | - web/**.dart 8 | options: 9 | compilers: 10 | dart2wasm: 11 | args: 12 | - -O4 13 | - --no-strip-wasm 14 | dart2js: 15 | args: 16 | - -O4 -------------------------------------------------------------------------------- /example/pubspec.lock: -------------------------------------------------------------------------------- 1 | # Generated by pub 2 | # See https://dart.dev/tools/pub/glossary#lockfile 3 | packages: 4 | _fe_analyzer_shared: 5 | dependency: transitive 6 | description: 7 | name: _fe_analyzer_shared 8 | sha256: dc27559385e905ad30838356c5f5d574014ba39872d732111cd07ac0beff4c57 9 | url: "https://pub.dev" 10 | source: hosted 11 | version: "80.0.0" 12 | analyzer: 13 | dependency: transitive 14 | description: 15 | name: analyzer 16 | sha256: "192d1c5b944e7e53b24b5586db760db934b177d4147c42fbca8c8c5f1eb8d11e" 17 | url: "https://pub.dev" 18 | source: hosted 19 | version: "7.3.0" 20 | archive: 21 | dependency: transitive 22 | description: 23 | name: archive 24 | sha256: "6199c74e3db4fbfbd04f66d739e72fe11c8a8957d5f219f1f4482dbde6420b5a" 25 | url: "https://pub.dev" 26 | source: hosted 27 | version: "4.0.2" 28 | args: 29 | dependency: transitive 30 | description: 31 | name: args 32 | sha256: bf9f5caeea8d8fe6721a9c358dd8a5c1947b27f1cfaa18b39c301273594919e6 33 | url: "https://pub.dev" 34 | source: hosted 35 | version: "2.6.0" 36 | async: 37 | dependency: transitive 38 | description: 39 | name: async 40 | sha256: "758e6d74e971c3e5aceb4110bfd6698efc7f501675bcfe0c775459a8140750eb" 41 | url: "https://pub.dev" 42 | source: hosted 43 | version: "2.13.0" 44 | bazel_worker: 45 | dependency: transitive 46 | description: 47 | name: bazel_worker 48 | sha256: "57035594b87d9f5af99f1a80e1edf5411dadbdf5acfc4f90403e3849f57dd0f0" 49 | url: "https://pub.dev" 50 | source: hosted 51 | version: "1.1.2" 52 | boolean_selector: 53 | dependency: transitive 54 | description: 55 | name: boolean_selector 56 | sha256: "8aab1771e1243a5063b8b0ff68042d67334e3feab9e95b9490f9a6ebf73b42ea" 57 | url: "https://pub.dev" 58 | source: hosted 59 | version: "2.1.2" 60 | build: 61 | dependency: transitive 62 | description: 63 | name: build 64 | sha256: cef23f1eda9b57566c81e2133d196f8e3df48f244b317368d65c5943d91148f0 65 | url: "https://pub.dev" 66 | source: hosted 67 | version: "2.4.2" 68 | build_config: 69 | dependency: transitive 70 | description: 71 | name: build_config 72 | sha256: "4ae2de3e1e67ea270081eaee972e1bd8f027d459f249e0f1186730784c2e7e33" 73 | url: "https://pub.dev" 74 | source: hosted 75 | version: "1.1.2" 76 | build_daemon: 77 | dependency: transitive 78 | description: 79 | name: build_daemon 80 | sha256: "8e928697a82be082206edb0b9c99c5a4ad6bc31c9e9b8b2f291ae65cd4a25daa" 81 | url: "https://pub.dev" 82 | source: hosted 83 | version: "4.0.4" 84 | build_modules: 85 | dependency: transitive 86 | description: 87 | name: build_modules 88 | sha256: "0327cb2a9eefba197b63f71872c38bafe4c63b331797a43618d6c270516a6447" 89 | url: "https://pub.dev" 90 | source: hosted 91 | version: "5.0.11" 92 | build_resolvers: 93 | dependency: transitive 94 | description: 95 | name: build_resolvers 96 | sha256: b9e4fda21d846e192628e7a4f6deda6888c36b5b69ba02ff291a01fd529140f0 97 | url: "https://pub.dev" 98 | source: hosted 99 | version: "2.4.4" 100 | build_runner: 101 | dependency: "direct dev" 102 | description: 103 | name: build_runner 104 | sha256: "058fe9dce1de7d69c4b84fada934df3e0153dd000758c4d65964d0166779aa99" 105 | url: "https://pub.dev" 106 | source: hosted 107 | version: "2.4.15" 108 | build_runner_core: 109 | dependency: transitive 110 | description: 111 | name: build_runner_core 112 | sha256: "22e3aa1c80e0ada3722fe5b63fd43d9c8990759d0a2cf489c8c5d7b2bdebc021" 113 | url: "https://pub.dev" 114 | source: hosted 115 | version: "8.0.0" 116 | build_web_compilers: 117 | dependency: "direct dev" 118 | description: 119 | name: build_web_compilers 120 | sha256: "01cfac85e835d9fe8e87928958586ddbd477d98cfac5af2442cb2df6bbb42dff" 121 | url: "https://pub.dev" 122 | source: hosted 123 | version: "4.1.1" 124 | built_collection: 125 | dependency: transitive 126 | description: 127 | name: built_collection 128 | sha256: "376e3dd27b51ea877c28d525560790aee2e6fbb5f20e2f85d5081027d94e2100" 129 | url: "https://pub.dev" 130 | source: hosted 131 | version: "5.1.1" 132 | built_value: 133 | dependency: transitive 134 | description: 135 | name: built_value 136 | sha256: "28a712df2576b63c6c005c465989a348604960c0958d28be5303ba9baa841ac2" 137 | url: "https://pub.dev" 138 | source: hosted 139 | version: "8.9.3" 140 | checked_yaml: 141 | dependency: transitive 142 | description: 143 | name: checked_yaml 144 | sha256: feb6bed21949061731a7a75fc5d2aa727cf160b91af9a3e464c5e3a32e28b5ff 145 | url: "https://pub.dev" 146 | source: hosted 147 | version: "2.0.3" 148 | code_builder: 149 | dependency: transitive 150 | description: 151 | name: code_builder 152 | sha256: "0ec10bf4a89e4c613960bf1e8b42c64127021740fb21640c29c909826a5eea3e" 153 | url: "https://pub.dev" 154 | source: hosted 155 | version: "4.10.1" 156 | collection: 157 | dependency: transitive 158 | description: 159 | name: collection 160 | sha256: "2f5709ae4d3d59dd8f7cd309b4e023046b57d8a6c82130785d2b0e5868084e76" 161 | url: "https://pub.dev" 162 | source: hosted 163 | version: "1.19.1" 164 | convert: 165 | dependency: transitive 166 | description: 167 | name: convert 168 | sha256: b30acd5944035672bc15c6b7a8b47d773e41e2f17de064350988c5d02adb1c68 169 | url: "https://pub.dev" 170 | source: hosted 171 | version: "3.1.2" 172 | crypto: 173 | dependency: transitive 174 | description: 175 | name: crypto 176 | sha256: "1e445881f28f22d6140f181e07737b22f1e099a5e1ff94b0af2f9e4a463f4855" 177 | url: "https://pub.dev" 178 | source: hosted 179 | version: "3.0.6" 180 | dart_style: 181 | dependency: transitive 182 | description: 183 | name: dart_style 184 | sha256: "27eb0ae77836989a3bc541ce55595e8ceee0992807f14511552a898ddd0d88ac" 185 | url: "https://pub.dev" 186 | source: hosted 187 | version: "3.0.1" 188 | ffi: 189 | dependency: transitive 190 | description: 191 | name: ffi 192 | sha256: "16ed7b077ef01ad6170a3d0c57caa4a112a38d7a2ed5602e0aca9ca6f3d98da6" 193 | url: "https://pub.dev" 194 | source: hosted 195 | version: "2.1.3" 196 | file: 197 | dependency: transitive 198 | description: 199 | name: file 200 | sha256: a3b4f84adafef897088c160faf7dfffb7696046cb13ae90b508c2cbc95d3b8d4 201 | url: "https://pub.dev" 202 | source: hosted 203 | version: "7.0.1" 204 | fixnum: 205 | dependency: transitive 206 | description: 207 | name: fixnum 208 | sha256: b6dc7065e46c974bc7c5f143080a6764ec7a4be6da1285ececdc37be96de53be 209 | url: "https://pub.dev" 210 | source: hosted 211 | version: "1.1.1" 212 | frontend_server_client: 213 | dependency: transitive 214 | description: 215 | name: frontend_server_client 216 | sha256: f64a0333a82f30b0cca061bc3d143813a486dc086b574bfb233b7c1372427694 217 | url: "https://pub.dev" 218 | source: hosted 219 | version: "4.0.0" 220 | glob: 221 | dependency: transitive 222 | description: 223 | name: glob 224 | sha256: c3f1ee72c96f8f78935e18aa8cecced9ab132419e8625dc187e1c2408efc20de 225 | url: "https://pub.dev" 226 | source: hosted 227 | version: "2.1.3" 228 | graphs: 229 | dependency: transitive 230 | description: 231 | name: graphs 232 | sha256: "741bbf84165310a68ff28fe9e727332eef1407342fca52759cb21ad8177bb8d0" 233 | url: "https://pub.dev" 234 | source: hosted 235 | version: "2.3.2" 236 | html_web_components: 237 | dependency: "direct main" 238 | description: 239 | path: ".." 240 | relative: true 241 | source: path 242 | version: "0.1.0" 243 | http: 244 | dependency: "direct main" 245 | description: 246 | name: http 247 | sha256: fe7ab022b76f3034adc518fb6ea04a82387620e19977665ea18d30a1cf43442f 248 | url: "https://pub.dev" 249 | source: hosted 250 | version: "1.3.0" 251 | http_multi_server: 252 | dependency: transitive 253 | description: 254 | name: http_multi_server 255 | sha256: aa6199f908078bb1c5efb8d8638d4ae191aac11b311132c3ef48ce352fb52ef8 256 | url: "https://pub.dev" 257 | source: hosted 258 | version: "3.2.2" 259 | http_parser: 260 | dependency: transitive 261 | description: 262 | name: http_parser 263 | sha256: "178d74305e7866013777bab2c3d8726205dc5a4dd935297175b19a23a2e66571" 264 | url: "https://pub.dev" 265 | source: hosted 266 | version: "4.1.2" 267 | io: 268 | dependency: transitive 269 | description: 270 | name: io 271 | sha256: dfd5a80599cf0165756e3181807ed3e77daf6dd4137caaad72d0b7931597650b 272 | url: "https://pub.dev" 273 | source: hosted 274 | version: "1.0.5" 275 | js: 276 | dependency: transitive 277 | description: 278 | name: js 279 | sha256: c1b2e9b5ea78c45e1a0788d29606ba27dc5f71f019f32ca5140f61ef071838cf 280 | url: "https://pub.dev" 281 | source: hosted 282 | version: "0.7.1" 283 | json_annotation: 284 | dependency: transitive 285 | description: 286 | name: json_annotation 287 | sha256: "1ce844379ca14835a50d2f019a3099f419082cfdd231cd86a142af94dd5c6bb1" 288 | url: "https://pub.dev" 289 | source: hosted 290 | version: "4.9.0" 291 | lints: 292 | dependency: "direct dev" 293 | description: 294 | name: lints 295 | sha256: c35bb79562d980e9a453fc715854e1ed39e24e7d0297a880ef54e17f9874a9d7 296 | url: "https://pub.dev" 297 | source: hosted 298 | version: "5.1.1" 299 | logging: 300 | dependency: transitive 301 | description: 302 | name: logging 303 | sha256: c8245ada5f1717ed44271ed1c26b8ce85ca3228fd2ffdb75468ab01979309d61 304 | url: "https://pub.dev" 305 | source: hosted 306 | version: "1.3.0" 307 | markdown: 308 | dependency: "direct main" 309 | description: 310 | name: markdown 311 | sha256: "935e23e1ff3bc02d390bad4d4be001208ee92cc217cb5b5a6c19bc14aaa318c1" 312 | url: "https://pub.dev" 313 | source: hosted 314 | version: "7.3.0" 315 | matcher: 316 | dependency: transitive 317 | description: 318 | name: matcher 319 | sha256: dc58c723c3c24bf8d3e2d3ad3f2f9d7bd9cf43ec6feaa64181775e60190153f2 320 | url: "https://pub.dev" 321 | source: hosted 322 | version: "0.12.17" 323 | meta: 324 | dependency: transitive 325 | description: 326 | name: meta 327 | sha256: e3641ec5d63ebf0d9b41bd43201a66e3fc79a65db5f61fc181f04cd27aab950c 328 | url: "https://pub.dev" 329 | source: hosted 330 | version: "1.16.0" 331 | mime: 332 | dependency: transitive 333 | description: 334 | name: mime 335 | sha256: "41a20518f0cb1256669420fdba0cd90d21561e560ac240f26ef8322e45bb7ed6" 336 | url: "https://pub.dev" 337 | source: hosted 338 | version: "2.0.0" 339 | package_config: 340 | dependency: transitive 341 | description: 342 | name: package_config 343 | sha256: "92d4488434b520a62570293fbd33bb556c7d49230791c1b4bbd973baf6d2dc67" 344 | url: "https://pub.dev" 345 | source: hosted 346 | version: "2.1.1" 347 | path: 348 | dependency: transitive 349 | description: 350 | name: path 351 | sha256: "75cca69d1490965be98c73ceaea117e8a04dd21217b37b292c9ddbec0d955bc5" 352 | url: "https://pub.dev" 353 | source: hosted 354 | version: "1.9.1" 355 | pool: 356 | dependency: transitive 357 | description: 358 | name: pool 359 | sha256: "20fe868b6314b322ea036ba325e6fc0711a22948856475e2c2b6306e8ab39c2a" 360 | url: "https://pub.dev" 361 | source: hosted 362 | version: "1.5.1" 363 | posix: 364 | dependency: transitive 365 | description: 366 | name: posix 367 | sha256: a0117dc2167805aa9125b82eee515cc891819bac2f538c83646d355b16f58b9a 368 | url: "https://pub.dev" 369 | source: hosted 370 | version: "6.0.1" 371 | preact_signals: 372 | dependency: transitive 373 | description: 374 | name: preact_signals 375 | sha256: a5b445796a02244b85fa43d79a7030fbfbbb08f7c48277ee93c636140a8fb2e0 376 | url: "https://pub.dev" 377 | source: hosted 378 | version: "1.8.3" 379 | protobuf: 380 | dependency: transitive 381 | description: 382 | name: protobuf 383 | sha256: "68645b24e0716782e58948f8467fd42a880f255096a821f9e7d0ec625b00c84d" 384 | url: "https://pub.dev" 385 | source: hosted 386 | version: "3.1.0" 387 | pub_semver: 388 | dependency: transitive 389 | description: 390 | name: pub_semver 391 | sha256: "7b3cfbf654f3edd0c6298ecd5be782ce997ddf0e00531b9464b55245185bbbbd" 392 | url: "https://pub.dev" 393 | source: hosted 394 | version: "2.1.5" 395 | pubspec_parse: 396 | dependency: transitive 397 | description: 398 | name: pubspec_parse 399 | sha256: "0560ba233314abbed0a48a2956f7f022cce7c3e1e73df540277da7544cad4082" 400 | url: "https://pub.dev" 401 | source: hosted 402 | version: "1.5.0" 403 | scratch_space: 404 | dependency: transitive 405 | description: 406 | name: scratch_space 407 | sha256: "8510fbff458d733a58fc427057d1ac86303b376d609d6e1bc43f240aad9aa445" 408 | url: "https://pub.dev" 409 | source: hosted 410 | version: "1.0.2" 411 | shelf: 412 | dependency: transitive 413 | description: 414 | name: shelf 415 | sha256: e7dd780a7ffb623c57850b33f43309312fc863fb6aa3d276a754bb299839ef12 416 | url: "https://pub.dev" 417 | source: hosted 418 | version: "1.4.2" 419 | shelf_web_socket: 420 | dependency: transitive 421 | description: 422 | name: shelf_web_socket 423 | sha256: "3632775c8e90d6c9712f883e633716432a27758216dfb61bd86a8321c0580925" 424 | url: "https://pub.dev" 425 | source: hosted 426 | version: "3.0.0" 427 | signals_core: 428 | dependency: "direct main" 429 | description: 430 | name: signals_core 431 | sha256: "5668ff1fb953fe48c88b03d50d43c5fe128cd7c831b932a4157f5f6be868b80f" 432 | url: "https://pub.dev" 433 | source: hosted 434 | version: "6.0.2" 435 | source_maps: 436 | dependency: transitive 437 | description: 438 | name: source_maps 439 | sha256: "190222579a448b03896e0ca6eca5998fa810fda630c1d65e2f78b3f638f54812" 440 | url: "https://pub.dev" 441 | source: hosted 442 | version: "0.10.13" 443 | source_span: 444 | dependency: transitive 445 | description: 446 | name: source_span 447 | sha256: "254ee5351d6cb365c859e20ee823c3bb479bf4a293c22d17a9f1bf144ce86f7c" 448 | url: "https://pub.dev" 449 | source: hosted 450 | version: "1.10.1" 451 | stack_trace: 452 | dependency: transitive 453 | description: 454 | name: stack_trace 455 | sha256: "8b27215b45d22309b5cddda1aa2b19bdfec9df0e765f2de506401c071d38d1b1" 456 | url: "https://pub.dev" 457 | source: hosted 458 | version: "1.12.1" 459 | stream_channel: 460 | dependency: transitive 461 | description: 462 | name: stream_channel 463 | sha256: "969e04c80b8bcdf826f8f16579c7b14d780458bd97f56d107d3950fdbeef059d" 464 | url: "https://pub.dev" 465 | source: hosted 466 | version: "2.1.4" 467 | stream_transform: 468 | dependency: transitive 469 | description: 470 | name: stream_transform 471 | sha256: ad47125e588cfd37a9a7f86c7d6356dde8dfe89d071d293f80ca9e9273a33871 472 | url: "https://pub.dev" 473 | source: hosted 474 | version: "2.1.1" 475 | string_scanner: 476 | dependency: transitive 477 | description: 478 | name: string_scanner 479 | sha256: "921cd31725b72fe181906c6a94d987c78e3b98c2e205b397ea399d4054872b43" 480 | url: "https://pub.dev" 481 | source: hosted 482 | version: "1.4.1" 483 | term_glyph: 484 | dependency: transitive 485 | description: 486 | name: term_glyph 487 | sha256: "7f554798625ea768a7518313e58f83891c7f5024f88e46e7182a4558850a4b8e" 488 | url: "https://pub.dev" 489 | source: hosted 490 | version: "1.2.2" 491 | test_api: 492 | dependency: transitive 493 | description: 494 | name: test_api 495 | sha256: fb31f383e2ee25fbbfe06b40fe21e1e458d14080e3c67e7ba0acfde4df4e0bbd 496 | url: "https://pub.dev" 497 | source: hosted 498 | version: "0.7.4" 499 | timing: 500 | dependency: transitive 501 | description: 502 | name: timing 503 | sha256: "62ee18aca144e4a9f29d212f5a4c6a053be252b895ab14b5821996cff4ed90fe" 504 | url: "https://pub.dev" 505 | source: hosted 506 | version: "1.0.2" 507 | typed_data: 508 | dependency: transitive 509 | description: 510 | name: typed_data 511 | sha256: f9049c039ebfeb4cf7a7104a675823cd72dba8297f264b6637062516699fa006 512 | url: "https://pub.dev" 513 | source: hosted 514 | version: "1.4.0" 515 | watcher: 516 | dependency: transitive 517 | description: 518 | name: watcher 519 | sha256: "69da27e49efa56a15f8afe8f4438c4ec02eff0a117df1b22ea4aad194fe1c104" 520 | url: "https://pub.dev" 521 | source: hosted 522 | version: "1.1.1" 523 | web: 524 | dependency: "direct main" 525 | description: 526 | name: web 527 | sha256: cd3543bd5798f6ad290ea73d210f423502e71900302dde696f8bff84bf89a1cb 528 | url: "https://pub.dev" 529 | source: hosted 530 | version: "1.1.0" 531 | web_socket: 532 | dependency: transitive 533 | description: 534 | name: web_socket 535 | sha256: "3c12d96c0c9a4eec095246debcea7b86c0324f22df69893d538fcc6f1b8cce83" 536 | url: "https://pub.dev" 537 | source: hosted 538 | version: "0.1.6" 539 | web_socket_channel: 540 | dependency: transitive 541 | description: 542 | name: web_socket_channel 543 | sha256: "0b8e2457400d8a859b7b2030786835a28a8e80836ef64402abef392ff4f1d0e5" 544 | url: "https://pub.dev" 545 | source: hosted 546 | version: "3.0.2" 547 | yaml: 548 | dependency: transitive 549 | description: 550 | name: yaml 551 | sha256: b9da305ac7c39faa3f030eccd175340f968459dae4af175130b3fc47e40d76ce 552 | url: "https://pub.dev" 553 | source: hosted 554 | version: "3.1.3" 555 | sdks: 556 | dart: ">=3.6.0 <3.8.0-z" 557 | -------------------------------------------------------------------------------- /example/pubspec.yaml: -------------------------------------------------------------------------------- 1 | name: example 2 | publish_to: "none" 3 | environment: 4 | sdk: ">=3.6.0 <4.0.0" 5 | dependencies: 6 | http: ^1.3.0 7 | markdown: ^7.3.0 8 | signals_core: ^6.0.2 9 | web: ">=0.4.2 <2.0.0" 10 | html_web_components: 11 | path: ../ 12 | dev_dependencies: 13 | lints: ^5.0.0 14 | build_runner: ^2.0.5 15 | build_web_compilers: ^4.0.0 16 | scripts: 17 | build: dart run build_runner build -o web:build --release 18 | serve: dart run build_runner serve web 19 | -------------------------------------------------------------------------------- /example/web/components/hello_world.dart: -------------------------------------------------------------------------------- 1 | import 'package:html_web_components/html_web_components.dart'; 2 | 3 | class HelloWorld extends WebComponent { 4 | @override 5 | void connectedCallback() { 6 | super.connectedCallback(); 7 | element.innerText = "Hello World!"; 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /example/web/components/md_editor.dart: -------------------------------------------------------------------------------- 1 | import 'dart:js_interop'; 2 | 3 | import 'package:signals_core/signals_core.dart'; 4 | import 'package:web/web.dart'; 5 | import 'package:html_web_components/helpers.dart'; 6 | import 'package:html_web_components/html_web_components.dart'; 7 | 8 | class MarkdownEditor extends WebComponent 9 | with 10 | WebComponentCleanupMixin, 11 | WebComponentShadowDomMixin, 12 | WebComponentAdoptedStylesMixin { 13 | final src = signal(testFile.trim()); 14 | 15 | final style = computed(() { 16 | return r''' 17 | :host { 18 | display: flex; 19 | flex-direction: column; 20 | margin-top: 10px; 21 | } 22 | textarea { 23 | width: 100%; 24 | height: 400px; 25 | } 26 | '''; 27 | }); 28 | 29 | @override 30 | late final sheets = computed(() { 31 | final sheet = CSSStyleSheet(); 32 | sheet.replaceSync(style()); 33 | return [sheet]; 34 | }); 35 | 36 | late final viewer = computed(() { 37 | final el = document.createElement('md-viewer'); 38 | return el as HTMLElement; 39 | }); 40 | 41 | late final editor = computed(() { 42 | final el = document.createElement('textarea') as HTMLTextAreaElement; 43 | el.value = src.peek(); 44 | return el; 45 | }); 46 | 47 | void _onEdit(Event e) { 48 | src.value = editor().value; 49 | } 50 | 51 | @override 52 | void connectedCallback() { 53 | super.connectedCallback(); 54 | final root = getRoot(); 55 | 56 | root.appendChild(editor()); 57 | root.appendChild(document.createElement('br')); 58 | final view = root.appendChild(viewer()) as HTMLElement; 59 | 60 | editor().addEventListener('input', _onEdit.toJS); 61 | editor().addEventListener('change', _onEdit.toJS); 62 | 63 | // final url = Uri.dataFromString(src()); 64 | // view.setAttribute('src', url.toString()); 65 | 66 | cleanup.add(effect(() { 67 | final url = Uri.dataFromString(src()); 68 | view.setAttribute('src', url.toString()); 69 | })); 70 | } 71 | } 72 | 73 | final testFile = r''' 74 | --- 75 | __Advertisement :)__ 76 | 77 | - __[pica](https://nodeca.github.io/pica/demo/)__ - high quality and fast image 78 | resize in browser. 79 | - __[babelfish](https://github.com/nodeca/babelfish/)__ - developer friendly 80 | i18n with plurals support and easy syntax. 81 | 82 | You will like those projects! 83 | 84 | --- 85 | 86 | # h1 Heading 8-) 87 | ## h2 Heading 88 | ### h3 Heading 89 | #### h4 Heading 90 | ##### h5 Heading 91 | ###### h6 Heading 92 | 93 | 94 | ## Horizontal Rules 95 | 96 | ___ 97 | 98 | --- 99 | 100 | *** 101 | 102 | 103 | ## Typographic replacements 104 | 105 | Enable typographer option to see result. 106 | 107 | (c) (C) (r) (R) (tm) (TM) (p) (P) +- 108 | 109 | test.. test... test..... test?..... test!.... 110 | 111 | !!!!!! ???? ,, -- --- 112 | 113 | "Smartypants, double quotes" and 'single quotes' 114 | 115 | 116 | ## Emphasis 117 | 118 | **This is bold text** 119 | 120 | __This is bold text__ 121 | 122 | *This is italic text* 123 | 124 | _This is italic text_ 125 | 126 | ~~Strikethrough~~ 127 | 128 | 129 | ## Blockquotes 130 | 131 | 132 | > Blockquotes can also be nested... 133 | >> ...by using additional greater-than signs right next to each other... 134 | > > > ...or with spaces between arrows. 135 | 136 | 137 | ## Lists 138 | 139 | Unordered 140 | 141 | + Create a list by starting a line with `+`, `-`, or `*` 142 | + Sub-lists are made by indenting 2 spaces: 143 | - Marker character change forces new list start: 144 | * Ac tristique libero volutpat at 145 | + Facilisis in pretium nisl aliquet 146 | - Nulla volutpat aliquam velit 147 | + Very easy! 148 | 149 | Ordered 150 | 151 | 1. Lorem ipsum dolor sit amet 152 | 2. Consectetur adipiscing elit 153 | 3. Integer molestie lorem at massa 154 | 155 | 156 | 1. You can use sequential numbers... 157 | 1. ...or keep all the numbers as `1.` 158 | 159 | Start numbering with offset: 160 | 161 | 57. foo 162 | 1. bar 163 | 164 | 165 | ## Code 166 | 167 | Inline `code` 168 | 169 | Indented code 170 | 171 | // Some comments 172 | line 1 of code 173 | line 2 of code 174 | line 3 of code 175 | 176 | 177 | Block code "fences" 178 | 179 | ``` 180 | Sample text here... 181 | ``` 182 | 183 | Syntax highlighting 184 | 185 | ``` js 186 | var foo = function (bar) { 187 | return bar++; 188 | }; 189 | 190 | console.log(foo(5)); 191 | ``` 192 | 193 | ## Tables 194 | 195 | | Option | Description | 196 | | ------ | ----------- | 197 | | data | path to data files to supply the data that will be passed into templates. | 198 | | engine | engine to be used for processing templates. Handlebars is the default. | 199 | | ext | extension to be used for dest files. | 200 | 201 | Right aligned columns 202 | 203 | | Option | Description | 204 | | ------:| -----------:| 205 | | data | path to data files to supply the data that will be passed into templates. | 206 | | engine | engine to be used for processing templates. Handlebars is the default. | 207 | | ext | extension to be used for dest files. | 208 | 209 | 210 | ## Links 211 | 212 | [link text](http://dev.nodeca.com) 213 | 214 | [link with title](http://nodeca.github.io/pica/demo/ "title text!") 215 | 216 | Autoconverted link https://github.com/nodeca/pica (enable linkify to see) 217 | 218 | 219 | ## Images 220 | 221 | ![Minion](https://octodex.github.com/images/minion.png) 222 | ![Stormtroopocat](https://octodex.github.com/images/stormtroopocat.jpg "The Stormtroopocat") 223 | 224 | Like links, Images also have a footnote style syntax 225 | 226 | ![Alt text][id] 227 | 228 | With a reference later in the document defining the URL location: 229 | 230 | [id]: https://octodex.github.com/images/dojocat.jpg "The Dojocat" 231 | 232 | 233 | ## Plugins 234 | 235 | The killer feature of `markdown-it` is very effective support of 236 | [syntax plugins](https://www.npmjs.org/browse/keyword/markdown-it-plugin). 237 | 238 | 239 | ### [Emojies](https://github.com/markdown-it/markdown-it-emoji) 240 | 241 | > Classic markup: :wink: :cry: :laughing: :yum: 242 | > 243 | > Shortcuts (emoticons): :-) :-( 8-) ;) 244 | 245 | see [how to change output](https://github.com/markdown-it/markdown-it-emoji#change-output) with twemoji. 246 | 247 | 248 | ### [Subscript](https://github.com/markdown-it/markdown-it-sub) / [Superscript](https://github.com/markdown-it/markdown-it-sup) 249 | 250 | - 19^th^ 251 | - H~2~O 252 | 253 | 254 | ### [\](https://github.com/markdown-it/markdown-it-ins) 255 | 256 | ++Inserted text++ 257 | 258 | 259 | ### [\](https://github.com/markdown-it/markdown-it-mark) 260 | 261 | ==Marked text== 262 | 263 | 264 | ### [Footnotes](https://github.com/markdown-it/markdown-it-footnote) 265 | 266 | Footnote 1 link[^first]. 267 | 268 | Footnote 2 link[^second]. 269 | 270 | Inline footnote^[Text of inline footnote] definition. 271 | 272 | Duplicated footnote reference[^second]. 273 | 274 | [^first]: Footnote **can have markup** 275 | 276 | and multiple paragraphs. 277 | 278 | [^second]: Footnote text. 279 | 280 | 281 | ### [Definition lists](https://github.com/markdown-it/markdown-it-deflist) 282 | 283 | Term 1 284 | 285 | : Definition 1 286 | with lazy continuation. 287 | 288 | Term 2 with *inline markup* 289 | 290 | : Definition 2 291 | 292 | { some code, part of Definition 2 } 293 | 294 | Third paragraph of definition 2. 295 | 296 | _Compact style:_ 297 | 298 | Term 1 299 | ~ Definition 1 300 | 301 | Term 2 302 | ~ Definition 2a 303 | ~ Definition 2b 304 | 305 | 306 | ### [Abbreviations](https://github.com/markdown-it/markdown-it-abbr) 307 | 308 | This is HTML abbreviation example. 309 | 310 | It converts "HTML", but keep intact partial entries like "xxxHTMLyyy" and so on. 311 | 312 | *[HTML]: Hyper Text Markup Language 313 | 314 | ### [Custom containers](https://github.com/markdown-it/markdown-it-container) 315 | 316 | ::: warning 317 | *here be dragons* 318 | ::: 319 | '''; 320 | -------------------------------------------------------------------------------- /example/web/components/md_viewer.dart: -------------------------------------------------------------------------------- 1 | import 'dart:js_interop'; 2 | 3 | import 'package:html_web_components/html_web_components.dart'; 4 | import 'package:html_web_components/helpers.dart'; 5 | import 'package:signals_core/signals_core.dart'; 6 | import 'package:http/http.dart' as http; 7 | import 'package:markdown/markdown.dart'; 8 | import 'package:web/web.dart'; 9 | 10 | class MarkdownView extends WebComponent 11 | with 12 | WebComponentCleanupMixin, 13 | WebComponentShadowDomMixin, 14 | WebComponentReactiveAttributesMixin { 15 | http.Client client = http.Client(); 16 | 17 | @override 18 | List get observedAttributes => ['src']; 19 | 20 | late final src = attr('src'); 21 | 22 | late final md = computedAsync(() async { 23 | final src = this.src.value ?? ''; 24 | if (src.isEmpty) return null; 25 | return client.get(Uri.parse(src)); 26 | }); 27 | 28 | late final html = computed(() { 29 | final val = md.value.value?.body ?? ''; 30 | if (val.isEmpty) return ''; 31 | return markdownToHtml(val); 32 | }); 33 | 34 | @override 35 | void connectedCallback() { 36 | super.connectedCallback(); 37 | cleanup.add(effect(() { 38 | getRoot().innerHTML = html.value.toJS; 39 | })); 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /example/web/components/x_counter.dart: -------------------------------------------------------------------------------- 1 | import 'dart:js_interop'; 2 | 3 | import 'package:signals_core/signals_core.dart'; 4 | import 'package:html_web_components/helpers.dart'; 5 | import 'package:web/web.dart'; 6 | import 'package:html_web_components/html_web_components.dart'; 7 | 8 | class XCounter extends WebComponent with WebComponentCleanupMixin { 9 | final count = signal(0); 10 | late final template = computed(() => ""); 11 | 12 | void _onClick(Event e) { 13 | count.value++; 14 | } 15 | 16 | @override 17 | void connectedCallback() { 18 | super.connectedCallback(); 19 | final root = getRoot(); 20 | 21 | root.addEventListener("click", _onClick.toJS); 22 | 23 | cleanup.add(effect(() { 24 | root.innerHTML = template().toJS; 25 | })); 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /example/web/css/styles.css: -------------------------------------------------------------------------------- 1 | body { 2 | font-family: "Roboto", sans-serif; 3 | } 4 | -------------------------------------------------------------------------------- /example/web/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Dart + Web Components 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | -------------------------------------------------------------------------------- /example/web/main.dart: -------------------------------------------------------------------------------- 1 | import 'package:html_web_components/html_web_components.dart'; 2 | 3 | import 'components/hello_world.dart'; 4 | import 'components/x_counter.dart'; 5 | import 'components/md_viewer.dart'; 6 | import 'components/md_editor.dart'; 7 | 8 | void main() { 9 | WebComponent.define('hello-world', HelloWorld.new); 10 | WebComponent.define('x-counter', XCounter.new); 11 | WebComponent.define('md-viewer', MarkdownView.new); 12 | WebComponent.define('md-editor', MarkdownEditor.new); 13 | } 14 | -------------------------------------------------------------------------------- /lib/helpers.dart: -------------------------------------------------------------------------------- 1 | export 'src/mixins/adopted_styles.dart'; 2 | export 'src/mixins/cleanup.dart'; 3 | export 'src/mixins/reactive_attributes.dart'; 4 | export 'src/mixins/shadow_dom.dart'; 5 | -------------------------------------------------------------------------------- /lib/html_web_components.dart: -------------------------------------------------------------------------------- 1 | export 'src/web_component.dart'; 2 | -------------------------------------------------------------------------------- /lib/src/mixins/adopted_styles.dart: -------------------------------------------------------------------------------- 1 | import 'dart:js_interop'; 2 | 3 | import 'package:signals_core/signals_core.dart'; 4 | import 'package:web/web.dart'; 5 | 6 | import 'cleanup.dart'; 7 | import 'shadow_dom.dart'; 8 | 9 | mixin WebComponentAdoptedStylesMixin 10 | on WebComponentShadowDomMixin, WebComponentCleanupMixin { 11 | ReadonlySignal> sheets = listSignal([]); 12 | 13 | @override 14 | void connectedCallback() { 15 | super.connectedCallback(); 16 | cleanup.add(effect(() { 17 | getRoot().adoptedStyleSheets = sheets().toJS; 18 | })); 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /lib/src/mixins/cleanup.dart: -------------------------------------------------------------------------------- 1 | import '../web_component.dart'; 2 | 3 | mixin WebComponentCleanupMixin on WebComponent { 4 | final cleanup = []; 5 | 6 | @override 7 | void disconnectedCallback() { 8 | super.disconnectedCallback(); 9 | for (final cleanup in cleanup) { 10 | cleanup(); 11 | } 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /lib/src/mixins/reactive_attributes.dart: -------------------------------------------------------------------------------- 1 | import 'package:signals_core/signals_core.dart'; 2 | 3 | import '../web_component.dart'; 4 | 5 | mixin WebComponentReactiveAttributesMixin on WebComponent { 6 | final _attrs = >{}; 7 | 8 | @override 9 | void attributeChangedCallback( 10 | String name, 11 | String? oldValue, 12 | String? newValue, 13 | ) { 14 | super.attributeChangedCallback(name, oldValue, newValue); 15 | if (observedAttributes.contains(name)) { 16 | if (_attrs.containsKey(name)) { 17 | _attrs[name]!.value = newValue; 18 | } 19 | } 20 | } 21 | 22 | ReadonlySignal attr( 23 | String name, { 24 | String? defaultValue, 25 | }) { 26 | if (!_attrs.containsKey(name)) { 27 | final value = element.getAttribute(name) ?? defaultValue; 28 | _attrs[name] = signal(value); 29 | } 30 | return _attrs[name]!; 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /lib/src/mixins/shadow_dom.dart: -------------------------------------------------------------------------------- 1 | import 'dart:js_interop'; 2 | 3 | import 'package:web/web.dart'; 4 | 5 | import '../web_component.dart'; 6 | 7 | mixin WebComponentShadowDomMixin on WebComponent { 8 | ShadowRootInit get shadowOptions => ShadowRootInit(mode: 'open'); 9 | 10 | @override 11 | R getRoot() { 12 | if (element.shadowRoot == null) { 13 | element.attachShadow(shadowOptions) as R; 14 | } 15 | return super.getRoot(); 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /lib/src/web_component.dart: -------------------------------------------------------------------------------- 1 | import 'dart:js_interop'; 2 | import 'dart:js_interop_unsafe'; 3 | 4 | import 'package:web/web.dart'; 5 | 6 | class WebComponent { 7 | late T element; 8 | final String extendsType = 'HTMLElement'; 9 | 10 | void connectedCallback() {} 11 | 12 | void disconnectedCallback() {} 13 | 14 | void adoptedCallback() {} 15 | 16 | void attributeChangedCallback( 17 | String name, 18 | String? oldValue, 19 | String? newValue, 20 | ) {} 21 | 22 | Iterable get observedAttributes => []; 23 | 24 | bool get formAssociated => false; 25 | 26 | ElementInternals? get internals => element['_internals'] as ElementInternals?; 27 | set internals(ElementInternals? value) { 28 | element['_internals'] = value; 29 | } 30 | 31 | R getRoot() { 32 | final hasShadow = element.shadowRoot != null; 33 | return (hasShadow ? element.shadowRoot! : element) as R; 34 | } 35 | 36 | static void define(String tag, WebComponent Function() create) { 37 | final obj = _factory(create); 38 | window.customElements.define(tag, obj); 39 | } 40 | } 41 | 42 | @JS('Reflect.construct') 43 | external JSAny _reflectConstruct( 44 | JSObject target, 45 | JSAny args, 46 | JSFunction constructor, 47 | ); 48 | 49 | final _instances = {}; 50 | 51 | JSFunction _factory(WebComponent Function() create) { 52 | final base = create(); 53 | final elemProto = globalContext[base.extendsType] as JSObject; 54 | late JSAny obj; 55 | 56 | JSAny constructor() { 57 | final args = [].jsify()!; 58 | final self = _reflectConstruct(elemProto, args, obj as JSFunction); 59 | final el = self as HTMLElement; 60 | _instances.putIfAbsent(el, () => create()..element = el); 61 | return self; 62 | } 63 | 64 | obj = constructor.toJS; 65 | obj = obj as JSObject; 66 | 67 | final observedAttributes = base.observedAttributes; 68 | final formAssociated = base.formAssociated; 69 | 70 | obj['prototype'] = elemProto['prototype']; 71 | obj['observedAttributes'] = observedAttributes.toList().jsify()!; 72 | obj['formAssociated'] = formAssociated.jsify()!; 73 | 74 | final prototype = obj['prototype'] as JSObject; 75 | prototype['connectedCallback'] = (HTMLElement instance) { 76 | _instances[instance]?.connectedCallback(); 77 | }.toJSCaptureThis; 78 | prototype['disconnectedCallback'] = (HTMLElement instance) { 79 | _instances[instance]?.disconnectedCallback(); 80 | _instances.remove(instance); 81 | }.toJSCaptureThis; 82 | prototype['adoptedCallback'] = (HTMLElement instance) { 83 | _instances[instance]?.adoptedCallback(); 84 | }.toJSCaptureThis; 85 | prototype['attributeChangedCallback'] = ( 86 | HTMLElement instance, 87 | String name, 88 | String? oldName, 89 | String? newName, 90 | ) { 91 | _instances[instance]?.attributeChangedCallback(name, oldName, newName); 92 | }.toJSCaptureThis; 93 | 94 | return obj as JSFunction; 95 | } 96 | -------------------------------------------------------------------------------- /peanut.yaml: -------------------------------------------------------------------------------- 1 | # Configuration for https://pub.dev/packages/peanut 2 | directories: 3 | - example 4 | -------------------------------------------------------------------------------- /pubspec.lock: -------------------------------------------------------------------------------- 1 | # Generated by pub 2 | # See https://dart.dev/tools/pub/glossary#lockfile 3 | packages: 4 | _fe_analyzer_shared: 5 | dependency: transitive 6 | description: 7 | name: _fe_analyzer_shared 8 | sha256: dc27559385e905ad30838356c5f5d574014ba39872d732111cd07ac0beff4c57 9 | url: "https://pub.dev" 10 | source: hosted 11 | version: "80.0.0" 12 | analyzer: 13 | dependency: transitive 14 | description: 15 | name: analyzer 16 | sha256: "192d1c5b944e7e53b24b5586db760db934b177d4147c42fbca8c8c5f1eb8d11e" 17 | url: "https://pub.dev" 18 | source: hosted 19 | version: "7.3.0" 20 | archive: 21 | dependency: transitive 22 | description: 23 | name: archive 24 | sha256: "6199c74e3db4fbfbd04f66d739e72fe11c8a8957d5f219f1f4482dbde6420b5a" 25 | url: "https://pub.dev" 26 | source: hosted 27 | version: "4.0.2" 28 | args: 29 | dependency: transitive 30 | description: 31 | name: args 32 | sha256: bf9f5caeea8d8fe6721a9c358dd8a5c1947b27f1cfaa18b39c301273594919e6 33 | url: "https://pub.dev" 34 | source: hosted 35 | version: "2.6.0" 36 | async: 37 | dependency: transitive 38 | description: 39 | name: async 40 | sha256: "758e6d74e971c3e5aceb4110bfd6698efc7f501675bcfe0c775459a8140750eb" 41 | url: "https://pub.dev" 42 | source: hosted 43 | version: "2.13.0" 44 | bazel_worker: 45 | dependency: transitive 46 | description: 47 | name: bazel_worker 48 | sha256: "57035594b87d9f5af99f1a80e1edf5411dadbdf5acfc4f90403e3849f57dd0f0" 49 | url: "https://pub.dev" 50 | source: hosted 51 | version: "1.1.2" 52 | boolean_selector: 53 | dependency: transitive 54 | description: 55 | name: boolean_selector 56 | sha256: "8aab1771e1243a5063b8b0ff68042d67334e3feab9e95b9490f9a6ebf73b42ea" 57 | url: "https://pub.dev" 58 | source: hosted 59 | version: "2.1.2" 60 | build: 61 | dependency: transitive 62 | description: 63 | name: build 64 | sha256: cef23f1eda9b57566c81e2133d196f8e3df48f244b317368d65c5943d91148f0 65 | url: "https://pub.dev" 66 | source: hosted 67 | version: "2.4.2" 68 | build_config: 69 | dependency: transitive 70 | description: 71 | name: build_config 72 | sha256: "4ae2de3e1e67ea270081eaee972e1bd8f027d459f249e0f1186730784c2e7e33" 73 | url: "https://pub.dev" 74 | source: hosted 75 | version: "1.1.2" 76 | build_daemon: 77 | dependency: transitive 78 | description: 79 | name: build_daemon 80 | sha256: "8e928697a82be082206edb0b9c99c5a4ad6bc31c9e9b8b2f291ae65cd4a25daa" 81 | url: "https://pub.dev" 82 | source: hosted 83 | version: "4.0.4" 84 | build_modules: 85 | dependency: transitive 86 | description: 87 | name: build_modules 88 | sha256: "0327cb2a9eefba197b63f71872c38bafe4c63b331797a43618d6c270516a6447" 89 | url: "https://pub.dev" 90 | source: hosted 91 | version: "5.0.11" 92 | build_resolvers: 93 | dependency: transitive 94 | description: 95 | name: build_resolvers 96 | sha256: b9e4fda21d846e192628e7a4f6deda6888c36b5b69ba02ff291a01fd529140f0 97 | url: "https://pub.dev" 98 | source: hosted 99 | version: "2.4.4" 100 | build_runner: 101 | dependency: "direct dev" 102 | description: 103 | name: build_runner 104 | sha256: "058fe9dce1de7d69c4b84fada934df3e0153dd000758c4d65964d0166779aa99" 105 | url: "https://pub.dev" 106 | source: hosted 107 | version: "2.4.15" 108 | build_runner_core: 109 | dependency: transitive 110 | description: 111 | name: build_runner_core 112 | sha256: "22e3aa1c80e0ada3722fe5b63fd43d9c8990759d0a2cf489c8c5d7b2bdebc021" 113 | url: "https://pub.dev" 114 | source: hosted 115 | version: "8.0.0" 116 | build_web_compilers: 117 | dependency: "direct dev" 118 | description: 119 | name: build_web_compilers 120 | sha256: "01cfac85e835d9fe8e87928958586ddbd477d98cfac5af2442cb2df6bbb42dff" 121 | url: "https://pub.dev" 122 | source: hosted 123 | version: "4.1.1" 124 | built_collection: 125 | dependency: transitive 126 | description: 127 | name: built_collection 128 | sha256: "376e3dd27b51ea877c28d525560790aee2e6fbb5f20e2f85d5081027d94e2100" 129 | url: "https://pub.dev" 130 | source: hosted 131 | version: "5.1.1" 132 | built_value: 133 | dependency: transitive 134 | description: 135 | name: built_value 136 | sha256: "28a712df2576b63c6c005c465989a348604960c0958d28be5303ba9baa841ac2" 137 | url: "https://pub.dev" 138 | source: hosted 139 | version: "8.9.3" 140 | checked_yaml: 141 | dependency: transitive 142 | description: 143 | name: checked_yaml 144 | sha256: feb6bed21949061731a7a75fc5d2aa727cf160b91af9a3e464c5e3a32e28b5ff 145 | url: "https://pub.dev" 146 | source: hosted 147 | version: "2.0.3" 148 | code_builder: 149 | dependency: transitive 150 | description: 151 | name: code_builder 152 | sha256: "0ec10bf4a89e4c613960bf1e8b42c64127021740fb21640c29c909826a5eea3e" 153 | url: "https://pub.dev" 154 | source: hosted 155 | version: "4.10.1" 156 | collection: 157 | dependency: transitive 158 | description: 159 | name: collection 160 | sha256: "2f5709ae4d3d59dd8f7cd309b4e023046b57d8a6c82130785d2b0e5868084e76" 161 | url: "https://pub.dev" 162 | source: hosted 163 | version: "1.19.1" 164 | convert: 165 | dependency: transitive 166 | description: 167 | name: convert 168 | sha256: b30acd5944035672bc15c6b7a8b47d773e41e2f17de064350988c5d02adb1c68 169 | url: "https://pub.dev" 170 | source: hosted 171 | version: "3.1.2" 172 | crypto: 173 | dependency: transitive 174 | description: 175 | name: crypto 176 | sha256: "1e445881f28f22d6140f181e07737b22f1e099a5e1ff94b0af2f9e4a463f4855" 177 | url: "https://pub.dev" 178 | source: hosted 179 | version: "3.0.6" 180 | dart_style: 181 | dependency: transitive 182 | description: 183 | name: dart_style 184 | sha256: "27eb0ae77836989a3bc541ce55595e8ceee0992807f14511552a898ddd0d88ac" 185 | url: "https://pub.dev" 186 | source: hosted 187 | version: "3.0.1" 188 | ffi: 189 | dependency: transitive 190 | description: 191 | name: ffi 192 | sha256: "16ed7b077ef01ad6170a3d0c57caa4a112a38d7a2ed5602e0aca9ca6f3d98da6" 193 | url: "https://pub.dev" 194 | source: hosted 195 | version: "2.1.3" 196 | file: 197 | dependency: transitive 198 | description: 199 | name: file 200 | sha256: a3b4f84adafef897088c160faf7dfffb7696046cb13ae90b508c2cbc95d3b8d4 201 | url: "https://pub.dev" 202 | source: hosted 203 | version: "7.0.1" 204 | fixnum: 205 | dependency: transitive 206 | description: 207 | name: fixnum 208 | sha256: b6dc7065e46c974bc7c5f143080a6764ec7a4be6da1285ececdc37be96de53be 209 | url: "https://pub.dev" 210 | source: hosted 211 | version: "1.1.1" 212 | frontend_server_client: 213 | dependency: transitive 214 | description: 215 | name: frontend_server_client 216 | sha256: f64a0333a82f30b0cca061bc3d143813a486dc086b574bfb233b7c1372427694 217 | url: "https://pub.dev" 218 | source: hosted 219 | version: "4.0.0" 220 | glob: 221 | dependency: transitive 222 | description: 223 | name: glob 224 | sha256: c3f1ee72c96f8f78935e18aa8cecced9ab132419e8625dc187e1c2408efc20de 225 | url: "https://pub.dev" 226 | source: hosted 227 | version: "2.1.3" 228 | graphs: 229 | dependency: transitive 230 | description: 231 | name: graphs 232 | sha256: "741bbf84165310a68ff28fe9e727332eef1407342fca52759cb21ad8177bb8d0" 233 | url: "https://pub.dev" 234 | source: hosted 235 | version: "2.3.2" 236 | http: 237 | dependency: transitive 238 | description: 239 | name: http 240 | sha256: fe7ab022b76f3034adc518fb6ea04a82387620e19977665ea18d30a1cf43442f 241 | url: "https://pub.dev" 242 | source: hosted 243 | version: "1.3.0" 244 | http_multi_server: 245 | dependency: transitive 246 | description: 247 | name: http_multi_server 248 | sha256: aa6199f908078bb1c5efb8d8638d4ae191aac11b311132c3ef48ce352fb52ef8 249 | url: "https://pub.dev" 250 | source: hosted 251 | version: "3.2.2" 252 | http_parser: 253 | dependency: transitive 254 | description: 255 | name: http_parser 256 | sha256: "178d74305e7866013777bab2c3d8726205dc5a4dd935297175b19a23a2e66571" 257 | url: "https://pub.dev" 258 | source: hosted 259 | version: "4.1.2" 260 | io: 261 | dependency: transitive 262 | description: 263 | name: io 264 | sha256: dfd5a80599cf0165756e3181807ed3e77daf6dd4137caaad72d0b7931597650b 265 | url: "https://pub.dev" 266 | source: hosted 267 | version: "1.0.5" 268 | js: 269 | dependency: transitive 270 | description: 271 | name: js 272 | sha256: c1b2e9b5ea78c45e1a0788d29606ba27dc5f71f019f32ca5140f61ef071838cf 273 | url: "https://pub.dev" 274 | source: hosted 275 | version: "0.7.1" 276 | json_annotation: 277 | dependency: transitive 278 | description: 279 | name: json_annotation 280 | sha256: "1ce844379ca14835a50d2f019a3099f419082cfdd231cd86a142af94dd5c6bb1" 281 | url: "https://pub.dev" 282 | source: hosted 283 | version: "4.9.0" 284 | lints: 285 | dependency: "direct dev" 286 | description: 287 | name: lints 288 | sha256: c35bb79562d980e9a453fc715854e1ed39e24e7d0297a880ef54e17f9874a9d7 289 | url: "https://pub.dev" 290 | source: hosted 291 | version: "5.1.1" 292 | logging: 293 | dependency: transitive 294 | description: 295 | name: logging 296 | sha256: c8245ada5f1717ed44271ed1c26b8ce85ca3228fd2ffdb75468ab01979309d61 297 | url: "https://pub.dev" 298 | source: hosted 299 | version: "1.3.0" 300 | matcher: 301 | dependency: transitive 302 | description: 303 | name: matcher 304 | sha256: dc58c723c3c24bf8d3e2d3ad3f2f9d7bd9cf43ec6feaa64181775e60190153f2 305 | url: "https://pub.dev" 306 | source: hosted 307 | version: "0.12.17" 308 | meta: 309 | dependency: transitive 310 | description: 311 | name: meta 312 | sha256: e3641ec5d63ebf0d9b41bd43201a66e3fc79a65db5f61fc181f04cd27aab950c 313 | url: "https://pub.dev" 314 | source: hosted 315 | version: "1.16.0" 316 | mime: 317 | dependency: transitive 318 | description: 319 | name: mime 320 | sha256: "41a20518f0cb1256669420fdba0cd90d21561e560ac240f26ef8322e45bb7ed6" 321 | url: "https://pub.dev" 322 | source: hosted 323 | version: "2.0.0" 324 | package_config: 325 | dependency: transitive 326 | description: 327 | name: package_config 328 | sha256: "92d4488434b520a62570293fbd33bb556c7d49230791c1b4bbd973baf6d2dc67" 329 | url: "https://pub.dev" 330 | source: hosted 331 | version: "2.1.1" 332 | path: 333 | dependency: transitive 334 | description: 335 | name: path 336 | sha256: "75cca69d1490965be98c73ceaea117e8a04dd21217b37b292c9ddbec0d955bc5" 337 | url: "https://pub.dev" 338 | source: hosted 339 | version: "1.9.1" 340 | pool: 341 | dependency: transitive 342 | description: 343 | name: pool 344 | sha256: "20fe868b6314b322ea036ba325e6fc0711a22948856475e2c2b6306e8ab39c2a" 345 | url: "https://pub.dev" 346 | source: hosted 347 | version: "1.5.1" 348 | posix: 349 | dependency: transitive 350 | description: 351 | name: posix 352 | sha256: a0117dc2167805aa9125b82eee515cc891819bac2f538c83646d355b16f58b9a 353 | url: "https://pub.dev" 354 | source: hosted 355 | version: "6.0.1" 356 | preact_signals: 357 | dependency: transitive 358 | description: 359 | name: preact_signals 360 | sha256: a5b445796a02244b85fa43d79a7030fbfbbb08f7c48277ee93c636140a8fb2e0 361 | url: "https://pub.dev" 362 | source: hosted 363 | version: "1.8.3" 364 | protobuf: 365 | dependency: transitive 366 | description: 367 | name: protobuf 368 | sha256: "68645b24e0716782e58948f8467fd42a880f255096a821f9e7d0ec625b00c84d" 369 | url: "https://pub.dev" 370 | source: hosted 371 | version: "3.1.0" 372 | pub_semver: 373 | dependency: transitive 374 | description: 375 | name: pub_semver 376 | sha256: "7b3cfbf654f3edd0c6298ecd5be782ce997ddf0e00531b9464b55245185bbbbd" 377 | url: "https://pub.dev" 378 | source: hosted 379 | version: "2.1.5" 380 | pubspec_parse: 381 | dependency: transitive 382 | description: 383 | name: pubspec_parse 384 | sha256: "0560ba233314abbed0a48a2956f7f022cce7c3e1e73df540277da7544cad4082" 385 | url: "https://pub.dev" 386 | source: hosted 387 | version: "1.5.0" 388 | scratch_space: 389 | dependency: transitive 390 | description: 391 | name: scratch_space 392 | sha256: "8510fbff458d733a58fc427057d1ac86303b376d609d6e1bc43f240aad9aa445" 393 | url: "https://pub.dev" 394 | source: hosted 395 | version: "1.0.2" 396 | shelf: 397 | dependency: transitive 398 | description: 399 | name: shelf 400 | sha256: e7dd780a7ffb623c57850b33f43309312fc863fb6aa3d276a754bb299839ef12 401 | url: "https://pub.dev" 402 | source: hosted 403 | version: "1.4.2" 404 | shelf_web_socket: 405 | dependency: transitive 406 | description: 407 | name: shelf_web_socket 408 | sha256: "3632775c8e90d6c9712f883e633716432a27758216dfb61bd86a8321c0580925" 409 | url: "https://pub.dev" 410 | source: hosted 411 | version: "3.0.0" 412 | signals_core: 413 | dependency: "direct main" 414 | description: 415 | name: signals_core 416 | sha256: "5668ff1fb953fe48c88b03d50d43c5fe128cd7c831b932a4157f5f6be868b80f" 417 | url: "https://pub.dev" 418 | source: hosted 419 | version: "6.0.2" 420 | source_maps: 421 | dependency: transitive 422 | description: 423 | name: source_maps 424 | sha256: "190222579a448b03896e0ca6eca5998fa810fda630c1d65e2f78b3f638f54812" 425 | url: "https://pub.dev" 426 | source: hosted 427 | version: "0.10.13" 428 | source_span: 429 | dependency: transitive 430 | description: 431 | name: source_span 432 | sha256: "254ee5351d6cb365c859e20ee823c3bb479bf4a293c22d17a9f1bf144ce86f7c" 433 | url: "https://pub.dev" 434 | source: hosted 435 | version: "1.10.1" 436 | stack_trace: 437 | dependency: transitive 438 | description: 439 | name: stack_trace 440 | sha256: "8b27215b45d22309b5cddda1aa2b19bdfec9df0e765f2de506401c071d38d1b1" 441 | url: "https://pub.dev" 442 | source: hosted 443 | version: "1.12.1" 444 | stream_channel: 445 | dependency: transitive 446 | description: 447 | name: stream_channel 448 | sha256: "969e04c80b8bcdf826f8f16579c7b14d780458bd97f56d107d3950fdbeef059d" 449 | url: "https://pub.dev" 450 | source: hosted 451 | version: "2.1.4" 452 | stream_transform: 453 | dependency: transitive 454 | description: 455 | name: stream_transform 456 | sha256: ad47125e588cfd37a9a7f86c7d6356dde8dfe89d071d293f80ca9e9273a33871 457 | url: "https://pub.dev" 458 | source: hosted 459 | version: "2.1.1" 460 | string_scanner: 461 | dependency: transitive 462 | description: 463 | name: string_scanner 464 | sha256: "921cd31725b72fe181906c6a94d987c78e3b98c2e205b397ea399d4054872b43" 465 | url: "https://pub.dev" 466 | source: hosted 467 | version: "1.4.1" 468 | term_glyph: 469 | dependency: transitive 470 | description: 471 | name: term_glyph 472 | sha256: "7f554798625ea768a7518313e58f83891c7f5024f88e46e7182a4558850a4b8e" 473 | url: "https://pub.dev" 474 | source: hosted 475 | version: "1.2.2" 476 | test_api: 477 | dependency: transitive 478 | description: 479 | name: test_api 480 | sha256: fb31f383e2ee25fbbfe06b40fe21e1e458d14080e3c67e7ba0acfde4df4e0bbd 481 | url: "https://pub.dev" 482 | source: hosted 483 | version: "0.7.4" 484 | timing: 485 | dependency: transitive 486 | description: 487 | name: timing 488 | sha256: "62ee18aca144e4a9f29d212f5a4c6a053be252b895ab14b5821996cff4ed90fe" 489 | url: "https://pub.dev" 490 | source: hosted 491 | version: "1.0.2" 492 | typed_data: 493 | dependency: transitive 494 | description: 495 | name: typed_data 496 | sha256: f9049c039ebfeb4cf7a7104a675823cd72dba8297f264b6637062516699fa006 497 | url: "https://pub.dev" 498 | source: hosted 499 | version: "1.4.0" 500 | watcher: 501 | dependency: transitive 502 | description: 503 | name: watcher 504 | sha256: "69da27e49efa56a15f8afe8f4438c4ec02eff0a117df1b22ea4aad194fe1c104" 505 | url: "https://pub.dev" 506 | source: hosted 507 | version: "1.1.1" 508 | web: 509 | dependency: "direct main" 510 | description: 511 | name: web 512 | sha256: cd3543bd5798f6ad290ea73d210f423502e71900302dde696f8bff84bf89a1cb 513 | url: "https://pub.dev" 514 | source: hosted 515 | version: "1.1.0" 516 | web_socket: 517 | dependency: transitive 518 | description: 519 | name: web_socket 520 | sha256: "3c12d96c0c9a4eec095246debcea7b86c0324f22df69893d538fcc6f1b8cce83" 521 | url: "https://pub.dev" 522 | source: hosted 523 | version: "0.1.6" 524 | web_socket_channel: 525 | dependency: transitive 526 | description: 527 | name: web_socket_channel 528 | sha256: "0b8e2457400d8a859b7b2030786835a28a8e80836ef64402abef392ff4f1d0e5" 529 | url: "https://pub.dev" 530 | source: hosted 531 | version: "3.0.2" 532 | yaml: 533 | dependency: transitive 534 | description: 535 | name: yaml 536 | sha256: b9da305ac7c39faa3f030eccd175340f968459dae4af175130b3fc47e40d76ce 537 | url: "https://pub.dev" 538 | source: hosted 539 | version: "3.1.3" 540 | sdks: 541 | dart: ">=3.6.0 <3.8.0-z" 542 | -------------------------------------------------------------------------------- /pubspec.yaml: -------------------------------------------------------------------------------- 1 | name: html_web_components 2 | version: 0.1.0 3 | description: HTML Web Components with pure dart that compile to WASM and JS 4 | homepage: https://github.com/rodydavis/dart-web-components 5 | repository: https://github.com/rodydavis/dart-web-components 6 | environment: 7 | sdk: ">=3.6.0 <4.0.0" 8 | dependencies: 9 | signals_core: ^6.0.2 10 | web: ">=0.4.2 <2.0.0" 11 | dev_dependencies: 12 | lints: ^5.0.0 13 | build_runner: ^2.0.5 14 | build_web_compilers: ^4.0.0 15 | scripts: 16 | build: dart run build_runner build -o web:build --release 17 | serve: dart run build_runner serve web 18 | --------------------------------------------------------------------------------