@unovis/ts 1.6.8-stellar-beta.0 → 1.6.8-stellar-beta.1

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/components/annotations/style.js +1 -1
  2. package/components/annotations/style.js.map +1 -1
  3. package/components/area/style.js +1 -1
  4. package/components/area/style.js.map +1 -1
  5. package/components/axis/style.js +1 -1
  6. package/components/axis/style.js.map +1 -1
  7. package/components/brush/style.js +1 -1
  8. package/components/brush/style.js.map +1 -1
  9. package/components/bullet-legend/style.js +1 -1
  10. package/components/bullet-legend/style.js.map +1 -1
  11. package/components/chord-diagram/style.js +1 -1
  12. package/components/chord-diagram/style.js.map +1 -1
  13. package/components/crosshair/style.d.ts +5 -1
  14. package/components/crosshair/style.js +28 -18
  15. package/components/crosshair/style.js.map +1 -1
  16. package/components/donut/style.js +1 -1
  17. package/components/donut/style.js.map +1 -1
  18. package/components/flow-legend/style.js +1 -1
  19. package/components/flow-legend/style.js.map +1 -1
  20. package/components/free-brush/style.js +1 -1
  21. package/components/free-brush/style.js.map +1 -1
  22. package/components/graph/modules/link/style.js +1 -1
  23. package/components/graph/modules/link/style.js.map +1 -1
  24. package/components/graph/modules/node/style.js +1 -1
  25. package/components/graph/modules/node/style.js.map +1 -1
  26. package/components/graph/modules/panel/style.js +1 -1
  27. package/components/graph/modules/panel/style.js.map +1 -1
  28. package/components/graph/style.js +1 -1
  29. package/components/graph/style.js.map +1 -1
  30. package/components/grouped-bar/style.js +1 -1
  31. package/components/grouped-bar/style.js.map +1 -1
  32. package/components/leaflet-map/renderer/mapboxgl-layer.js +1 -1
  33. package/components/leaflet-map/renderer/mapboxgl-layer.js.map +1 -1
  34. package/components/leaflet-map/style.js +1 -1
  35. package/components/leaflet-map/style.js.map +1 -1
  36. package/components/line/style.js +1 -1
  37. package/components/line/style.js.map +1 -1
  38. package/components/nested-donut/style.js +1 -1
  39. package/components/nested-donut/style.js.map +1 -1
  40. package/components/plotband/style.js +1 -1
  41. package/components/plotband/style.js.map +1 -1
  42. package/components/plotline/style.js +1 -1
  43. package/components/plotline/style.js.map +1 -1
  44. package/components/rolling-pin-legend/style.js +1 -1
  45. package/components/rolling-pin-legend/style.js.map +1 -1
  46. package/components/sankey/style.js +1 -1
  47. package/components/sankey/style.js.map +1 -1
  48. package/components/scatter/style.js +1 -1
  49. package/components/scatter/style.js.map +1 -1
  50. package/components/stacked-bar/style.js +1 -1
  51. package/components/stacked-bar/style.js.map +1 -1
  52. package/components/timeline/style.js +1 -1
  53. package/components/timeline/style.js.map +1 -1
  54. package/components/tooltip/style.js +1 -1
  55. package/components/tooltip/style.js.map +1 -1
  56. package/components/topojson-map/style.js +1 -1
  57. package/components/topojson-map/style.js.map +1 -1
  58. package/components/treemap/style.js +1 -1
  59. package/components/treemap/style.js.map +1 -1
  60. package/components/vis-controls/style.js +1 -1
  61. package/components/vis-controls/style.js.map +1 -1
  62. package/components/xy-labels/style.js +1 -1
  63. package/components/xy-labels/style.js.map +1 -1
  64. package/containers/xy-container/index.js +1 -1
  65. package/containers/xy-container/index.js.map +1 -1
  66. package/package.json +1 -1
  67. package/styles/emotion.d.ts +11 -0
  68. package/styles/emotion.js +17 -0
  69. package/styles/emotion.js.map +1 -0
  70. package/styles/index.js +1 -1
  71. package/styles/index.js.map +1 -1
  72. package/styles/sizes.js +1 -1
  73. package/styles/sizes.js.map +1 -1
  74. package/utils/style.js +1 -1
  75. package/utils/style.js.map +1 -1
@@ -1,4 +1,4 @@
1
- import { css } from '@emotion/css';
1
+ import { css } from '../../styles/emotion.js';
2
2
  import { getCssVarNames, injectGlobalCssVariables } from '../../utils/style.js';
3
3
 
