blue-web 1.21.0 → 1.21.2

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 (75) hide show
  1. package/LICENSE +164 -164
  2. package/README.md +74 -74
  3. package/dist/js/actions.d.ts +6 -6
  4. package/dist/js/color-mode.d.ts +4 -4
  5. package/dist/js/dialog.d.ts +18 -18
  6. package/dist/js/edit-view.d.ts +14 -14
  7. package/dist/js/edit-view.js +2 -2
  8. package/dist/js/input-splitted.d.ts +19 -19
  9. package/dist/js/odometer.bundle.js +1 -1
  10. package/dist/js/odometer.d.ts +30 -17
  11. package/dist/js/odometer.js +38 -3
  12. package/dist/js/progress.d.ts +2 -2
  13. package/dist/js/read-view.d.ts +35 -35
  14. package/dist/js/read-view.js +18 -18
  15. package/dist/js/select-list.d.ts +46 -46
  16. package/dist/js/select-list.js +17 -17
  17. package/dist/js/shared.d.ts +14 -14
  18. package/dist/js/side-layout.d.ts +7 -7
  19. package/dist/js/utils.d.ts +18 -18
  20. package/dist/js/utils.js +6 -6
  21. package/dist/merged.scss +2170 -2323
  22. package/dist/neu.scss +92 -92
  23. package/dist/style.css +48 -55
  24. package/dist/style.css.map +1 -1
  25. package/dist/style.min.css +4 -4
  26. package/dist/style.scss +62 -61
  27. package/dist/styles/_action-menu.scss +57 -57
  28. package/dist/styles/_actions.scss +37 -37
  29. package/dist/styles/_anchor.scss +42 -42
  30. package/dist/styles/_bootstrap-mixins_overwritten.scss +106 -106
  31. package/dist/styles/_bootstrap-variables.scss +46 -46
  32. package/dist/styles/_bootstrap.scss +64 -65
  33. package/dist/styles/_button-icon-wrapper.scss +28 -28
  34. package/dist/styles/_buttons.scss +120 -110
  35. package/dist/styles/_collapse.scss +72 -72
  36. package/dist/styles/_container-grid.scss +52 -52
  37. package/dist/styles/_devexpress.scss +104 -104
  38. package/dist/styles/_general.scss +55 -74
  39. package/dist/styles/_hover.scss +37 -37
  40. package/dist/styles/_input-group.scss +29 -29
  41. package/dist/styles/_inter.scss +19 -19
  42. package/dist/styles/_intro.scss +22 -0
  43. package/dist/styles/_keyframes.scss +73 -73
  44. package/dist/styles/_layout.scss +175 -178
  45. package/dist/styles/_menu-item.scss +86 -255
  46. package/dist/styles/_mixins.scss +6 -6
  47. package/dist/styles/_modal.scss +118 -118
  48. package/dist/styles/_page-header.scss +14 -14
  49. package/dist/styles/_scrollspy.scss +78 -73
  50. package/dist/styles/_status.scss +131 -131
  51. package/dist/styles/_text-icons.scss +15 -15
  52. package/dist/styles/_tooltips.scss +150 -150
  53. package/dist/styles/_utils.scss +20 -20
  54. package/dist/styles/_variables.scss +128 -127
  55. package/dist/styles/mixins/_action-menu.scss +64 -64
  56. package/dist/styles/mixins/_custom-property.scss +10 -10
  57. package/dist/styles/mixins/_menu-item.scss +136 -136
  58. package/dist/styles/mixins/_misc.scss +7 -7
  59. package/dist/styles/mixins/_scroll-shadow.scss +9 -9
  60. package/dist/styles/mixins/_switch.scss +91 -91
  61. package/package.json +88 -88
  62. package/dist/container-grid.css +0 -196
  63. package/dist/js/auto-theme.bundle.js +0 -1
  64. package/dist/js/auto-theme.d.ts +0 -26
  65. package/dist/js/auto-theme.js +0 -169
  66. package/dist/js/button.bundle.js +0 -1
  67. package/dist/js/button.d.ts +0 -6
  68. package/dist/js/button.js +0 -16
  69. package/dist/js/dialog.bundle.js.LICENSE.txt +0 -5
  70. package/dist/js/dxf-viewer.js +0 -129
  71. package/dist/js/searchbox.bundle.js +0 -2
  72. package/dist/js/searchbox.bundle.js.LICENSE.txt +0 -11
  73. package/dist/js/searchbox.d.ts +0 -16
  74. package/dist/js/searchbox.js +0 -158
  75. package/dist/tailwind-main.css +0 -737
