@ni/spright-components 1.0.17 → 1.0.19
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/all-components-bundle.js +30 -54
- package/dist/all-components-bundle.js.map +1 -1
- package/dist/all-components-bundle.min.js +21 -49
- package/dist/all-components-bundle.min.js.map +1 -1
- package/dist/esm/utilities/style/display.d.ts +4 -2
- package/dist/esm/utilities/style/display.js +5 -3
- package/dist/esm/utilities/style/display.js.map +1 -1
- package/package.json +2 -2
|
@@ -15159,10 +15159,12 @@
|
|
|
15159
15159
|
}
|
|
15160
15160
|
|
|
15161
15161
|
/**
|
|
15162
|
-
*
|
|
15163
|
-
*
|
|
15162
|
+
* Each element should use the display utility which will create styles to:
|
|
15163
|
+
* - Set the `:host` display property
|
|
15164
|
+
* - Respond to the `hidden` attribute set on `:host`
|
|
15165
|
+
* - Configure `box-sizing` for `:host`, all elements in shadow root, and `::before` / `::after` pseudoelements
|
|
15164
15166
|
*/
|
|
15165
|
-
const display$1 = (displayValue) => `${display$2(displayValue)}`;
|
|
15167
|
+
const display$1 = (displayValue) => `${display$2(displayValue)}:host{box-sizing:border-box;}*{box-sizing:border-box;}:host::before,:host::after,::before,::after{box-sizing:border-box;}`;
|
|
15166
15168
|
|
|
15167
15169
|
/**
|
|
15168
15170
|
* This file is a workaround for: https://github.com/prettier/prettier/issues/11400
|
|
@@ -16278,7 +16280,7 @@
|
|
|
16278
16280
|
|
|
16279
16281
|
/**
|
|
16280
16282
|
* Do not edit directly
|
|
16281
|
-
* Generated on
|
|
16283
|
+
* Generated on Tue, 11 Jun 2024 19:14:08 GMT
|
|
16282
16284
|
*/
|
|
16283
16285
|
|
|
16284
16286
|
const Information100DarkUi = "#a46eff";
|
|
@@ -17019,7 +17021,6 @@
|
|
|
17019
17021
|
${display$1('inline')}
|
|
17020
17022
|
|
|
17021
17023
|
:host {
|
|
17022
|
-
box-sizing: border-box;
|
|
17023
17024
|
font: ${linkFont};
|
|
17024
17025
|
}
|
|
17025
17026
|
|
|
@@ -17322,7 +17323,6 @@
|
|
|
17322
17323
|
cursor: pointer;
|
|
17323
17324
|
outline: none;
|
|
17324
17325
|
border: none;
|
|
17325
|
-
box-sizing: border-box;
|
|
17326
17326
|
${
|
|
17327
17327
|
/*
|
|
17328
17328
|
Not sure why but this is needed to get buttons with icons and buttons
|
|
@@ -17337,7 +17337,6 @@
|
|
|
17337
17337
|
height: 100%;
|
|
17338
17338
|
width: 100%;
|
|
17339
17339
|
border: ${borderWidth} solid transparent;
|
|
17340
|
-
box-sizing: border-box;
|
|
17341
17340
|
color: inherit;
|
|
17342
17341
|
border-radius: inherit;
|
|
17343
17342
|
fill: inherit;
|
|
@@ -17371,10 +17370,9 @@
|
|
|
17371
17370
|
width: 100%;
|
|
17372
17371
|
height: 100%;
|
|
17373
17372
|
pointer-events: none;
|
|
17374
|
-
box-sizing: border-box;
|
|
17375
17373
|
outline: 0px solid transparent;
|
|
17376
17374
|
color: transparent;
|
|
17377
|
-
background-clip:
|
|
17375
|
+
background-clip: border-box;
|
|
17378
17376
|
transition: outline ${smallDelay} ease-in-out;
|
|
17379
17377
|
}
|
|
17380
17378
|
|
|
@@ -17721,7 +17719,6 @@
|
|
|
17721
17719
|
display: grid;
|
|
17722
17720
|
contain: layout;
|
|
17723
17721
|
overflow: visible;
|
|
17724
|
-
box-sizing: border-box;
|
|
17725
17722
|
height: ${controlHeight};
|
|
17726
17723
|
grid-template-columns: 1fr;
|
|
17727
17724
|
column-gap: 8px;
|
|
@@ -17899,7 +17896,6 @@
|
|
|
17899
17896
|
|
|
17900
17897
|
:host {
|
|
17901
17898
|
position: relative;
|
|
17902
|
-
box-sizing: border-box;
|
|
17903
17899
|
font: ${buttonLabelFont};
|
|
17904
17900
|
height: ${controlHeight};
|
|
17905
17901
|
color: ${bodyFontColor};
|
|
@@ -18075,7 +18071,6 @@
|
|
|
18075
18071
|
${display$1('grid')}
|
|
18076
18072
|
|
|
18077
18073
|
:host {
|
|
18078
|
-
box-sizing: border-box;
|
|
18079
18074
|
grid-template-columns: auto 1fr;
|
|
18080
18075
|
grid-template-rows: auto 1fr;
|
|
18081
18076
|
}
|
|
@@ -18352,7 +18347,6 @@
|
|
|
18352
18347
|
.positioning-region {
|
|
18353
18348
|
display: flex;
|
|
18354
18349
|
position: relative;
|
|
18355
|
-
box-sizing: border-box;
|
|
18356
18350
|
height: calc(${iconSize} * 2);
|
|
18357
18351
|
width: 100%;
|
|
18358
18352
|
}
|
|
@@ -19970,7 +19964,6 @@
|
|
|
19970
19964
|
${display$1('inline-block')}
|
|
19971
19965
|
|
|
19972
19966
|
:host {
|
|
19973
|
-
box-sizing: border-box;
|
|
19974
19967
|
font: ${linkFont};
|
|
19975
19968
|
--ni-private-breadcrumb-link-font-color: ${linkFontColor};
|
|
19976
19969
|
--ni-private-breadcrumb-link-active-font-color: ${linkActiveFontColor};
|
|
@@ -20016,7 +20009,6 @@
|
|
|
20016
20009
|
|
|
20017
20010
|
:host {
|
|
20018
20011
|
height: ${controlHeight};
|
|
20019
|
-
box-sizing: border-box;
|
|
20020
20012
|
padding-left: calc(4px - ${borderWidth});
|
|
20021
20013
|
|
|
20022
20014
|
${
|
|
@@ -20150,7 +20142,6 @@
|
|
|
20150
20142
|
cursor: pointer;
|
|
20151
20143
|
outline: none;
|
|
20152
20144
|
border: none;
|
|
20153
|
-
box-sizing: border-box;
|
|
20154
20145
|
transition: box-shadow ${smallDelay};
|
|
20155
20146
|
}
|
|
20156
20147
|
|
|
@@ -20324,7 +20315,6 @@
|
|
|
20324
20315
|
.control {
|
|
20325
20316
|
width: calc(${controlHeight} / 2);
|
|
20326
20317
|
height: calc(${controlHeight} / 2);
|
|
20327
|
-
box-sizing: border-box;
|
|
20328
20318
|
flex-shrink: 0;
|
|
20329
20319
|
border: ${borderWidth} solid ${borderColor};
|
|
20330
20320
|
padding: 2px;
|
|
@@ -20660,7 +20650,6 @@
|
|
|
20660
20650
|
${display$1('inline-flex')}
|
|
20661
20651
|
|
|
20662
20652
|
:host {
|
|
20663
|
-
box-sizing: border-box;
|
|
20664
20653
|
color: ${bodyFontColor};
|
|
20665
20654
|
font: ${bodyFont};
|
|
20666
20655
|
height: ${controlHeight};
|
|
@@ -20738,7 +20727,6 @@
|
|
|
20738
20727
|
|
|
20739
20728
|
.control {
|
|
20740
20729
|
align-items: center;
|
|
20741
|
-
box-sizing: border-box;
|
|
20742
20730
|
cursor: pointer;
|
|
20743
20731
|
display: flex;
|
|
20744
20732
|
min-height: 100%;
|
|
@@ -20765,7 +20753,6 @@
|
|
|
20765
20753
|
}
|
|
20766
20754
|
|
|
20767
20755
|
.listbox {
|
|
20768
|
-
box-sizing: border-box;
|
|
20769
20756
|
display: inline-flex;
|
|
20770
20757
|
flex-direction: column;
|
|
20771
20758
|
overflow-y: auto;
|
|
@@ -20983,7 +20970,7 @@
|
|
|
20983
20970
|
border-right: 2px solid rgba(${borderRgbPartialColor}, 0.15);
|
|
20984
20971
|
height: calc(${controlHeight} - 12px);
|
|
20985
20972
|
align-self: center;
|
|
20986
|
-
|
|
20973
|
+
margin-left: 4px;
|
|
20987
20974
|
}
|
|
20988
20975
|
|
|
20989
20976
|
.dropdown-button {
|
|
@@ -22120,7 +22107,6 @@
|
|
|
22120
22107
|
}
|
|
22121
22108
|
|
|
22122
22109
|
.dialog-contents {
|
|
22123
|
-
box-sizing: border-box;
|
|
22124
22110
|
display: flex;
|
|
22125
22111
|
flex-direction: column;
|
|
22126
22112
|
position: absolute;
|
|
@@ -25448,7 +25434,7 @@
|
|
|
25448
25434
|
}
|
|
25449
25435
|
|
|
25450
25436
|
::slotted(hr) {
|
|
25451
|
-
box-sizing:
|
|
25437
|
+
box-sizing: border-box;
|
|
25452
25438
|
height: 2px;
|
|
25453
25439
|
margin: ${smallPadding};
|
|
25454
25440
|
border: none;
|
|
@@ -25793,7 +25779,6 @@
|
|
|
25793
25779
|
:host {
|
|
25794
25780
|
contain: layout;
|
|
25795
25781
|
overflow: visible;
|
|
25796
|
-
box-sizing: border-box;
|
|
25797
25782
|
height: ${controlHeight};
|
|
25798
25783
|
grid-template-columns: 1fr;
|
|
25799
25784
|
column-gap: 8px;
|
|
@@ -25930,7 +25915,6 @@
|
|
|
25930
25915
|
}
|
|
25931
25916
|
|
|
25932
25917
|
.root {
|
|
25933
|
-
box-sizing: border-box;
|
|
25934
25918
|
position: relative;
|
|
25935
25919
|
display: flex;
|
|
25936
25920
|
flex-direction: row;
|
|
@@ -26047,7 +26031,7 @@
|
|
|
26047
26031
|
|
|
26048
26032
|
.error-icon {
|
|
26049
26033
|
order: 1;
|
|
26050
|
-
|
|
26034
|
+
margin-right: ${smallPadding};
|
|
26051
26035
|
}
|
|
26052
26036
|
`.withBehaviors(appearanceBehavior(NumberFieldAppearance.underline, css `
|
|
26053
26037
|
.root {
|
|
@@ -26177,7 +26161,6 @@
|
|
|
26177
26161
|
position: relative;
|
|
26178
26162
|
width: calc(${controlHeight} / 2);
|
|
26179
26163
|
height: calc(${controlHeight} / 2);
|
|
26180
|
-
box-sizing: border-box;
|
|
26181
26164
|
flex-shrink: 0;
|
|
26182
26165
|
border: ${borderWidth} solid ${borderColor};
|
|
26183
26166
|
border-radius: 100%;
|
|
@@ -44448,7 +44431,6 @@ img.ProseMirror-separator {
|
|
|
44448
44431
|
}
|
|
44449
44432
|
|
|
44450
44433
|
.container {
|
|
44451
|
-
box-sizing: border-box;
|
|
44452
44434
|
display: flex;
|
|
44453
44435
|
flex-direction: column;
|
|
44454
44436
|
position: relative;
|
|
@@ -44529,7 +44511,6 @@ img.ProseMirror-separator {
|
|
|
44529
44511
|
${
|
|
44530
44512
|
/* This padding ensures that showing/hiding the error icon doesn't affect text layout */ ''}
|
|
44531
44513
|
padding-right: calc(${iconSize});
|
|
44532
|
-
box-sizing: border-box;
|
|
44533
44514
|
position: relative;
|
|
44534
44515
|
color: inherit;
|
|
44535
44516
|
}
|
|
@@ -44651,7 +44632,6 @@ img.ProseMirror-separator {
|
|
|
44651
44632
|
${toolbarTag}::part(positioning-region) {
|
|
44652
44633
|
background: transparent;
|
|
44653
44634
|
padding-right: 8px;
|
|
44654
|
-
box-sizing: border-box;
|
|
44655
44635
|
gap: 0px;
|
|
44656
44636
|
height: var(--ni-private-rich-text-editor-footer-section-height);
|
|
44657
44637
|
}
|
|
@@ -59224,7 +59204,6 @@ img.ProseMirror-separator {
|
|
|
59224
59204
|
.viewer {
|
|
59225
59205
|
font: inherit;
|
|
59226
59206
|
outline: none;
|
|
59227
|
-
box-sizing: border-box;
|
|
59228
59207
|
position: relative;
|
|
59229
59208
|
color: inherit;
|
|
59230
59209
|
overflow-wrap: anywhere;
|
|
@@ -60867,7 +60846,6 @@ img.ProseMirror-separator {
|
|
|
60867
60846
|
display: flex;
|
|
60868
60847
|
height: var(--ni-private-switch-height);
|
|
60869
60848
|
width: calc(var(--ni-private-switch-height) * 2);
|
|
60870
|
-
box-sizing: border-box;
|
|
60871
60849
|
background-color: ${fillHoverColor};
|
|
60872
60850
|
border-radius: calc(var(--ni-private-switch-height) / 2);
|
|
60873
60851
|
align-items: center;
|
|
@@ -60896,7 +60874,6 @@ img.ProseMirror-separator {
|
|
|
60896
60874
|
justify-content: center;
|
|
60897
60875
|
align-items: center;
|
|
60898
60876
|
background-color: var(--ni-private-switch-indicator-background-color);
|
|
60899
|
-
box-sizing: border-box;
|
|
60900
60877
|
width: var(--ni-private-switch-indicator-size);
|
|
60901
60878
|
height: var(--ni-private-switch-indicator-size);
|
|
60902
60879
|
border-radius: calc(var(--ni-private-switch-indicator-size) / 2);
|
|
@@ -61037,7 +61014,6 @@ img.ProseMirror-separator {
|
|
|
61037
61014
|
|
|
61038
61015
|
:host {
|
|
61039
61016
|
position: relative;
|
|
61040
|
-
box-sizing: border-box;
|
|
61041
61017
|
font: ${buttonLabelFont};
|
|
61042
61018
|
height: ${controlHeight};
|
|
61043
61019
|
color: ${bodyFontColor};
|
|
@@ -61151,7 +61127,6 @@ img.ProseMirror-separator {
|
|
|
61151
61127
|
${display$1('block')}
|
|
61152
61128
|
|
|
61153
61129
|
:host {
|
|
61154
|
-
box-sizing: border-box;
|
|
61155
61130
|
font: ${bodyFont};
|
|
61156
61131
|
color: ${bodyFontColor};
|
|
61157
61132
|
padding-top: ${standardPadding};
|
|
@@ -65191,7 +65166,6 @@ img.ProseMirror-separator {
|
|
|
65191
65166
|
background-color: ${applicationBackgroundColor};
|
|
65192
65167
|
height: calc(${controlHeight} + 2 * ${borderWidth});
|
|
65193
65168
|
border-top: calc(2 * ${borderWidth}) solid transparent;
|
|
65194
|
-
box-sizing: border-box;
|
|
65195
65169
|
background-clip: padding-box;
|
|
65196
65170
|
}
|
|
65197
65171
|
|
|
@@ -65200,7 +65174,6 @@ img.ProseMirror-separator {
|
|
|
65200
65174
|
width: 100%;
|
|
65201
65175
|
height: ${controlHeight};
|
|
65202
65176
|
pointer-events: none;
|
|
65203
|
-
box-sizing: border-box;
|
|
65204
65177
|
bottom: 0px;
|
|
65205
65178
|
position: absolute;
|
|
65206
65179
|
}
|
|
@@ -65219,9 +65192,13 @@ img.ProseMirror-separator {
|
|
|
65219
65192
|
|
|
65220
65193
|
.expand-collapse-button {
|
|
65221
65194
|
flex: 0 0 auto;
|
|
65222
|
-
|
|
65223
|
-
|
|
65224
|
-
${
|
|
65195
|
+
margin-left: max(
|
|
65196
|
+
calc(
|
|
65197
|
+
${mediumPadding} +
|
|
65198
|
+
(var(--ni-private-table-row-indent-level) - 1) *
|
|
65199
|
+
${controlHeight}
|
|
65200
|
+
),
|
|
65201
|
+
0px
|
|
65225
65202
|
);
|
|
65226
65203
|
}
|
|
65227
65204
|
|
|
@@ -65233,9 +65210,13 @@ img.ProseMirror-separator {
|
|
|
65233
65210
|
display: flex;
|
|
65234
65211
|
align-items: center;
|
|
65235
65212
|
justify-content: center;
|
|
65236
|
-
|
|
65237
|
-
|
|
65238
|
-
${
|
|
65213
|
+
margin-left: max(
|
|
65214
|
+
calc(
|
|
65215
|
+
${mediumPadding} +
|
|
65216
|
+
(var(--ni-private-table-row-indent-level) - 1) *
|
|
65217
|
+
${controlHeight}
|
|
65218
|
+
),
|
|
65219
|
+
0px
|
|
65239
65220
|
);
|
|
65240
65221
|
}
|
|
65241
65222
|
|
|
@@ -65760,7 +65741,6 @@ img.ProseMirror-separator {
|
|
|
65760
65741
|
align-items: center;
|
|
65761
65742
|
height: calc(${controlHeight} + 2 * ${borderWidth});
|
|
65762
65743
|
border-top: calc(2 * ${borderWidth}) solid ${applicationBackgroundColor};
|
|
65763
|
-
box-sizing: border-box;
|
|
65764
65744
|
grid-template-columns:
|
|
65765
65745
|
calc(
|
|
65766
65746
|
${controlHeight} *
|
|
@@ -71072,7 +71052,6 @@ img.ProseMirror-separator {
|
|
|
71072
71052
|
${display$1('grid')}
|
|
71073
71053
|
|
|
71074
71054
|
:host {
|
|
71075
|
-
box-sizing: border-box;
|
|
71076
71055
|
grid-template-columns: auto 1fr;
|
|
71077
71056
|
grid-template-rows: auto 1fr;
|
|
71078
71057
|
}
|
|
@@ -71121,7 +71100,6 @@ img.ProseMirror-separator {
|
|
|
71121
71100
|
:host {
|
|
71122
71101
|
align-items: center;
|
|
71123
71102
|
height: ${controlHeight};
|
|
71124
|
-
box-sizing: border-box;
|
|
71125
71103
|
font: ${bodyFont};
|
|
71126
71104
|
color: ${bodyFontColor};
|
|
71127
71105
|
}
|
|
@@ -71230,7 +71208,6 @@ img.ProseMirror-separator {
|
|
|
71230
71208
|
font: inherit;
|
|
71231
71209
|
flex-grow: 1;
|
|
71232
71210
|
outline: none;
|
|
71233
|
-
box-sizing: border-box;
|
|
71234
71211
|
position: relative;
|
|
71235
71212
|
color: inherit;
|
|
71236
71213
|
border-radius: 0px;
|
|
@@ -71535,7 +71512,6 @@ img.ProseMirror-separator {
|
|
|
71535
71512
|
}
|
|
71536
71513
|
|
|
71537
71514
|
.root {
|
|
71538
|
-
box-sizing: border-box;
|
|
71539
71515
|
position: relative;
|
|
71540
71516
|
display: flex;
|
|
71541
71517
|
flex-direction: row;
|
|
@@ -71804,7 +71780,6 @@ img.ProseMirror-separator {
|
|
|
71804
71780
|
}
|
|
71805
71781
|
|
|
71806
71782
|
.tooltip {
|
|
71807
|
-
box-sizing: border-box;
|
|
71808
71783
|
flex-shrink: 0;
|
|
71809
71784
|
max-width: 440px;
|
|
71810
71785
|
box-shadow: ${elevation2BoxShadow};
|
|
@@ -72057,7 +72032,6 @@ img.ProseMirror-separator {
|
|
|
72057
72032
|
.positioning-region {
|
|
72058
72033
|
display: flex;
|
|
72059
72034
|
position: relative;
|
|
72060
|
-
box-sizing: border-box;
|
|
72061
72035
|
height: calc(${iconSize} * 2);
|
|
72062
72036
|
}
|
|
72063
72037
|
|
|
@@ -78607,7 +78581,7 @@ img.ProseMirror-separator {
|
|
|
78607
78581
|
.join("-");
|
|
78608
78582
|
}
|
|
78609
78583
|
|
|
78610
|
-
const workerCode = "var MatrixRenderer = (function (exports) {\n 'use strict';\n\n /**\n * @license\n * Copyright 2019 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n const proxyMarker = Symbol(\"Comlink.proxy\");\n const createEndpoint = Symbol(\"Comlink.endpoint\");\n const releaseProxy = Symbol(\"Comlink.releaseProxy\");\n const finalizer = Symbol(\"Comlink.finalizer\");\n const throwMarker = Symbol(\"Comlink.thrown\");\n const isObject = (val) => (typeof val === \"object\" && val !== null) || typeof val === \"function\";\n /**\n * Internal transfer handle to handle objects marked to proxy.\n */\n const proxyTransferHandler = {\n canHandle: (val) => isObject(val) && val[proxyMarker],\n serialize(obj) {\n const { port1, port2 } = new MessageChannel();\n expose(obj, port1);\n return [port2, [port2]];\n },\n deserialize(port) {\n port.start();\n return wrap(port);\n },\n };\n /**\n * Internal transfer handler to handle thrown exceptions.\n */\n const throwTransferHandler = {\n canHandle: (value) => isObject(value) && throwMarker in value,\n serialize({ value }) {\n let serialized;\n if (value instanceof Error) {\n serialized = {\n isError: true,\n value: {\n message: value.message,\n name: value.name,\n stack: value.stack,\n },\n };\n }\n else {\n serialized = { isError: false, value };\n }\n return [serialized, []];\n },\n deserialize(serialized) {\n if (serialized.isError) {\n throw Object.assign(new Error(serialized.value.message), serialized.value);\n }\n throw serialized.value;\n },\n };\n /**\n * Allows customizing the serialization of certain values.\n */\n const transferHandlers = new Map([\n [\"proxy\", proxyTransferHandler],\n [\"throw\", throwTransferHandler],\n ]);\n function isAllowedOrigin(allowedOrigins, origin) {\n for (const allowedOrigin of allowedOrigins) {\n if (origin === allowedOrigin || allowedOrigin === \"*\") {\n return true;\n }\n if (allowedOrigin instanceof RegExp && allowedOrigin.test(origin)) {\n return true;\n }\n }\n return false;\n }\n function expose(obj, ep = globalThis, allowedOrigins = [\"*\"]) {\n ep.addEventListener(\"message\", function callback(ev) {\n if (!ev || !ev.data) {\n return;\n }\n if (!isAllowedOrigin(allowedOrigins, ev.origin)) {\n console.warn(`Invalid origin '${ev.origin}' for comlink proxy`);\n return;\n }\n const { id, type, path } = Object.assign({ path: [] }, ev.data);\n const argumentList = (ev.data.argumentList || []).map(fromWireValue);\n let returnValue;\n try {\n const parent = path.slice(0, -1).reduce((obj, prop) => obj[prop], obj);\n const rawValue = path.reduce((obj, prop) => obj[prop], obj);\n switch (type) {\n case \"GET\" /* MessageType.GET */:\n {\n returnValue = rawValue;\n }\n break;\n case \"SET\" /* MessageType.SET */:\n {\n parent[path.slice(-1)[0]] = fromWireValue(ev.data.value);\n returnValue = true;\n }\n break;\n case \"APPLY\" /* MessageType.APPLY */:\n {\n returnValue = rawValue.apply(parent, argumentList);\n }\n break;\n case \"CONSTRUCT\" /* MessageType.CONSTRUCT */:\n {\n const value = new rawValue(...argumentList);\n returnValue = proxy(value);\n }\n break;\n case \"ENDPOINT\" /* MessageType.ENDPOINT */:\n {\n const { port1, port2 } = new MessageChannel();\n expose(obj, port2);\n returnValue = transfer(port1, [port1]);\n }\n break;\n case \"RELEASE\" /* MessageType.RELEASE */:\n {\n returnValue = undefined;\n }\n break;\n default:\n return;\n }\n }\n catch (value) {\n returnValue = { value, [throwMarker]: 0 };\n }\n Promise.resolve(returnValue)\n .catch((value) => {\n return { value, [throwMarker]: 0 };\n })\n .then((returnValue) => {\n const [wireValue, transferables] = toWireValue(returnValue);\n ep.postMessage(Object.assign(Object.assign({}, wireValue), { id }), transferables);\n if (type === \"RELEASE\" /* MessageType.RELEASE */) {\n // detach and deactive after sending release response above.\n ep.removeEventListener(\"message\", callback);\n closeEndPoint(ep);\n if (finalizer in obj && typeof obj[finalizer] === \"function\") {\n obj[finalizer]();\n }\n }\n })\n .catch((error) => {\n // Send Serialization Error To Caller\n const [wireValue, transferables] = toWireValue({\n value: new TypeError(\"Unserializable return value\"),\n [throwMarker]: 0,\n });\n ep.postMessage(Object.assign(Object.assign({}, wireValue), { id }), transferables);\n });\n });\n if (ep.start) {\n ep.start();\n }\n }\n function isMessagePort(endpoint) {\n return endpoint.constructor.name === \"MessagePort\";\n }\n function closeEndPoint(endpoint) {\n if (isMessagePort(endpoint))\n endpoint.close();\n }\n function wrap(ep, target) {\n return createProxy(ep, [], target);\n }\n function throwIfProxyReleased(isReleased) {\n if (isReleased) {\n throw new Error(\"Proxy has been released and is not useable\");\n }\n }\n function releaseEndpoint(ep) {\n return requestResponseMessage(ep, {\n type: \"RELEASE\" /* MessageType.RELEASE */,\n }).then(() => {\n closeEndPoint(ep);\n });\n }\n const proxyCounter = new WeakMap();\n const proxyFinalizers = \"FinalizationRegistry\" in globalThis &&\n new FinalizationRegistry((ep) => {\n const newCount = (proxyCounter.get(ep) || 0) - 1;\n proxyCounter.set(ep, newCount);\n if (newCount === 0) {\n releaseEndpoint(ep);\n }\n });\n function registerProxy(proxy, ep) {\n const newCount = (proxyCounter.get(ep) || 0) + 1;\n proxyCounter.set(ep, newCount);\n if (proxyFinalizers) {\n proxyFinalizers.register(proxy, ep, proxy);\n }\n }\n function unregisterProxy(proxy) {\n if (proxyFinalizers) {\n proxyFinalizers.unregister(proxy);\n }\n }\n function createProxy(ep, path = [], target = function () { }) {\n let isProxyReleased = false;\n const proxy = new Proxy(target, {\n get(_target, prop) {\n throwIfProxyReleased(isProxyReleased);\n if (prop === releaseProxy) {\n return () => {\n unregisterProxy(proxy);\n releaseEndpoint(ep);\n isProxyReleased = true;\n };\n }\n if (prop === \"then\") {\n if (path.length === 0) {\n return { then: () => proxy };\n }\n const r = requestResponseMessage(ep, {\n type: \"GET\" /* MessageType.GET */,\n path: path.map((p) => p.toString()),\n }).then(fromWireValue);\n return r.then.bind(r);\n }\n return createProxy(ep, [...path, prop]);\n },\n set(_target, prop, rawValue) {\n throwIfProxyReleased(isProxyReleased);\n // FIXME: ES6 Proxy Handler `set` methods are supposed to return a\n // boolean. To show good will, we return true asynchronously ¯\\_(ツ)_/¯\n const [value, transferables] = toWireValue(rawValue);\n return requestResponseMessage(ep, {\n type: \"SET\" /* MessageType.SET */,\n path: [...path, prop].map((p) => p.toString()),\n value,\n }, transferables).then(fromWireValue);\n },\n apply(_target, _thisArg, rawArgumentList) {\n throwIfProxyReleased(isProxyReleased);\n const last = path[path.length - 1];\n if (last === createEndpoint) {\n return requestResponseMessage(ep, {\n type: \"ENDPOINT\" /* MessageType.ENDPOINT */,\n }).then(fromWireValue);\n }\n // We just pretend that `bind()` didn’t happen.\n if (last === \"bind\") {\n return createProxy(ep, path.slice(0, -1));\n }\n const [argumentList, transferables] = processArguments(rawArgumentList);\n return requestResponseMessage(ep, {\n type: \"APPLY\" /* MessageType.APPLY */,\n path: path.map((p) => p.toString()),\n argumentList,\n }, transferables).then(fromWireValue);\n },\n construct(_target, rawArgumentList) {\n throwIfProxyReleased(isProxyReleased);\n const [argumentList, transferables] = processArguments(rawArgumentList);\n return requestResponseMessage(ep, {\n type: \"CONSTRUCT\" /* MessageType.CONSTRUCT */,\n path: path.map((p) => p.toString()),\n argumentList,\n }, transferables).then(fromWireValue);\n },\n });\n registerProxy(proxy, ep);\n return proxy;\n }\n function myFlat(arr) {\n return Array.prototype.concat.apply([], arr);\n }\n function processArguments(argumentList) {\n const processed = argumentList.map(toWireValue);\n return [processed.map((v) => v[0]), myFlat(processed.map((v) => v[1]))];\n }\n const transferCache = new WeakMap();\n function transfer(obj, transfers) {\n transferCache.set(obj, transfers);\n return obj;\n }\n function proxy(obj) {\n return Object.assign(obj, { [proxyMarker]: true });\n }\n function toWireValue(value) {\n for (const [name, handler] of transferHandlers) {\n if (handler.canHandle(value)) {\n const [serializedValue, transferables] = handler.serialize(value);\n return [\n {\n type: \"HANDLER\" /* WireValueType.HANDLER */,\n name,\n value: serializedValue,\n },\n transferables,\n ];\n }\n }\n return [\n {\n type: \"RAW\" /* WireValueType.RAW */,\n value,\n },\n transferCache.get(value) || [],\n ];\n }\n function fromWireValue(value) {\n switch (value.type) {\n case \"HANDLER\" /* WireValueType.HANDLER */:\n return transferHandlers.get(value.name).deserialize(value.value);\n case \"RAW\" /* WireValueType.RAW */:\n return value.value;\n }\n }\n function requestResponseMessage(ep, msg, transfers) {\n return new Promise((resolve) => {\n const id = generateUUID();\n ep.addEventListener(\"message\", function l(ev) {\n if (!ev.data || !ev.data.id || ev.data.id !== id) {\n return;\n }\n ep.removeEventListener(\"message\", l);\n resolve(ev.data);\n });\n if (ep.start) {\n ep.start();\n }\n ep.postMessage(Object.assign({ id }, msg), transfers);\n });\n }\n function generateUUID() {\n return new Array(4)\n .fill(0)\n .map(() => Math.floor(Math.random() * Number.MAX_SAFE_INTEGER).toString(16))\n .join(\"-\");\n }\n\n /* eslint-disable @typescript-eslint/member-ordering */\n /**\n * MatrixRenderer class is meant to be used within a Web Worker context,\n * using Comlink to facilitate communication between the main thread and the worker.\n * The MatrixRenderer class manages a matrix of dies, once an instance of MatrixRenderer is created,\n * it is exposed to the main thread using Comlink's `expose` method.\n * This setup is used in the wafer-map component to perform heavy computational duties\n */\n class MatrixRenderer {\n constructor() {\n this.values = Float64Array.from([]);\n this.scaledColumnIndices = Float64Array.from([]);\n this.scaledRowIndices = Float64Array.from([]);\n this.columnIndicesPositions = Int32Array.from([]);\n this.colorIndices = Int32Array.from([]);\n this.colors = [];\n this.colorValues = Float64Array.from([]);\n this.outsideRangeDieColor = 'rgba(218,223,236,1)';\n this.fontSizeFactor = 0.8;\n this.renderConfig = {\n dieDimensions: {\n width: 0,\n height: 0\n },\n margin: {\n top: 0,\n right: 0,\n bottom: 0,\n left: 0\n },\n verticalCoefficient: 1,\n horizontalCoefficient: 1,\n horizontalConstant: 0,\n verticalConstant: 0,\n gridMinX: 0,\n gridMaxX: 0,\n gridMinY: 0,\n gridMaxY: 0,\n labelsFontSize: 0,\n colorScale: [],\n dieLabelsSuffix: '',\n maxCharacters: 0\n };\n this.transformConfig = {\n transform: {\n k: 1,\n x: 0,\n y: 0\n },\n topLeftCanvasCorner: {\n x: 0,\n y: 0\n },\n bottomRightCanvasCorner: {\n x: 0,\n y: 0\n }\n };\n }\n isDieInGrid(x, y) {\n return (x >= this.renderConfig.gridMinX\n && x <= this.renderConfig.gridMaxX\n && y >= this.renderConfig.gridMinY\n && y <= this.renderConfig.gridMaxY);\n }\n calculateHorizontalScaledIndices(columnIndex) {\n return (this.renderConfig.horizontalCoefficient * columnIndex\n + this.renderConfig.horizontalConstant\n + this.renderConfig.margin.left);\n }\n calculateVerticalScaledIndices(rowIndex) {\n return (this.renderConfig.verticalCoefficient * rowIndex\n + this.renderConfig.verticalConstant\n + this.renderConfig.margin.top);\n }\n findColorIndex(value) {\n let index = -1;\n if (this.colorValues.length === 0 || this.colorValues[0] >= value) {\n return index;\n }\n for (let i = 0; i < this.colorValues.length; i++) {\n if (value <= this.colorValues[i]) {\n index = i;\n break;\n }\n }\n return index;\n }\n setMatrixData(columnIndices, rowIndices, valuesBuffer) {\n const scaledColumnIndex = [];\n const columnPositions = [];\n const scaledRowIndices = [];\n const values = [];\n const colorIndices = [];\n let prevXIndex;\n let dieCount = 0;\n for (let i = 0; i < columnIndices.length; i++) {\n const xIndex = columnIndices[i];\n const yIndex = rowIndices[i];\n if (this.isDieInGrid(xIndex, yIndex)) {\n if (xIndex !== prevXIndex) {\n scaledColumnIndex.push(this.calculateHorizontalScaledIndices(xIndex));\n columnPositions.push(dieCount);\n prevXIndex = xIndex;\n }\n scaledRowIndices.push(this.calculateVerticalScaledIndices(yIndex));\n const value = valuesBuffer[i];\n values.push(value);\n colorIndices.push(this.findColorIndex(value));\n dieCount += 1;\n }\n }\n this.scaledColumnIndices = Float64Array.from(scaledColumnIndex);\n this.columnIndicesPositions = Int32Array.from(columnPositions);\n this.scaledRowIndices = Float64Array.from(scaledRowIndices);\n this.values = Float64Array.from(values);\n this.colorIndices = Int32Array.from(colorIndices);\n }\n setRenderConfig(renderConfig) {\n this.renderConfig = renderConfig;\n this.colors = renderConfig.colorScale.map(marker => marker.color);\n this.colorValues = Float64Array.from(renderConfig.colorScale.map(marker => marker.value));\n }\n setTransformConfig(transformData) {\n this.transformConfig = transformData;\n }\n setCanvas(canvas) {\n this.canvas = canvas;\n this.context = canvas.getContext('2d');\n }\n scaleCanvas() {\n this.context.translate(this.transformConfig.transform.x, this.transformConfig.transform.y);\n this.context.scale(this.transformConfig.transform.k, this.transformConfig.transform.k);\n }\n setCanvasDimensions(data) {\n this.canvas.width = data.width;\n this.canvas.height = data.height;\n }\n getCanvasDimensions() {\n return {\n width: this.canvas.width,\n height: this.canvas.height\n };\n }\n clearCanvas() {\n this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);\n }\n drawWafer() {\n this.context.restore();\n this.context.save();\n this.clearCanvas();\n this.scaleCanvas();\n for (let i = 0; i < this.scaledColumnIndices.length; i++) {\n const scaledX = this.scaledColumnIndices[i];\n if (!(scaledX >= this.transformConfig.topLeftCanvasCorner.x\n && scaledX < this.transformConfig.bottomRightCanvasCorner.x)) {\n continue;\n }\n // columnIndexPositions is used to get chunks to determine the start and end index of the column, it looks something like [0, 1, 4, 9, 12]\n // This means that the first column has a start index of 0 and an end index of 1, the second column has a start index of 1 and an end index of 4, and so on\n // scaledRowIndices is used when we reach the end of the columnIndexPositions, when columnIndexPositions is [0, 1, 4, 9, 12], scaledRowIndices is 13\n const columnEndIndex = this.columnIndicesPositions[i + 1] !== undefined\n ? this.columnIndicesPositions[i + 1]\n : this.scaledRowIndices.length;\n for (let columnStartIndex = this.columnIndicesPositions[i]; columnStartIndex < columnEndIndex; columnStartIndex++) {\n const scaledY = this.scaledRowIndices[columnStartIndex];\n if (!(scaledY >= this.transformConfig.topLeftCanvasCorner.y\n && scaledY < this.transformConfig.bottomRightCanvasCorner.y)) {\n continue;\n }\n // Fill style is temporary green for all dies, will be replaced with a color based on the value of the die in a future implementation\n this.context.fillStyle = this.colors[this.colorIndices[columnStartIndex]]\n ?? this.outsideRangeDieColor;\n this.context.fillRect(scaledX, scaledY, this.renderConfig.dieDimensions.width, this.renderConfig.dieDimensions.height);\n }\n }\n }\n drawText() {\n this.context.font = `${this.renderConfig.labelsFontSize.toString()}px sans-serif`;\n this.context.fillStyle = '#ffffff';\n this.context.textAlign = 'center';\n this.context.lineCap = 'butt';\n const approximateTextHeight = this.context.measureText('M');\n for (let i = 0; i < this.scaledColumnIndices.length; i++) {\n const scaledX = this.scaledColumnIndices[i];\n if (!(scaledX >= this.transformConfig.topLeftCanvasCorner.x\n && scaledX < this.transformConfig.bottomRightCanvasCorner.x)) {\n continue;\n }\n // columnIndexPositions is used to get chunks to determine the start and end index of the column, it looks something like [0, 1, 4, 9, 12]\n // This means that the first column has a start index of 0 and an end index of 1, the second column has a start index of 1 and an end index of 4, and so on\n // scaledRowIndices is used when we reach the end of the columnIndexPositions, when columnIndexPositions is [0, 1, 4, 9, 12], scaledRowIndices is 13\n const columnEndIndex = this.columnIndicesPositions[i + 1] !== undefined\n ? this.columnIndicesPositions[i + 1]\n : this.scaledRowIndices.length;\n for (let columnStartIndex = this.columnIndicesPositions[i]; columnStartIndex < columnEndIndex; columnStartIndex++) {\n const scaledY = this.scaledRowIndices[columnStartIndex];\n if (!(scaledY >= this.transformConfig.topLeftCanvasCorner.y\n && scaledY < this.transformConfig.bottomRightCanvasCorner.y)) {\n continue;\n }\n let label = `${this.values[columnStartIndex] || 'NaN'}${this.renderConfig.dieLabelsSuffix}`;\n if (label.length >= this.renderConfig.maxCharacters) {\n label = `${label.substring(0, this.renderConfig.maxCharacters)}…`;\n }\n this.context.fillText(label, scaledX + this.renderConfig.dieDimensions.width / 2, scaledY\n + this.renderConfig.dieDimensions.height / 2\n + approximateTextHeight.width / 2, this.renderConfig.dieDimensions.width * this.fontSizeFactor);\n }\n }\n }\n }\n expose(MatrixRenderer);\n\n exports.MatrixRenderer = MatrixRenderer;\n\n return exports;\n\n})({});\n";
|
|
78584
|
+
const workerCode = "var MatrixRenderer = (function (exports) {\n 'use strict';\n\n /**\n * @license\n * Copyright 2019 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n const proxyMarker = Symbol(\"Comlink.proxy\");\n const createEndpoint = Symbol(\"Comlink.endpoint\");\n const releaseProxy = Symbol(\"Comlink.releaseProxy\");\n const finalizer = Symbol(\"Comlink.finalizer\");\n const throwMarker = Symbol(\"Comlink.thrown\");\n const isObject = (val) => (typeof val === \"object\" && val !== null) || typeof val === \"function\";\n /**\n * Internal transfer handle to handle objects marked to proxy.\n */\n const proxyTransferHandler = {\n canHandle: (val) => isObject(val) && val[proxyMarker],\n serialize(obj) {\n const { port1, port2 } = new MessageChannel();\n expose(obj, port1);\n return [port2, [port2]];\n },\n deserialize(port) {\n port.start();\n return wrap(port);\n },\n };\n /**\n * Internal transfer handler to handle thrown exceptions.\n */\n const throwTransferHandler = {\n canHandle: (value) => isObject(value) && throwMarker in value,\n serialize({ value }) {\n let serialized;\n if (value instanceof Error) {\n serialized = {\n isError: true,\n value: {\n message: value.message,\n name: value.name,\n stack: value.stack,\n },\n };\n }\n else {\n serialized = { isError: false, value };\n }\n return [serialized, []];\n },\n deserialize(serialized) {\n if (serialized.isError) {\n throw Object.assign(new Error(serialized.value.message), serialized.value);\n }\n throw serialized.value;\n },\n };\n /**\n * Allows customizing the serialization of certain values.\n */\n const transferHandlers = new Map([\n [\"proxy\", proxyTransferHandler],\n [\"throw\", throwTransferHandler],\n ]);\n function isAllowedOrigin(allowedOrigins, origin) {\n for (const allowedOrigin of allowedOrigins) {\n if (origin === allowedOrigin || allowedOrigin === \"*\") {\n return true;\n }\n if (allowedOrigin instanceof RegExp && allowedOrigin.test(origin)) {\n return true;\n }\n }\n return false;\n }\n function expose(obj, ep = globalThis, allowedOrigins = [\"*\"]) {\n ep.addEventListener(\"message\", function callback(ev) {\n if (!ev || !ev.data) {\n return;\n }\n if (!isAllowedOrigin(allowedOrigins, ev.origin)) {\n console.warn(`Invalid origin '${ev.origin}' for comlink proxy`);\n return;\n }\n const { id, type, path } = Object.assign({ path: [] }, ev.data);\n const argumentList = (ev.data.argumentList || []).map(fromWireValue);\n let returnValue;\n try {\n const parent = path.slice(0, -1).reduce((obj, prop) => obj[prop], obj);\n const rawValue = path.reduce((obj, prop) => obj[prop], obj);\n switch (type) {\n case \"GET\" /* MessageType.GET */:\n {\n returnValue = rawValue;\n }\n break;\n case \"SET\" /* MessageType.SET */:\n {\n parent[path.slice(-1)[0]] = fromWireValue(ev.data.value);\n returnValue = true;\n }\n break;\n case \"APPLY\" /* MessageType.APPLY */:\n {\n returnValue = rawValue.apply(parent, argumentList);\n }\n break;\n case \"CONSTRUCT\" /* MessageType.CONSTRUCT */:\n {\n const value = new rawValue(...argumentList);\n returnValue = proxy(value);\n }\n break;\n case \"ENDPOINT\" /* MessageType.ENDPOINT */:\n {\n const { port1, port2 } = new MessageChannel();\n expose(obj, port2);\n returnValue = transfer(port1, [port1]);\n }\n break;\n case \"RELEASE\" /* MessageType.RELEASE */:\n {\n returnValue = undefined;\n }\n break;\n default:\n return;\n }\n }\n catch (value) {\n returnValue = { value, [throwMarker]: 0 };\n }\n Promise.resolve(returnValue)\n .catch((value) => {\n return { value, [throwMarker]: 0 };\n })\n .then((returnValue) => {\n const [wireValue, transferables] = toWireValue(returnValue);\n ep.postMessage(Object.assign(Object.assign({}, wireValue), { id }), transferables);\n if (type === \"RELEASE\" /* MessageType.RELEASE */) {\n // detach and deactive after sending release response above.\n ep.removeEventListener(\"message\", callback);\n closeEndPoint(ep);\n if (finalizer in obj && typeof obj[finalizer] === \"function\") {\n obj[finalizer]();\n }\n }\n })\n .catch((error) => {\n // Send Serialization Error To Caller\n const [wireValue, transferables] = toWireValue({\n value: new TypeError(\"Unserializable return value\"),\n [throwMarker]: 0,\n });\n ep.postMessage(Object.assign(Object.assign({}, wireValue), { id }), transferables);\n });\n });\n if (ep.start) {\n ep.start();\n }\n }\n function isMessagePort(endpoint) {\n return endpoint.constructor.name === \"MessagePort\";\n }\n function closeEndPoint(endpoint) {\n if (isMessagePort(endpoint))\n endpoint.close();\n }\n function wrap(ep, target) {\n return createProxy(ep, [], target);\n }\n function throwIfProxyReleased(isReleased) {\n if (isReleased) {\n throw new Error(\"Proxy has been released and is not useable\");\n }\n }\n function releaseEndpoint(ep) {\n return requestResponseMessage(ep, {\n type: \"RELEASE\" /* MessageType.RELEASE */,\n }).then(() => {\n closeEndPoint(ep);\n });\n }\n const proxyCounter = new WeakMap();\n const proxyFinalizers = \"FinalizationRegistry\" in globalThis &&\n new FinalizationRegistry((ep) => {\n const newCount = (proxyCounter.get(ep) || 0) - 1;\n proxyCounter.set(ep, newCount);\n if (newCount === 0) {\n releaseEndpoint(ep);\n }\n });\n function registerProxy(proxy, ep) {\n const newCount = (proxyCounter.get(ep) || 0) + 1;\n proxyCounter.set(ep, newCount);\n if (proxyFinalizers) {\n proxyFinalizers.register(proxy, ep, proxy);\n }\n }\n function unregisterProxy(proxy) {\n if (proxyFinalizers) {\n proxyFinalizers.unregister(proxy);\n }\n }\n function createProxy(ep, path = [], target = function () { }) {\n let isProxyReleased = false;\n const proxy = new Proxy(target, {\n get(_target, prop) {\n throwIfProxyReleased(isProxyReleased);\n if (prop === releaseProxy) {\n return () => {\n unregisterProxy(proxy);\n releaseEndpoint(ep);\n isProxyReleased = true;\n };\n }\n if (prop === \"then\") {\n if (path.length === 0) {\n return { then: () => proxy };\n }\n const r = requestResponseMessage(ep, {\n type: \"GET\" /* MessageType.GET */,\n path: path.map((p) => p.toString()),\n }).then(fromWireValue);\n return r.then.bind(r);\n }\n return createProxy(ep, [...path, prop]);\n },\n set(_target, prop, rawValue) {\n throwIfProxyReleased(isProxyReleased);\n // FIXME: ES6 Proxy Handler `set` methods are supposed to return a\n // boolean. To show good will, we return true asynchronously ¯\\_(ツ)_/¯\n const [value, transferables] = toWireValue(rawValue);\n return requestResponseMessage(ep, {\n type: \"SET\" /* MessageType.SET */,\n path: [...path, prop].map((p) => p.toString()),\n value,\n }, transferables).then(fromWireValue);\n },\n apply(_target, _thisArg, rawArgumentList) {\n throwIfProxyReleased(isProxyReleased);\n const last = path[path.length - 1];\n if (last === createEndpoint) {\n return requestResponseMessage(ep, {\n type: \"ENDPOINT\" /* MessageType.ENDPOINT */,\n }).then(fromWireValue);\n }\n // We just pretend that `bind()` didn’t happen.\n if (last === \"bind\") {\n return createProxy(ep, path.slice(0, -1));\n }\n const [argumentList, transferables] = processArguments(rawArgumentList);\n return requestResponseMessage(ep, {\n type: \"APPLY\" /* MessageType.APPLY */,\n path: path.map((p) => p.toString()),\n argumentList,\n }, transferables).then(fromWireValue);\n },\n construct(_target, rawArgumentList) {\n throwIfProxyReleased(isProxyReleased);\n const [argumentList, transferables] = processArguments(rawArgumentList);\n return requestResponseMessage(ep, {\n type: \"CONSTRUCT\" /* MessageType.CONSTRUCT */,\n path: path.map((p) => p.toString()),\n argumentList,\n }, transferables).then(fromWireValue);\n },\n });\n registerProxy(proxy, ep);\n return proxy;\n }\n function myFlat(arr) {\n return Array.prototype.concat.apply([], arr);\n }\n function processArguments(argumentList) {\n const processed = argumentList.map(toWireValue);\n return [processed.map((v) => v[0]), myFlat(processed.map((v) => v[1]))];\n }\n const transferCache = new WeakMap();\n function transfer(obj, transfers) {\n transferCache.set(obj, transfers);\n return obj;\n }\n function proxy(obj) {\n return Object.assign(obj, { [proxyMarker]: true });\n }\n function toWireValue(value) {\n for (const [name, handler] of transferHandlers) {\n if (handler.canHandle(value)) {\n const [serializedValue, transferables] = handler.serialize(value);\n return [\n {\n type: \"HANDLER\" /* WireValueType.HANDLER */,\n name,\n value: serializedValue,\n },\n transferables,\n ];\n }\n }\n return [\n {\n type: \"RAW\" /* WireValueType.RAW */,\n value,\n },\n transferCache.get(value) || [],\n ];\n }\n function fromWireValue(value) {\n switch (value.type) {\n case \"HANDLER\" /* WireValueType.HANDLER */:\n return transferHandlers.get(value.name).deserialize(value.value);\n case \"RAW\" /* WireValueType.RAW */:\n return value.value;\n }\n }\n function requestResponseMessage(ep, msg, transfers) {\n return new Promise((resolve) => {\n const id = generateUUID();\n ep.addEventListener(\"message\", function l(ev) {\n if (!ev.data || !ev.data.id || ev.data.id !== id) {\n return;\n }\n ep.removeEventListener(\"message\", l);\n resolve(ev.data);\n });\n if (ep.start) {\n ep.start();\n }\n ep.postMessage(Object.assign({ id }, msg), transfers);\n });\n }\n function generateUUID() {\n return new Array(4)\n .fill(0)\n .map(() => Math.floor(Math.random() * Number.MAX_SAFE_INTEGER).toString(16))\n .join(\"-\");\n }\n\n /**\n * MatrixRenderer class is meant to be used within a Web Worker context,\n * using Comlink to facilitate communication between the main thread and the worker.\n * The MatrixRenderer class manages a matrix of dies, once an instance of MatrixRenderer is created,\n * it is exposed to the main thread using Comlink's `expose` method.\n * This setup is used in the wafer-map component to perform heavy computational duties\n */\n class MatrixRenderer {\n constructor() {\n this.values = Float64Array.from([]);\n this.scaledColumnIndices = Float64Array.from([]);\n this.scaledRowIndices = Float64Array.from([]);\n this.columnIndicesPositions = Int32Array.from([]);\n this.colorIndices = Int32Array.from([]);\n this.colors = [];\n this.colorValues = Float64Array.from([]);\n this.outsideRangeDieColor = 'rgba(218,223,236,1)';\n this.fontSizeFactor = 0.8;\n this.renderConfig = {\n dieDimensions: {\n width: 0,\n height: 0\n },\n margin: {\n top: 0,\n right: 0,\n bottom: 0,\n left: 0\n },\n verticalCoefficient: 1,\n horizontalCoefficient: 1,\n horizontalConstant: 0,\n verticalConstant: 0,\n gridMinX: 0,\n gridMaxX: 0,\n gridMinY: 0,\n gridMaxY: 0,\n labelsFontSize: 0,\n colorScale: [],\n dieLabelsSuffix: '',\n maxCharacters: 0\n };\n this.transformConfig = {\n transform: {\n k: 1,\n x: 0,\n y: 0\n },\n topLeftCanvasCorner: {\n x: 0,\n y: 0\n },\n bottomRightCanvasCorner: {\n x: 0,\n y: 0\n }\n };\n }\n setMatrixData(columnIndices, rowIndices, valuesBuffer) {\n const scaledColumnIndex = [];\n const columnPositions = [];\n const scaledRowIndices = [];\n const values = [];\n const colorIndices = [];\n let prevXIndex;\n let dieCount = 0;\n for (let i = 0; i < columnIndices.length; i++) {\n const xIndex = columnIndices[i];\n const yIndex = rowIndices[i];\n if (this.isDieInGrid(xIndex, yIndex)) {\n if (xIndex !== prevXIndex) {\n scaledColumnIndex.push(this.calculateHorizontalScaledIndices(xIndex));\n columnPositions.push(dieCount);\n prevXIndex = xIndex;\n }\n scaledRowIndices.push(this.calculateVerticalScaledIndices(yIndex));\n const value = valuesBuffer[i];\n values.push(value);\n colorIndices.push(this.findColorIndex(value));\n dieCount += 1;\n }\n }\n this.scaledColumnIndices = Float64Array.from(scaledColumnIndex);\n this.columnIndicesPositions = Int32Array.from(columnPositions);\n this.scaledRowIndices = Float64Array.from(scaledRowIndices);\n this.values = Float64Array.from(values);\n this.colorIndices = Int32Array.from(colorIndices);\n }\n setRenderConfig(renderConfig) {\n this.renderConfig = renderConfig;\n this.colors = renderConfig.colorScale.map(marker => marker.color);\n this.colorValues = Float64Array.from(renderConfig.colorScale.map(marker => marker.value));\n }\n setTransformConfig(transformData) {\n this.transformConfig = transformData;\n }\n setCanvas(canvas) {\n this.canvas = canvas;\n this.context = canvas.getContext('2d');\n }\n scaleCanvas() {\n this.context.translate(this.transformConfig.transform.x, this.transformConfig.transform.y);\n this.context.scale(this.transformConfig.transform.k, this.transformConfig.transform.k);\n }\n setCanvasDimensions(data) {\n this.canvas.width = data.width;\n this.canvas.height = data.height;\n }\n getCanvasDimensions() {\n return {\n width: this.canvas.width,\n height: this.canvas.height\n };\n }\n clearCanvas() {\n this.context.clearRect(0, 0, this.canvas.width, this.canvas.height);\n }\n drawWafer() {\n this.context.restore();\n this.context.save();\n this.clearCanvas();\n this.scaleCanvas();\n for (let i = 0; i < this.scaledColumnIndices.length; i++) {\n const scaledX = this.scaledColumnIndices[i];\n if (!(scaledX >= this.transformConfig.topLeftCanvasCorner.x\n && scaledX < this.transformConfig.bottomRightCanvasCorner.x)) {\n continue;\n }\n // columnIndexPositions is used to get chunks to determine the start and end index of the column, it looks something like [0, 1, 4, 9, 12]\n // This means that the first column has a start index of 0 and an end index of 1, the second column has a start index of 1 and an end index of 4, and so on\n // scaledRowIndices is used when we reach the end of the columnIndexPositions, when columnIndexPositions is [0, 1, 4, 9, 12], scaledRowIndices is 13\n const columnEndIndex = this.columnIndicesPositions[i + 1] !== undefined\n ? this.columnIndicesPositions[i + 1]\n : this.scaledRowIndices.length;\n for (let columnStartIndex = this.columnIndicesPositions[i]; columnStartIndex < columnEndIndex; columnStartIndex++) {\n const scaledY = this.scaledRowIndices[columnStartIndex];\n if (!(scaledY >= this.transformConfig.topLeftCanvasCorner.y\n && scaledY < this.transformConfig.bottomRightCanvasCorner.y)) {\n continue;\n }\n // Fill style is temporary green for all dies, will be replaced with a color based on the value of the die in a future implementation\n this.context.fillStyle = this.colors[this.colorIndices[columnStartIndex]]\n ?? this.outsideRangeDieColor;\n this.context.fillRect(scaledX, scaledY, this.renderConfig.dieDimensions.width, this.renderConfig.dieDimensions.height);\n }\n }\n }\n drawText() {\n this.context.font = `${this.renderConfig.labelsFontSize.toString()}px sans-serif`;\n this.context.fillStyle = '#ffffff';\n this.context.textAlign = 'center';\n this.context.lineCap = 'butt';\n const approximateTextHeight = this.context.measureText('M');\n for (let i = 0; i < this.scaledColumnIndices.length; i++) {\n const scaledX = this.scaledColumnIndices[i];\n if (!(scaledX >= this.transformConfig.topLeftCanvasCorner.x\n && scaledX < this.transformConfig.bottomRightCanvasCorner.x)) {\n continue;\n }\n // columnIndexPositions is used to get chunks to determine the start and end index of the column, it looks something like [0, 1, 4, 9, 12]\n // This means that the first column has a start index of 0 and an end index of 1, the second column has a start index of 1 and an end index of 4, and so on\n // scaledRowIndices is used when we reach the end of the columnIndexPositions, when columnIndexPositions is [0, 1, 4, 9, 12], scaledRowIndices is 13\n const columnEndIndex = this.columnIndicesPositions[i + 1] !== undefined\n ? this.columnIndicesPositions[i + 1]\n : this.scaledRowIndices.length;\n for (let columnStartIndex = this.columnIndicesPositions[i]; columnStartIndex < columnEndIndex; columnStartIndex++) {\n const scaledY = this.scaledRowIndices[columnStartIndex];\n if (!(scaledY >= this.transformConfig.topLeftCanvasCorner.y\n && scaledY < this.transformConfig.bottomRightCanvasCorner.y)) {\n continue;\n }\n let label = `${this.values[columnStartIndex] || 'NaN'}${this.renderConfig.dieLabelsSuffix}`;\n if (label.length >= this.renderConfig.maxCharacters) {\n label = `${label.substring(0, this.renderConfig.maxCharacters)}…`;\n }\n this.context.fillText(label, scaledX + this.renderConfig.dieDimensions.width / 2, scaledY\n + this.renderConfig.dieDimensions.height / 2\n + approximateTextHeight.width / 2, this.renderConfig.dieDimensions.width * this.fontSizeFactor);\n }\n }\n }\n isDieInGrid(x, y) {\n return (x >= this.renderConfig.gridMinX\n && x <= this.renderConfig.gridMaxX\n && y >= this.renderConfig.gridMinY\n && y <= this.renderConfig.gridMaxY);\n }\n calculateHorizontalScaledIndices(columnIndex) {\n return (this.renderConfig.horizontalCoefficient * columnIndex\n + this.renderConfig.horizontalConstant\n + this.renderConfig.margin.left);\n }\n calculateVerticalScaledIndices(rowIndex) {\n return (this.renderConfig.verticalCoefficient * rowIndex\n + this.renderConfig.verticalConstant\n + this.renderConfig.margin.top);\n }\n findColorIndex(value) {\n let index = -1;\n if (this.colorValues.length === 0 || this.colorValues[0] >= value) {\n return index;\n }\n for (let i = 0; i < this.colorValues.length; i++) {\n if (value <= this.colorValues[i]) {\n index = i;\n break;\n }\n }\n return index;\n }\n }\n expose(MatrixRenderer);\n\n exports.MatrixRenderer = MatrixRenderer;\n\n return exports;\n\n})({});\n";
|
|
78611
78585
|
|
|
78612
78586
|
let url;
|
|
78613
78587
|
/**
|
|
@@ -79540,10 +79514,12 @@ img.ProseMirror-separator {
|
|
|
79540
79514
|
DesignSystem.getOrCreate().withPrefix('nimble').register(nimbleWaferMap());
|
|
79541
79515
|
|
|
79542
79516
|
/**
|
|
79543
|
-
*
|
|
79544
|
-
*
|
|
79517
|
+
* Each element should use the display utility which will create styles to:
|
|
79518
|
+
* - Set the `:host` display property
|
|
79519
|
+
* - Respond to the `hidden` attribute set on `:host`
|
|
79520
|
+
* - Configure `box-sizing` for `:host`, all elements in shadow root, and `::before` / `::after` pseudoelements
|
|
79545
79521
|
*/
|
|
79546
|
-
const display = (displayValue) => `${display$2(displayValue)}`;
|
|
79522
|
+
const display = (displayValue) => `${display$2(displayValue)}:host{box-sizing:border-box;}*{box-sizing:border-box;}:host::before,:host::after,::before,::after{box-sizing:border-box;}`;
|
|
79547
79523
|
|
|
79548
79524
|
const styles = css `
|
|
79549
79525
|
${display('inline-block')}
|