4
4
  const cssVarDefaults = {
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../src/components/annotations/style.ts"],"sourcesContent":["import { css } from '@emotion/css'\n\n// Utils\nimport { getCssVarNames, injectGlobalCssVariables } from 'utils/style'\n\nconst cssVarDefaults = {\n '--vis-annotations-text-color': '#282C34',\n\n '--vis-annotations-connector-stroke-color': '#444',\n '--vis-annotations-connector-stroke-width': '1px',\n '--vis-annotations-connector-stroke-dasharray': 'none',\n\n '--vis-annotations-subject-stroke-color': '#444',\n '--vis-annotations-subject-fill-color': 'none',\n '--vis-annotations-subject-stroke-dasharray': 'none',\n\n '--vis-annotations-debug-bounding-box-stroke-color': '#f00',\n\n '--vis-dark-annotations-text-color': '#e8e9ef',\n '--vis-dark-annotations-connector-stroke-color': '#fff',\n '--vis-dark-annotations-subject-stroke-color': '#fff',\n}\n\nexport const root = css`\n label: annotations-component;\n`\nexport const variables = getCssVarNames(cssVarDefaults)\ninjectGlobalCssVariables(cssVarDefaults, root)\n\nexport const annotation = css`\n label: annotation;\n`\n\nexport const annotationSubject = css`\n label: annotationSubject;\n\n line {\n stroke: var(${variables.annotationsConnectorStrokeColor});\n stroke-width: var(${variables.annotationsConnectorStrokeWidth});\n stroke-dasharray: var(${variables.annotationsConnectorStrokeDasharray});\n }\n\n circle {\n stroke: var(${variables.annotationsSubjectStrokeColor});\n fill: var(${variables.annotationsSubjectFillColor});\n stroke-dasharray: var(${variables.annotationsSubjectStrokeDasharray});\n }\n`\n\nexport const annotationContent = css`\n label: annotationContent;\n > text {\n fill: var(--vis-annotations-text-color);\n }\n`\n\nexport const debugBoundingBox = css`\n label: debugBoundingBox;\n fill: none;\n stroke: var(--vis-annotations-debug-bounding-box-stroke-color);\n stroke-width: 1;\n`\n"],"names":[],"mappings":";;;AAKA,MAAM,cAAc,GAAG;AACrB,IAAA,8BAA8B,EAAE,SAAS;AAEzC,IAAA,0CAA0C,EAAE,MAAM;AAClD,IAAA,0CAA0C,EAAE,KAAK;AACjD,IAAA,8CAA8C,EAAE,MAAM;AAEtD,IAAA,wCAAwC,EAAE,MAAM;AAChD,IAAA,sCAAsC,EAAE,MAAM;AAC9C,IAAA,4CAA4C,EAAE,MAAM;AAEpD,IAAA,mDAAmD,EAAE,MAAM;AAE3D,IAAA,mCAAmC,EAAE,SAAS;AAC9C,IAAA,+CAA+C,EAAE,MAAM;AACvD,IAAA,6CAA6C,EAAE,MAAM;CACtD,CAAA;AAEM,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;MACY,SAAS,GAAG,cAAc,CAAC,cAAc,EAAC;AACvD,wBAAwB,CAAC,cAAc,EAAE,IAAI,CAAC,CAAA;AAEvC,MAAM,UAAU,GAAG,GAAG,CAAA,CAAA;;EAE5B;AAEM,MAAM,iBAAiB,GAAG,GAAG,CAAA,CAAA;;;;AAIlB,gBAAA,EAAA,SAAS,CAAC,+BAA+B,CAAA;AACnC,sBAAA,EAAA,SAAS,CAAC,+BAA+B,CAAA;AACrC,0BAAA,EAAA,SAAS,CAAC,mCAAmC,CAAA;;;;AAIvD,gBAAA,EAAA,SAAS,CAAC,6BAA6B,CAAA;AACzC,cAAA,EAAA,SAAS,CAAC,2BAA2B,CAAA;AACzB,0BAAA,EAAA,SAAS,CAAC,iCAAiC,CAAA;;EAEtE;AAEM,MAAM,iBAAiB,GAAG,GAAG,CAAA,CAAA;;;;;EAKnC;AAEM,MAAM,gBAAgB,GAAG,GAAG,CAAA,CAAA;;;;;;;;;"}
1
+ {"version":3,"file":"style.js","sources":["../../../src/components/annotations/style.ts"],"sourcesContent":["import { css } from 'styles/emotion'\n\n// Utils\nimport { getCssVarNames, injectGlobalCssVariables } from 'utils/style'\n\nconst cssVarDefaults = {\n '--vis-annotations-text-color': '#282C34',\n\n '--vis-annotations-connector-stroke-color': '#444',\n '--vis-annotations-connector-stroke-width': '1px',\n '--vis-annotations-connector-stroke-dasharray': 'none',\n\n '--vis-annotations-subject-stroke-color': '#444',\n '--vis-annotations-subject-fill-color': 'none',\n '--vis-annotations-subject-stroke-dasharray': 'none',\n\n '--vis-annotations-debug-bounding-box-stroke-color': '#f00',\n\n '--vis-dark-annotations-text-color': '#e8e9ef',\n '--vis-dark-annotations-connector-stroke-color': '#fff',\n '--vis-dark-annotations-subject-stroke-color': '#fff',\n}\n\nexport const root = css`\n label: annotations-component;\n`\nexport const variables = getCssVarNames(cssVarDefaults)\ninjectGlobalCssVariables(cssVarDefaults, root)\n\nexport const annotation = css`\n label: annotation;\n`\n\nexport const annotationSubject = css`\n label: annotationSubject;\n\n line {\n stroke: var(${variables.annotationsConnectorStrokeColor});\n stroke-width: var(${variables.annotationsConnectorStrokeWidth});\n stroke-dasharray: var(${variables.annotationsConnectorStrokeDasharray});\n }\n\n circle {\n stroke: var(${variables.annotationsSubjectStrokeColor});\n fill: var(${variables.annotationsSubjectFillColor});\n stroke-dasharray: var(${variables.annotationsSubjectStrokeDasharray});\n }\n`\n\nexport const annotationContent = css`\n label: annotationContent;\n > text {\n fill: var(--vis-annotations-text-color);\n }\n`\n\nexport const debugBoundingBox = css`\n label: debugBoundingBox;\n fill: none;\n stroke: var(--vis-annotations-debug-bounding-box-stroke-color);\n stroke-width: 1;\n`\n"],"names":[],"mappings":";;;AAKA,MAAM,cAAc,GAAG;AACrB,IAAA,8BAA8B,EAAE,SAAS;AAEzC,IAAA,0CAA0C,EAAE,MAAM;AAClD,IAAA,0CAA0C,EAAE,KAAK;AACjD,IAAA,8CAA8C,EAAE,MAAM;AAEtD,IAAA,wCAAwC,EAAE,MAAM;AAChD,IAAA,sCAAsC,EAAE,MAAM;AAC9C,IAAA,4CAA4C,EAAE,MAAM;AAEpD,IAAA,mDAAmD,EAAE,MAAM;AAE3D,IAAA,mCAAmC,EAAE,SAAS;AAC9C,IAAA,+CAA+C,EAAE,MAAM;AACvD,IAAA,6CAA6C,EAAE,MAAM;CACtD,CAAA;AAEM,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;MACY,SAAS,GAAG,cAAc,CAAC,cAAc,EAAC;AACvD,wBAAwB,CAAC,cAAc,EAAE,IAAI,CAAC,CAAA;AAEvC,MAAM,UAAU,GAAG,GAAG,CAAA,CAAA;;EAE5B;AAEM,MAAM,iBAAiB,GAAG,GAAG,CAAA,CAAA;;;;AAIlB,gBAAA,EAAA,SAAS,CAAC,+BAA+B,CAAA;AACnC,sBAAA,EAAA,SAAS,CAAC,+BAA+B,CAAA;AACrC,0BAAA,EAAA,SAAS,CAAC,mCAAmC,CAAA;;;;AAIvD,gBAAA,EAAA,SAAS,CAAC,6BAA6B,CAAA;AACzC,cAAA,EAAA,SAAS,CAAC,2BAA2B,CAAA;AACzB,0BAAA,EAAA,SAAS,CAAC,iCAAiC,CAAA;;EAEtE;AAEM,MAAM,iBAAiB,GAAG,GAAG,CAAA,CAAA;;;;;EAKnC;AAEM,MAAM,gBAAgB,GAAG,GAAG,CAAA,CAAA;;;;;;;;;"}
@@ -1,4 +1,4 @@
1
- import { css, injectGlobal } from '@emotion/css';
1
+ import { css, injectGlobal } from '../../styles/emotion.js';
2
2
  import { darkThemeCssSelectors } from '../../utils/theme.js';
3
3
 
4
4
  const root = css `
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../src/components/area/style.ts"],"sourcesContent":["import { css, injectGlobal } from '@emotion/css'\nimport { darkThemeCssSelectors } from 'utils/theme'\n\n\nexport const root = css`\n label: area-component;\n`\n\nexport const globalStyles = injectGlobal`\n :root {\n --vis-area-cursor: default;\n --vis-area-fill-opacity: 1;\n --vis-area-stroke-color: none;\n --vis-area-stroke-width: 0px;\n --vis-area-stroke-dasharray: none;\n --vis-area-stroke-opacity: 1;\n --vis-area-hover-fill-opacity: none;\n --vis-area-hover-stroke-width: none;\n\n /* Dark Theme */\n --vis-dark-area-stroke-color: none;\n }\n\n ${darkThemeCssSelectors} ${`.${root}`} {\n --vis-area-fill-opacity: 0.5;\n --vis-area-stroke-color: var(--vis-dark-area-stroke-color);\n }\n\n`\nexport const area = css`\n label: area;\n cursor: var(--vis-area-cursor);\n fill-opacity: var(--vis-area-fill-opacity);\n stroke-width: var(--vis-area-stroke-width);\n stroke-dasharray: var(--vis-area-stroke-dasharray);\n stroke: var(--vis-area-stroke-color);\n stroke-opacity: var(--vis-area-stroke-opacity);\n\n &:hover {\n fill-opacity: var(--vis-area-hover-fill-opacity);\n stroke-width: var(--vis-area-hover-stroke-width);\n }\n`\n\nexport const areaLinePath = css`\n label: areaLinePath;\n fill: none;\n stroke-dasharray: var(--vis-line-stroke-dasharray);\n stroke-dashoffset: var(--vis-line-stroke-dashoffset);\n`\n"],"names":[],"mappings":";;;AAIO,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;AAEM,MAAM,YAAY,GAAG,YAAY,CAAA,CAAA;;;;;;;;;;;;;;;IAepC,qBAAqB,CAAA,CAAA,EAAI,CAAI,CAAA,EAAA,IAAI,CAAE,CAAA,CAAA;;;;;EAKtC;AACM,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;;;EAatB;AAEM,MAAM,YAAY,GAAG,GAAG,CAAA,CAAA;;;;;;;;;"}
1
+ {"version":3,"file":"style.js","sources":["../../../src/components/area/style.ts"],"sourcesContent":["import { css, injectGlobal } from 'styles/emotion'\nimport { darkThemeCssSelectors } from 'utils/theme'\n\n\nexport const root = css`\n label: area-component;\n`\n\nexport const globalStyles = injectGlobal`\n :root {\n --vis-area-cursor: default;\n --vis-area-fill-opacity: 1;\n --vis-area-stroke-color: none;\n --vis-area-stroke-width: 0px;\n --vis-area-stroke-dasharray: none;\n --vis-area-stroke-opacity: 1;\n --vis-area-hover-fill-opacity: none;\n --vis-area-hover-stroke-width: none;\n\n /* Dark Theme */\n --vis-dark-area-stroke-color: none;\n }\n\n ${darkThemeCssSelectors} ${`.${root}`} {\n --vis-area-fill-opacity: 0.5;\n --vis-area-stroke-color: var(--vis-dark-area-stroke-color);\n }\n\n`\nexport const area = css`\n label: area;\n cursor: var(--vis-area-cursor);\n fill-opacity: var(--vis-area-fill-opacity);\n stroke-width: var(--vis-area-stroke-width);\n stroke-dasharray: var(--vis-area-stroke-dasharray);\n stroke: var(--vis-area-stroke-color);\n stroke-opacity: var(--vis-area-stroke-opacity);\n\n &:hover {\n fill-opacity: var(--vis-area-hover-fill-opacity);\n stroke-width: var(--vis-area-hover-stroke-width);\n }\n`\n\nexport const areaLinePath = css`\n label: areaLinePath;\n fill: none;\n stroke-dasharray: var(--vis-line-stroke-dasharray);\n stroke-dashoffset: var(--vis-line-stroke-dashoffset);\n`\n"],"names":[],"mappings":";;;AAIO,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;AAEM,MAAM,YAAY,GAAG,YAAY,CAAA,CAAA;;;;;;;;;;;;;;;IAepC,qBAAqB,CAAA,CAAA,EAAI,CAAI,CAAA,EAAA,IAAI,CAAE,CAAA,CAAA;;;;;EAKtC;AACM,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;;;EAatB;AAEM,MAAM,YAAY,GAAG,GAAG,CAAA,CAAA;;;;;;;;;"}
@@ -1,4 +1,4 @@
1
- import { css } from '@emotion/css';
1
+ import { css } from '../../styles/emotion.js';
2
2
  import { getCssVarNames, injectGlobalCssVariables } from '../../utils/style.js';
3
3
 
4
4
  const root = css `
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../src/components/axis/style.ts"],"sourcesContent":["import { css } from '@emotion/css'\nimport { getCssVarNames, injectGlobalCssVariables } from 'utils/style'\n\nexport const root = css`\n label: axis-component;\n`\n\nexport const cssVarDefaults: Record<string, string | undefined> = {\n '--vis-axis-font-family': undefined, // Undefined by default to allow proper fallback to var(--vis-font-family)\n '--vis-axis-tick-color': '#e8e9ef',\n '--vis-axis-domain-color': undefined, // Undefined by default to allow fallback to var(--vis-axis-tick-color)\n '--vis-axis-domain-line-dasharray': undefined, // Undefined by default to allow fallback to var(--vis-axis-grid-line-dasharray)\n '--vis-axis-grid-color': '#e8e9ef',\n '--vis-axis-grid-line-width': '1px',\n '--vis-axis-grid-line-dasharray': 'none',\n '--vis-axis-grid-opacity': '1',\n '--vis-axis-grid-transition': 'none',\n\n '--vis-axis-label-font-size': '14px',\n '--vis-axis-label-color': '#6c778c',\n '--vis-axis-label-weight': '500',\n\n '--vis-axis-tick-label-color': '#6c778c',\n '--vis-axis-tick-label-font-size': '12px',\n '--vis-axis-tick-label-weight': '500',\n '--vis-axis-tick-label-cursor': 'default',\n '--vis-axis-tick-label-text-decoration': 'none',\n\n '--vis-axis-tick-line-width': '1px',\n '--vis-axis-tick-label-hide-transition': 'opacity 400ms ease-in-out',\n\n '--vis-axis-domain-line-width': undefined, // Undefined by default to allow fallback to var(--vis-axis-grid-line-width)\n\n '--vis-dark-axis-tick-color': '#6c778c',\n '--vis-dark-axis-domain-color': undefined, // Undefined by default to allow fallback to var(--vis-dark-axis-tick-color)\n '--vis-dark-axis-tick-label-color': '#e8e9ef',\n '--vis-dark-axis-grid-color': '#6c778c',\n '--vis-dark-axis-label-color': '#fefefe',\n}\n\nexport const variables = getCssVarNames(cssVarDefaults)\ninjectGlobalCssVariables(cssVarDefaults, root)\n\nexport const hideTickLine = css`\n label: hide-tick-line;\n`\n\nexport const hideDomain = css`\n label: hide-domain;\n`\n\nexport const axis = css`\n label: axis;\n\n user-select: none;\n\n .domain {\n stroke: var(${variables.axisDomainColor}, var(${variables.axisTickColor}));\n stroke-width: var(${variables.axisDomainLineWidth}, var(${variables.axisGridLineWidth}));\n stroke-dasharray: var(${variables.axisDomainLineDasharray}, var(${variables.axisGridLineDasharray}));\n }\n\n &${`.${hideTickLine}`} {\n .tick > line {\n opacity: 0;\n }\n }\n\n &${`.${hideDomain}`} {\n .domain {\n opacity: 0;\n }\n }\n`\n\nexport const grid = css`\n label: grid;\n\n .domain {\n opacity: 0;\n }\n\n line {\n stroke: var(${variables.axisGridColor});\n stroke-width: var(${variables.axisGridLineWidth});\n stroke-dasharray: var(${variables.axisGridLineDasharray});\n opacity: var(${variables.axisGridOpacity});\n transition: var(${variables.axisGridTransition});\n }\n`\n\nexport const tick = css`\n label: tick;\n\n stroke: none;\n font-size: var(${variables.axisTickLabelFontSize});\n font-weight: var(${variables.axisTickLabelWeight});\n\n line {\n stroke: var(${variables.axisTickColor});\n stroke-width: var(${variables.axisTickLineWidth});\n }\n\n text {\n fill: var(${variables.axisTickLabelColor});\n cursor: var(${variables.axisTickLabelCursor});\n font-family: var(${variables.axisFontFamily}, var(--vis-font-family));\n text-decoration: var(${variables.axisTickLabelTextDecoration});\n stroke: none;\n }\n`\n\nexport const tickTextExiting = css`\n label: tick-text-exiting;\n`\n\nexport const label = css`\n label: label;\n fill: var(${variables.axisLabelColor});\n font-size: var(${variables.axisLabelFontSize});\n font-weight: var(${variables.axisLabelWeight});\n font-family: var(${variables.axisFontFamily}, var(--vis-font-family));\n text-anchor: middle;\n`\n\nexport const tickLabel = css`\n label: tick-label;\n`\n\nexport const tickLabelHideable = css`\n label: tick-label-hideable;\n opacity: 0;\n transition: var(${variables.axisTickLabelHideTransition});\n`\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"style.js","sources":["../../../src/components/axis/style.ts"],"sourcesContent":["import { css } from 'styles/emotion'\nimport { getCssVarNames, injectGlobalCssVariables } from 'utils/style'\n\nexport const root = css`\n label: axis-component;\n`\n\nexport const cssVarDefaults: Record<string, string | undefined> = {\n '--vis-axis-font-family': undefined, // Undefined by default to allow proper fallback to var(--vis-font-family)\n '--vis-axis-tick-color': '#e8e9ef',\n '--vis-axis-domain-color': undefined, // Undefined by default to allow fallback to var(--vis-axis-tick-color)\n '--vis-axis-domain-line-dasharray': undefined, // Undefined by default to allow fallback to var(--vis-axis-grid-line-dasharray)\n '--vis-axis-grid-color': '#e8e9ef',\n '--vis-axis-grid-line-width': '1px',\n '--vis-axis-grid-line-dasharray': 'none',\n '--vis-axis-grid-opacity': '1',\n '--vis-axis-grid-transition': 'none',\n\n '--vis-axis-label-font-size': '14px',\n '--vis-axis-label-color': '#6c778c',\n '--vis-axis-label-weight': '500',\n\n '--vis-axis-tick-label-color': '#6c778c',\n '--vis-axis-tick-label-font-size': '12px',\n '--vis-axis-tick-label-weight': '500',\n '--vis-axis-tick-label-cursor': 'default',\n '--vis-axis-tick-label-text-decoration': 'none',\n\n '--vis-axis-tick-line-width': '1px',\n '--vis-axis-tick-label-hide-transition': 'opacity 400ms ease-in-out',\n\n '--vis-axis-domain-line-width': undefined, // Undefined by default to allow fallback to var(--vis-axis-grid-line-width)\n\n '--vis-dark-axis-tick-color': '#6c778c',\n '--vis-dark-axis-domain-color': undefined, // Undefined by default to allow fallback to var(--vis-dark-axis-tick-color)\n '--vis-dark-axis-tick-label-color': '#e8e9ef',\n '--vis-dark-axis-grid-color': '#6c778c',\n '--vis-dark-axis-label-color': '#fefefe',\n}\n\nexport const variables = getCssVarNames(cssVarDefaults)\ninjectGlobalCssVariables(cssVarDefaults, root)\n\nexport const hideTickLine = css`\n label: hide-tick-line;\n`\n\nexport const hideDomain = css`\n label: hide-domain;\n`\n\nexport const axis = css`\n label: axis;\n\n user-select: none;\n\n .domain {\n stroke: var(${variables.axisDomainColor}, var(${variables.axisTickColor}));\n stroke-width: var(${variables.axisDomainLineWidth}, var(${variables.axisGridLineWidth}));\n stroke-dasharray: var(${variables.axisDomainLineDasharray}, var(${variables.axisGridLineDasharray}));\n }\n\n &${`.${hideTickLine}`} {\n .tick > line {\n opacity: 0;\n }\n }\n\n &${`.${hideDomain}`} {\n .domain {\n opacity: 0;\n }\n }\n`\n\nexport const grid = css`\n label: grid;\n\n .domain {\n opacity: 0;\n }\n\n line {\n stroke: var(${variables.axisGridColor});\n stroke-width: var(${variables.axisGridLineWidth});\n stroke-dasharray: var(${variables.axisGridLineDasharray});\n opacity: var(${variables.axisGridOpacity});\n transition: var(${variables.axisGridTransition});\n }\n`\n\nexport const tick = css`\n label: tick;\n\n stroke: none;\n font-size: var(${variables.axisTickLabelFontSize});\n font-weight: var(${variables.axisTickLabelWeight});\n\n line {\n stroke: var(${variables.axisTickColor});\n stroke-width: var(${variables.axisTickLineWidth});\n }\n\n text {\n fill: var(${variables.axisTickLabelColor});\n cursor: var(${variables.axisTickLabelCursor});\n font-family: var(${variables.axisFontFamily}, var(--vis-font-family));\n text-decoration: var(${variables.axisTickLabelTextDecoration});\n stroke: none;\n }\n`\n\nexport const tickTextExiting = css`\n label: tick-text-exiting;\n`\n\nexport const label = css`\n label: label;\n fill: var(${variables.axisLabelColor});\n font-size: var(${variables.axisLabelFontSize});\n font-weight: var(${variables.axisLabelWeight});\n font-family: var(${variables.axisFontFamily}, var(--vis-font-family));\n text-anchor: middle;\n`\n\nexport const tickLabel = css`\n label: tick-label;\n`\n\nexport const tickLabelHideable = css`\n label: tick-label-hideable;\n opacity: 0;\n transition: var(${variables.axisTickLabelHideTransition});\n`\n"],"names":[],"mappings":"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"}
@@ -1,4 +1,4 @@
1
- import { css } from '@emotion/css';
1
+ import { css } from '../../styles/emotion.js';
2
2
  import { getCssVarNames, injectGlobalCssVariables } from '../../utils/style.js';
3
3
 
4
4
  const root = css `
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../src/components/brush/style.ts"],"sourcesContent":["import { css } from '@emotion/css'\nimport { getCssVarNames, injectGlobalCssVariables } from 'utils/style'\n\nexport const root = css`\n label: brush-component;\n`\n\nexport const cssVarDefaults = {\n '--vis-brush-selection-fill-color': 'none',\n '--vis-brush-selection-stroke-color': 'none',\n '--vis-brush-selection-stroke-width': '0',\n '--vis-brush-selection-opacity': '0',\n '--vis-brush-unselected-fill-color': '#0b1640',\n '--vis-brush-unselected-stroke-color': '#acb2b9',\n '--vis-brush-unselected-stroke-width': '0',\n '--vis-brush-unselected-opacity': '0.4',\n '--vis-brush-handle-fill-color': '#6d778c',\n '--vis-brush-handle-stroke-color': '#eee',\n\n /* Dark Theme */\n '--vis-dark-brush-selection-fill-color': 'none',\n '--vis-dark-brush-selection-stroke-color': 'none',\n '--vis-dark-brush-selection-stroke-width': '0',\n '--vis-dark-brush-selection-opacity': '0',\n '--vis-dark-brush-unselected-fill-color': '#acb2b9',\n '--vis-dark-brush-unselected-stroke-color': '#0b1640',\n '--vis-dark-brush-unselected-stroke-width': '0',\n '--vis-dark-brush-unselected-opacity': '0.4',\n '--vis-dark-brush-handle-fill-color': '#acb2b9',\n '--vis-dark-brush-handle-stroke-color': 'var(--vis-color-grey)',\n}\n\nexport const variables = getCssVarNames(cssVarDefaults)\ninjectGlobalCssVariables(cssVarDefaults, root)\n\nexport const brush = css`\n label: brush;\n\n .selection {\n fill: var(${variables.brushSelectionFillColor});\n stroke: var(${variables.brushSelectionStrokeColor});\n stroke-width: var(${variables.brushSelectionStrokeWidth});\n opacity: var(${variables.brushSelectionOpacity});\n }\n\n .handle {\n fill: var(${variables.brushHandleFillColor});\n }\n\n &.non-draggable {\n .selection, .overlay {\n pointer-events: none;\n }\n }\n`\n\nexport const unselected = css`\n label: unselected;\n fill: var(${variables.brushUnselectedFillColor});\n stroke: var(${variables.brushUnselectedStrokeColor});\n stroke-width: var(${variables.brushUnselectedStrokeWidth});\n stroke-opacity: var(${variables.brushUnselectedOpacity});\n opacity: var(${variables.brushUnselectedOpacity});\n pointer-events: none;\n`\n\nexport const handleLine = css`\n label: handle-line;\n stroke: var(${variables.brushHandleStrokeColor});\n stroke-width: 1;\n fill: none;\n pointer-events: none;\n`\n"],"names":[],"mappings":";;;AAGO,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;AAEY,MAAA,cAAc,GAAG;AAC5B,IAAA,kCAAkC,EAAE,MAAM;AAC1C,IAAA,oCAAoC,EAAE,MAAM;AAC5C,IAAA,oCAAoC,EAAE,GAAG;AACzC,IAAA,+BAA+B,EAAE,GAAG;AACpC,IAAA,mCAAmC,EAAE,SAAS;AAC9C,IAAA,qCAAqC,EAAE,SAAS;AAChD,IAAA,qCAAqC,EAAE,GAAG;AAC1C,IAAA,gCAAgC,EAAE,KAAK;AACvC,IAAA,+BAA+B,EAAE,SAAS;AAC1C,IAAA,iCAAiC,EAAE,MAAM;;AAGzC,IAAA,uCAAuC,EAAE,MAAM;AAC/C,IAAA,yCAAyC,EAAE,MAAM;AACjD,IAAA,yCAAyC,EAAE,GAAG;AAC9C,IAAA,oCAAoC,EAAE,GAAG;AACzC,IAAA,wCAAwC,EAAE,SAAS;AACnD,IAAA,0CAA0C,EAAE,SAAS;AACrD,IAAA,0CAA0C,EAAE,GAAG;AAC/C,IAAA,qCAAqC,EAAE,KAAK;AAC5C,IAAA,oCAAoC,EAAE,SAAS;AAC/C,IAAA,sCAAsC,EAAE,uBAAuB;EAChE;MAEY,SAAS,GAAG,cAAc,CAAC,cAAc,EAAC;AACvD,wBAAwB,CAAC,cAAc,EAAE,IAAI,CAAC,CAAA;AAEvC,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;;;AAIR,cAAA,EAAA,SAAS,CAAC,uBAAuB,CAAA;AAC/B,gBAAA,EAAA,SAAS,CAAC,yBAAyB,CAAA;AAC7B,sBAAA,EAAA,SAAS,CAAC,yBAAyB,CAAA;AACxC,iBAAA,EAAA,SAAS,CAAC,qBAAqB,CAAA;;;;AAIlC,cAAA,EAAA,SAAS,CAAC,oBAAoB,CAAA;;;;;;;;EAQ7C;AAEM,MAAM,UAAU,GAAG,GAAG,CAAA,CAAA;;AAEf,YAAA,EAAA,SAAS,CAAC,wBAAwB,CAAA;AAChC,cAAA,EAAA,SAAS,CAAC,0BAA0B,CAAA;AAC9B,oBAAA,EAAA,SAAS,CAAC,0BAA0B,CAAA;AAClC,sBAAA,EAAA,SAAS,CAAC,sBAAsB,CAAA;AACvC,eAAA,EAAA,SAAS,CAAC,sBAAsB,CAAA;;EAEhD;AAEM,MAAM,UAAU,GAAG,GAAG,CAAA,CAAA;;AAEb,cAAA,EAAA,SAAS,CAAC,sBAAsB,CAAA;;;;;;;;"}
1
+ {"version":3,"file":"style.js","sources":["../../../src/components/brush/style.ts"],"sourcesContent":["import { css } from 'styles/emotion'\nimport { getCssVarNames, injectGlobalCssVariables } from 'utils/style'\n\nexport const root = css`\n label: brush-component;\n`\n\nexport const cssVarDefaults = {\n '--vis-brush-selection-fill-color': 'none',\n '--vis-brush-selection-stroke-color': 'none',\n '--vis-brush-selection-stroke-width': '0',\n '--vis-brush-selection-opacity': '0',\n '--vis-brush-unselected-fill-color': '#0b1640',\n '--vis-brush-unselected-stroke-color': '#acb2b9',\n '--vis-brush-unselected-stroke-width': '0',\n '--vis-brush-unselected-opacity': '0.4',\n '--vis-brush-handle-fill-color': '#6d778c',\n '--vis-brush-handle-stroke-color': '#eee',\n\n /* Dark Theme */\n '--vis-dark-brush-selection-fill-color': 'none',\n '--vis-dark-brush-selection-stroke-color': 'none',\n '--vis-dark-brush-selection-stroke-width': '0',\n '--vis-dark-brush-selection-opacity': '0',\n '--vis-dark-brush-unselected-fill-color': '#acb2b9',\n '--vis-dark-brush-unselected-stroke-color': '#0b1640',\n '--vis-dark-brush-unselected-stroke-width': '0',\n '--vis-dark-brush-unselected-opacity': '0.4',\n '--vis-dark-brush-handle-fill-color': '#acb2b9',\n '--vis-dark-brush-handle-stroke-color': 'var(--vis-color-grey)',\n}\n\nexport const variables = getCssVarNames(cssVarDefaults)\ninjectGlobalCssVariables(cssVarDefaults, root)\n\nexport const brush = css`\n label: brush;\n\n .selection {\n fill: var(${variables.brushSelectionFillColor});\n stroke: var(${variables.brushSelectionStrokeColor});\n stroke-width: var(${variables.brushSelectionStrokeWidth});\n opacity: var(${variables.brushSelectionOpacity});\n }\n\n .handle {\n fill: var(${variables.brushHandleFillColor});\n }\n\n &.non-draggable {\n .selection, .overlay {\n pointer-events: none;\n }\n }\n`\n\nexport const unselected = css`\n label: unselected;\n fill: var(${variables.brushUnselectedFillColor});\n stroke: var(${variables.brushUnselectedStrokeColor});\n stroke-width: var(${variables.brushUnselectedStrokeWidth});\n stroke-opacity: var(${variables.brushUnselectedOpacity});\n opacity: var(${variables.brushUnselectedOpacity});\n pointer-events: none;\n`\n\nexport const handleLine = css`\n label: handle-line;\n stroke: var(${variables.brushHandleStrokeColor});\n stroke-width: 1;\n fill: none;\n pointer-events: none;\n`\n"],"names":[],"mappings":";;;AAGO,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;AAEY,MAAA,cAAc,GAAG;AAC5B,IAAA,kCAAkC,EAAE,MAAM;AAC1C,IAAA,oCAAoC,EAAE,MAAM;AAC5C,IAAA,oCAAoC,EAAE,GAAG;AACzC,IAAA,+BAA+B,EAAE,GAAG;AACpC,IAAA,mCAAmC,EAAE,SAAS;AAC9C,IAAA,qCAAqC,EAAE,SAAS;AAChD,IAAA,qCAAqC,EAAE,GAAG;AAC1C,IAAA,gCAAgC,EAAE,KAAK;AACvC,IAAA,+BAA+B,EAAE,SAAS;AAC1C,IAAA,iCAAiC,EAAE,MAAM;;AAGzC,IAAA,uCAAuC,EAAE,MAAM;AAC/C,IAAA,yCAAyC,EAAE,MAAM;AACjD,IAAA,yCAAyC,EAAE,GAAG;AAC9C,IAAA,oCAAoC,EAAE,GAAG;AACzC,IAAA,wCAAwC,EAAE,SAAS;AACnD,IAAA,0CAA0C,EAAE,SAAS;AACrD,IAAA,0CAA0C,EAAE,GAAG;AAC/C,IAAA,qCAAqC,EAAE,KAAK;AAC5C,IAAA,oCAAoC,EAAE,SAAS;AAC/C,IAAA,sCAAsC,EAAE,uBAAuB;EAChE;MAEY,SAAS,GAAG,cAAc,CAAC,cAAc,EAAC;AACvD,wBAAwB,CAAC,cAAc,EAAE,IAAI,CAAC,CAAA;AAEvC,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;;;AAIR,cAAA,EAAA,SAAS,CAAC,uBAAuB,CAAA;AAC/B,gBAAA,EAAA,SAAS,CAAC,yBAAyB,CAAA;AAC7B,sBAAA,EAAA,SAAS,CAAC,yBAAyB,CAAA;AACxC,iBAAA,EAAA,SAAS,CAAC,qBAAqB,CAAA;;;;AAIlC,cAAA,EAAA,SAAS,CAAC,oBAAoB,CAAA;;;;;;;;EAQ7C;AAEM,MAAM,UAAU,GAAG,GAAG,CAAA,CAAA;;AAEf,YAAA,EAAA,SAAS,CAAC,wBAAwB,CAAA;AAChC,cAAA,EAAA,SAAS,CAAC,0BAA0B,CAAA;AAC9B,oBAAA,EAAA,SAAS,CAAC,0BAA0B,CAAA;AAClC,sBAAA,EAAA,SAAS,CAAC,sBAAsB,CAAA;AACvC,eAAA,EAAA,SAAS,CAAC,sBAAsB,CAAA;;EAEhD;AAEM,MAAM,UAAU,GAAG,GAAG,CAAA,CAAA;;AAEb,cAAA,EAAA,SAAS,CAAC,sBAAsB,CAAA;;;;;;;;"}
@@ -1,4 +1,4 @@
1
- import { css, injectGlobal } from '@emotion/css';
1
+ import { css, injectGlobal } from '../../styles/emotion.js';
2
2
  import { darkThemeCssSelectors } from '../../utils/theme.js';
3
3
 
4
4
  const root = css `
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../src/components/bullet-legend/style.ts"],"sourcesContent":["import { css, injectGlobal } from '@emotion/css'\nimport { darkThemeCssSelectors } from 'utils/theme'\n\nexport const root = css`\n label: bullet-legend-component;\n`\n\nexport const variables = injectGlobal`\n :root {\n // Undefined by default to allow proper fallback to var(--vis-font-family)\n /* --vis-legend-font-family: */\n\n --vis-legend-label-color: #6c778c;\n --vis-legend-label-max-width: 300px;\n --vis-legend-label-font-size: 12px;\n --vis-legend-bullet-size: 9px;\n --vis-legend-bullet-inactive-opacity: 0.15;\n --vis-legend-item-spacing: 20px;\n --vis-legend-vertical-item-spacing: 5px;\n --vis-legend-bullet-label-spacing: 8px;\n\n --vis-dark-legend-label-color: #eee;\n }\n\n ${darkThemeCssSelectors} ${`.${root}`} {\n --vis-legend-label-color: var(--vis-dark-legend-label-color);\n }\n\n body.theme-patterns {\n --vis-legend-bullet-size: 14px;\n }\n`\n\nexport const item = css`\n label: legendItem;\n display: inline-flex;\n align-items: center;\n font-family: var(--vis-legend-font-family, var(--vis-font-family));\n margin-right: var(--vis-legend-item-spacing);\n white-space: nowrap;\n cursor: default;\n user-select: none;\n max-width: min-content;\n`\n\nexport const itemVertical = css`\n label: legendItemVertical;\n display: flex;\n margin-top: var(--vis-legend-vertical-item-spacing);\n`\n\nexport const clickable = css`\n cursor: pointer;\n`\n\nexport const label = css`\n label: legendItemLabel;\n font-size: var(--vis-legend-label-font-size);\n display: inline-block;\n vertical-align: middle;\n color: var(--vis-legend-label-color);\n max-width: var(--vis-legend-label-max-width);\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n`\n\nexport const bullet = css`\n flex: 0 0 auto;\n label: legendItemBullet;\n margin-right: var(--vis-legend-bullet-label-spacing);\n height: var(--vis-legend-bullet-size);\n width: var(--vis-legend-bullet-size);\n\n svg {\n display: block;\n }\n`\n"],"names":[],"mappings":";;;AAGO,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;AAEM,MAAM,SAAS,GAAG,YAAY,CAAA,CAAA;;;;;;;;;;;;;;;;;IAiBjC,qBAAqB,CAAA,CAAA,EAAI,CAAI,CAAA,EAAA,IAAI,CAAE,CAAA,CAAA;;;;;;;EAOtC;AAEM,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;EAUtB;AAEM,MAAM,YAAY,GAAG,GAAG,CAAA,CAAA;;;;EAI9B;AAEM,MAAM,SAAS,GAAG,GAAG,CAAA,CAAA;;EAE3B;AAEM,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;EAUvB;AAEM,MAAM,MAAM,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"style.js","sources":["../../../src/components/bullet-legend/style.ts"],"sourcesContent":["import { css, injectGlobal } from 'styles/emotion'\nimport { darkThemeCssSelectors } from 'utils/theme'\n\nexport const root = css`\n label: bullet-legend-component;\n`\n\nexport const variables = injectGlobal`\n :root {\n // Undefined by default to allow proper fallback to var(--vis-font-family)\n /* --vis-legend-font-family: */\n\n --vis-legend-label-color: #6c778c;\n --vis-legend-label-max-width: 300px;\n --vis-legend-label-font-size: 12px;\n --vis-legend-bullet-size: 9px;\n --vis-legend-bullet-inactive-opacity: 0.15;\n --vis-legend-item-spacing: 20px;\n --vis-legend-vertical-item-spacing: 5px;\n --vis-legend-bullet-label-spacing: 8px;\n\n --vis-dark-legend-label-color: #eee;\n }\n\n ${darkThemeCssSelectors} ${`.${root}`} {\n --vis-legend-label-color: var(--vis-dark-legend-label-color);\n }\n\n body.theme-patterns {\n --vis-legend-bullet-size: 14px;\n }\n`\n\nexport const item = css`\n label: legendItem;\n display: inline-flex;\n align-items: center;\n font-family: var(--vis-legend-font-family, var(--vis-font-family));\n margin-right: var(--vis-legend-item-spacing);\n white-space: nowrap;\n cursor: default;\n user-select: none;\n max-width: min-content;\n`\n\nexport const itemVertical = css`\n label: legendItemVertical;\n display: flex;\n margin-top: var(--vis-legend-vertical-item-spacing);\n`\n\nexport const clickable = css`\n cursor: pointer;\n`\n\nexport const label = css`\n label: legendItemLabel;\n font-size: var(--vis-legend-label-font-size);\n display: inline-block;\n vertical-align: middle;\n color: var(--vis-legend-label-color);\n max-width: var(--vis-legend-label-max-width);\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n`\n\nexport const bullet = css`\n flex: 0 0 auto;\n label: legendItemBullet;\n margin-right: var(--vis-legend-bullet-label-spacing);\n height: var(--vis-legend-bullet-size);\n width: var(--vis-legend-bullet-size);\n\n svg {\n display: block;\n }\n`\n"],"names":[],"mappings":";;;AAGO,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;AAEM,MAAM,SAAS,GAAG,YAAY,CAAA,CAAA;;;;;;;;;;;;;;;;;IAiBjC,qBAAqB,CAAA,CAAA,EAAI,CAAI,CAAA,EAAA,IAAI,CAAE,CAAA,CAAA;;;;;;;EAOtC;AAEM,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;EAUtB;AAEM,MAAM,YAAY,GAAG,GAAG,CAAA,CAAA;;;;EAI9B;AAEM,MAAM,SAAS,GAAG,GAAG,CAAA,CAAA;;EAE3B;AAEM,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;EAUvB;AAEM,MAAM,MAAM,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;;;;"}
@@ -1,4 +1,4 @@
1
- import { css, injectGlobal } from '@emotion/css';
1
+ import { css, injectGlobal } from '../../styles/emotion.js';
2
2
  import { darkThemeCssSelectors } from '../../utils/theme.js';
3
3
 
4
4
  const root = css `
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../src/components/chord-diagram/style.ts"],"sourcesContent":["import { css, injectGlobal } from '@emotion/css'\nimport { darkThemeCssSelectors } from 'utils/theme'\n\nexport const root = css`\n label: chord-diagram-component;\n`\n\nexport const variables = injectGlobal`\n :root {\n --vis-chord-diagram-link-fill-color: #cad5f6;\n --vis-chord-diagram-link-stroke-color: #777777;\n --vis-chord-diagram-link-opacity: 0.5;\n --vis-chord-diagram-link-stroke-opacity: 0.15;\n --vis-chord-diagram-link-highlighted-opacity: 0.9;\n --vis-chord-diagram-link-dimmed-opacity: 0.25;\n\n --vis-chord-diagram-node-highlighted-opacity: 0.9;\n --vis-chord-diagram-node-dimmed-opacity: 0.25;\n\n --vis-chord-diagram-label-text-fill-color-bright: #ffffff;\n --vis-chord-diagram-label-text-fill-color-dark: #a5abb2;\n --vis-chord-diagram-label-text-font-size: 1em;\n\n --vis-dark-chord-diagram-link-fill-color: #575c65;\n }\n\n ${darkThemeCssSelectors} ${`.${root}`} {\n --vis-chord-diagram-link-fill-color: var(--vis-dark-chord-diagram-link-fill-color);\n }\n`\n\nexport const background = css`\n label: background;\n`\n\nexport const nodes = css`\n label: nodes;\n`\n\nexport const links = css`\n label: links;\n`\n\nexport const labels = css`\n label: labels;\n`\n\nexport const node = css`\n label: node;\n stroke-width: 0;\n fill: var(--vis-color-main);\n stroke: var(--vis-color-main);\n transition: .1s fill-opacity;\n`\n\nexport const highlightedNode = css`\n label: highlighted;\n fill-opacity: var(--vis-chord-diagram-node-highlighted-opacity);\n stroke-width: 1.5;\n`\n\nexport const label = css`\n label: label;\n`\n\nexport const labelText = css`\n label: label-text;\n\n dominant-baseline: middle;\n user-select: none;\n font-size: var(--vis-chord-diagram-label-text-font-size);\n\n > textPath {\n dominant-baseline: central;\n }\n`\n\nexport const labelExit = css`\n label: label-exit;\n`\n\nexport const link = css`\n label: link;\n\n fill: var(--vis-chord-diagram-link-fill-color);\n fill-opacity: var(--vis-chord-diagram-link-opacity);\n stroke: var(--vis-chord-diagram-link-stroke-color);\n stroke-opacity: var(--vis-chord-diagram-link-stroke-opacity);\n transition: .1s fill-opacity;\n`\nexport const highlightedLink = css`\n label: highlighted;\n fill-opacity: var(--vis-chord-diagram-link-highlighted-opacity);\n`\n\nexport const transparent = css`\n label: transparent;\n\n ${`.${link}`}:not(${`.${highlightedLink}`}) {\n fill-opacity: var(--vis-chord-diagram-link-dimmed-opacity);\n }\n\n ${`.${node}`}:not(${`.${highlightedNode}`}) {\n fill-opacity: var(--vis-chord-diagram-node-dimmed-opacity);\n }\n`\n"],"names":[],"mappings":";;;AAGO,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;AAEM,MAAM,SAAS,GAAG,YAAY,CAAA,CAAA;;;;;;;;;;;;;;;;;;;IAmBjC,qBAAqB,CAAA,CAAA,EAAI,CAAI,CAAA,EAAA,IAAI,CAAE,CAAA,CAAA;;;EAGtC;AAEM,MAAM,UAAU,GAAG,GAAG,CAAA,CAAA;;EAE5B;AAEM,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;EAEvB;AAEM,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;EAEvB;AAEM,MAAM,MAAM,GAAG,GAAG,CAAA,CAAA;;EAExB;AAEM,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;;;;;EAMtB;AAEM,MAAM,eAAe,GAAG,GAAG,CAAA,CAAA;;;;EAIjC;AAEM,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;EAEvB;AAEM,MAAM,SAAS,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;EAU3B;AAEM,MAAM,SAAS,GAAG,GAAG,CAAA,CAAA;;EAE3B;AAEM,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;;;;;;;EAQtB;AACM,MAAM,eAAe,GAAG,GAAG,CAAA,CAAA;;;EAGjC;AAEM,MAAM,WAAW,GAAG,GAAG,CAAA,CAAA;;;AAG1B,EAAA,EAAA,CAAA,CAAA,EAAI,IAAI,CAAA,CAAE,CAAQ,KAAA,EAAA,CAAA,CAAA,EAAI,eAAe,CAAE,CAAA,CAAA;;;;AAIvC,EAAA,EAAA,CAAA,CAAA,EAAI,IAAI,CAAA,CAAE,CAAQ,KAAA,EAAA,CAAA,CAAA,EAAI,eAAe,CAAE,CAAA,CAAA;;;;;;;"}
1
+ {"version":3,"file":"style.js","sources":["../../../src/components/chord-diagram/style.ts"],"sourcesContent":["import { css, injectGlobal } from 'styles/emotion'\nimport { darkThemeCssSelectors } from 'utils/theme'\n\nexport const root = css`\n label: chord-diagram-component;\n`\n\nexport const variables = injectGlobal`\n :root {\n --vis-chord-diagram-link-fill-color: #cad5f6;\n --vis-chord-diagram-link-stroke-color: #777777;\n --vis-chord-diagram-link-opacity: 0.5;\n --vis-chord-diagram-link-stroke-opacity: 0.15;\n --vis-chord-diagram-link-highlighted-opacity: 0.9;\n --vis-chord-diagram-link-dimmed-opacity: 0.25;\n\n --vis-chord-diagram-node-highlighted-opacity: 0.9;\n --vis-chord-diagram-node-dimmed-opacity: 0.25;\n\n --vis-chord-diagram-label-text-fill-color-bright: #ffffff;\n --vis-chord-diagram-label-text-fill-color-dark: #a5abb2;\n --vis-chord-diagram-label-text-font-size: 1em;\n\n --vis-dark-chord-diagram-link-fill-color: #575c65;\n }\n\n ${darkThemeCssSelectors} ${`.${root}`} {\n --vis-chord-diagram-link-fill-color: var(--vis-dark-chord-diagram-link-fill-color);\n }\n`\n\nexport const background = css`\n label: background;\n`\n\nexport const nodes = css`\n label: nodes;\n`\n\nexport const links = css`\n label: links;\n`\n\nexport const labels = css`\n label: labels;\n`\n\nexport const node = css`\n label: node;\n stroke-width: 0;\n fill: var(--vis-color-main);\n stroke: var(--vis-color-main);\n transition: .1s fill-opacity;\n`\n\nexport const highlightedNode = css`\n label: highlighted;\n fill-opacity: var(--vis-chord-diagram-node-highlighted-opacity);\n stroke-width: 1.5;\n`\n\nexport const label = css`\n label: label;\n`\n\nexport const labelText = css`\n label: label-text;\n\n dominant-baseline: middle;\n user-select: none;\n font-size: var(--vis-chord-diagram-label-text-font-size);\n\n > textPath {\n dominant-baseline: central;\n }\n`\n\nexport const labelExit = css`\n label: label-exit;\n`\n\nexport const link = css`\n label: link;\n\n fill: var(--vis-chord-diagram-link-fill-color);\n fill-opacity: var(--vis-chord-diagram-link-opacity);\n stroke: var(--vis-chord-diagram-link-stroke-color);\n stroke-opacity: var(--vis-chord-diagram-link-stroke-opacity);\n transition: .1s fill-opacity;\n`\nexport const highlightedLink = css`\n label: highlighted;\n fill-opacity: var(--vis-chord-diagram-link-highlighted-opacity);\n`\n\nexport const transparent = css`\n label: transparent;\n\n ${`.${link}`}:not(${`.${highlightedLink}`}) {\n fill-opacity: var(--vis-chord-diagram-link-dimmed-opacity);\n }\n\n ${`.${node}`}:not(${`.${highlightedNode}`}) {\n fill-opacity: var(--vis-chord-diagram-node-dimmed-opacity);\n }\n`\n"],"names":[],"mappings":";;;AAGO,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;AAEM,MAAM,SAAS,GAAG,YAAY,CAAA,CAAA;;;;;;;;;;;;;;;;;;;IAmBjC,qBAAqB,CAAA,CAAA,EAAI,CAAI,CAAA,EAAA,IAAI,CAAE,CAAA,CAAA;;;EAGtC;AAEM,MAAM,UAAU,GAAG,GAAG,CAAA,CAAA;;EAE5B;AAEM,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;EAEvB;AAEM,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;EAEvB;AAEM,MAAM,MAAM,GAAG,GAAG,CAAA,CAAA;;EAExB;AAEM,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;;;;;EAMtB;AAEM,MAAM,eAAe,GAAG,GAAG,CAAA,CAAA;;;;EAIjC;AAEM,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;EAEvB;AAEM,MAAM,SAAS,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;EAU3B;AAEM,MAAM,SAAS,GAAG,GAAG,CAAA,CAAA;;EAE3B;AAEM,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;;;;;;;EAQtB;AACM,MAAM,eAAe,GAAG,GAAG,CAAA,CAAA;;;EAGjC;AAEM,MAAM,WAAW,GAAG,GAAG,CAAA,CAAA;;;AAG1B,EAAA,EAAA,CAAA,CAAA,EAAI,IAAI,CAAA,CAAE,CAAQ,KAAA,EAAA,CAAA,CAAA,EAAI,eAAe,CAAE,CAAA,CAAA;;;;AAIvC,EAAA,EAAA,CAAA,CAAA,EAAI,IAAI,CAAA,CAAE,CAAQ,KAAA,EAAA,CAAA,CAAA,EAAI,eAAe,CAAE,CAAA,CAAA;;;;;;;"}
@@ -1,4 +1,8 @@
1
- export declare const globalStyles: void;
2
1
  export declare const root: string;
2
+ export declare const cssVarDefaults: Record<string, string | undefined>;
3
+ export declare const variables: {
4
+ [x: string]: string;
5
+ };
3
6
  export declare const line: string;
7
+ export declare const lineHorizontal: string;
4
8
  export declare const circle: string;
@@ -1,30 +1,40 @@
1
- import { injectGlobal, css } from '@emotion/css';
1
+ import { css } from '../../styles/emotion.js';
2
+ import { getCssVarNames, injectGlobalCssVariables } from '../../utils/style.js';
2
3
 
3
- const globalStyles = injectGlobal `
4
- :root {
5
- --vis-crosshair-line-stroke-color: #888;
6
- --vis-crosshair-line-stroke-width: 1px;
7
- --vis-crosshair-line-stroke-opacity: 1;
8
- --vis-crosshair-circle-stroke-color: #fff;
9
- --vis-crosshair-circle-stroke-width: 1px;
10
- --vis-crosshair-circle-stroke-opacity: 0.75;
11
- }
12
- `;
13
4
  const root = css `
14
5
  label: crosshair-component;
15
6
  `;
7
+ const cssVarDefaults = {
8
+ '--vis-crosshair-line-stroke-color': '#888',
9
+ '--vis-crosshair-line-stroke-width': '1px',
10
+ '--vis-crosshair-line-stroke-opacity': '1',
11
+ '--vis-crosshair-line-stroke-dasharray': 'none',
12
+ '--vis-crosshair-circle-stroke-color': '#fff',
13
+ '--vis-crosshair-circle-stroke-width': '1px',
14
+ '--vis-crosshair-circle-stroke-opacity': '0.75',
15
+ };
16
+ const variables = getCssVarNames(cssVarDefaults);
17
+ injectGlobalCssVariables(cssVarDefaults, root);
16
18
  const line = css `
17
- stroke: var(--vis-crosshair-line-stroke-color);
18
- stroke-width: var(--vis-crosshair-line-stroke-width);
19
- stroke-opacity: var(--vis-crosshair-line-stroke-opacity);
19
+ stroke: var(${variables.crosshairLineStrokeColor});
20
+ stroke-width: var(${variables.crosshairLineStrokeWidth});
21
+ stroke-opacity: var(${variables.crosshairLineStrokeOpacity});
22
+ stroke-dasharray: var(${variables.crosshairLineStrokeDasharray});
23
+ pointer-events: none;
24
+ `;
25
+ const lineHorizontal = css `
26
+ stroke: var(${variables.crosshairLineStrokeColor});
27
+ stroke-width: var(${variables.crosshairLineStrokeWidth});
28
+ stroke-opacity: var(${variables.crosshairLineStrokeOpacity});
29
+ stroke-dasharray: var(${variables.crosshairLineStrokeDasharray});
20
30
  pointer-events: none;
21
31
  `;
22
32
  const circle = css `
23
- stroke: var(--vis-crosshair-circle-stroke-color);
24
- stroke-width: var(--vis-crosshair-circle-stroke-width);
25
- stroke-opacity: var(--vis-crosshair-circle-stroke-opacity);
33
+ stroke: var(${variables.crosshairCircleStrokeColor});
34
+ stroke-width: var(${variables.crosshairCircleStrokeWidth});
35
+ stroke-opacity: var(${variables.crosshairCircleStrokeOpacity});
26
36
  pointer-events: none;
27
37
  `;
28
38
 
29
- export { circle, globalStyles, line, root };
39
+ export { circle, cssVarDefaults, line, lineHorizontal, root, variables };
30
40
  //# sourceMappingURL=style.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../src/components/crosshair/style.ts"],"sourcesContent":["import { css, injectGlobal } from '@emotion/css'\n\nexport const globalStyles = injectGlobal`\n :root {\n --vis-crosshair-line-stroke-color: #888;\n --vis-crosshair-line-stroke-width: 1px;\n --vis-crosshair-line-stroke-opacity: 1;\n --vis-crosshair-circle-stroke-color: #fff;\n --vis-crosshair-circle-stroke-width: 1px;\n --vis-crosshair-circle-stroke-opacity: 0.75;\n }\n`\n\nexport const root = css`\n label: crosshair-component;\n`\n\nexport const line = css`\n stroke: var(--vis-crosshair-line-stroke-color);\n stroke-width: var(--vis-crosshair-line-stroke-width);\n stroke-opacity: var(--vis-crosshair-line-stroke-opacity);\n pointer-events: none;\n`\n\nexport const circle = css`\n stroke: var(--vis-crosshair-circle-stroke-color);\n stroke-width: var(--vis-crosshair-circle-stroke-width);\n stroke-opacity: var(--vis-crosshair-circle-stroke-opacity);\n pointer-events: none;\n`\n"],"names":[],"mappings":";;AAEO,MAAM,YAAY,GAAG,YAAY,CAAA,CAAA;;;;;;;;;EASvC;AAEM,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;AAEM,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;;;;EAKtB;AAEM,MAAM,MAAM,GAAG,GAAG,CAAA,CAAA;;;;;;;;;"}
1
+ {"version":3,"file":"style.js","sources":["../../../src/components/crosshair/style.ts"],"sourcesContent":["import { css } from 'styles/emotion'\nimport { getCssVarNames, injectGlobalCssVariables } from 'utils/style'\n\nexport const root = css`\n label: crosshair-component;\n`\n\nexport const cssVarDefaults: Record<string, string | undefined> = {\n '--vis-crosshair-line-stroke-color': '#888',\n '--vis-crosshair-line-stroke-width': '1px',\n '--vis-crosshair-line-stroke-opacity': '1',\n '--vis-crosshair-line-stroke-dasharray': 'none',\n '--vis-crosshair-circle-stroke-color': '#fff',\n '--vis-crosshair-circle-stroke-width': '1px',\n '--vis-crosshair-circle-stroke-opacity': '0.75',\n}\n\nexport const variables = getCssVarNames(cssVarDefaults)\ninjectGlobalCssVariables(cssVarDefaults, root)\n\nexport const line = css`\n stroke: var(${variables.crosshairLineStrokeColor});\n stroke-width: var(${variables.crosshairLineStrokeWidth});\n stroke-opacity: var(${variables.crosshairLineStrokeOpacity});\n stroke-dasharray: var(${variables.crosshairLineStrokeDasharray});\n pointer-events: none;\n`\n\nexport const lineHorizontal = css`\n stroke: var(${variables.crosshairLineStrokeColor});\n stroke-width: var(${variables.crosshairLineStrokeWidth});\n stroke-opacity: var(${variables.crosshairLineStrokeOpacity});\n stroke-dasharray: var(${variables.crosshairLineStrokeDasharray});\n pointer-events: none;\n`\n\nexport const circle = css`\n stroke: var(${variables.crosshairCircleStrokeColor});\n stroke-width: var(${variables.crosshairCircleStrokeWidth});\n stroke-opacity: var(${variables.crosshairCircleStrokeOpacity});\n pointer-events: none;\n`\n"],"names":[],"mappings":";;;AAGO,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;AAEY,MAAA,cAAc,GAAuC;AAChE,IAAA,mCAAmC,EAAE,MAAM;AAC3C,IAAA,mCAAmC,EAAE,KAAK;AAC1C,IAAA,qCAAqC,EAAE,GAAG;AAC1C,IAAA,uCAAuC,EAAE,MAAM;AAC/C,IAAA,qCAAqC,EAAE,MAAM;AAC7C,IAAA,qCAAqC,EAAE,KAAK;AAC5C,IAAA,uCAAuC,EAAE,MAAM;EAChD;MAEY,SAAS,GAAG,cAAc,CAAC,cAAc,EAAC;AACvD,wBAAwB,CAAC,cAAc,EAAE,IAAI,CAAC,CAAA;AAEvC,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;AACP,cAAA,EAAA,SAAS,CAAC,wBAAwB,CAAA;AAC5B,oBAAA,EAAA,SAAS,CAAC,wBAAwB,CAAA;AAChC,sBAAA,EAAA,SAAS,CAAC,0BAA0B,CAAA;AAClC,wBAAA,EAAA,SAAS,CAAC,4BAA4B,CAAA;;EAE/D;AAEM,MAAM,cAAc,GAAG,GAAG,CAAA,CAAA;AACjB,cAAA,EAAA,SAAS,CAAC,wBAAwB,CAAA;AAC5B,oBAAA,EAAA,SAAS,CAAC,wBAAwB,CAAA;AAChC,sBAAA,EAAA,SAAS,CAAC,0BAA0B,CAAA;AAClC,wBAAA,EAAA,SAAS,CAAC,4BAA4B,CAAA;;EAE/D;AAEM,MAAM,MAAM,GAAG,GAAG,CAAA,CAAA;AACT,cAAA,EAAA,SAAS,CAAC,0BAA0B,CAAA;AAC9B,oBAAA,EAAA,SAAS,CAAC,0BAA0B,CAAA;AAClC,sBAAA,EAAA,SAAS,CAAC,4BAA4B,CAAA;;;;;;"}
@@ -1,4 +1,4 @@
1
- import { css, injectGlobal } from '@emotion/css';
1
+ import { css, injectGlobal } from '../../styles/emotion.js';
2
2
  import { darkThemeCssSelectors } from '../../utils/theme.js';
3
3
 
4
4
  const root = css `
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../src/components/donut/style.ts"],"sourcesContent":["import { css, injectGlobal } from '@emotion/css'\nimport { darkThemeCssSelectors } from 'utils/theme'\n\nexport const root = css`\n label: donut-component;\n`\n\nexport const variables = injectGlobal`\n :root {\n --vis-donut-central-label-font-size: 16px;\n --vis-donut-central-label-text-color: #5b5f6d;\n // Undefined by default to allow proper fallback to var(--vis-font-family)\n /* --vis-donut-central-label-font-family: */\n --vis-donut-central-label-font-weight: 600;\n\n --vis-donut-central-sub-label-font-size: 12px;\n --vis-donut-central-sub-label-text-color: #5b5f6d;\n // Undefined by default to allow proper fallback to var(--vis-font-family)\n /* --vis-donut-central-sub-label-font-family: */\n --vis-donut-central-sub-label-font-weight: 500;\n\n --vis-donut-background-color: #E7E9F3;\n --vis-donut-segment-stroke-width: 0;\n // The line segment color variable is not defined by default\n // to allow it to fallback to the donut background color\n /* --vis-donut-segment-stroke-color: none; */\n\n --vis-dark-donut-central-label-text-color: #C2BECE;\n --vis-dark-donut-central-sub-label-text-color: #C2BECE;\n --vis-dark-donut-background-color: #18160C;\n }\n\n ${darkThemeCssSelectors} ${`.${root}`} {\n --vis-donut-central-label-text-color: var(--vis-dark-donut-central-label-text-color);\n --vis-donut-central-sub-label-text-color: var(--vis-dark-donut-central-sub-label-text-color);\n --vis-donut-background-color: var(--vis-dark-donut-background-color);\n }\n`\nexport const background = css`\n label: background;\n fill: var(--vis-donut-background-color);\n`\n\nexport const segment = css`\n label: segment;\n stroke-width: var(--vis-donut-segment-stroke-width);\n stroke: var(--vis-donut-segment-stroke-color, var(--vis-donut-background-color));\n`\n\nexport const segmentExit = css`\n label: segment-exit;\n`\n\nexport const centralLabel = css`\n label: central-label;\n text-anchor: middle;\n dominant-baseline: middle;\n font-size: var(--vis-donut-central-label-font-size);\n font-family: var(--vis-donut-central-label-font-family, var(--vis-font-family));\n font-weight: var(--vis-donut-central-label-font-weight);\n fill: var(--vis-donut-central-label-text-color);\n`\n\nexport const centralSubLabel = css`\n label: central-label;\n text-anchor: middle;\n dominant-baseline: middle;\n font-size: var(--vis-donut-central-sub-label-font-size);\n font-family: var(--vis-donut-central-sub-label-font-family, var(--vis-font-family));\n font-weight: var(--vis-donut-central-sub-label-font-weight);\n fill: var(--vis-donut-central-sub-label-text-color);\n`\n"],"names":[],"mappings":";;;AAGO,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;AAEM,MAAM,SAAS,GAAG,YAAY,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;IAyBjC,qBAAqB,CAAA,CAAA,EAAI,CAAI,CAAA,EAAA,IAAI,CAAE,CAAA,CAAA;;;;;EAKtC;AACM,MAAM,UAAU,GAAG,GAAG,CAAA,CAAA;;;EAG5B;AAEM,MAAM,OAAO,GAAG,GAAG,CAAA,CAAA;;;;EAIzB;AAEM,MAAM,WAAW,GAAG,GAAG,CAAA,CAAA;;EAE7B;AAEM,MAAM,YAAY,GAAG,GAAG,CAAA,CAAA;;;;;;;;EAQ9B;AAEM,MAAM,eAAe,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;;"}
1
+ {"version":3,"file":"style.js","sources":["../../../src/components/donut/style.ts"],"sourcesContent":["import { css, injectGlobal } from 'styles/emotion'\nimport { darkThemeCssSelectors } from 'utils/theme'\n\nexport const root = css`\n label: donut-component;\n`\n\nexport const variables = injectGlobal`\n :root {\n --vis-donut-central-label-font-size: 16px;\n --vis-donut-central-label-text-color: #5b5f6d;\n // Undefined by default to allow proper fallback to var(--vis-font-family)\n /* --vis-donut-central-label-font-family: */\n --vis-donut-central-label-font-weight: 600;\n\n --vis-donut-central-sub-label-font-size: 12px;\n --vis-donut-central-sub-label-text-color: #5b5f6d;\n // Undefined by default to allow proper fallback to var(--vis-font-family)\n /* --vis-donut-central-sub-label-font-family: */\n --vis-donut-central-sub-label-font-weight: 500;\n\n --vis-donut-background-color: #E7E9F3;\n --vis-donut-segment-stroke-width: 0;\n // The line segment color variable is not defined by default\n // to allow it to fallback to the donut background color\n /* --vis-donut-segment-stroke-color: none; */\n\n --vis-dark-donut-central-label-text-color: #C2BECE;\n --vis-dark-donut-central-sub-label-text-color: #C2BECE;\n --vis-dark-donut-background-color: #18160C;\n }\n\n ${darkThemeCssSelectors} ${`.${root}`} {\n --vis-donut-central-label-text-color: var(--vis-dark-donut-central-label-text-color);\n --vis-donut-central-sub-label-text-color: var(--vis-dark-donut-central-sub-label-text-color);\n --vis-donut-background-color: var(--vis-dark-donut-background-color);\n }\n`\nexport const background = css`\n label: background;\n fill: var(--vis-donut-background-color);\n`\n\nexport const segment = css`\n label: segment;\n stroke-width: var(--vis-donut-segment-stroke-width);\n stroke: var(--vis-donut-segment-stroke-color, var(--vis-donut-background-color));\n`\n\nexport const segmentExit = css`\n label: segment-exit;\n`\n\nexport const centralLabel = css`\n label: central-label;\n text-anchor: middle;\n dominant-baseline: middle;\n font-size: var(--vis-donut-central-label-font-size);\n font-family: var(--vis-donut-central-label-font-family, var(--vis-font-family));\n font-weight: var(--vis-donut-central-label-font-weight);\n fill: var(--vis-donut-central-label-text-color);\n`\n\nexport const centralSubLabel = css`\n label: central-label;\n text-anchor: middle;\n dominant-baseline: middle;\n font-size: var(--vis-donut-central-sub-label-font-size);\n font-family: var(--vis-donut-central-sub-label-font-family, var(--vis-font-family));\n font-weight: var(--vis-donut-central-sub-label-font-weight);\n fill: var(--vis-donut-central-sub-label-text-color);\n`\n"],"names":[],"mappings":";;;AAGO,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;AAEM,MAAM,SAAS,GAAG,YAAY,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;IAyBjC,qBAAqB,CAAA,CAAA,EAAI,CAAI,CAAA,EAAA,IAAI,CAAE,CAAA,CAAA;;;;;EAKtC;AACM,MAAM,UAAU,GAAG,GAAG,CAAA,CAAA;;;EAG5B;AAEM,MAAM,OAAO,GAAG,GAAG,CAAA,CAAA;;;;EAIzB;AAEM,MAAM,WAAW,GAAG,GAAG,CAAA,CAAA;;EAE7B;AAEM,MAAM,YAAY,GAAG,GAAG,CAAA,CAAA;;;;;;;;EAQ9B;AAEM,MAAM,eAAe,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;;"}
@@ -1,4 +1,4 @@
1
- import { css, injectGlobal } from '@emotion/css';
1
+ import { css, injectGlobal } from '../../styles/emotion.js';
2
2
  import { UNOVIS_ICON_FONT_FAMILY_DEFAULT } from '../../styles/index.js';
3
3
  import { darkThemeCssSelectors } from '../../utils/theme.js';
4
4
 
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../src/components/flow-legend/style.ts"],"sourcesContent":["import { css, injectGlobal } from '@emotion/css'\nimport { UNOVIS_ICON_FONT_FAMILY_DEFAULT } from 'styles/index'\nimport { darkThemeCssSelectors } from 'utils/theme'\nimport { FlowLegendItem } from './types'\n\nexport const root = css`\n label: flow-legend-component;\n position: relative;\n user-select: none;\n`\n\nexport const globalStyles = injectGlobal`\n :root {\n --vis-flow-legend-label-background: #ffffff;\n --vis-flow-legend-label-color: #71788a;\n --vis-flow-legend-link-color: #E5E9F7;\n --vis-flow-legend-arrow-color: #E5E9F7;\n --vis-flow-legend-label-padding: 5px 10px;\n --vis-flow-legend-arrow-padding: 0 5px;\n /* --vis-flow-legend-arrow-font-family: Undefined by default to allow proper fallback to var(DEFAULT_ICON_FONT_FAMILY)*/\n\n --vis-dark-flow-legend-label-background: #292b34;\n --vis-dark-flow-legend-label-color: #E5E9F7;\n --vis-dark-flow-legend-link-color: #71788a;\n --vis-dark-flow-legend-arrow-color: #71788a;\n }\n\n ${darkThemeCssSelectors} ${`.${root}`} {\n --vis-flow-legend-label-background: var(--vis-dark-flow-legend-label-background);\n --vis-flow-legend-label-color: var(--vis-dark-flow-legend-label-color);\n --vis-flow-legend-link-color: var(--vis-dark-flow-legend-link-color);\n --vis-flow-legend-arrow-color: var(--vis-dark-flow-legend-arrow-color);\n }\n`\n\nexport const labels = (spacing: number, lineColor: string, items: FlowLegendItem[]): string => css`\n label: labels;\n\n position: relative;\n width: ${spacing ? 'fit-content' : '100%'};\n display: flex;\n align-items: center;\n justify-content: ${items.length > 1 ? 'space-between' : 'center'};\n gap: ${spacing ? `${spacing}px` : 'unset'};\n\n &::before {\n content: \"\";\n position: absolute;\n top: 50%;\n left: 0;\n right: 0;\n height: 1px;\n transform: translateY(-50%);\n background-color: ${lineColor || 'var(--vis-flow-legend-link-color)'};\n opacity: ${items.length > 1 ? 1 : 0};\n }\n`\n\nexport const item = css`\n label: item;\n position: relative;\n\n :first-child > span {\n padding-left: 0;\n }\n\n :last-child > span {\n padding-right: 0;\n }\n\n`\n\nexport const clickable = css`\n cursor: pointer;\n\n &:hover {\n text-decoration: underline;\n }\n`\n\nexport const label = (labelFontSize: number, labelColor: string): string => css`\n label: label;\n padding: var(--vis-flow-legend-label-padding);\n background-color: var(--vis-flow-legend-label-background);\n font-size: ${labelFontSize}px;\n color: ${labelColor || 'var(--vis-flow-legend-label-color)'};\n display: inline-table;\n text-align: center;\n`\n\nexport const arrow = (arrowColor: string, arrowSymbolYOffset: number): string => css`\n label: arrow;\n font-family: var(--vis-flow-legend-arrow-font-family, ${UNOVIS_ICON_FONT_FAMILY_DEFAULT});\n font-size: 9px;\n vertical-align: middle;\n color: ${arrowColor || 'var(--vis-flow-legend-arrow-color)'};\n background-color: var(--vis-flow-legend-label-background);\n padding: var(--vis-flow-legend-arrow-padding);\n display: inline-table;\n text-align: center;\n transform: translateY(${arrowSymbolYOffset || 0}px);\n`\n"],"names":[],"mappings":";;;;AAKO,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;;;EAItB;AAEM,MAAM,YAAY,GAAG,YAAY,CAAA,CAAA;;;;;;;;;;;;;;;;IAgBpC,qBAAqB,CAAA,CAAA,EAAI,CAAI,CAAA,EAAA,IAAI,CAAE,CAAA,CAAA;;;;;;EAMtC;AAEM,MAAM,MAAM,GAAG,CAAC,OAAe,EAAE,SAAiB,EAAE,KAAuB,KAAa,GAAG,CAAA,CAAA;;;;AAIvF,SAAA,EAAA,OAAO,GAAG,aAAa,GAAG,MAAM,CAAA;;;qBAGtB,KAAK,CAAC,MAAM,GAAG,CAAC,GAAG,eAAe,GAAG,QAAQ,CAAA;SACzD,OAAO,GAAG,CAAA,EAAG,OAAO,CAAI,EAAA,CAAA,GAAG,OAAO,CAAA;;;;;;;;;;AAUnB,sBAAA,EAAA,SAAS,IAAI,mCAAmC,CAAA;eACzD,KAAK,CAAC,MAAM,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;;EAEtC;AAEM,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;;EAYtB;AAEM,MAAM,SAAS,GAAG,GAAG,CAAA,CAAA;;;;;;EAM3B;AAEM,MAAM,KAAK,GAAG,CAAC,aAAqB,EAAE,UAAkB,KAAa,GAAG,CAAA,CAAA;;;;eAIhE,aAAa,CAAA;AACjB,SAAA,EAAA,UAAU,IAAI,oCAAoC,CAAA;;;EAG5D;AAEM,MAAM,KAAK,GAAG,CAAC,UAAkB,EAAE,kBAA0B,KAAa,GAAG,CAAA,CAAA;;0DAE1B,+BAA+B,CAAA;;;AAG9E,SAAA,EAAA,UAAU,IAAI,oCAAoC,CAAA;;;;;AAKnC,wBAAA,EAAA,kBAAkB,IAAI,CAAC,CAAA;;;;;"}
1
+ {"version":3,"file":"style.js","sources":["../../../src/components/flow-legend/style.ts"],"sourcesContent":["import { css, injectGlobal } from 'styles/emotion'\nimport { UNOVIS_ICON_FONT_FAMILY_DEFAULT } from 'styles/index'\nimport { darkThemeCssSelectors } from 'utils/theme'\nimport { FlowLegendItem } from './types'\n\nexport const root = css`\n label: flow-legend-component;\n position: relative;\n user-select: none;\n`\n\nexport const globalStyles = injectGlobal`\n :root {\n --vis-flow-legend-label-background: #ffffff;\n --vis-flow-legend-label-color: #71788a;\n --vis-flow-legend-link-color: #E5E9F7;\n --vis-flow-legend-arrow-color: #E5E9F7;\n --vis-flow-legend-label-padding: 5px 10px;\n --vis-flow-legend-arrow-padding: 0 5px;\n /* --vis-flow-legend-arrow-font-family: Undefined by default to allow proper fallback to var(DEFAULT_ICON_FONT_FAMILY)*/\n\n --vis-dark-flow-legend-label-background: #292b34;\n --vis-dark-flow-legend-label-color: #E5E9F7;\n --vis-dark-flow-legend-link-color: #71788a;\n --vis-dark-flow-legend-arrow-color: #71788a;\n }\n\n ${darkThemeCssSelectors} ${`.${root}`} {\n --vis-flow-legend-label-background: var(--vis-dark-flow-legend-label-background);\n --vis-flow-legend-label-color: var(--vis-dark-flow-legend-label-color);\n --vis-flow-legend-link-color: var(--vis-dark-flow-legend-link-color);\n --vis-flow-legend-arrow-color: var(--vis-dark-flow-legend-arrow-color);\n }\n`\n\nexport const labels = (spacing: number, lineColor: string, items: FlowLegendItem[]): string => css`\n label: labels;\n\n position: relative;\n width: ${spacing ? 'fit-content' : '100%'};\n display: flex;\n align-items: center;\n justify-content: ${items.length > 1 ? 'space-between' : 'center'};\n gap: ${spacing ? `${spacing}px` : 'unset'};\n\n &::before {\n content: \"\";\n position: absolute;\n top: 50%;\n left: 0;\n right: 0;\n height: 1px;\n transform: translateY(-50%);\n background-color: ${lineColor || 'var(--vis-flow-legend-link-color)'};\n opacity: ${items.length > 1 ? 1 : 0};\n }\n`\n\nexport const item = css`\n label: item;\n position: relative;\n\n :first-child > span {\n padding-left: 0;\n }\n\n :last-child > span {\n padding-right: 0;\n }\n\n`\n\nexport const clickable = css`\n cursor: pointer;\n\n &:hover {\n text-decoration: underline;\n }\n`\n\nexport const label = (labelFontSize: number, labelColor: string): string => css`\n label: label;\n padding: var(--vis-flow-legend-label-padding);\n background-color: var(--vis-flow-legend-label-background);\n font-size: ${labelFontSize}px;\n color: ${labelColor || 'var(--vis-flow-legend-label-color)'};\n display: inline-table;\n text-align: center;\n`\n\nexport const arrow = (arrowColor: string, arrowSymbolYOffset: number): string => css`\n label: arrow;\n font-family: var(--vis-flow-legend-arrow-font-family, ${UNOVIS_ICON_FONT_FAMILY_DEFAULT});\n font-size: 9px;\n vertical-align: middle;\n color: ${arrowColor || 'var(--vis-flow-legend-arrow-color)'};\n background-color: var(--vis-flow-legend-label-background);\n padding: var(--vis-flow-legend-arrow-padding);\n display: inline-table;\n text-align: center;\n transform: translateY(${arrowSymbolYOffset || 0}px);\n`\n"],"names":[],"mappings":";;;;AAKO,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;;;EAItB;AAEM,MAAM,YAAY,GAAG,YAAY,CAAA,CAAA;;;;;;;;;;;;;;;;IAgBpC,qBAAqB,CAAA,CAAA,EAAI,CAAI,CAAA,EAAA,IAAI,CAAE,CAAA,CAAA;;;;;;EAMtC;AAEM,MAAM,MAAM,GAAG,CAAC,OAAe,EAAE,SAAiB,EAAE,KAAuB,KAAa,GAAG,CAAA,CAAA;;;;AAIvF,SAAA,EAAA,OAAO,GAAG,aAAa,GAAG,MAAM,CAAA;;;qBAGtB,KAAK,CAAC,MAAM,GAAG,CAAC,GAAG,eAAe,GAAG,QAAQ,CAAA;SACzD,OAAO,GAAG,CAAA,EAAG,OAAO,CAAI,EAAA,CAAA,GAAG,OAAO,CAAA;;;;;;;;;;AAUnB,sBAAA,EAAA,SAAS,IAAI,mCAAmC,CAAA;eACzD,KAAK,CAAC,MAAM,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;;EAEtC;AAEM,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;;EAYtB;AAEM,MAAM,SAAS,GAAG,GAAG,CAAA,CAAA;;;;;;EAM3B;AAEM,MAAM,KAAK,GAAG,CAAC,aAAqB,EAAE,UAAkB,KAAa,GAAG,CAAA,CAAA;;;;eAIhE,aAAa,CAAA;AACjB,SAAA,EAAA,UAAU,IAAI,oCAAoC,CAAA;;;EAG5D;AAEM,MAAM,KAAK,GAAG,CAAC,UAAkB,EAAE,kBAA0B,KAAa,GAAG,CAAA,CAAA;;0DAE1B,+BAA+B,CAAA;;;AAG9E,SAAA,EAAA,UAAU,IAAI,oCAAoC,CAAA;;;;;AAKnC,wBAAA,EAAA,kBAAkB,IAAI,CAAC,CAAA;;;;;"}
@@ -1,4 +1,4 @@
1
- import { css, injectGlobal } from '@emotion/css';
1
+ import { css, injectGlobal } from '../../styles/emotion.js';
2
2
  import { darkThemeCssSelectors } from '../../utils/theme.js';
3
3
 
4
4
  const root = css `
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../src/components/free-brush/style.ts"],"sourcesContent":["import { css, injectGlobal } from '@emotion/css'\nimport { darkThemeCssSelectors } from 'utils/theme'\n\nexport const root = css`\n label: free-brush-component;\n`\n\nexport const variables = injectGlobal`\n :root {\n --vis-free-brush-selection-fill-color: #0b1640;\n --vis-free-brush-selection-fill-opacity: 0.4;\n --vis-free-brush-selection-stroke-color: #acb2b9;\n --vis-free-brush-handle-fill-color: #6d778c;\n --vis-free-brush-handle-stroke-color: none;\n\n --vis-dark-free-brush-selection-fill-color: #344174;\n --vis-dark-free-brush-selection-stroke-color: #0b1640;\n --vis-dark-free-brush-handle-fill-color: #6d778c;\n }\n\n ${darkThemeCssSelectors} ${`.${root}`} {\n --vis-free-brush-selection-fill-color: var(--vis-dark-free-brush-selection-fill-color);\n --vis-free-brush-selection-stroke-color: var(--vis-dark-free-brush-selection-stroke-color);\n --vis-free-brush-handle-fill-color: var(--vis-dark-free-brush-selection-fill-color);\n }\n`\n\nexport const brush = css`\n label: brush;\n fill: none;\n stroke: none;\n\n .selection {\n fill: var(--vis-free-brush-selection-fill-color);\n fill-opacity: var(--vis-free-brush-selection-fill-opacity);\n stroke: var(--vis-free-brush-selection-stroke-color);\n stroke-width: 0;\n stroke-opacity: 0;\n }\n\n .handle {\n fill: var(--vis-free-brush-handle-fill-color);\n stroke: var(--vis-free-brush-handle-stroke-color);\n }\n`\n\nexport const hide = css`\n .selection, .handle {\n display: none;\n }\n`\n"],"names":[],"mappings":";;;AAGO,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;AAEM,MAAM,SAAS,GAAG,YAAY,CAAA,CAAA;;;;;;;;;;;;;IAajC,qBAAqB,CAAA,CAAA,EAAI,CAAI,CAAA,EAAA,IAAI,CAAE,CAAA,CAAA;;;;;EAKtC;AAEM,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;;;;;;;EAiBvB;AAEM,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;;;;;;;"}
1
+ {"version":3,"file":"style.js","sources":["../../../src/components/free-brush/style.ts"],"sourcesContent":["import { css, injectGlobal } from 'styles/emotion'\nimport { darkThemeCssSelectors } from 'utils/theme'\n\nexport const root = css`\n label: free-brush-component;\n`\n\nexport const variables = injectGlobal`\n :root {\n --vis-free-brush-selection-fill-color: #0b1640;\n --vis-free-brush-selection-fill-opacity: 0.4;\n --vis-free-brush-selection-stroke-color: #acb2b9;\n --vis-free-brush-handle-fill-color: #6d778c;\n --vis-free-brush-handle-stroke-color: none;\n\n --vis-dark-free-brush-selection-fill-color: #344174;\n --vis-dark-free-brush-selection-stroke-color: #0b1640;\n --vis-dark-free-brush-handle-fill-color: #6d778c;\n }\n\n ${darkThemeCssSelectors} ${`.${root}`} {\n --vis-free-brush-selection-fill-color: var(--vis-dark-free-brush-selection-fill-color);\n --vis-free-brush-selection-stroke-color: var(--vis-dark-free-brush-selection-stroke-color);\n --vis-free-brush-handle-fill-color: var(--vis-dark-free-brush-selection-fill-color);\n }\n`\n\nexport const brush = css`\n label: brush;\n fill: none;\n stroke: none;\n\n .selection {\n fill: var(--vis-free-brush-selection-fill-color);\n fill-opacity: var(--vis-free-brush-selection-fill-opacity);\n stroke: var(--vis-free-brush-selection-stroke-color);\n stroke-width: 0;\n stroke-opacity: 0;\n }\n\n .handle {\n fill: var(--vis-free-brush-handle-fill-color);\n stroke: var(--vis-free-brush-handle-stroke-color);\n }\n`\n\nexport const hide = css`\n .selection, .handle {\n display: none;\n }\n`\n"],"names":[],"mappings":";;;AAGO,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;AAEM,MAAM,SAAS,GAAG,YAAY,CAAA,CAAA;;;;;;;;;;;;;IAajC,qBAAqB,CAAA,CAAA,EAAI,CAAI,CAAA,EAAA,IAAI,CAAE,CAAA,CAAA;;;;;EAKtC;AAEM,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;;;;;;;EAiBvB;AAEM,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;;;;;;;"}
@@ -1,4 +1,4 @@
1
- import { css, injectGlobal } from '@emotion/css';
1
+ import { css, injectGlobal } from '../../../../styles/emotion.js';
2
2
  import { darkThemeCssSelectors } from '../../../../utils/theme.js';
3
3
 
4
4
  const links = css `
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../../../src/components/graph/modules/link/style.ts"],"sourcesContent":["import { css, injectGlobal } from '@emotion/css'\nimport { darkThemeCssSelectors } from 'utils/theme'\n\nexport const links = css`\n label: links;\n`\n\nexport const variables = injectGlobal`\n :root {\n --vis-graph-link-stroke-color: #e6e9f3;\n --vis-graph-link-stroke-opacity: 1.0;\n --vis-graph-link-greyout-opacity: 0.3;\n --vis-graph-link-dashed-stroke-dasharray: 6 6;\n\n --vis-graph-link-label-font-size: 9pt;\n --vis-graph-link-label-background: #e6e9f3;\n --vis-graph-link-label-text-color-dark: #18181B;\n --vis-graph-link-label-text-color-bright: #fff;\n --vis-graph-link-label-text-color: var(--vis-graph-link-label-text-color-dark);\n\n --vis-graph-link-band-opacity: 0.35;\n --vis-graph-link-support-stroke-width: 10px;\n --vis-graph-link-flow-opacity: 1;\n\n --vis-dark-graph-link-stroke-color: #494b56;\n --vis-dark-graph-link-label-background: #3f3f45;\n --vis-dark-graph-link-label-text-color: var(--vis-graph-link-label-text-color-bright);\n\n\n --vis-graph-link-dominant-baseline: middle;\n }\n\n ${darkThemeCssSelectors} ${`.${links}`} {\n --vis-graph-link-stroke-color: var(--vis-dark-graph-link-stroke-color);\n --vis-graph-link-label-stroke-color: var(--vis-dark-graph-link-label-stroke-color);\n --vis-graph-link-label-text-color: var(--vis-dark-graph-link-label-text-color);\n --vis-graph-link-label-background: var(--vis-dark-graph-link-label-background);\n }\n`\n\nexport const linkSupport = css`\n label: link-support;\n\n fill: none;\n stroke-linecap: round;\n stroke-width: var(--vis-graph-link-support-stroke-width);\n stroke-opacity: 0;\n stroke: var(--vis-graph-link-stroke-color);\n transition: stroke-opacity 0.2s;\n`\n\nexport const link = css`\n label: link;\n\n fill: none;\n stroke: var(--vis-graph-link-stroke-color);\n stroke-opacity: var(--vis-graph-link-stroke-opacity);\n transition: stroke 800ms;\n stroke-linecap: round;\n pointer-events: none;\n`\n\nexport const linkDashed = css`\n label: dashed;\n\n ${`.${link}`} {\n stroke-dasharray: var(--vis-graph-link-dashed-stroke-dasharray);\n }\n`\n\nexport const linkArrow = css`\n label: link-arrow;\n fill: var(--vis-graph-link-stroke-color);\n`\n\nexport const gLink = css`\n label: g-link;\n`\n\nexport const gLinkExit = css`\n label: g-link-exit;\n pointer-events: none;\n`\n\nexport const greyedOutLink = css`\n label: greyed-out;\n opacity: var(--vis-graph-link-greyout-opacity);\n`\n\nexport const linkBand = css`\n label: link-band;\n\n stroke-opacity: var(--vis-graph-link-band-opacity);\n pointer-events: none;\n stroke: var(--vis-graph-node-stroke-color);\n fill: none;\n`\n\nexport const flowGroup = css`\n label: flow-group;\n\n pointer-events: none;\n`\n\nexport const flowCircle = css`\n label: flow-circle;\n\n fill: var(--vis-graph-link-stroke-color);\n opacity: var(--vis-graph-link-flow-opacity);\n`\n\nexport const linkLabelGroup = css`\n label: label-group;\n`\n\nexport const linkLabelBackground = css`\n label: label-background;\n\n fill: var(--vis-graph-link-label-background);\n`\n\nexport const linkLabelContent = css`\n label: label-content;\n\n font-size: var(--vis-graph-link-label-font-size);\n font-family: var(--vis-font-family);\n fill: var(--vis-graph-link-label-text-color);\n text-anchor: middle;\n dominant-baseline: var(--vis-graph-link-dominant-baseline);\n user-select: none;\n`\n"],"names":[],"mappings":";;;AAGO,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;EAEvB;AAEM,MAAM,SAAS,GAAG,YAAY,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;IAyBjC,qBAAqB,CAAA,CAAA,EAAI,CAAI,CAAA,EAAA,KAAK,CAAE,CAAA,CAAA;;;;;;EAMvC;AAEM,MAAM,WAAW,GAAG,GAAG,CAAA,CAAA;;;;;;;;;EAS7B;AAEM,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;;;;;;;;EAStB;AAEM,MAAM,UAAU,GAAG,GAAG,CAAA,CAAA;;;AAGzB,EAAA,EAAA,CAAA,CAAA,EAAI,IAAI,CAAE,CAAA,CAAA;;;EAGb;AAEM,MAAM,SAAS,GAAG,GAAG,CAAA,CAAA;;;EAG3B;AAEM,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;EAEvB;AAEM,MAAM,SAAS,GAAG,GAAG,CAAA,CAAA;;;EAG3B;AAEM,MAAM,aAAa,GAAG,GAAG,CAAA,CAAA;;;EAG/B;AAEM,MAAM,QAAQ,GAAG,GAAG,CAAA,CAAA;;;;;;;EAO1B;AAEM,MAAM,SAAS,GAAG,GAAG,CAAA,CAAA;;;;EAI3B;AAEM,MAAM,UAAU,GAAG,GAAG,CAAA,CAAA;;;;;EAK5B;AAEM,MAAM,cAAc,GAAG,GAAG,CAAA,CAAA;;EAEhC;AAEM,MAAM,mBAAmB,GAAG,GAAG,CAAA,CAAA;;;;EAIrC;AAEM,MAAM,gBAAgB,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"style.js","sources":["../../../../../src/components/graph/modules/link/style.ts"],"sourcesContent":["import { css, injectGlobal } from 'styles/emotion'\nimport { darkThemeCssSelectors } from 'utils/theme'\n\nexport const links = css`\n label: links;\n`\n\nexport const variables = injectGlobal`\n :root {\n --vis-graph-link-stroke-color: #e6e9f3;\n --vis-graph-link-stroke-opacity: 1.0;\n --vis-graph-link-greyout-opacity: 0.3;\n --vis-graph-link-dashed-stroke-dasharray: 6 6;\n\n --vis-graph-link-label-font-size: 9pt;\n --vis-graph-link-label-background: #e6e9f3;\n --vis-graph-link-label-text-color-dark: #18181B;\n --vis-graph-link-label-text-color-bright: #fff;\n --vis-graph-link-label-text-color: var(--vis-graph-link-label-text-color-dark);\n\n --vis-graph-link-band-opacity: 0.35;\n --vis-graph-link-support-stroke-width: 10px;\n --vis-graph-link-flow-opacity: 1;\n\n --vis-dark-graph-link-stroke-color: #494b56;\n --vis-dark-graph-link-label-background: #3f3f45;\n --vis-dark-graph-link-label-text-color: var(--vis-graph-link-label-text-color-bright);\n\n\n --vis-graph-link-dominant-baseline: middle;\n }\n\n ${darkThemeCssSelectors} ${`.${links}`} {\n --vis-graph-link-stroke-color: var(--vis-dark-graph-link-stroke-color);\n --vis-graph-link-label-stroke-color: var(--vis-dark-graph-link-label-stroke-color);\n --vis-graph-link-label-text-color: var(--vis-dark-graph-link-label-text-color);\n --vis-graph-link-label-background: var(--vis-dark-graph-link-label-background);\n }\n`\n\nexport const linkSupport = css`\n label: link-support;\n\n fill: none;\n stroke-linecap: round;\n stroke-width: var(--vis-graph-link-support-stroke-width);\n stroke-opacity: 0;\n stroke: var(--vis-graph-link-stroke-color);\n transition: stroke-opacity 0.2s;\n`\n\nexport const link = css`\n label: link;\n\n fill: none;\n stroke: var(--vis-graph-link-stroke-color);\n stroke-opacity: var(--vis-graph-link-stroke-opacity);\n transition: stroke 800ms;\n stroke-linecap: round;\n pointer-events: none;\n`\n\nexport const linkDashed = css`\n label: dashed;\n\n ${`.${link}`} {\n stroke-dasharray: var(--vis-graph-link-dashed-stroke-dasharray);\n }\n`\n\nexport const linkArrow = css`\n label: link-arrow;\n fill: var(--vis-graph-link-stroke-color);\n`\n\nexport const gLink = css`\n label: g-link;\n`\n\nexport const gLinkExit = css`\n label: g-link-exit;\n pointer-events: none;\n`\n\nexport const greyedOutLink = css`\n label: greyed-out;\n opacity: var(--vis-graph-link-greyout-opacity);\n`\n\nexport const linkBand = css`\n label: link-band;\n\n stroke-opacity: var(--vis-graph-link-band-opacity);\n pointer-events: none;\n stroke: var(--vis-graph-node-stroke-color);\n fill: none;\n`\n\nexport const flowGroup = css`\n label: flow-group;\n\n pointer-events: none;\n`\n\nexport const flowCircle = css`\n label: flow-circle;\n\n fill: var(--vis-graph-link-stroke-color);\n opacity: var(--vis-graph-link-flow-opacity);\n`\n\nexport const linkLabelGroup = css`\n label: label-group;\n`\n\nexport const linkLabelBackground = css`\n label: label-background;\n\n fill: var(--vis-graph-link-label-background);\n`\n\nexport const linkLabelContent = css`\n label: label-content;\n\n font-size: var(--vis-graph-link-label-font-size);\n font-family: var(--vis-font-family);\n fill: var(--vis-graph-link-label-text-color);\n text-anchor: middle;\n dominant-baseline: var(--vis-graph-link-dominant-baseline);\n user-select: none;\n`\n"],"names":[],"mappings":";;;AAGO,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;EAEvB;AAEM,MAAM,SAAS,GAAG,YAAY,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;IAyBjC,qBAAqB,CAAA,CAAA,EAAI,CAAI,CAAA,EAAA,KAAK,CAAE,CAAA,CAAA;;;;;;EAMvC;AAEM,MAAM,WAAW,GAAG,GAAG,CAAA,CAAA;;;;;;;;;EAS7B;AAEM,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;;;;;;;;EAStB;AAEM,MAAM,UAAU,GAAG,GAAG,CAAA,CAAA;;;AAGzB,EAAA,EAAA,CAAA,CAAA,EAAI,IAAI,CAAE,CAAA,CAAA;;;EAGb;AAEM,MAAM,SAAS,GAAG,GAAG,CAAA,CAAA;;;EAG3B;AAEM,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;EAEvB;AAEM,MAAM,SAAS,GAAG,GAAG,CAAA,CAAA;;;EAG3B;AAEM,MAAM,aAAa,GAAG,GAAG,CAAA,CAAA;;;EAG/B;AAEM,MAAM,QAAQ,GAAG,GAAG,CAAA,CAAA;;;;;;;EAO1B;AAEM,MAAM,SAAS,GAAG,GAAG,CAAA,CAAA;;;;EAI3B;AAEM,MAAM,UAAU,GAAG,GAAG,CAAA,CAAA;;;;;EAK5B;AAEM,MAAM,cAAc,GAAG,GAAG,CAAA,CAAA;;EAEhC;AAEM,MAAM,mBAAmB,GAAG,GAAG,CAAA,CAAA;;;;EAIrC;AAEM,MAAM,gBAAgB,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;;;"}
@@ -1,4 +1,4 @@
1
- import { css, injectGlobal } from '@emotion/css';
1
+ import { css, injectGlobal } from '../../../../styles/emotion.js';
2
2
  import { darkThemeCssSelectors } from '../../../../utils/theme.js';
3
3
 
4
4
  const nodes = css `
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../../../src/components/graph/modules/node/style.ts"],"sourcesContent":["import { css, injectGlobal } from '@emotion/css'\nimport { darkThemeCssSelectors } from 'utils/theme'\n\nexport const nodes = css`\n label: nodes;\n`\n\nexport const variables = injectGlobal`\n :root {\n /* Node Fill */\n --vis-graph-node-stroke-color: rgb(206, 211, 222);\n --vis-graph-node-fill-color: #fff;\n --vis-graph-node-gauge-color: #adb4c2;\n --vis-graph-node-selection-color: #acb3b8;\n\n --vis-dark-graph-node-stroke-color: rgba(30,30,30,.25);\n --vis-dark-graph-node-fill-color: #494b56;\n --vis-dark-graph-node-gauge-color: #989aa3;\n --vis-dark-graph-node-selection-color: #494b56;\n\n /* Node Central Icon */\n --vis-graph-node-icon-fill-color-bright: #ffffff;\n --vis-graph-node-icon-fill-color-dark: var(--vis-color-grey);\n --vis-graph-node-icon-fill-color: #9ea7b8;\n\n --vis-dark-graph-node-icon-fill-color: var(--vis-graph-node-icon-fill-color-bright);\n\n /* Node Bottom Icon */\n --vis-graph-node-bottom-icon-font-size: 14pt;\n --vis-graph-node-bottom-icon-fill-color: #a0a6ad;\n --vis-graph-node-bottom-icon-stroke-color: #fff;\n --vis-graph-node-bottom-icon-stroke-width: 2px;\n\n --vis-dark-graph-node-bottom-icon-fill-color: #a0a6ad;\n --vis-dark-graph-node-bottom-icon-stroke-color: #fff;\n\n /* Node Label */\n --vis-graph-node-label-font-size: 9pt;\n --vis-graph-node-label-background: #ffffff;\n --vis-graph-node-label-text-color: #0F1E57;\n --vis-graph-node-sublabel-text-color: #989aa3;\n --vis-graph-node-sublabel-font-size: 8pt;\n // Undefined by default to allow proper fallback to var(--vis-font-family)\n /* --vis-graph-node-label-font-family: */\n\n --vis-dark-graph-node-label-background: var(--vis-color-grey);\n --vis-dark-graph-node-label-text-color: #ffffff;\n --vis-dark-graph-node-sublabel-text-color: #989aa3;\n\n /* Node Side Labels (circular labels)*/\n --vis-graph-node-side-label-background-fill-color: #a0a9af;\n --vis-graph-node-side-label-background-stroke-color: #ffffff;\n --vis-graph-node-side-label-fill-color-bright: #ffffff;\n --vis-graph-node-side-label-fill-color-dark: #494b56;\n\n --vis-dark-graph-node-side-label-background-fill-color: #989aa3;\n --vis-dark-graph-node-side-label-background-stroke-color: var(--vis-color-grey);\n --vis-dark-graph-node-side-label-fill-color-bright: #f1f4f7;\n --vis-dark-graph-node-side-label-fill-color-dark: var(--vis-color-grey);\n\n /* Greyout */\n --vis-graph-node-greyout-opacity: 0.9;\n --vis-graph-node-greyout-filter: none;\n --vis-graph-node-greyout-color: #ebeff7;\n --vis-graph-node-icon-greyout-color: #c6cad1;\n --vis-graph-node-side-label-background-greyout-color: #f1f4f7;\n\n --vis-dark-graph-node-greyout-color: #494b56;\n --vis-dark-graph-node-icon-greyout-color: var(--vis-color-grey);\n --vis-dark-graph-node-side-label-background-greyout-color: #494B56;\n\n /* Brushed */\n --vis-graph-brushed-node-stroke-color: var(--vis-color-main);\n --vis-graph-brushed-node-label-text-color: var(--vis-color-main);\n --vis-graph-brushed-node-icon-fill-color: var(--vis-color-main);\n\n /* Misc */\n --vis-graph-node-dominant-baseline: middle;\n }\n\n ${darkThemeCssSelectors} ${`.${nodes}`} {\n --vis-graph-node-stroke-color: var(--vis-dark-graph-node-stroke-color);\n --vis-graph-node-fill-color: var(--vis-dark-graph-node-fill-color);\n --vis-graph-node-gauge-color: var(--vis-dark-graph-node-gauge-color);\n --vis-graph-node-selection-color: var(--vis-dark-graph-node-selection-color);\n\n --vis-graph-node-icon-fill-color: var(--vis-dark-graph-node-icon-fill-color);\n\n --vis-graph-node-bottom-icon-fill-color: var(--vis-dark-graph-node-bottom-icon-fill-color);\n --vis-graph-node-bottom-icon-stroke-color: var(--vis-dark-graph-node-bottom-icon-stroke-color);\n\n --vis-graph-node-label-background: var(--vis-dark-graph-node-label-background);\n --vis-graph-node-label-text-color: var(--vis-dark-graph-node-label-text-color);\n --vis-graph-node-sublabel-text-color: var(--vis-dark-graph-node-sublabel-text-color);\n\n --vis-graph-node-side-label-background-fill-color: var(--vis-dark-graph-node-side-label-background-fill-color);\n --vis-graph-node-side-label-background-stroke-color: var(--vis-dark-graph-side-label-background-stroke-color);\n --vis-graph-node-side-label-fill-color-bright: var(--vis-dark-graph-node-side-label-fill-color-bright);\n --vis-graph-node-side-label-fill-color-dark: var(vis-dark-graph-node-side-label-fill-color-dark);\n\n --vis-graph-node-greyout-color: var(--vis-dark-graph-node-greyout-color);\n --vis-graph-node-icon-greyout-color: var(--vis-dark-graph-node-icon-greyout-color);\n --vis-graph-node-side-label-background-greyout-color: var(--vis-dark-graph-node-side-label-background-greyout-color);\n }\n`\n\nexport const brushable = css`\n label: brushable;\n`\n\n\nexport const node = css`\n label: node-shape;\n\n stroke: var(--vis-graph-node-stroke-color);\n fill: var(--vis-graph-node-fill-color);\n\n :not(.${brushable}) {\n transition: .4s fill, 4s stroke;\n }\n`\n\nexport const nodeIcon = css`\n label: icon;\n\n font-family: var(--vis-graph-icon-font-family), var(--vis-font-family);\n dominant-baseline: var(--vis-graph-node-dominant-baseline);\n text-anchor: middle;\n pointer-events: none;\n fill: var(--vis-graph-node-icon-fill-color);\n\n :not(.${brushable}) {\n transition: .4s all;\n }\n`\n\nexport const nodeBottomIcon = css`\n label: node-bottom-icon;\n font-family: var(--vis-graph-icon-font-family), var(--vis-font-family);\n font-size: var(--vis-graph-node-bottom-icon-font-size);\n dominant-baseline: var(--vis-graph-node-dominant-baseline);\n text-anchor: middle;\n pointer-events: none;\n fill: var(--vis-graph-node-bottom-icon-fill-color);\n stroke: var(--vis-graph-node-bottom-icon-stroke-color);\n stroke-width: var(--vis-graph-node-bottom-icon-stroke-width);\n\n :not(.${brushable}) {\n transition: .4s all;\n }\n`\n\nexport const nodeIsDragged = css`\n label: dragged;\n`\n\nexport const label = css`\n label: label;\n\n text-anchor: middle;\n font-weight: 300;\n font-size: var(--vis-graph-node-label-font-size);\n`\n\nexport const labelBackground = css`\n label: background;\n\n opacity: 0.9;\n -webkit-backdrop-filter: blur(2px);\n backdrop-filter: blur(2px);\n fill: var(--vis-graph-node-label-background);\n`\n\nexport const labelText = css`\n label: label-text;\n`\n\nexport const labelTextContent = css`\n label: label-text-content;\n\n fill: var(--vis-graph-node-label-text-color);\n font-family: var(--vis-graph-node-label-font-family, var(--vis-font-family));\n`\n\nexport const subLabelTextContent = css`\n label: sublabel-text-content;\n\n fill: var(--vis-graph-node-sublabel-text-color);\n font-family: var(--vis-graph-node-label-font-family, var(--vis-font-family));\n font-size: var(--vis-graph-node-sublabel-font-size);\n`\n\nexport const sideLabelsGroup = css`\n label: side-labels-group;\n`\n\nexport const sideLabelBackground = css`\n label: side-label-background;\n\n stroke-opacity: 0.8;\n stroke: var(--vis-graph-node-side-label-background-stroke-color);\n fill: var(--vis-graph-node-side-label-background-fill-color);\n`\n\nexport const sideLabel = css`\n label: side-label;\n\n font-family: var(--vis-graph-icon-font-family), var(--vis-font-family);\n dominant-baseline: var(--vis-graph-node-dominant-baseline);\n text-anchor: middle;\n font-size: 16px;\n fill: var(--vis-graph-node-side-label-fill-color-bright);\n`\n\nexport const sideLabelGroup = css`\n label: side-label-group;\n cursor: default;\n`\n\nexport const gNode = css`\n label: g-node;\n\n transition: .25s opacity;\n`\n\nexport const draggable = css`\n label: draggable;\n\n &:hover {\n cursor: grab;\n }\n\n &${`.${nodeIsDragged}`} {\n cursor: grabbing;\n }\n`\n\nexport const gNodeExit = css`\n label: g-node-exit;\n pointer-events: none;\n`\n\nexport const nodeSelectionActive = css`\n label: active;\n`\n\nexport const nodeSelection = css`\n label: node-selection;\n\n fill: none;\n stroke-width: 1;\n stroke-dasharray: 3 3;\n opacity: 0;\n transition: 350ms cubic-bezier(0.165, 0.840, 0.440, 1.000);\n transform: scale(.5);\n fill: var(--vis-graph-node-selection-color);\n fill-opacity: 0.1;\n stroke: var(--vis-graph-node-selection-color);\n stroke-opacity: 0.75;\n\n &${`.${nodeSelectionActive}`} {\n opacity: 1;\n transform: scale(1.2);\n }\n`\n\nexport const nodeGauge = css`\n label: node-gauge;\n\n fill: var(--vis-graph-node-gauge-color);\n transition: .4s fill;\n`\n\nexport const nodePolygon = css`\n label: polygon;\n\n ${`.${nodeGauge}`} {\n fill-opacity: 0;\n stroke-linecap: round;\n pointer-events: none;\n }\n`\n\nexport const customNode = css`\n label: custom-node;\n\n stroke-width: 0;\n`\n\nexport const greyedOutNode = css`\n label: greyed-out;\n opacity: var(--vis-graph-node-greyout-opacity);\n filter: var(--vis-graph-node-greyout-filter);\n\n ${`.${node}`} {\n fill: var(--vis-graph-node-greyout-color) !important;\n stroke: var(--vis-graph-node-greyout-color) !important;\n }\n\n ${`.${nodeIcon}`} {\n fill: var(--vis-graph-node-icon-greyout-color) !important;\n }\n\n ${`.${nodeGauge}`} {\n fill: var(--vis-graph-node-greyout-color) !important;\n stroke: var(--vis-graph-node-greyout-color) !important;\n }\n\n ${`.${label}`} {\n opacity: 0.5;\n }\n\n ${`.${sideLabelBackground}`} {\n fill: var(--vis-graph-node-side-label-background-greyout-color) !important;\n stroke-opacity: 0.5;\n }\n\n ${`.${sideLabel}`} {\n fill: var(--vis-graph-node-side-label-fill-color-bright) !important;\n opacity: 0.25;\n }\n`\n\nexport const brushed = css`\n label: brushed-node;\n\n ${`.${node}`} {\n stroke: var(--vis-graph-brushed-node-stroke-color);\n }\n ${`.${nodeIcon}`} {\n fill: var(--vis-graph-brushed-node-icon-fill-color);\n }\n ${`.${labelTextContent}`} {\n fill: var(--vis-graph-brushed-node-label-text-color);\n }\n`\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"style.js","sources":["../../../../../src/components/graph/modules/node/style.ts"],"sourcesContent":["import { css, injectGlobal } from 'styles/emotion'\nimport { darkThemeCssSelectors } from 'utils/theme'\n\nexport const nodes = css`\n label: nodes;\n`\n\nexport const variables = injectGlobal`\n :root {\n /* Node Fill */\n --vis-graph-node-stroke-color: rgb(206, 211, 222);\n --vis-graph-node-fill-color: #fff;\n --vis-graph-node-gauge-color: #adb4c2;\n --vis-graph-node-selection-color: #acb3b8;\n\n --vis-dark-graph-node-stroke-color: rgba(30,30,30,.25);\n --vis-dark-graph-node-fill-color: #494b56;\n --vis-dark-graph-node-gauge-color: #989aa3;\n --vis-dark-graph-node-selection-color: #494b56;\n\n /* Node Central Icon */\n --vis-graph-node-icon-fill-color-bright: #ffffff;\n --vis-graph-node-icon-fill-color-dark: var(--vis-color-grey);\n --vis-graph-node-icon-fill-color: #9ea7b8;\n\n --vis-dark-graph-node-icon-fill-color: var(--vis-graph-node-icon-fill-color-bright);\n\n /* Node Bottom Icon */\n --vis-graph-node-bottom-icon-font-size: 14pt;\n --vis-graph-node-bottom-icon-fill-color: #a0a6ad;\n --vis-graph-node-bottom-icon-stroke-color: #fff;\n --vis-graph-node-bottom-icon-stroke-width: 2px;\n\n --vis-dark-graph-node-bottom-icon-fill-color: #a0a6ad;\n --vis-dark-graph-node-bottom-icon-stroke-color: #fff;\n\n /* Node Label */\n --vis-graph-node-label-font-size: 9pt;\n --vis-graph-node-label-background: #ffffff;\n --vis-graph-node-label-text-color: #0F1E57;\n --vis-graph-node-sublabel-text-color: #989aa3;\n --vis-graph-node-sublabel-font-size: 8pt;\n // Undefined by default to allow proper fallback to var(--vis-font-family)\n /* --vis-graph-node-label-font-family: */\n\n --vis-dark-graph-node-label-background: var(--vis-color-grey);\n --vis-dark-graph-node-label-text-color: #ffffff;\n --vis-dark-graph-node-sublabel-text-color: #989aa3;\n\n /* Node Side Labels (circular labels)*/\n --vis-graph-node-side-label-background-fill-color: #a0a9af;\n --vis-graph-node-side-label-background-stroke-color: #ffffff;\n --vis-graph-node-side-label-fill-color-bright: #ffffff;\n --vis-graph-node-side-label-fill-color-dark: #494b56;\n\n --vis-dark-graph-node-side-label-background-fill-color: #989aa3;\n --vis-dark-graph-node-side-label-background-stroke-color: var(--vis-color-grey);\n --vis-dark-graph-node-side-label-fill-color-bright: #f1f4f7;\n --vis-dark-graph-node-side-label-fill-color-dark: var(--vis-color-grey);\n\n /* Greyout */\n --vis-graph-node-greyout-opacity: 0.9;\n --vis-graph-node-greyout-filter: none;\n --vis-graph-node-greyout-color: #ebeff7;\n --vis-graph-node-icon-greyout-color: #c6cad1;\n --vis-graph-node-side-label-background-greyout-color: #f1f4f7;\n\n --vis-dark-graph-node-greyout-color: #494b56;\n --vis-dark-graph-node-icon-greyout-color: var(--vis-color-grey);\n --vis-dark-graph-node-side-label-background-greyout-color: #494B56;\n\n /* Brushed */\n --vis-graph-brushed-node-stroke-color: var(--vis-color-main);\n --vis-graph-brushed-node-label-text-color: var(--vis-color-main);\n --vis-graph-brushed-node-icon-fill-color: var(--vis-color-main);\n\n /* Misc */\n --vis-graph-node-dominant-baseline: middle;\n }\n\n ${darkThemeCssSelectors} ${`.${nodes}`} {\n --vis-graph-node-stroke-color: var(--vis-dark-graph-node-stroke-color);\n --vis-graph-node-fill-color: var(--vis-dark-graph-node-fill-color);\n --vis-graph-node-gauge-color: var(--vis-dark-graph-node-gauge-color);\n --vis-graph-node-selection-color: var(--vis-dark-graph-node-selection-color);\n\n --vis-graph-node-icon-fill-color: var(--vis-dark-graph-node-icon-fill-color);\n\n --vis-graph-node-bottom-icon-fill-color: var(--vis-dark-graph-node-bottom-icon-fill-color);\n --vis-graph-node-bottom-icon-stroke-color: var(--vis-dark-graph-node-bottom-icon-stroke-color);\n\n --vis-graph-node-label-background: var(--vis-dark-graph-node-label-background);\n --vis-graph-node-label-text-color: var(--vis-dark-graph-node-label-text-color);\n --vis-graph-node-sublabel-text-color: var(--vis-dark-graph-node-sublabel-text-color);\n\n --vis-graph-node-side-label-background-fill-color: var(--vis-dark-graph-node-side-label-background-fill-color);\n --vis-graph-node-side-label-background-stroke-color: var(--vis-dark-graph-side-label-background-stroke-color);\n --vis-graph-node-side-label-fill-color-bright: var(--vis-dark-graph-node-side-label-fill-color-bright);\n --vis-graph-node-side-label-fill-color-dark: var(vis-dark-graph-node-side-label-fill-color-dark);\n\n --vis-graph-node-greyout-color: var(--vis-dark-graph-node-greyout-color);\n --vis-graph-node-icon-greyout-color: var(--vis-dark-graph-node-icon-greyout-color);\n --vis-graph-node-side-label-background-greyout-color: var(--vis-dark-graph-node-side-label-background-greyout-color);\n }\n`\n\nexport const brushable = css`\n label: brushable;\n`\n\n\nexport const node = css`\n label: node-shape;\n\n stroke: var(--vis-graph-node-stroke-color);\n fill: var(--vis-graph-node-fill-color);\n\n :not(.${brushable}) {\n transition: .4s fill, 4s stroke;\n }\n`\n\nexport const nodeIcon = css`\n label: icon;\n\n font-family: var(--vis-graph-icon-font-family), var(--vis-font-family);\n dominant-baseline: var(--vis-graph-node-dominant-baseline);\n text-anchor: middle;\n pointer-events: none;\n fill: var(--vis-graph-node-icon-fill-color);\n\n :not(.${brushable}) {\n transition: .4s all;\n }\n`\n\nexport const nodeBottomIcon = css`\n label: node-bottom-icon;\n font-family: var(--vis-graph-icon-font-family), var(--vis-font-family);\n font-size: var(--vis-graph-node-bottom-icon-font-size);\n dominant-baseline: var(--vis-graph-node-dominant-baseline);\n text-anchor: middle;\n pointer-events: none;\n fill: var(--vis-graph-node-bottom-icon-fill-color);\n stroke: var(--vis-graph-node-bottom-icon-stroke-color);\n stroke-width: var(--vis-graph-node-bottom-icon-stroke-width);\n\n :not(.${brushable}) {\n transition: .4s all;\n }\n`\n\nexport const nodeIsDragged = css`\n label: dragged;\n`\n\nexport const label = css`\n label: label;\n\n text-anchor: middle;\n font-weight: 300;\n font-size: var(--vis-graph-node-label-font-size);\n`\n\nexport const labelBackground = css`\n label: background;\n\n opacity: 0.9;\n -webkit-backdrop-filter: blur(2px);\n backdrop-filter: blur(2px);\n fill: var(--vis-graph-node-label-background);\n`\n\nexport const labelText = css`\n label: label-text;\n`\n\nexport const labelTextContent = css`\n label: label-text-content;\n\n fill: var(--vis-graph-node-label-text-color);\n font-family: var(--vis-graph-node-label-font-family, var(--vis-font-family));\n`\n\nexport const subLabelTextContent = css`\n label: sublabel-text-content;\n\n fill: var(--vis-graph-node-sublabel-text-color);\n font-family: var(--vis-graph-node-label-font-family, var(--vis-font-family));\n font-size: var(--vis-graph-node-sublabel-font-size);\n`\n\nexport const sideLabelsGroup = css`\n label: side-labels-group;\n`\n\nexport const sideLabelBackground = css`\n label: side-label-background;\n\n stroke-opacity: 0.8;\n stroke: var(--vis-graph-node-side-label-background-stroke-color);\n fill: var(--vis-graph-node-side-label-background-fill-color);\n`\n\nexport const sideLabel = css`\n label: side-label;\n\n font-family: var(--vis-graph-icon-font-family), var(--vis-font-family);\n dominant-baseline: var(--vis-graph-node-dominant-baseline);\n text-anchor: middle;\n font-size: 16px;\n fill: var(--vis-graph-node-side-label-fill-color-bright);\n`\n\nexport const sideLabelGroup = css`\n label: side-label-group;\n cursor: default;\n`\n\nexport const gNode = css`\n label: g-node;\n\n transition: .25s opacity;\n`\n\nexport const draggable = css`\n label: draggable;\n\n &:hover {\n cursor: grab;\n }\n\n &${`.${nodeIsDragged}`} {\n cursor: grabbing;\n }\n`\n\nexport const gNodeExit = css`\n label: g-node-exit;\n pointer-events: none;\n`\n\nexport const nodeSelectionActive = css`\n label: active;\n`\n\nexport const nodeSelection = css`\n label: node-selection;\n\n fill: none;\n stroke-width: 1;\n stroke-dasharray: 3 3;\n opacity: 0;\n transition: 350ms cubic-bezier(0.165, 0.840, 0.440, 1.000);\n transform: scale(.5);\n fill: var(--vis-graph-node-selection-color);\n fill-opacity: 0.1;\n stroke: var(--vis-graph-node-selection-color);\n stroke-opacity: 0.75;\n\n &${`.${nodeSelectionActive}`} {\n opacity: 1;\n transform: scale(1.2);\n }\n`\n\nexport const nodeGauge = css`\n label: node-gauge;\n\n fill: var(--vis-graph-node-gauge-color);\n transition: .4s fill;\n`\n\nexport const nodePolygon = css`\n label: polygon;\n\n ${`.${nodeGauge}`} {\n fill-opacity: 0;\n stroke-linecap: round;\n pointer-events: none;\n }\n`\n\nexport const customNode = css`\n label: custom-node;\n\n stroke-width: 0;\n`\n\nexport const greyedOutNode = css`\n label: greyed-out;\n opacity: var(--vis-graph-node-greyout-opacity);\n filter: var(--vis-graph-node-greyout-filter);\n\n ${`.${node}`} {\n fill: var(--vis-graph-node-greyout-color) !important;\n stroke: var(--vis-graph-node-greyout-color) !important;\n }\n\n ${`.${nodeIcon}`} {\n fill: var(--vis-graph-node-icon-greyout-color) !important;\n }\n\n ${`.${nodeGauge}`} {\n fill: var(--vis-graph-node-greyout-color) !important;\n stroke: var(--vis-graph-node-greyout-color) !important;\n }\n\n ${`.${label}`} {\n opacity: 0.5;\n }\n\n ${`.${sideLabelBackground}`} {\n fill: var(--vis-graph-node-side-label-background-greyout-color) !important;\n stroke-opacity: 0.5;\n }\n\n ${`.${sideLabel}`} {\n fill: var(--vis-graph-node-side-label-fill-color-bright) !important;\n opacity: 0.25;\n }\n`\n\nexport const brushed = css`\n label: brushed-node;\n\n ${`.${node}`} {\n stroke: var(--vis-graph-brushed-node-stroke-color);\n }\n ${`.${nodeIcon}`} {\n fill: var(--vis-graph-brushed-node-icon-fill-color);\n }\n ${`.${labelTextContent}`} {\n fill: var(--vis-graph-brushed-node-label-text-color);\n }\n`\n"],"names":[],"mappings":"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"}
@@ -1,4 +1,4 @@
1
- import { css, injectGlobal } from '@emotion/css';
1
+ import { css, injectGlobal } from '../../../../styles/emotion.js';
2
2
  import { darkThemeCssSelectors } from '../../../../utils/theme.js';
3
3
 
4
4
  const panels = css `
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../../../src/components/graph/modules/panel/style.ts"],"sourcesContent":["import { css, injectGlobal } from '@emotion/css'\nimport { darkThemeCssSelectors } from 'utils/theme'\n\nexport const panels = css`\n label: panels;\n`\n\nexport const variables = injectGlobal`\n :root {\n --vis-graph-panel-border-color: #E6E9F3;\n --vis-graph-panel-border-opacity: 0.9;\n --vis-graph-panel-fill-color: #ffffff;\n\n --vis-graph-panel-label-color: #6c778c;\n --vis-graph-panel-label-background: #ffffff;\n\n // Undefined by default to allow proper fallback to var(--vis-font-family)\n /* --vis-graph-panel-label-font-family: */\n --vis-graph-panel-label-font-size: 10pt;\n --vis-graph-panel-label-font-weight: 300;\n\n --vis-graph-panel-dashed-outline-color: #b7b7b7;\n\n --vis-graph-panel-side-icon-symbol-color: #9ea7b8;\n --vis-graph-panel-side-icon-shape-fill-color: #ffffff;\n\n --vis-dark-graph-panel-border-color: var(--vis-color-grey);\n --vis-dark-graph-panel-fill-color: #292b34;\n --vis-dark-graph-panel-label-color: #E6E9F3;\n --vis-dark-graph-panel-label-background: var(--vis-color-grey);\n --vis-dark-graph-panel-side-icon-symbol-color: #ffffff;\n --vis-dark-graph-panel-side-icon-shape-fill-color: #6c778c;\n --vis-dark-graph-panel-border-color: #a0a6ad;\n }\n\n ${darkThemeCssSelectors} ${`.${panels}`} {\n --vis-graph-panel-border-color: var(--vis-dark-graph-panel-border-color);\n --vis-graph-panel-fill-color: var(--vis-dark-graph-panel-fill-color);\n --vis-graph-panel-label-color: var(--vis-dark-graph-panel-label-color);\n --vis-graph-panel-label-background: var(--vis-dark-graph-panel-label-background);\n --vis-graph-panel-side-icon-symbol-color: var(--vis-dark-graph-panel-side-icon-symbol-color);\n --vis-graph-panel-side-icon-shape-fill-color: var(--vis-dark-graph-panel-side-icon-shape-fill-color);\n --vis-graph-panel-border-color: var(--vis-dark-graph-panel-border-color);\n }\n`\n\nexport const gPanel = css`\n label: g-panel;\n`\n\nexport const panel = css`\n label: panel;\n\n stroke: var(--vis-graph-panel-border-color);\n stroke-opacity: var(--vis-graph-panel-border-opacity);\n fill: var(--vis-graph-panel-fill-color);\n`\n\nexport const label = css`\n label: label;\n\n fill: var(--vis-graph-panel-label-color);\n`\n\nexport const background = css`\n label: background;\n\n opacity: 0.9;\n -webkit-backdrop-filter: blur(2px);\n backdrop-filter: blur(2px);\n fill: var(--vis-graph-panel-label-background);\n stroke: none;\n`\n\nexport const labelText = css`\n label: label-text;\n\n text-anchor: middle;\n font-size: var(--vis-graph-panel-label-font-size);\n font-weight: var(--vis-graph-panel-label-font-weight);;\n cursor: default;\n stroke: none;\n font-family: var(--vis-graph-panel-label-font-family, var(--vis-font-family));\n`\n\nexport const panelSelectionActive = css`\n label: active;\n`\n\nexport const panelSelection = css`\n label: panel-selection-outline;\n\n opacity: 0;\n stroke-width: 1;\n stroke-dasharray: 3 3;\n fill: var(--vis-graph-node-selection-color);\n fill-opacity: 0.1;\n stroke: var(--vis-graph-panel-dashed-outline-color);\n stroke-opacity: 0;\n\n &${`.${panelSelectionActive}`} {\n opacity: 1;\n stroke-opacity: 0.75;\n }\n`\n\nexport const greyout = css`\n label: greyout;\n opacity: 0.4;\n`\n\nexport const sideIconGroup = css`\n label: side-icon-group;\n`\n\nexport const sideIconShape = css`\n label: side-icon-shape;\n\n fill: var(--vis-graph-panel-side-icon-shape-fill-color);\n stroke-width: 2px;\n`\n\nexport const customSideIcon = css`\n label: side-icon-custom;\n`\n\nexport const sideIconSymbol = css`\n label: side-label-icon-text;\n font-family: var(--vis-graph-icon-font-family), var(--vis-font-family);\n fill: var(--vis-graph-panel-side-icon-symbol-color);\n stroke: none;\n dominant-baseline: middle;\n text-anchor: middle;\n pointer-events: none;\n cursor: default;\n`\n"],"names":[],"mappings":";;;AAGO,MAAM,MAAM,GAAG,GAAG,CAAA,CAAA;;EAExB;AAEM,MAAM,SAAS,GAAG,YAAY,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;IA4BjC,qBAAqB,CAAA,CAAA,EAAI,CAAI,CAAA,EAAA,MAAM,CAAE,CAAA,CAAA;;;;;;;;;EASxC;AAEM,MAAM,MAAM,GAAG,GAAG,CAAA,CAAA;;EAExB;AAEM,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;;;;;EAMvB;AAEM,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;;;EAIvB;AAEM,MAAM,UAAU,GAAG,GAAG,CAAA,CAAA;;;;;;;;EAQ5B;AAEM,MAAM,SAAS,GAAG,GAAG,CAAA,CAAA;;;;;;;;;EAS3B;AAEM,MAAM,oBAAoB,GAAG,GAAG,CAAA,CAAA;;EAEtC;AAEM,MAAM,cAAc,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;AAW5B,GAAA,EAAA,CAAA,CAAA,EAAI,oBAAoB,CAAE,CAAA,CAAA;;;;EAI9B;AAEM,MAAM,OAAO,GAAG,GAAG,CAAA,CAAA;;;EAGzB;AAEM,MAAM,aAAa,GAAG,GAAG,CAAA,CAAA;;EAE/B;AAEM,MAAM,aAAa,GAAG,GAAG,CAAA,CAAA;;;;;EAK/B;AAEM,MAAM,cAAc,GAAG,GAAG,CAAA,CAAA;;EAEhC;AAEM,MAAM,cAAc,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"style.js","sources":["../../../../../src/components/graph/modules/panel/style.ts"],"sourcesContent":["import { css, injectGlobal } from 'styles/emotion'\nimport { darkThemeCssSelectors } from 'utils/theme'\n\nexport const panels = css`\n label: panels;\n`\n\nexport const variables = injectGlobal`\n :root {\n --vis-graph-panel-border-color: #E6E9F3;\n --vis-graph-panel-border-opacity: 0.9;\n --vis-graph-panel-fill-color: #ffffff;\n\n --vis-graph-panel-label-color: #6c778c;\n --vis-graph-panel-label-background: #ffffff;\n\n // Undefined by default to allow proper fallback to var(--vis-font-family)\n /* --vis-graph-panel-label-font-family: */\n --vis-graph-panel-label-font-size: 10pt;\n --vis-graph-panel-label-font-weight: 300;\n\n --vis-graph-panel-dashed-outline-color: #b7b7b7;\n\n --vis-graph-panel-side-icon-symbol-color: #9ea7b8;\n --vis-graph-panel-side-icon-shape-fill-color: #ffffff;\n\n --vis-dark-graph-panel-border-color: var(--vis-color-grey);\n --vis-dark-graph-panel-fill-color: #292b34;\n --vis-dark-graph-panel-label-color: #E6E9F3;\n --vis-dark-graph-panel-label-background: var(--vis-color-grey);\n --vis-dark-graph-panel-side-icon-symbol-color: #ffffff;\n --vis-dark-graph-panel-side-icon-shape-fill-color: #6c778c;\n --vis-dark-graph-panel-border-color: #a0a6ad;\n }\n\n ${darkThemeCssSelectors} ${`.${panels}`} {\n --vis-graph-panel-border-color: var(--vis-dark-graph-panel-border-color);\n --vis-graph-panel-fill-color: var(--vis-dark-graph-panel-fill-color);\n --vis-graph-panel-label-color: var(--vis-dark-graph-panel-label-color);\n --vis-graph-panel-label-background: var(--vis-dark-graph-panel-label-background);\n --vis-graph-panel-side-icon-symbol-color: var(--vis-dark-graph-panel-side-icon-symbol-color);\n --vis-graph-panel-side-icon-shape-fill-color: var(--vis-dark-graph-panel-side-icon-shape-fill-color);\n --vis-graph-panel-border-color: var(--vis-dark-graph-panel-border-color);\n }\n`\n\nexport const gPanel = css`\n label: g-panel;\n`\n\nexport const panel = css`\n label: panel;\n\n stroke: var(--vis-graph-panel-border-color);\n stroke-opacity: var(--vis-graph-panel-border-opacity);\n fill: var(--vis-graph-panel-fill-color);\n`\n\nexport const label = css`\n label: label;\n\n fill: var(--vis-graph-panel-label-color);\n`\n\nexport const background = css`\n label: background;\n\n opacity: 0.9;\n -webkit-backdrop-filter: blur(2px);\n backdrop-filter: blur(2px);\n fill: var(--vis-graph-panel-label-background);\n stroke: none;\n`\n\nexport const labelText = css`\n label: label-text;\n\n text-anchor: middle;\n font-size: var(--vis-graph-panel-label-font-size);\n font-weight: var(--vis-graph-panel-label-font-weight);;\n cursor: default;\n stroke: none;\n font-family: var(--vis-graph-panel-label-font-family, var(--vis-font-family));\n`\n\nexport const panelSelectionActive = css`\n label: active;\n`\n\nexport const panelSelection = css`\n label: panel-selection-outline;\n\n opacity: 0;\n stroke-width: 1;\n stroke-dasharray: 3 3;\n fill: var(--vis-graph-node-selection-color);\n fill-opacity: 0.1;\n stroke: var(--vis-graph-panel-dashed-outline-color);\n stroke-opacity: 0;\n\n &${`.${panelSelectionActive}`} {\n opacity: 1;\n stroke-opacity: 0.75;\n }\n`\n\nexport const greyout = css`\n label: greyout;\n opacity: 0.4;\n`\n\nexport const sideIconGroup = css`\n label: side-icon-group;\n`\n\nexport const sideIconShape = css`\n label: side-icon-shape;\n\n fill: var(--vis-graph-panel-side-icon-shape-fill-color);\n stroke-width: 2px;\n`\n\nexport const customSideIcon = css`\n label: side-icon-custom;\n`\n\nexport const sideIconSymbol = css`\n label: side-label-icon-text;\n font-family: var(--vis-graph-icon-font-family), var(--vis-font-family);\n fill: var(--vis-graph-panel-side-icon-symbol-color);\n stroke: none;\n dominant-baseline: middle;\n text-anchor: middle;\n pointer-events: none;\n cursor: default;\n`\n"],"names":[],"mappings":";;;AAGO,MAAM,MAAM,GAAG,GAAG,CAAA,CAAA;;EAExB;AAEM,MAAM,SAAS,GAAG,YAAY,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;IA4BjC,qBAAqB,CAAA,CAAA,EAAI,CAAI,CAAA,EAAA,MAAM,CAAE,CAAA,CAAA;;;;;;;;;EASxC;AAEM,MAAM,MAAM,GAAG,GAAG,CAAA,CAAA;;EAExB;AAEM,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;;;;;EAMvB;AAEM,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;;;EAIvB;AAEM,MAAM,UAAU,GAAG,GAAG,CAAA,CAAA;;;;;;;;EAQ5B;AAEM,MAAM,SAAS,GAAG,GAAG,CAAA,CAAA;;;;;;;;;EAS3B;AAEM,MAAM,oBAAoB,GAAG,GAAG,CAAA,CAAA;;EAEtC;AAEM,MAAM,cAAc,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;AAW5B,GAAA,EAAA,CAAA,CAAA,EAAI,oBAAoB,CAAE,CAAA,CAAA;;;;EAI9B;AAEM,MAAM,OAAO,GAAG,GAAG,CAAA,CAAA;;;EAGzB;AAEM,MAAM,aAAa,GAAG,GAAG,CAAA,CAAA;;EAE/B;AAEM,MAAM,aAAa,GAAG,GAAG,CAAA,CAAA;;;;;EAK/B;AAEM,MAAM,cAAc,GAAG,GAAG,CAAA,CAAA;;EAEhC;AAEM,MAAM,cAAc,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;;;"}
@@ -1,4 +1,4 @@
1
- import { injectGlobal, css } from '@emotion/css';
1
+ import { injectGlobal, css } from '../../styles/emotion.js';
2
2
  import { UNOVIS_ICON_FONT_FAMILY_DEFAULT } from '../../styles/index.js';
3
3
  import { label, nodeGauge, node, nodeSelection, nodeSelectionActive } from './modules/node/style.js';
4
4
  import { gLink, flowCircle } from './modules/link/style.js';
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../src/components/graph/style.ts"],"sourcesContent":["import { css, injectGlobal } from '@emotion/css'\nimport { UNOVIS_ICON_FONT_FAMILY_DEFAULT } from 'styles/index'\n\n// Nodes\nimport * as nodeSelectors from './modules/node/style'\n\n// Links\nimport * as linkSelectors from './modules/link/style'\n\nexport const variables = injectGlobal`\n :root {\n --vis-graph-icon-font-family: ${UNOVIS_ICON_FONT_FAMILY_DEFAULT};\n\n /* Brush */\n --vis-graph-brush-selection-opacity: 0.2;\n }\n`\n\n// General\nexport const root = css`\n label: graph-component;\n`\n\nexport const background = css`\n label: background;\n`\n\nexport const graphGroup = css`\n label: graph-group;\n`\n\nexport const brush = css`\n label: brush;\n\n :not(.active) {\n display: none;\n }\n\n .active {\n .selection {\n fill-opacity: 0;\n stroke: none;\n }\n\n .handle {\n display: none;\n }\n }\n`\n\nexport const zoomOutLevel1 = css`\n label: zoom-out-level-1;\n\n ${`.${nodeSelectors.label}`} {\n rect {\n stroke: none;\n }\n }\n`\n\nexport const zoomOutLevel2 = css`\n label: zoom-out-level-2;\n\n ${`.${nodeSelectors.label}`} {\n visibility: visible;\n }\n\n ${`.${nodeSelectors.nodeGauge}`} {\n visibility: visible;\n }\n\n ${`.${nodeSelectors.node}`} {\n stroke-width: 4px;\n }\n\n rect${`.${nodeSelectors.node}`} {\n stroke-width: 2px;\n }\n\n ${`.${linkSelectors.gLink}`} {\n animation: none;\n stroke-dasharray: none;\n }\n\n ${`.${linkSelectors.flowCircle}`} {\n display: none;\n }\n\n ${`.${nodeSelectors.nodeSelection}`} {\n &${`.${nodeSelectors.nodeSelectionActive}`} {\n transform: scale(1.15);\n }\n }\n`\n"],"names":["nodeSelectors.label","nodeSelectors.nodeGauge","nodeSelectors.node","linkSelectors.gLink","linkSelectors.flowCircle","nodeSelectors.nodeSelection","nodeSelectors.nodeSelectionActive"],"mappings":";;;;;AASO,MAAM,SAAS,GAAG,YAAY,CAAA,CAAA;;oCAED,+BAA+B,CAAA;;;;;EAKlE;AAED;AACO,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;AAEM,MAAM,UAAU,GAAG,GAAG,CAAA,CAAA;;EAE5B;AAEM,MAAM,UAAU,GAAG,GAAG,CAAA,CAAA;;EAE5B;AAEM,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;;;;;;;EAiBvB;AAEM,MAAM,aAAa,GAAG,GAAG,CAAA,CAAA;;;IAG5B,CAAI,CAAA,EAAAA,KAAmB,CAAE,CAAA,CAAA;;;;;EAK5B;AAEM,MAAM,aAAa,GAAG,GAAG,CAAA,CAAA;;;IAG5B,CAAI,CAAA,EAAAA,KAAmB,CAAE,CAAA,CAAA;;;;IAIzB,CAAI,CAAA,EAAAC,SAAuB,CAAE,CAAA,CAAA;;;;IAI7B,CAAI,CAAA,EAAAC,IAAkB,CAAE,CAAA,CAAA;;;;QAIpB,CAAI,CAAA,EAAAA,IAAkB,CAAE,CAAA,CAAA;;;;IAI5B,CAAI,CAAA,EAAAC,KAAmB,CAAE,CAAA,CAAA;;;;;IAKzB,CAAI,CAAA,EAAAC,UAAwB,CAAE,CAAA,CAAA;;;;IAI9B,CAAI,CAAA,EAAAC,aAA2B,CAAE,CAAA,CAAA;OAC9B,CAAI,CAAA,EAAAC,mBAAiC,CAAE,CAAA,CAAA;;;;;;;;"}
1
+ {"version":3,"file":"style.js","sources":["../../../src/components/graph/style.ts"],"sourcesContent":["import { css, injectGlobal } from 'styles/emotion'\nimport { UNOVIS_ICON_FONT_FAMILY_DEFAULT } from 'styles/index'\n\n// Nodes\nimport * as nodeSelectors from './modules/node/style'\n\n// Links\nimport * as linkSelectors from './modules/link/style'\n\nexport const variables = injectGlobal`\n :root {\n --vis-graph-icon-font-family: ${UNOVIS_ICON_FONT_FAMILY_DEFAULT};\n\n /* Brush */\n --vis-graph-brush-selection-opacity: 0.2;\n }\n`\n\n// General\nexport const root = css`\n label: graph-component;\n`\n\nexport const background = css`\n label: background;\n`\n\nexport const graphGroup = css`\n label: graph-group;\n`\n\nexport const brush = css`\n label: brush;\n\n :not(.active) {\n display: none;\n }\n\n .active {\n .selection {\n fill-opacity: 0;\n stroke: none;\n }\n\n .handle {\n display: none;\n }\n }\n`\n\nexport const zoomOutLevel1 = css`\n label: zoom-out-level-1;\n\n ${`.${nodeSelectors.label}`} {\n rect {\n stroke: none;\n }\n }\n`\n\nexport const zoomOutLevel2 = css`\n label: zoom-out-level-2;\n\n ${`.${nodeSelectors.label}`} {\n visibility: visible;\n }\n\n ${`.${nodeSelectors.nodeGauge}`} {\n visibility: visible;\n }\n\n ${`.${nodeSelectors.node}`} {\n stroke-width: 4px;\n }\n\n rect${`.${nodeSelectors.node}`} {\n stroke-width: 2px;\n }\n\n ${`.${linkSelectors.gLink}`} {\n animation: none;\n stroke-dasharray: none;\n }\n\n ${`.${linkSelectors.flowCircle}`} {\n display: none;\n }\n\n ${`.${nodeSelectors.nodeSelection}`} {\n &${`.${nodeSelectors.nodeSelectionActive}`} {\n transform: scale(1.15);\n }\n }\n`\n"],"names":["nodeSelectors.label","nodeSelectors.nodeGauge","nodeSelectors.node","linkSelectors.gLink","linkSelectors.flowCircle","nodeSelectors.nodeSelection","nodeSelectors.nodeSelectionActive"],"mappings":";;;;;AASO,MAAM,SAAS,GAAG,YAAY,CAAA,CAAA;;oCAED,+BAA+B,CAAA;;;;;EAKlE;AAED;AACO,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;AAEM,MAAM,UAAU,GAAG,GAAG,CAAA,CAAA;;EAE5B;AAEM,MAAM,UAAU,GAAG,GAAG,CAAA,CAAA;;EAE5B;AAEM,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;;;;;;;EAiBvB;AAEM,MAAM,aAAa,GAAG,GAAG,CAAA,CAAA;;;IAG5B,CAAI,CAAA,EAAAA,KAAmB,CAAE,CAAA,CAAA;;;;;EAK5B;AAEM,MAAM,aAAa,GAAG,GAAG,CAAA,CAAA;;;IAG5B,CAAI,CAAA,EAAAA,KAAmB,CAAE,CAAA,CAAA;;;;IAIzB,CAAI,CAAA,EAAAC,SAAuB,CAAE,CAAA,CAAA;;;;IAI7B,CAAI,CAAA,EAAAC,IAAkB,CAAE,CAAA,CAAA;;;;QAIpB,CAAI,CAAA,EAAAA,IAAkB,CAAE,CAAA,CAAA;;;;IAI5B,CAAI,CAAA,EAAAC,KAAmB,CAAE,CAAA,CAAA;;;;;IAKzB,CAAI,CAAA,EAAAC,UAAwB,CAAE,CAAA,CAAA;;;;IAI9B,CAAI,CAAA,EAAAC,aAA2B,CAAE,CAAA,CAAA;OAC9B,CAAI,CAAA,EAAAC,mBAAiC,CAAE,CAAA,CAAA;;;;;;;;"}
@@ -1,4 +1,4 @@
1
- import { css, injectGlobal } from '@emotion/css';
1
+ import { css, injectGlobal } from '../../styles/emotion.js';
2
2
  import { darkThemeCssSelectors } from '../../utils/theme.js';
3
3
 
4
4
  const root = css `
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../src/components/grouped-bar/style.ts"],"sourcesContent":["import { css, injectGlobal } from '@emotion/css'\nimport { darkThemeCssSelectors } from 'utils/theme'\n\nexport const root = css`\n label: grouped-bar-component;\n`\n\nexport const globalStyles = injectGlobal`\n :root {\n --vis-grouped-bar-cursor: default;\n --vis-grouped-bar-fill-color: var(--vis-color-main);\n --vis-grouped-bar-stroke-color: none;\n --vis-grouped-bar-stroke-width: 0px;\n --vis-grouped-bar-hover-stroke-width: 1px;\n --vis-grouped-bar-hover-stroke-color: none;\n\n\n /* Dark Theme */\n --vis-dark-grouped-bar-stroke-color: none;\n }\n\n ${darkThemeCssSelectors} ${`.${root}`} {\n --vis-grouped-bar-stroke-color: var(--vis-dark-grouped-bar-stroke-color);\n }\n`\n\nexport const bar = css`\n label: bar;\n fill: var(--vis-grouped-bar-fill-color);\n stroke: var(--vis-grouped-bar-stroke-color);\n stroke-width: var(--vis-grouped-bar-stroke-width);\n cursor: var(--vis-grouped-bar-cursor);\n\n &:hover {\n stroke-width: var(--vis-grouped-bar-hover-stroke-width);\n stroke: var(--vis-grouped-bar-hover-stroke-color);\n }\n`\n\nexport const barGroup = css`\n label: barGroup;\n`\n\nexport const barGroupExit = css`\n label: barGroupExit;\n`\n"],"names":[],"mappings":";;;AAGO,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;AAEM,MAAM,YAAY,GAAG,YAAY,CAAA,CAAA;;;;;;;;;;;;;;IAcpC,qBAAqB,CAAA,CAAA,EAAI,CAAI,CAAA,EAAA,IAAI,CAAE,CAAA,CAAA;;;EAGtC;AAEM,MAAM,GAAG,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;EAWrB;AAEM,MAAM,QAAQ,GAAG,GAAG,CAAA,CAAA;;EAE1B;AAEM,MAAM,YAAY,GAAG,GAAG,CAAA,CAAA;;;;;;"}
1
+ {"version":3,"file":"style.js","sources":["../../../src/components/grouped-bar/style.ts"],"sourcesContent":["import { css, injectGlobal } from 'styles/emotion'\nimport { darkThemeCssSelectors } from 'utils/theme'\n\nexport const root = css`\n label: grouped-bar-component;\n`\n\nexport const globalStyles = injectGlobal`\n :root {\n --vis-grouped-bar-cursor: default;\n --vis-grouped-bar-fill-color: var(--vis-color-main);\n --vis-grouped-bar-stroke-color: none;\n --vis-grouped-bar-stroke-width: 0px;\n --vis-grouped-bar-hover-stroke-width: 1px;\n --vis-grouped-bar-hover-stroke-color: none;\n\n\n /* Dark Theme */\n --vis-dark-grouped-bar-stroke-color: none;\n }\n\n ${darkThemeCssSelectors} ${`.${root}`} {\n --vis-grouped-bar-stroke-color: var(--vis-dark-grouped-bar-stroke-color);\n }\n`\n\nexport const bar = css`\n label: bar;\n fill: var(--vis-grouped-bar-fill-color);\n stroke: var(--vis-grouped-bar-stroke-color);\n stroke-width: var(--vis-grouped-bar-stroke-width);\n cursor: var(--vis-grouped-bar-cursor);\n\n &:hover {\n stroke-width: var(--vis-grouped-bar-hover-stroke-width);\n stroke: var(--vis-grouped-bar-hover-stroke-color);\n }\n`\n\nexport const barGroup = css`\n label: barGroup;\n`\n\nexport const barGroupExit = css`\n label: barGroupExit;\n`\n"],"names":[],"mappings":";;;AAGO,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;AAEM,MAAM,YAAY,GAAG,YAAY,CAAA,CAAA;;;;;;;;;;;;;;IAcpC,qBAAqB,CAAA,CAAA,EAAI,CAAI,CAAA,EAAA,IAAI,CAAE,CAAA,CAAA;;;EAGtC;AAEM,MAAM,GAAG,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;EAWrB;AAEM,MAAM,QAAQ,GAAG,GAAG,CAAA,CAAA;;EAE1B;AAEM,MAAM,YAAY,GAAG,GAAG,CAAA,CAAA;;;;;;"}
@@ -1,4 +1,4 @@
1
- import { injectGlobal } from '@emotion/css';
1
+ import { injectGlobal } from '../../../styles/emotion.js';
2
2
  import { isObject } from '../../../utils/data.js';
3
3
  import { MaplibreGLLayer } from './leaflet-maplibre-gl.js';
4
4
  import mapLibreStyles from './maplibre-gl.css.js';
@@ -1 +1 @@
1
- {"version":3,"file":"mapboxgl-layer.js","sources":["../../../../src/components/leaflet-map/renderer/mapboxgl-layer.ts"],"sourcesContent":["import type L from 'leaflet'\nimport type Maplibre from 'maplibre-gl'\nimport type { Map } from 'maplibre-gl'\n\nimport { injectGlobal } from '@emotion/css'\n\n// Utils\nimport { isObject } from 'utils/data'\n\n// Types\nimport { GenericDataRecord } from 'types/data'\n\n// Config\nimport { LeafletMapConfigInterface } from '../config'\nimport { MapLibreStyleSpecs } from './map-style'\n// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-ignore\nimport { MaplibreGLLayer } from './leaflet-maplibre-gl'\n\n// Inject MapLibreGL global style\n// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-ignore\nimport mapLibreStyles from './maplibre-gl.css.js'\ninjectGlobal(mapLibreStyles)\n\nexport function getMaplibreGLLayer<Datum extends GenericDataRecord> (\n config: LeafletMapConfigInterface<Datum>,\n leaflet: typeof L,\n maplibre: typeof Maplibre\n): L.Layer & { getMaplibreMap(): Map } {\n const { accessToken, style } = config\n\n if (isObject(style) && !(style as MapLibreStyleSpecs).glyphs) {\n console.warn('Unovis | Leaflet Map: Glyphs URL is required in order to show the map. Set `mapboxglGlyphs` URL in the style settings')\n return\n }\n\n if (isObject(style) && !(style as MapLibreStyleSpecs).sources) {\n console.warn('Unovis | Leaflet Map: Sources settings are required in order to show map. Set the `sources` property in the style settings')\n return\n }\n\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n const layer = MaplibreGLLayer(leaflet, maplibre, {\n style: style,\n accessToken: accessToken || 'not-needed',\n })\n\n return layer\n}\n"],"names":[],"mappings":";;;;;AAuBA,YAAY,CAAC,cAAc,CAAC,CAAA;SAEZ,kBAAkB,CAChC,MAAwC,EACxC,OAAiB,EACjB,QAAyB,EAAA;AAEzB,IAAA,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,GAAG,MAAM,CAAA;IAErC,IAAI,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAE,KAA4B,CAAC,MAAM,EAAE;AAC5D,QAAA,OAAO,CAAC,IAAI,CAAC,uHAAuH,CAAC,CAAA;QACrI,OAAM;AACP,KAAA;IAED,IAAI,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAE,KAA4B,CAAC,OAAO,EAAE;AAC7D,QAAA,OAAO,CAAC,IAAI,CAAC,4HAA4H,CAAC,CAAA;QAC1I,OAAM;AACP,KAAA;;;AAID,IAAA,MAAM,KAAK,GAAG,eAAe,CAAC,OAAO,EAAE,QAAQ,EAAE;AAC/C,QAAA,KAAK,EAAE,KAAK;QACZ,WAAW,EAAE,WAAW,IAAI,YAAY;AACzC,KAAA,CAAC,CAAA;AAEF,IAAA,OAAO,KAAK,CAAA;AACd;;;;"}
1
+ {"version":3,"file":"mapboxgl-layer.js","sources":["../../../../src/components/leaflet-map/renderer/mapboxgl-layer.ts"],"sourcesContent":["import type L from 'leaflet'\nimport type Maplibre from 'maplibre-gl'\nimport type { Map } from 'maplibre-gl'\n\nimport { injectGlobal } from 'styles/emotion'\n\n// Utils\nimport { isObject } from 'utils/data'\n\n// Types\nimport { GenericDataRecord } from 'types/data'\n\n// Config\nimport { LeafletMapConfigInterface } from '../config'\nimport { MapLibreStyleSpecs } from './map-style'\n// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-ignore\nimport { MaplibreGLLayer } from './leaflet-maplibre-gl'\n\n// Inject MapLibreGL global style\n// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-ignore\nimport mapLibreStyles from './maplibre-gl.css.js'\ninjectGlobal(mapLibreStyles)\n\nexport function getMaplibreGLLayer<Datum extends GenericDataRecord> (\n config: LeafletMapConfigInterface<Datum>,\n leaflet: typeof L,\n maplibre: typeof Maplibre\n): L.Layer & { getMaplibreMap(): Map } {\n const { accessToken, style } = config\n\n if (isObject(style) && !(style as MapLibreStyleSpecs).glyphs) {\n console.warn('Unovis | Leaflet Map: Glyphs URL is required in order to show the map. Set `mapboxglGlyphs` URL in the style settings')\n return\n }\n\n if (isObject(style) && !(style as MapLibreStyleSpecs).sources) {\n console.warn('Unovis | Leaflet Map: Sources settings are required in order to show map. Set the `sources` property in the style settings')\n return\n }\n\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n const layer = MaplibreGLLayer(leaflet, maplibre, {\n style: style,\n accessToken: accessToken || 'not-needed',\n })\n\n return layer\n}\n"],"names":[],"mappings":";;;;;AAuBA,YAAY,CAAC,cAAc,CAAC,CAAA;SAEZ,kBAAkB,CAChC,MAAwC,EACxC,OAAiB,EACjB,QAAyB,EAAA;AAEzB,IAAA,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,GAAG,MAAM,CAAA;IAErC,IAAI,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAE,KAA4B,CAAC,MAAM,EAAE;AAC5D,QAAA,OAAO,CAAC,IAAI,CAAC,uHAAuH,CAAC,CAAA;QACrI,OAAM;AACP,KAAA;IAED,IAAI,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAE,KAA4B,CAAC,OAAO,EAAE;AAC7D,QAAA,OAAO,CAAC,IAAI,CAAC,4HAA4H,CAAC,CAAA;QAC1I,OAAM;AACP,KAAA;;;AAID,IAAA,MAAM,KAAK,GAAG,eAAe,CAAC,OAAO,EAAE,QAAQ,EAAE;AAC/C,QAAA,KAAK,EAAE,KAAK;QACZ,WAAW,EAAE,WAAW,IAAI,YAAY;AACzC,KAAA,CAAC,CAAA;AAEF,IAAA,OAAO,KAAK,CAAA;AACd;;;;"}
@@ -1,4 +1,4 @@
1
- import { injectGlobal, css } from '@emotion/css';
1
+ import { injectGlobal, css } from '../../styles/emotion.js';
2
2
  import { getCssVarNames, injectGlobalCssVariables } from '../../utils/style.js';
3
3
  import css_248z from './leaflet.css.js';
4
4
 
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../src/components/leaflet-map/style.ts"],"sourcesContent":["import { css, injectGlobal } from '@emotion/css'\n\n// Utils\nimport { getCssVarNames, injectGlobalCssVariables } from 'utils/style'\n\n// Inject Leaflet global style\n// eslint-disable-next-line\nimport leafletCSS from './leaflet.css'\ninjectGlobal(leafletCSS)\n\nconst cssVarDefaults = {\n '--vis-map-container-background-color': '#dfe5eb',\n /* Undefined by default to allow proper fallback to var(--vis-font-family) */\n '--vis-map-label-font-family': undefined as undefined,\n\n '--vis-map-point-default-fill-color': '#B9BEC3',\n '--vis-map-point-ring-fill-color': '#ffffff',\n '--vis-map-point-default-stroke-color': '#959da3',\n '--vis-map-point-default-stroke-width': '0px',\n '--vis-map-point-default-cursor': 'default',\n\n '--vis-map-cluster-default-fill-color': '#fff',\n '--vis-map-cluster-default-stroke-color': '#B9BEC3',\n '--vis-map-cluster-default-stroke-width': '1.5px',\n '--vis-map-cluster-donut-fill-color': '#959da3',\n\n '--vis-map-cluster-inner-label-text-color-dark': '#5b5f6d',\n '--vis-map-cluster-inner-label-text-color-light': '#fff',\n\n '--vis-map-point-inner-label-text-color-dark': '#5b5f6d',\n '--vis-map-point-inner-label-text-color-light': '#fff',\n\n '--vis-map-point-bottom-label-text-color': '#5b5f6d',\n '--vis-map-point-bottom-label-font-size': '10px',\n\n '--vis-map-cluster-expanded-background-fill-color': '#fff',\n\n /* Dark Theme */\n '--vis-dark-map-container-background-color': '#dfe5eb',\n '--vis-dark-map-point-default-fill-color': '#B9BEC3',\n '--vis-dark-map-point-default-stroke-color': '#959da3',\n '--vis-dark-map-point-ring-fill-color': '#5b5f6d',\n\n '--vis-dark-map-cluster-default-fill-color': '#5b5f6d',\n '--vis-dark-map-cluster-default-stroke-color': '#B9BEC3',\n '--vis-dark-map-cluster-donut-fill-color': '#959da3',\n\n '--vis-dark-map-cluster-inner-label-text-color-dark': '#5b5f6d',\n '--vis-dark-map-cluster-inner-label-text-color-light': '#fff',\n\n '--vis-dark-map-point-inner-label-text-color-dark': '#5b5f6d',\n '--vis-dark-map-point-inner-label-text-color-light': '#fff',\n\n '--vis-dark-map-point-bottom-label-text-color': '#5b5f6d',\n\n '--vis-dark-map-cluster-expanded-background-fill-color': '#fff',\n}\n\nexport const root = css`\n label: leaflet-map-component;\n\n width: 100%;\n height: 100%;\n position: absolute;\n background-color: var(--vis-map-container-background-color);\n\n canvas {\n pointer-events: all;\n }\n`\n\nexport const variables = getCssVarNames(cssVarDefaults)\ninjectGlobalCssVariables(cssVarDefaults, root)\n\nexport const background = `${root} canvas`\n\nexport const points = css`\n label: g-points;\n`\n\nexport const point = css`\n label: g-point;\n`\n\nexport const pointPath = css`\n label: point-path;\n\n stroke-opacity: 1;\n fill-opacity: 1.0;\n fill: var(${variables.mapPointDefaultFillColor});\n stroke: var(${variables.mapPointDefaultStrokeColor});\n stroke-width: var(${variables.mapPointDefaultStrokeWidth});\n pointer-events: fill !important;\n transition: .2s stroke-width, .3s transform;\n cursor: var(${variables.mapPointDefaultCursor});\n\n &:hover {\n stroke-width: 2;\n fill-opacity: 1;\n animation: none;\n transform: scale(1.1);\n }\n`\n\nexport const pointPathRing = css`\n label: point-path-ring;\n fill: var(${variables.mapPointRingFillColor});\n`\n\nexport const pointPathCluster = css`\n label: point-path-cluster;\n fill-opacity: 0.9;\n stroke: none;\n animation: none;\n fill: var(${variables.mapClusterDefaultFillColor});\n stroke: var(${variables.mapClusterDefaultStrokeColor});\n stroke-width: var(${variables.mapClusterDefaultStrokeWidth});\n`\n\nexport const pointSelectionRing = css`\n label: point-selection-ring;\n stroke: var(${variables.mapPointDefaultFillColor});\n`\n\nexport const pointSelection = css`\n label: point-selection;\n\n opacity: 0;\n transform: scale(1);\n\n &.active {\n transition: all 400ms cubic-bezier(0.230, 1.000, 0.320, 1.000);\n opacity: 1;\n transform: scale(1.25);\n }\n`\n\nexport const innerLabel = css`\n label: inner-label;\n\n text-anchor: middle;\n fill: var(${variables.mapPointInnerLabelTextColorDark});\n font-family: var(${variables.mapLabelFontFamily}, var(--vis-font-family));\n pointer-events: none;\n font-weight: 600;\n`\n\nexport const innerLabelCluster = css`\n label: inner-label-cluster;\n fill: var(${variables.mapPointInnerLabelTextColorDark});\n`\n\nexport const bottomLabel = css`\n label: bottom-label;\n\n text-anchor: middle;\n fill: var(${variables.mapPointBottomLabelTextColor});\n font-family: var(${variables.mapLabelFontFamily}, var(--vis-font-family));\n pointer-events: none;\n font-weight: 600;\n`\n\nexport const donutCluster = css`\n label: donut-cluster;\n\n transform: scale(1);\n transition: .3s transform;\n path {\n fill: var(${variables.mapClusterDonutFillColor});\n stroke-width: 0.5;\n }\n\n &:hover {\n transform: scale(1.1);\n }\n`\n\nexport const svgOverlay = css`\n label: svg-overlay;\n position: absolute;\n pointer-events: none;\n`\n\nexport const backgroundRect = css`\n label: background-rect;\n\n opacity: 0;\n`\n\nexport const clusterBackground = css`\n label: cluster-background;\n\n fill: var(${variables.mapClusterExpandedBackgroundFillColor});\n opacity: 0.6;\n visibility: hidden;\n\n &.active {\n visibility: visible;\n }\n`\n\nexport const onFeatureHover = css`\n label: feature-hovered;\n`\n\nexport const mapboxglCanvas = css`\n pointer-events: all;\n cursor: grab;\n\n &${`.${onFeatureHover}`} {\n cursor: default;\n }\n`\n\nexport const map = css`\n label: map;\n`\n"],"names":["leafletCSS"],"mappings":"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"}
1
+ {"version":3,"file":"style.js","sources":["../../../src/components/leaflet-map/style.ts"],"sourcesContent":["import { css, injectGlobal } from 'styles/emotion'\n\n// Utils\nimport { getCssVarNames, injectGlobalCssVariables } from 'utils/style'\n\n// Inject Leaflet global style\n// eslint-disable-next-line\nimport leafletCSS from './leaflet.css'\ninjectGlobal(leafletCSS)\n\nconst cssVarDefaults = {\n '--vis-map-container-background-color': '#dfe5eb',\n /* Undefined by default to allow proper fallback to var(--vis-font-family) */\n '--vis-map-label-font-family': undefined as undefined,\n\n '--vis-map-point-default-fill-color': '#B9BEC3',\n '--vis-map-point-ring-fill-color': '#ffffff',\n '--vis-map-point-default-stroke-color': '#959da3',\n '--vis-map-point-default-stroke-width': '0px',\n '--vis-map-point-default-cursor': 'default',\n\n '--vis-map-cluster-default-fill-color': '#fff',\n '--vis-map-cluster-default-stroke-color': '#B9BEC3',\n '--vis-map-cluster-default-stroke-width': '1.5px',\n '--vis-map-cluster-donut-fill-color': '#959da3',\n\n '--vis-map-cluster-inner-label-text-color-dark': '#5b5f6d',\n '--vis-map-cluster-inner-label-text-color-light': '#fff',\n\n '--vis-map-point-inner-label-text-color-dark': '#5b5f6d',\n '--vis-map-point-inner-label-text-color-light': '#fff',\n\n '--vis-map-point-bottom-label-text-color': '#5b5f6d',\n '--vis-map-point-bottom-label-font-size': '10px',\n\n '--vis-map-cluster-expanded-background-fill-color': '#fff',\n\n /* Dark Theme */\n '--vis-dark-map-container-background-color': '#dfe5eb',\n '--vis-dark-map-point-default-fill-color': '#B9BEC3',\n '--vis-dark-map-point-default-stroke-color': '#959da3',\n '--vis-dark-map-point-ring-fill-color': '#5b5f6d',\n\n '--vis-dark-map-cluster-default-fill-color': '#5b5f6d',\n '--vis-dark-map-cluster-default-stroke-color': '#B9BEC3',\n '--vis-dark-map-cluster-donut-fill-color': '#959da3',\n\n '--vis-dark-map-cluster-inner-label-text-color-dark': '#5b5f6d',\n '--vis-dark-map-cluster-inner-label-text-color-light': '#fff',\n\n '--vis-dark-map-point-inner-label-text-color-dark': '#5b5f6d',\n '--vis-dark-map-point-inner-label-text-color-light': '#fff',\n\n '--vis-dark-map-point-bottom-label-text-color': '#5b5f6d',\n\n '--vis-dark-map-cluster-expanded-background-fill-color': '#fff',\n}\n\nexport const root = css`\n label: leaflet-map-component;\n\n width: 100%;\n height: 100%;\n position: absolute;\n background-color: var(--vis-map-container-background-color);\n\n canvas {\n pointer-events: all;\n }\n`\n\nexport const variables = getCssVarNames(cssVarDefaults)\ninjectGlobalCssVariables(cssVarDefaults, root)\n\nexport const background = `${root} canvas`\n\nexport const points = css`\n label: g-points;\n`\n\nexport const point = css`\n label: g-point;\n`\n\nexport const pointPath = css`\n label: point-path;\n\n stroke-opacity: 1;\n fill-opacity: 1.0;\n fill: var(${variables.mapPointDefaultFillColor});\n stroke: var(${variables.mapPointDefaultStrokeColor});\n stroke-width: var(${variables.mapPointDefaultStrokeWidth});\n pointer-events: fill !important;\n transition: .2s stroke-width, .3s transform;\n cursor: var(${variables.mapPointDefaultCursor});\n\n &:hover {\n stroke-width: 2;\n fill-opacity: 1;\n animation: none;\n transform: scale(1.1);\n }\n`\n\nexport const pointPathRing = css`\n label: point-path-ring;\n fill: var(${variables.mapPointRingFillColor});\n`\n\nexport const pointPathCluster = css`\n label: point-path-cluster;\n fill-opacity: 0.9;\n stroke: none;\n animation: none;\n fill: var(${variables.mapClusterDefaultFillColor});\n stroke: var(${variables.mapClusterDefaultStrokeColor});\n stroke-width: var(${variables.mapClusterDefaultStrokeWidth});\n`\n\nexport const pointSelectionRing = css`\n label: point-selection-ring;\n stroke: var(${variables.mapPointDefaultFillColor});\n`\n\nexport const pointSelection = css`\n label: point-selection;\n\n opacity: 0;\n transform: scale(1);\n\n &.active {\n transition: all 400ms cubic-bezier(0.230, 1.000, 0.320, 1.000);\n opacity: 1;\n transform: scale(1.25);\n }\n`\n\nexport const innerLabel = css`\n label: inner-label;\n\n text-anchor: middle;\n fill: var(${variables.mapPointInnerLabelTextColorDark});\n font-family: var(${variables.mapLabelFontFamily}, var(--vis-font-family));\n pointer-events: none;\n font-weight: 600;\n`\n\nexport const innerLabelCluster = css`\n label: inner-label-cluster;\n fill: var(${variables.mapPointInnerLabelTextColorDark});\n`\n\nexport const bottomLabel = css`\n label: bottom-label;\n\n text-anchor: middle;\n fill: var(${variables.mapPointBottomLabelTextColor});\n font-family: var(${variables.mapLabelFontFamily}, var(--vis-font-family));\n pointer-events: none;\n font-weight: 600;\n`\n\nexport const donutCluster = css`\n label: donut-cluster;\n\n transform: scale(1);\n transition: .3s transform;\n path {\n fill: var(${variables.mapClusterDonutFillColor});\n stroke-width: 0.5;\n }\n\n &:hover {\n transform: scale(1.1);\n }\n`\n\nexport const svgOverlay = css`\n label: svg-overlay;\n position: absolute;\n pointer-events: none;\n`\n\nexport const backgroundRect = css`\n label: background-rect;\n\n opacity: 0;\n`\n\nexport const clusterBackground = css`\n label: cluster-background;\n\n fill: var(${variables.mapClusterExpandedBackgroundFillColor});\n opacity: 0.6;\n visibility: hidden;\n\n &.active {\n visibility: visible;\n }\n`\n\nexport const onFeatureHover = css`\n label: feature-hovered;\n`\n\nexport const mapboxglCanvas = css`\n pointer-events: all;\n cursor: grab;\n\n &${`.${onFeatureHover}`} {\n cursor: default;\n }\n`\n\nexport const map = css`\n label: map;\n`\n"],"names":["leafletCSS"],"mappings":"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"}