package/package.json CHANGED
@@ -1,88 +1,88 @@
1
- {
2
- "name": "blue-web",
3
- "version": "1.21.0",
4
- "description": "UI components built on top of Bootstrap 5",
5
- "license": "LGPL-3.0-or-later",
6
- "type": "module",
7
- "homepage": "https://bruegmann.github.io/blue-web/v1",
8
- "repository": {
9
- "type": "git",
10
- "url": "https://github.com/bruegmann/blue-react.git"
11
- },
12
- "bugs": {
13
- "url": "https://github.com/bruegmann/blue-react/issues"
14
- },
15
- "scripts": {
16
- "start": "npm run dev",
17
- "build-docs": "npm run build-astro",
18
- "build-types": "tsc --declaration --emitDeclarationOnly --declarationDir ./dist/js --noEmit false --project tsconfig.build.json",
19
- "build": "babel ./src/js --out-dir ./dist/js --extensions \".tsx,.js,.ts\"",
20
- "build-bundles": "webpack",
21
- "build-css": "node ./setVersionToStyleScss.cjs && sass --load-path=. ./dist/style.scss:./dist/style.css && npx postcss ./dist/style.css --use autoprefixer -r && npx postcss ./dist/style.css --use postcss-minify -o ./dist/style.min.css",
22
- "build-neu-css": "sass --load-path=. ./dist/neu.scss:./dist/neu.css && npx postcss ./dist/neu.css --use autoprefixer -r && npx postcss ./dist/neu.css --use postcss-minify -o ./dist/neu.min.css",
23
- "build-release": "npm run build-types && npm run build && npm run build-bundles && npm run build-css && node merge-scss.cjs dist/style.scss && npm run license-report",
24
- "predeploy": "npm run build-astro",
25
- "deploy": "gh-pages --dist site/dist --dest v1",
26
- "prepublishOnly": "npm i && npm run build-release",
27
- "release": "npm publish && npm run deploy",
28
- "prettier": "npx prettier --write .",
29
- "license-report": "npx license-report --prod --output=json > site/src/assets/license-report.json",
30
- "dev": "astro dev --root site",
31
- "build-astro": "astro build --root site",
32
- "preview-astro": "astro preview --root site"
33
- },
34
- "dependencies": {
35
- "@popperjs/core": "^2.11.5",
36
- "bootstrap": "~5.3.8"
37
- },
38
- "devDependencies": {
39
- "@astrojs/mdx": "^4.3.10",
40
- "@astrojs/react": "^4.4.2",
41
- "@babel/cli": "^7.10.4",
42
- "@babel/preset-env": "^7.10.4",
43
- "@babel/preset-typescript": "^7.9.0",
44
- "@radix-ui/react-slot": "^1.2.4",
45
- "@types/bootstrap": "^5.0.17",
46
- "@types/node": "^12.12.47",
47
- "@types/react": "^19.0.8",
48
- "@types/react-dom": "^19.0.3",
49
- "@types/react-syntax-highlighter": "^13.5.0",
50
- "astro": "^5.15.4",
51
- "autoprefixer": "^10.3.6",
52
- "babel-loader": "^8.4.1",
53
- "blue-react": "^11.0.2",
54
- "blue-themify": "^1.0.0",
55
- "colorjs.io": "^0.5.2",
56
- "gh-pages": "^3.1.0",
57
- "license-report": "^6.2.0",
58
- "lint-staged": "^11.1.2",
59
- "postcss-cli": "^9.0.1",
60
- "postcss-minify": "^1.1.0",
61
- "postcss-only-vars": "^1.0.0",
62
- "prettier": "^3.5.3",
63
- "react": "^19.0.0",
64
- "react-bootstrap-icons": "^1.11.5",
65
- "react-dom": "^19.0.0",
66
- "react-markdown": "^8.0.3",
67
- "react-syntax-highlighter": "^15.4.3",
68
- "sass": "^1.93.2",
69
- "typescript": "^4.3.5",
70
- "webpack": "^5.95.0",
71
- "webpack-cli": "^5.1.4"
72
- },
73
- "eslintConfig": {
74
- "extends": "react-app"
75
- },
76
- "browserslist": {
77
- "production": [
78
- ">0.2%",
79
- "not dead",
80
- "not op_mini all"
81
- ],
82
- "development": [
83
- "last 1 chrome version",
84
- "last 1 firefox version",
85
- "last 1 safari version"
86
- ]
87
- }
88
- }
1
+ {
2
+ "name": "blue-web",
3
+ "version": "1.21.2",
4
+ "description": "UI components built on top of Bootstrap 5",
5
+ "license": "LGPL-3.0-or-later",
6
+ "type": "module",
7
+ "homepage": "https://bruegmann.github.io/blue-web/v1",
8
+ "repository": {
9
+ "type": "git",
10
+ "url": "https://github.com/bruegmann/blue-react.git"
11
+ },
12
+ "bugs": {
13
+ "url": "https://github.com/bruegmann/blue-react/issues"
14
+ },
15
+ "scripts": {
16
+ "start": "npm run dev",
17
+ "build-docs": "npm run build-astro",
18
+ "build-types": "tsc --declaration --emitDeclarationOnly --declarationDir ./dist/js --noEmit false --project tsconfig.build.json",
19
+ "build": "babel ./src/js --out-dir ./dist/js --extensions \".tsx,.js,.ts\"",
20
+ "build-bundles": "webpack",
21
+ "build-css": "node ./setVersionToStyleScss.cjs && sass --load-path=. ./dist/style.scss:./dist/style.css && npx postcss ./dist/style.css --use autoprefixer -r && npx postcss ./dist/style.css --use postcss-minify -o ./dist/style.min.css",
22
+ "build-neu-css": "sass --load-path=. ./dist/neu.scss:./dist/neu.css && npx postcss ./dist/neu.css --use autoprefixer -r && npx postcss ./dist/neu.css --use postcss-minify -o ./dist/neu.min.css",
23
+ "build-release": "npm run build-types && npm run build && npm run build-bundles && npm run build-css && node merge-scss.cjs dist/style.scss && npm run license-report",
24
+ "predeploy": "npm run build-astro",
25
+ "deploy": "gh-pages --dist site/dist --dest v1",
26
+ "prepublishOnly": "npm i && npm run build-release",
27
+ "release": "npm publish && npm run deploy",
28
+ "prettier": "npx prettier --write .",
29
+ "license-report": "npx license-report --prod --output=json > site/src/assets/license-report.json",
30
+ "dev": "astro dev --root site",
31
+ "build-astro": "astro build --root site",
32
+ "preview-astro": "astro preview --root site"
33
+ },
34
+ "dependencies": {
35
+ "@popperjs/core": "^2.11.5",
36
+ "bootstrap": "~5.3.8"
37
+ },
38
+ "devDependencies": {
39
+ "@astrojs/mdx": "^4.3.13",
40
+ "@astrojs/react": "^4.4.2",
41
+ "@babel/cli": "^7.10.4",
42
+ "@babel/preset-env": "^7.10.4",
43
+ "@babel/preset-typescript": "^7.9.0",
44
+ "@radix-ui/react-slot": "^1.2.4",
45
+ "@types/bootstrap": "^5.0.17",
46
+ "@types/node": "^12.12.47",
47
+ "@types/react": "^19.0.8",
48
+ "@types/react-dom": "^19.0.3",
49
+ "@types/react-syntax-highlighter": "^13.5.0",
50
+ "astro": "^5.16.5",
51
+ "autoprefixer": "^10.3.6",
52
+ "babel-loader": "^8.4.1",
53
+ "blue-react": "^11.0.2",
54
+ "blue-themify": "^1.0.0",
55
+ "colorjs.io": "^0.5.2",
56
+ "gh-pages": "^3.1.0",
57
+ "license-report": "^6.2.0",
58
+ "lint-staged": "^11.1.2",
59
+ "postcss-cli": "^9.0.1",
60
+ "postcss-minify": "^1.1.0",
61
+ "postcss-only-vars": "^1.0.0",
62
+ "prettier": "^3.5.3",
63
+ "react": "^19.0.0",
64
+ "react-bootstrap-icons": "^1.11.5",
65
+ "react-dom": "^19.0.0",
66
+ "react-markdown": "^8.0.3",
67
+ "react-syntax-highlighter": "^15.4.3",
68
+ "sass": "^1.93.2",
69
+ "typescript": "^4.3.5",
70
+ "webpack": "^5.95.0",
71
+ "webpack-cli": "^5.1.4"
72
+ },
73
+ "eslintConfig": {
74
+ "extends": "react-app"
75
+ },
76
+ "browserslist": {
77
+ "production": [
78
+ ">0.2%",
79
+ "not dead",
80
+ "not op_mini all"
81
+ ],
82
+ "development": [
83
+ "last 1 chrome version",
84
+ "last 1 firefox version",
85
+ "last 1 safari version"
86
+ ]
87
+ }
88
+ }
@@ -1,196 +0,0 @@
1
- .blue-container-grid {
2
- container-type: inline-size; }
3
- .blue-container-grid .col, .blue-container-grid .col-1, .blue-container-grid .col-2, .blue-container-grid .col-3, .blue-container-grid .col-4, .blue-container-grid .col-5, .blue-container-grid .col-6, .blue-container-grid .col-7, .blue-container-grid .col-8, .blue-container-grid .col-9, .blue-container-grid .col-10, .blue-container-grid .col-11, .blue-container-grid .col-12, .blue-container-grid .col-sm-1, .blue-container-grid .col-sm-2, .blue-container-grid .col-sm-3, .blue-container-grid .col-sm-4, .blue-container-grid .col-sm-5, .blue-container-grid .col-sm-6, .blue-container-grid .col-sm-7, .blue-container-grid .col-sm-8, .blue-container-grid .col-sm-9, .blue-container-grid .col-sm-10, .blue-container-grid .col-sm-11, .blue-container-grid .col-sm-12, .blue-container-grid .col-md-1, .blue-container-grid .col-md-2, .blue-container-grid .col-md-3, .blue-container-grid .col-md-4, .blue-container-grid .col-md-5, .blue-container-grid .col-md-6, .blue-container-grid .col-md-7, .blue-container-grid .col-md-8, .blue-container-grid .col-md-9, .blue-container-grid .col-md-10, .blue-container-grid .col-md-11, .blue-container-grid .col-md-12, .blue-container-grid .col-lg-1, .blue-container-grid .col-lg-2, .blue-container-grid .col-lg-3, .blue-container-grid .col-lg-4, .blue-container-grid .col-lg-5, .blue-container-grid .col-lg-6, .blue-container-grid .col-lg-7, .blue-container-grid .col-lg-8, .blue-container-grid .col-lg-9, .blue-container-grid .col-lg-10, .blue-container-grid .col-lg-11, .blue-container-grid .col-lg-12, .blue-container-grid .col-xl-1, .blue-container-grid .col-xl-2, .blue-container-grid .col-xl-3, .blue-container-grid .col-xl-4, .blue-container-grid .col-xl-5, .blue-container-grid .col-xl-6, .blue-container-grid .col-xl-7, .blue-container-grid .col-xl-8, .blue-container-grid .col-xl-9, .blue-container-grid .col-xl-10, .blue-container-grid .col-xl-11, .blue-container-grid .col-xl-12, .blue-container-grid .col-xxl-1, .blue-container-grid .col-xxl-2, .blue-container-grid .col-xxl-3, .blue-container-grid .col-xxl-4, .blue-container-grid .col-xxl-5, .blue-container-grid .col-xxl-6, .blue-container-grid .col-xxl-7, .blue-container-grid .col-xxl-8, .blue-container-grid .col-xxl-9, .blue-container-grid .col-xxl-10, .blue-container-grid .col-xxl-11, .blue-container-grid .col-xxl-12 {
4
- flex: initial;
5
- max-width: initial;
6
- width: 100%; }
7
-
8
- @container (min-width: 576px) {
9
- .blue-container-grid .col-sm-1 {
10
- flex: 0 0 auto;
11
- width: 8.33333%; }
12
- .blue-container-grid .col-sm-2 {
13
- flex: 0 0 auto;
14
- width: 16.66667%; }
15
- .blue-container-grid .col-sm-3 {
16
- flex: 0 0 auto;
17
- width: 25%; }
18
- .blue-container-grid .col-sm-4 {
19
- flex: 0 0 auto;
20
- width: 33.33333%; }
21
- .blue-container-grid .col-sm-5 {
22
- flex: 0 0 auto;
23
- width: 41.66667%; }
24
- .blue-container-grid .col-sm-6 {
25
- flex: 0 0 auto;
26
- width: 50%; }
27
- .blue-container-grid .col-sm-7 {
28
- flex: 0 0 auto;
29
- width: 58.33333%; }
30
- .blue-container-grid .col-sm-8 {
31
- flex: 0 0 auto;
32
- width: 66.66667%; }
33
- .blue-container-grid .col-sm-9 {
34
- flex: 0 0 auto;
35
- width: 75%; }
36
- .blue-container-grid .col-sm-10 {
37
- flex: 0 0 auto;
38
- width: 83.33333%; }
39
- .blue-container-grid .col-sm-11 {
40
- flex: 0 0 auto;
41
- width: 91.66667%; }
42
- .blue-container-grid .col-sm-12 {
43
- flex: 0 0 auto;
44
- width: 100%; } }
45
-
46
- @container (min-width: 768px) {
47
- .blue-container-grid .col-md-1 {
48
- flex: 0 0 auto;
49
- width: 8.33333%; }
50
- .blue-container-grid .col-md-2 {
51
- flex: 0 0 auto;
52
- width: 16.66667%; }
53
- .blue-container-grid .col-md-3 {
54
- flex: 0 0 auto;
55
- width: 25%; }
56
- .blue-container-grid .col-md-4 {
57
- flex: 0 0 auto;
58
- width: 33.33333%; }
59
- .blue-container-grid .col-md-5 {
60
- flex: 0 0 auto;
61
- width: 41.66667%; }
62
- .blue-container-grid .col-md-6 {
63
- flex: 0 0 auto;
64
- width: 50%; }
65
- .blue-container-grid .col-md-7 {
66
- flex: 0 0 auto;
67
- width: 58.33333%; }
68
- .blue-container-grid .col-md-8 {
69
- flex: 0 0 auto;
70
- width: 66.66667%; }
71
- .blue-container-grid .col-md-9 {
72
- flex: 0 0 auto;
73
- width: 75%; }
74
- .blue-container-grid .col-md-10 {
75
- flex: 0 0 auto;
76
- width: 83.33333%; }
77
- .blue-container-grid .col-md-11 {
78
- flex: 0 0 auto;
79
- width: 91.66667%; }
80
- .blue-container-grid .col-md-12 {
81
- flex: 0 0 auto;
82
- width: 100%; } }
83
-
84
- @container (min-width: 992px) {
85
- .blue-container-grid .col-lg-1 {
86
- flex: 0 0 auto;
87
- width: 8.33333%; }
88
- .blue-container-grid .col-lg-2 {
89
- flex: 0 0 auto;
90
- width: 16.66667%; }
91
- .blue-container-grid .col-lg-3 {
92
- flex: 0 0 auto;
93
- width: 25%; }
94
- .blue-container-grid .col-lg-4 {
95
- flex: 0 0 auto;
96
- width: 33.33333%; }
97
- .blue-container-grid .col-lg-5 {
98
- flex: 0 0 auto;
99
- width: 41.66667%; }
100
- .blue-container-grid .col-lg-6 {
101
- flex: 0 0 auto;
102
- width: 50%; }
103
- .blue-container-grid .col-lg-7 {
104
- flex: 0 0 auto;
105
- width: 58.33333%; }
106
- .blue-container-grid .col-lg-8 {
107
- flex: 0 0 auto;
108
- width: 66.66667%; }
109
- .blue-container-grid .col-lg-9 {
110
- flex: 0 0 auto;
111
- width: 75%; }
112
- .blue-container-grid .col-lg-10 {
113
- flex: 0 0 auto;
114
- width: 83.33333%; }
115
- .blue-container-grid .col-lg-11 {
116
- flex: 0 0 auto;
117
- width: 91.66667%; }
118
- .blue-container-grid .col-lg-12 {
119
- flex: 0 0 auto;
120
- width: 100%; } }
121
-
122
- @container (min-width: 1200px) {
123
- .blue-container-grid .col-xl-1 {
124
- flex: 0 0 auto;
125
- width: 8.33333%; }
126
- .blue-container-grid .col-xl-2 {
127
- flex: 0 0 auto;
128
- width: 16.66667%; }
129
- .blue-container-grid .col-xl-3 {
130
- flex: 0 0 auto;
131
- width: 25%; }
132
- .blue-container-grid .col-xl-4 {
133
- flex: 0 0 auto;
134
- width: 33.33333%; }
135
- .blue-container-grid .col-xl-5 {
136
- flex: 0 0 auto;
137
- width: 41.66667%; }
138
- .blue-container-grid .col-xl-6 {
139
- flex: 0 0 auto;
140
- width: 50%; }
141
- .blue-container-grid .col-xl-7 {
142
- flex: 0 0 auto;
143
- width: 58.33333%; }
144
- .blue-container-grid .col-xl-8 {
145
- flex: 0 0 auto;
146
- width: 66.66667%; }
147
- .blue-container-grid .col-xl-9 {
148
- flex: 0 0 auto;
149
- width: 75%; }
150
- .blue-container-grid .col-xl-10 {
151
- flex: 0 0 auto;
152
- width: 83.33333%; }
153
- .blue-container-grid .col-xl-11 {
154
- flex: 0 0 auto;
155
- width: 91.66667%; }
156
- .blue-container-grid .col-xl-12 {
157
- flex: 0 0 auto;
158
- width: 100%; } }
159
-
160
- @container (min-width: 1400px) {
161
- .blue-container-grid .col-xxl-1 {
162
- flex: 0 0 auto;
163
- width: 8.33333%; }
164
- .blue-container-grid .col-xxl-2 {
165
- flex: 0 0 auto;
166
- width: 16.66667%; }
167
- .blue-container-grid .col-xxl-3 {
168
- flex: 0 0 auto;
169
- width: 25%; }
170
- .blue-container-grid .col-xxl-4 {
171
- flex: 0 0 auto;
172
- width: 33.33333%; }
173
- .blue-container-grid .col-xxl-5 {
174
- flex: 0 0 auto;
175
- width: 41.66667%; }
176
- .blue-container-grid .col-xxl-6 {
177
- flex: 0 0 auto;
178
- width: 50%; }
179
- .blue-container-grid .col-xxl-7 {
180
- flex: 0 0 auto;
181
- width: 58.33333%; }
182
- .blue-container-grid .col-xxl-8 {
183
- flex: 0 0 auto;
184
- width: 66.66667%; }
185
- .blue-container-grid .col-xxl-9 {
186
- flex: 0 0 auto;
187
- width: 75%; }
188
- .blue-container-grid .col-xxl-10 {
189
- flex: 0 0 auto;
190
- width: 83.33333%; }
191
- .blue-container-grid .col-xxl-11 {
192
- flex: 0 0 auto;
193
- width: 91.66667%; }
194
- .blue-container-grid .col-xxl-12 {
195
- flex: 0 0 auto;
196
- width: 100%; } }
@@ -1 +0,0 @@
1
- (()=>{"use strict";var e={};function t(e,t,r){return(t=function(e){var t=function(e){if("object"!=typeof e||!e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var r=t.call(e,"string");if("object"!=typeof r)return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e);return"symbol"==typeof t?t:t+""}(t))in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}e.d=(t,r)=>{for(var s in r)e.o(r,s)&&!e.o(t,s)&&Object.defineProperty(t,s,{enumerable:!0,get:r[s]})},e.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t);class r extends HTMLElement{constructor(){super(...arguments),t(this,"ancestorObservers",[]),t(this,"rafId",null)}static get observedAttributes(){return["dark-threshold"]}connectedCallback(){this.init()}disconnectedCallback(){this.cleanupObservers(),null!=this.rafId&&cancelAnimationFrame(this.rafId)}attributeChangedCallback(){this.scheduleUpdate()}init(){this.cleanupObservers(),this.observeAncestors(),this.updateTheme()}observeAncestors(){let e=this.parentElement;for(;e&&e!==document.documentElement;){const t=new MutationObserver(()=>this.scheduleUpdate());t.observe(e,{attributes:!0,attributeFilter:["class","style"]}),this.ancestorObservers.push(t),e=e.parentElement}[document.body,document.documentElement].forEach(e=>{if(!e)return;const t=new MutationObserver(()=>this.scheduleUpdate());t.observe(e,{attributes:!0,attributeFilter:["class","style"]}),this.ancestorObservers.push(t)})}cleanupObservers(){this.ancestorObservers.forEach(e=>e.disconnect()),this.ancestorObservers=[]}scheduleUpdate(){null==this.rafId&&(this.rafId=requestAnimationFrame(()=>{this.rafId=null,this.updateTheme()}))}getThreshold(){const e=parseFloat(this.getAttribute("dark-threshold")||"");return isNaN(e)?.5:Math.min(1,Math.max(0,e))}updateTheme(){const e=this.computeEffectiveBackground();e&&this.relativeLuminance(e.r,e.g,e.b)<this.getThreshold()?this.setAttribute("data-bs-theme","dark"):this.removeAttribute("data-bs-theme")}computeEffectiveBackground(){let e={r:0,g:0,b:0,a:0},t=this.parentElement;for(;t&&e.a<.999;){const r=getComputedStyle(t),s=this.parseColor(r.backgroundColor);s&&s.a>0&&(e=this.composite(s,e)),t=t.parentElement}if(e.a<.999){const t=this.parseColor(getComputedStyle(document.documentElement).backgroundColor)||this.parseColor(getComputedStyle(document.body).backgroundColor)||{r:255,g:255,b:255,a:1};e=this.composite(t,e)}return e}composite(e,t){const r=e.a+t.a*(1-e.a);return{r:(e.r*e.a+t.r*t.a*(1-e.a))/(r||1),g:(e.g*e.a+t.g*t.a*(1-e.a))/(r||1),b:(e.b*e.a+t.b*t.a*(1-e.a))/(r||1),a:r}}parseColor(e){if(!e)return null;const t=e.trim().match(/^rgba?\(\s*([\d.]+)[ ,]+([\d.]+)[ ,]+([\d.]+)(?:[ ,/]+([\d.]+))?\s*\)$/i);if(t)return{r:Number(t[1]),g:Number(t[2]),b:Number(t[3]),a:void 0!==t[4]?Number(t[4]):1};if("#"===e[0]){let t=e.slice(1);if(3===t.length&&(t=t.split("").map(e=>e+e).join("")),6===t.length||8===t.length)return{r:parseInt(t.slice(0,2),16),g:parseInt(t.slice(2,4),16),b:parseInt(t.slice(4,6),16),a:8===t.length?parseInt(t.slice(6,8),16)/255:1}}return null}relativeLuminance(e,t,r){const s=e=>{const t=e/255;return t<=.03928?t/12.92:Math.pow((t+.055)/1.055,2.4)};return.2126*s(e)+.7152*s(t)+.0722*s(r)}}customElements.define("bl-auto-theme",r)})();
@@ -1,26 +0,0 @@
1
- /**
2
- * <bl-auto-theme>
3
- * Determines the effective (composed through transparent layers) background color
4
- * behind the element and sets data-bs-theme="dark" if that color is dark.
5
- *
6
- * Attribute:
7
- * - dark-threshold (0..1, default 0.5)
8
- */
9
- export declare class AutoTheme extends HTMLElement {
10
- private ancestorObservers;
11
- private rafId;
12
- static get observedAttributes(): string[];
13
- connectedCallback(): void;
14
- disconnectedCallback(): void;
15
- attributeChangedCallback(): void;
16
- private init;
17
- private observeAncestors;
18
- private cleanupObservers;
19
- private scheduleUpdate;
20
- private getThreshold;
21
- private updateTheme;
22
- private computeEffectiveBackground;
23
- private composite;
24
- private parseColor;
25
- private relativeLuminance;
26
- }
@@ -1,169 +0,0 @@
1
- function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
2
- function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
3
- function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
4
- /**
5
- * <bl-auto-theme>
6
- * Determines the effective (composed through transparent layers) background color
7
- * behind the element and sets data-bs-theme="dark" if that color is dark.
8
- *
9
- * Attribute:
10
- * - dark-threshold (0..1, default 0.5)
11
- */
12
- export class AutoTheme extends HTMLElement {
13
- constructor() {
14
- super(...arguments);
15
- _defineProperty(this, "ancestorObservers", []);
16
- _defineProperty(this, "rafId", null);
17
- }
18
- static get observedAttributes() {
19
- return ["dark-threshold"];
20
- }
21
- connectedCallback() {
22
- this.init();
23
- }
24
- disconnectedCallback() {
25
- this.cleanupObservers();
26
- if (this.rafId != null) cancelAnimationFrame(this.rafId);
27
- }
28
- attributeChangedCallback() {
29
- this.scheduleUpdate();
30
- }
31
- init() {
32
- this.cleanupObservers();
33
- this.observeAncestors();
34
- this.updateTheme();
35
- }
36
- observeAncestors() {
37
- // Observe style/class changes of all ancestors
38
- let el = this.parentElement;
39
- while (el && el !== document.documentElement) {
40
- const mo = new MutationObserver(() => this.scheduleUpdate());
41
- mo.observe(el, {
42
- attributes: true,
43
- attributeFilter: ["class", "style"]
44
- });
45
- this.ancestorObservers.push(mo);
46
- el = el.parentElement;
47
- }
48
- // Also observe body / documentElement
49
- ;
50
- [document.body, document.documentElement].forEach(root => {
51
- if (!root) return;
52
- const mo = new MutationObserver(() => this.scheduleUpdate());
53
- mo.observe(root, {
54
- attributes: true,
55
- attributeFilter: ["class", "style"]
56
- });
57
- this.ancestorObservers.push(mo);
58
- });
59
- }
60
- cleanupObservers() {
61
- this.ancestorObservers.forEach(o => o.disconnect());
62
- this.ancestorObservers = [];
63
- }
64
- scheduleUpdate() {
65
- if (this.rafId != null) return;
66
- this.rafId = requestAnimationFrame(() => {
67
- this.rafId = null;
68
- this.updateTheme();
69
- });
70
- }
71
- getThreshold() {
72
- const v = parseFloat(this.getAttribute("dark-threshold") || "");
73
- return isNaN(v) ? 0.5 : Math.min(1, Math.max(0, v));
74
- }
75
- updateTheme() {
76
- const color = this.computeEffectiveBackground();
77
- if (!color) {
78
- this.removeAttribute("data-bs-theme");
79
- return;
80
- }
81
- const luminance = this.relativeLuminance(color.r, color.g, color.b);
82
- if (luminance < this.getThreshold()) {
83
- this.setAttribute("data-bs-theme", "dark");
84
- } else {
85
- this.removeAttribute("data-bs-theme");
86
- }
87
- }
88
-
89
- // Accumulates transparent layers (background-color only) of ancestors
90
- computeEffectiveBackground() {
91
- let accum = {
92
- r: 0,
93
- g: 0,
94
- b: 0,
95
- a: 0
96
- };
97
- let current = this.parentElement;
98
- while (current && accum.a < 0.999) {
99
- const cs = getComputedStyle(current);
100
- const col = this.parseColor(cs.backgroundColor);
101
- if (col && col.a > 0) {
102
- accum = this.composite(col, accum);
103
- }
104
- current = current.parentElement;
105
- }
106
- if (accum.a < 0.999) {
107
- const rootColor = this.parseColor(getComputedStyle(document.documentElement).backgroundColor) || this.parseColor(getComputedStyle(document.body).backgroundColor) || {
108
- r: 255,
109
- g: 255,
110
- b: 255,
111
- a: 1
112
- };
113
- accum = this.composite(rootColor, accum);
114
- }
115
- return accum;
116
- }
117
- composite(top, bottom) {
118
- const a = top.a + bottom.a * (1 - top.a);
119
- const r = (top.r * top.a + bottom.r * bottom.a * (1 - top.a)) / (a || 1);
120
- const g = (top.g * top.a + bottom.g * bottom.a * (1 - top.a)) / (a || 1);
121
- const b = (top.b * top.a + bottom.b * bottom.a * (1 - top.a)) / (a || 1);
122
- return {
123
- r,
124
- g,
125
- b,
126
- a
127
- };
128
- }
129
- parseColor(input) {
130
- if (!input) return null;
131
- const m = input.trim().match(/^rgba?\(\s*([\d.]+)[ ,]+([\d.]+)[ ,]+([\d.]+)(?:[ ,/]+([\d.]+))?\s*\)$/i);
132
- if (m) {
133
- return {
134
- r: Number(m[1]),
135
- g: Number(m[2]),
136
- b: Number(m[3]),
137
- a: m[4] !== undefined ? Number(m[4]) : 1
138
- };
139
- }
140
- if (input[0] === "#") {
141
- let hex = input.slice(1);
142
- if (hex.length === 3) hex = hex.split("").map(c => c + c).join("");
143
- if (hex.length === 6 || hex.length === 8) {
144
- const r = parseInt(hex.slice(0, 2), 16);
145
- const g = parseInt(hex.slice(2, 4), 16);
146
- const b = parseInt(hex.slice(4, 6), 16);
147
- const a = hex.length === 8 ? parseInt(hex.slice(6, 8), 16) / 255 : 1;
148
- return {
149
- r,
150
- g,
151
- b,
152
- a
153
- };
154
- }
155
- }
156
- return null;
157
- }
158
- relativeLuminance(r, g, b) {
159
- const toLin = c => {
160
- const v = c / 255;
161
- return v <= 0.03928 ? v / 12.92 : Math.pow((v + 0.055) / 1.055, 2.4);
162
- };
163
- const R = toLin(r);
164
- const G = toLin(g);
165
- const B = toLin(b);
166
- return 0.2126 * R + 0.7152 * G + 0.0722 * B;
167
- }
168
- }
169
- customElements.define("bl-auto-theme", AutoTheme);
@@ -1 +0,0 @@
1
- (()=>{"use strict";class t extends HTMLElement{constructor(){super(),this.attachShadow({mode:"open"})}connectedCallback(){this.shadowRoot.innerHTML='<button part="base" type="button">Hello world</button>'}}customElements.get("bl-button")||customElements.define("bl-button",t)})();
@@ -1,6 +0,0 @@
1
- declare class Button extends HTMLElement {
2
- constructor();
3
- connectedCallback(): void;
4
- }
5
- export { Button };
6
- export default Button;
package/dist/js/button.js DELETED
@@ -1,16 +0,0 @@
1
- class Button extends HTMLElement {
2
- constructor() {
3
- super();
4
- this.attachShadow({
5
- mode: "open"
6
- });
7
- }
8
- connectedCallback() {
9
- this.shadowRoot.innerHTML = /* html*/"<button part=\"base\" type=\"button\">Hello world</button>";
10
- }
11
- }
12
- if (!customElements.get("bl-button")) {
13
- customElements.define("bl-button", Button);
14
- }
15
- export { Button };
16
- export default Button;
@@ -1,5 +0,0 @@
1
- /*!
2
- * Bootstrap v5.3.3 (https://getbootstrap.com/)
3
- * Copyright 2011-2024 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
4
- * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
5
- */