@datalayer/icons-react 1.0.9 → 1.0.11

package/data1/esm/ApacheSparkIcon.svg

@@ -1,4 +1,4 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 388.112 201.85" fill="currentColor" aria-hidden="true">
+<svg width="16" height="16" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 388.112 201.85" fill="currentColor" aria-hidden="true">
   <path fill="#e25a1c" fill-rule="evenodd" d="M355.027 101.84c-.335-.715-.486-1.076-.668-1.422-4.863-9.245-9.714-18.496-14.62-27.718-.495-.926-.434-1.478.244-2.269 7.733-9.035 15.427-18.106 23.13-27.169.27-.317.513-.657.617-1.222-2.253.589-4.505 1.17-6.755 1.766-9.345 2.476-18.693 4.945-28.029 7.455-.871.234-1.266-.021-1.699-.742-5.306-8.864-10.642-17.709-15.972-26.558-.276-.46-.573-.906-1.159-1.292-.429 2.361-.865 4.721-1.285 7.083-1.485 8.34-2.965 16.683-4.445 25.024-.161.9-.384 1.796-.46 2.704-.075.861-.516 1.179-1.295 1.424-11.014 3.457-22.016 6.948-33.019 10.436-.483.152-.955.35-1.473.821l27.142 10.787c-.332.264-.549.467-.792.626-5.628 3.641-11.264 7.268-16.878 10.928-.671.437-1.205.5-1.96.16-6.721-3.027-13.469-5.997-20.2-9.003-3.022-1.35-5.741-3.143-7.859-5.732-4.786-5.856-3.84-12.517 2.537-16.586 2.087-1.331 4.456-2.33 6.82-3.101 10.786-3.514 21.613-6.902 32.436-10.303.906-.283 1.327-.69 1.496-1.672a3379.11 3379.11 0 014.441-25.025c.805-4.457 1.233-9.03 3.403-13.115.832-1.57 1.831-3.109 3.019-4.425 4.295-4.767 10.291-4.952 14.833-.41 1.533 1.533 2.852 3.341 3.99 5.196 5.005 8.159 9.928 16.37 14.824 24.595.579.973 1.101 1.169 2.173.881 12.067-3.235 24.147-6.42 36.227-9.61 2.491-.658 5.011-.9 7.569-.422 5.567 1.042 8.001 5.281 6.117 10.659-.857 2.451-2.336 4.52-4 6.475-8.428 9.912-16.843 19.836-25.3 29.723-.692.808-.707 1.393-.228 2.295 5.045 9.51 10.046 19.043 15.066 28.566 1.201 2.28 2.118 4.645 2.145 7.263.06 5.954-4.294 10.826-10.21 11.693-3.314.487-6.393-.221-9.498-1.18a3100.033 3100.033 0 00-22.73-6.92c-.702-.21-.97-.485-1.095-1.242-.872-5.337-1.823-10.663-2.743-15.992-.027-.147.017-.305.04-.631l26.104 7.201"/>
   <path fill="#3c3a3e" fill-rule="evenodd" d="M340.275 179.571c-6.824-.012-13.648-.043-20.473-.016-.9.002-1.41-.26-1.913-1.026-8.079-12.305-16.194-24.587-24.303-36.873-.259-.391-.534-.768-.992-1.426-1.747 13.27-3.453 26.244-5.163 39.25h-17.87c.209-1.741.393-3.424.613-5.1 1.745-13.324 3.496-26.648 5.247-39.97 1.673-12.73 3.34-25.46 5.038-38.188.05-.38.302-.859.612-1.06 6.149-4.01 12.319-7.984 18.489-11.962.09-.059.215-.065.534-.156l-5.572 42.48.22.151 29.25-32.421c.287 1.65.534 3.062.777 4.475.693 4.046 1.358 8.098 2.101 12.135.15.814-.066 1.32-.609 1.886-6.26 6.551-12.496 13.125-18.737 19.692-.273.287-.534.584-.844.924.199.319.369.625.57.909a95397.154 95397.154 0 0032.307 45.325c.195.274.477.489.718.732v.24M128.455 140.289c-.273-1.393-.468-3.438-1.086-5.348-2.992-9.234-12.467-14.297-22.274-12.014-10.758 2.503-18.446 10.96-19.558 21.938-.823 8.12 3.55 15.942 11.68 18.878 6.55 2.367 12.855 1.377 18.71-2.134 7.761-4.656 11.97-11.569 12.528-21.32zm-47.242 34.32c-.53 3.973-1.037 7.717-1.53 11.464a2756.23 2756.23 0 00-1.934 14.943c-.073.582-.25.838-.874.834-4.909-.02-9.817-.015-14.726-.022-.111 0-.223-.062-.49-.137.297-2.35.586-4.709.895-7.065 1.083-8.26 2.163-16.521 3.262-24.78 1.257-9.443 2.253-18.932 3.862-28.315 2.85-16.614 16.945-30.932 33.485-34.497 9.589-2.068 18.766-1.111 27.137 4.284 8.349 5.381 13.137 13.19 14.229 23.012 1.543 13.888-3.568 25.416-13.433 34.954-6.474 6.26-14.225 10.24-23.166 11.585-9.21 1.389-17.869-.148-25.638-5.578-.286-.198-.59-.372-1.08-.681M73.214 95.661l-16.142 12.016c-.86-1.355-1.629-2.705-2.527-3.962-2.313-3.231-5.185-5.646-9.362-5.939-3.474-.243-6.445.901-8.81 3.463-2.115 2.29-2.391 5.547-.415 8.134 2.176 2.848 4.557 5.55 6.989 8.185 4.03 4.37 8.244 8.573 12.249 12.967 3.644 3.996 6.549 8.481 7.446 13.946 1.067 6.497-.23 12.684-3.303 18.394-5.687 10.566-14.642 16.696-26.465 18.615-5.221.846-10.428.678-15.523-.822-6.761-1.99-11.467-6.422-14.494-12.68C1.788 165.767.97 163.433 0 161.062l17.504-9.367c.203.486.346.89.535 1.27.995 1.991 1.81 4.106 3.042 5.939 3.654 5.433 9.557 7.087 15.546 4.4a17.137 17.137 0 004.28-2.782c3.86-3.425 4.583-8.193 1.727-12.503-1.641-2.477-3.694-4.697-5.692-6.915-4.776-5.304-9.745-10.438-14.41-15.837-3.216-3.721-5.401-8.061-6.093-13.045-.755-5.442.333-10.577 3.165-15.16 7.041-11.387 17.272-17.312 30.804-16.82 7.715.279 13.858 3.886 18.627 9.88 1.41 1.773 2.733 3.617 4.179 5.54M203.93 156.8c-.897 6.86-1.744 13.38-2.624 19.895-.045.33-.304.779-.585.91-13.32 6.169-30.86 5.308-41.799-7.115-5.877-6.674-8.343-14.595-7.974-23.408.852-20.4 17.766-38.208 37.992-40.696 11.818-1.454 22.181 1.737 30.188 10.917 5.452 6.254 7.975 13.722 7.602 21.963-.245 5.444-1.099 10.864-1.776 16.283-.96 7.675-2.009 15.34-3.023 23.009-.036.272-.091.542-.152.888h-15.935c.212-1.762.406-3.487.63-5.208 1.154-8.858 2.422-17.702 3.434-26.575.63-5.527.233-11.012-2.294-16.13-2.689-5.44-7.196-8.318-13.125-8.947-12.27-1.298-23.944 7.228-26.561 19.303-1.73 7.97.996 15.61 7.343 19.835 6.188 4.116 12.814 4.13 19.557 1.46 3.418-1.352 6.33-3.494 9.102-6.384M271.029 107.934l-2.176 16.523c-3.37 0-6.673-.02-9.975.007-2.677.02-5.12 1.748-5.923 4.247-.315.978-.431 2.024-.566 3.05-1.677 12.685-3.34 25.372-5.004 38.06-.42 3.198-.829 6.4-1.249 9.647H229.55c.31-2.44.602-4.8.911-7.158a14570.69 14570.69 0 013.25-24.661c.944-7.113 1.785-14.241 2.896-21.328 1.49-9.5 10.942-17.935 20.528-18.352 4.574-.2 9.164-.034 13.894-.034"/>
   <path fill="#3c3a3e" d="M359.829 179.468v-7.002h-.04l-2.748 7.002h-.876l-2.748-7.002h-.04v7.002h-1.385v-8.386h2.137l2.503 6.37 2.464-6.37h2.118v8.386h-1.385zm-12.173-7.265v7.265h-1.384v-7.265h-2.626v-1.122h6.636v1.121h-2.626M95.432 83.885h4.112l-.97-6.226-3.142 6.226zm4.758 4.023h-6.842l-2.173 4.257H86.33l10.687-19.966h4.671l3.64 19.966h-4.493l-.645-4.257M124.669 76.22h-2.438l-.82 4.61h2.436c1.47 0 2.644-.968 2.644-2.79 0-1.204-.736-1.82-1.822-1.82zm-5.902-4.021h6.403c3.347 0 5.695 1.996 5.695 5.43 0 4.317-3.054 7.223-7.4 7.223h-2.759l-1.293 7.313h-4.168l3.522-19.966M145.028 83.885h4.112l-.97-6.226-3.142 6.226zm4.757 4.023h-6.841l-2.174 4.257h-4.845l10.687-19.966h4.67l3.64 19.966h-4.49l-.647-4.257M176.834 91.46c-1.409.645-2.964 1.029-4.521 1.029-5.284 0-8.604-3.966-8.604-8.928 0-6.343 5.344-11.687 11.687-11.687 1.585 0 3.025.381 4.199 1.027l-.588 4.788c-.88-.97-2.29-1.645-4.052-1.645-3.64 0-6.87 3.29-6.87 7.106 0 2.906 1.82 5.17 4.699 5.17 1.762 0 3.463-.676 4.608-1.616l-.558 4.755M202.315 84.119h-8.691l-1.411 8.046h-4.168l3.523-19.966h4.17l-1.41 7.898h8.692l1.407-7.898h4.17l-3.52 19.966h-4.17l1.408-8.046M217.606 92.165l3.521-19.966H232.2l-.705 4.021h-6.902l-.702 3.877h6.34l-.703 4.022h-6.343l-.705 4.023h6.901l-.705 4.023h-11.069"/>

package/data1/esm/ApacheSparkIconJupyterLab.d.ts

@@ -1,3 +1,3 @@
-import { LabIcon } from "@jupyterlab/ui-components/lib/icon/labicon";
+import { LabIcon } from "@jupyterlab/ui-components";
 declare const apacheSparkIconJupyterLab: LabIcon;
 export default apacheSparkIconJupyterLab;

package/data1/esm/ApacheSparkIconJupyterLab.js

@@ -1,4 +1,8 @@
-import { LabIcon } from '@jupyterlab/ui-components/lib/icon/labicon';
+// The root import, not lib/icon/labicon: inside JupyterLab the root is a
+// federation singleton, so this LabIcon is the class the host recognises
+// with instanceof — a deep import bundles a private copy the host would
+// not style (the icon then renders unstyled, at its intrinsic size).
+import { LabIcon } from '@jupyterlab/ui-components';
 import ApacheSparkIconSvgStr from './ApacheSparkIcon.svg';
 const apacheSparkIconJupyterLab = new LabIcon({
     name: '@datalayer/icons:apache-spark',

package/data1/esm/ArrowSwitchVerticalIcon.js

@@ -11,31 +11,44 @@ function _DlIconInverseColormode({
   children
 }) {
   const ref = React.useRef(null);
-  const [resolved, setResolved] = React.useState(typeof mode === "string" ? mode : null);
+  const [appearance, setAppearance] = React.useState({
+    mode: typeof mode === "string" ? mode : null,
+    lightTheme: null,
+    darkTheme: null
+  });
   React.useLayoutEffect(() => {
-    if (typeof mode === "string") {
-      setResolved(mode);
-      return;
-    }
     if (typeof document === "undefined") return;
-    let cur = null;
+    let currentMode = null;
+    let lightTheme = null;
+    let darkTheme = null;
     let el = ref.current && ref.current.parentElement;
-    while (el) {
-      const m = el.getAttribute && el.getAttribute("data-color-mode");
-      if (m) { cur = m; break; }
+    while (el && (!currentMode || !lightTheme || !darkTheme)) {
+      if (el.getAttribute) {
+        currentMode = currentMode || el.getAttribute("data-color-mode");
+        lightTheme = lightTheme || el.getAttribute("data-light-theme");
+        darkTheme = darkTheme || el.getAttribute("data-dark-theme");
+      }
       el = el.parentElement;
     }
-    if (!cur || cur === "auto") {
-      cur = (typeof window !== "undefined" && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) ? "dark" : "light";
+    if (!currentMode || currentMode === "auto") {
+      currentMode = (typeof window !== "undefined" && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) ? "dark" : "light";
     }
-    setResolved(cur === "dark" ? "light" : "dark");
+    setAppearance({
+      mode: typeof mode === "string" ? mode : (currentMode === "dark" ? "light" : "dark"),
+      lightTheme,
+      darkTheme
+    });
   }, [mode]);
   return /*#__PURE__*/React.createElement("span", {
     ref: ref,
-    "data-color-mode": resolved || "light",
-    "data-light-theme": "light",
-    "data-dark-theme": "dark",
-    style: { display: "inline-flex", lineHeight: 0 }
+    "data-color-mode": appearance.mode || "light",
+    "data-light-theme": appearance.lightTheme || undefined,
+    "data-dark-theme": appearance.darkTheme || undefined,
+    style: {
+      display: "inline-flex",
+      lineHeight: 0,
+      color: "var(--fgColor-default, var(--color-fg-default, currentColor))"
+    }
   }, children);
 }
 
@@ -51,16 +64,18 @@ function ArrowSwitchVerticalIcon({
   const _svgEl = /*#__PURE__*/React.createElement("svg", Object.assign({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 24 24",
-    fill: themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor',
+    fill: (themed ? "var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor))" : "var(--datalayer-icon-color, currentColor)"),
     width: size ? typeof size === "string" ? sizeMap[size] : size : "16px",
     "aria-hidden": "true",
     ref: svgRef,
     "aria-labelledby": titleId
   }, props, {
+    "data-datalayer-icon": "",
     style: props && props.color != null ? Object.assign({}, props.style, {
-      "--datalayer-icon-fg": props.color
+      "--datalayer-icon-color": props.color,
+      color: props.color
     }) : props && props.style
-  }), title ? /*#__PURE__*/React.createElement("title", {
+  }), /*#__PURE__*/React.createElement("style", null, "[data-color-mode=\"light\"]{--datalayer-icon-color-scheme:light}[data-color-mode=\"dark\"]{--datalayer-icon-color-scheme:dark}svg[data-datalayer-icon]{color-scheme:var(--datalayer-icon-color-scheme, light dark)}"), title ? /*#__PURE__*/React.createElement("title", {
     id: titleId
   }, title) : null, /*#__PURE__*/React.createElement("path", {
     d: "M2.22 7.72a.75.75 0 001.06 1.06L6.5 5.56v14.69a.75.75 0 001.5 0V5.56l3.22 3.22a.75.75 0 101.06-1.06l-4.5-4.5a.75.75 0 00-1.06 0zm9.5 8.56a.75.75 0 111.06-1.06L16 18.44V3.75a.75.75 0 011.5 0v14.69l3.22-3.22a.75.75 0 011.06 1.06l-4.5 4.5a.75.75 0 01-1.06 0z"

package/data1/esm/ArrowSwitchVerticalIcon.svg

@@ -1,3 +1,3 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+<svg width="16" height="16" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
   <path d="M2.22 7.72a.75.75 0 001.06 1.06L6.5 5.56v14.69a.75.75 0 001.5 0V5.56l3.22 3.22a.75.75 0 101.06-1.06l-4.5-4.5a.75.75 0 00-1.06 0zm9.5 8.56a.75.75 0 111.06-1.06L16 18.44V3.75a.75.75 0 011.5 0v14.69l3.22-3.22a.75.75 0 011.06 1.06l-4.5 4.5a.75.75 0 01-1.06 0z"/>
 </svg>

package/data1/esm/ArrowSwitchVerticalIconJupyterLab.d.ts

@@ -1,3 +1,3 @@
-import { LabIcon } from "@jupyterlab/ui-components/lib/icon/labicon";
+import { LabIcon } from "@jupyterlab/ui-components";
 declare const arrowSwitchVerticalIconJupyterLab: LabIcon;
 export default arrowSwitchVerticalIconJupyterLab;

package/data1/esm/ArrowSwitchVerticalIconJupyterLab.js

@@ -1,4 +1,8 @@
-import { LabIcon } from '@jupyterlab/ui-components/lib/icon/labicon';
+// The root import, not lib/icon/labicon: inside JupyterLab the root is a
+// federation singleton, so this LabIcon is the class the host recognises
+// with instanceof — a deep import bundles a private copy the host would
+// not style (the icon then renders unstyled, at its intrinsic size).
+import { LabIcon } from '@jupyterlab/ui-components';
 import ArrowSwitchVerticalIconSvgStr from './ArrowSwitchVerticalIcon.svg';
 const arrowSwitchVerticalIconJupyterLab = new LabIcon({
     name: '@datalayer/icons:arrow-switch-vertical',

package/data1/esm/ArxivIcon.js

@@ -11,31 +11,44 @@ function _DlIconInverseColormode({
   children
 }) {
   const ref = React.useRef(null);
-  const [resolved, setResolved] = React.useState(typeof mode === "string" ? mode : null);
+  const [appearance, setAppearance] = React.useState({
+    mode: typeof mode === "string" ? mode : null,
+    lightTheme: null,
+    darkTheme: null
+  });
   React.useLayoutEffect(() => {
-    if (typeof mode === "string") {
-      setResolved(mode);
-      return;
-    }
     if (typeof document === "undefined") return;
-    let cur = null;
+    let currentMode = null;
+    let lightTheme = null;
+    let darkTheme = null;
     let el = ref.current && ref.current.parentElement;
-    while (el) {
-      const m = el.getAttribute && el.getAttribute("data-color-mode");
-      if (m) { cur = m; break; }
+    while (el && (!currentMode || !lightTheme || !darkTheme)) {
+      if (el.getAttribute) {
+        currentMode = currentMode || el.getAttribute("data-color-mode");
+        lightTheme = lightTheme || el.getAttribute("data-light-theme");
+        darkTheme = darkTheme || el.getAttribute("data-dark-theme");
+      }
       el = el.parentElement;
     }
-    if (!cur || cur === "auto") {
-      cur = (typeof window !== "undefined" && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) ? "dark" : "light";
+    if (!currentMode || currentMode === "auto") {
+      currentMode = (typeof window !== "undefined" && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) ? "dark" : "light";
     }
-    setResolved(cur === "dark" ? "light" : "dark");
+    setAppearance({
+      mode: typeof mode === "string" ? mode : (currentMode === "dark" ? "light" : "dark"),
+      lightTheme,
+      darkTheme
+    });
   }, [mode]);
   return /*#__PURE__*/React.createElement("span", {
     ref: ref,
-    "data-color-mode": resolved || "light",
-    "data-light-theme": "light",
-    "data-dark-theme": "dark",
-    style: { display: "inline-flex", lineHeight: 0 }
+    "data-color-mode": appearance.mode || "light",
+    "data-light-theme": appearance.lightTheme || undefined,
+    "data-dark-theme": appearance.darkTheme || undefined,
+    style: {
+      display: "inline-flex",
+      lineHeight: 0,
+      color: "var(--fgColor-default, var(--color-fg-default, currentColor))"
+    }
   }, children);
 }
 
@@ -53,30 +66,32 @@ function ArxivIcon({
     "data-name": "primary logo",
     viewBox: "0 0 246.978 111.119",
     width: size ? typeof size === "string" ? sizeMap[size] : size : "16px",
-    fill: themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor',
+    fill: (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 72%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 62%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 72%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 62%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 72%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     "aria-hidden": "true",
     ref: svgRef,
     "aria-labelledby": titleId
   }, props, {
+    "data-datalayer-icon": "",
     style: props && props.color != null ? Object.assign({}, props.style, {
-      "--datalayer-icon-fg": props.color
+      "--datalayer-icon-color": props.color,
+      color: props.color
     }) : props && props.style
-  }), title ? /*#__PURE__*/React.createElement("title", {
+  }), /*#__PURE__*/React.createElement("style", null, "[data-color-mode=\"light\"]{--datalayer-icon-color-scheme:light}[data-color-mode=\"dark\"]{--datalayer-icon-color-scheme:dark}svg[data-datalayer-icon]{color-scheme:var(--datalayer-icon-color-scheme, light dark)}"), title ? /*#__PURE__*/React.createElement("title", {
     id: titleId
   }, title) : null, /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#7c7469' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#7c7469" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 48%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 86%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 48%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 86%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 48%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M69.406 32.884c1.859 0 3.1 1.24 3.985 3.453 1.062-2.213 2.568-3.453 4.694-3.453h14.878a4.062 4.062 0 014.074 4.074v7.828c0 2.656-1.327 4.074-4.074 4.074-2.656 0-4.074-1.418-4.074-4.074V41.03H78.35a2.411 2.411 0 00-2.656 2.745v27.188h10.007c2.658 0 4.074 1.329 4.074 4.074s-1.416 4.074-4.074 4.074h-26.39c-2.659 0-3.986-1.328-3.986-4.074s1.327-4.074 3.986-4.074h8.236V41.03h-7.263c-2.656 0-3.985-1.329-3.985-4.074 0-2.658 1.329-4.074 3.985-4.074zm111.662 0c2.656 0 4.074 1.416 4.074 4.074v34.007h10.1c2.746 0 4.074 1.329 4.074 4.074s-1.328 4.074-4.074 4.074h-28.607c-2.656 0-4.074-1.328-4.074-4.074s1.418-4.074 4.074-4.074h10.362V41.03h-8.533c-2.744 0-4.073-1.329-4.073-4.074 0-2.658 1.329-4.074 4.073-4.074zm4.22-17.615a5.859 5.859 0 11-5.819-5.819 5.9 5.9 0 015.819 5.819zm61.69 21.689a4.589 4.589 0 01-.267 1.594L231.835 76.63a3.722 3.722 0 01-3.721 2.48h-5.933a3.689 3.689 0 01-3.808-2.48l-15.055-38.081a3.23 3.23 0 01-.355-1.594 4.084 4.084 0 014.164-4.074 3.8 3.8 0 013.718 2.656l14.348 36.134 13.9-36.134a3.8 3.8 0 013.72-2.656 4.084 4.084 0 014.165 4.077z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#aa142d' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#aa142d" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M127.984 55.607L95.243 94.459c-1.286 1.372-2.084 3.777-1.365 5.5a4.705 4.705 0 004.4 2.914 4.191 4.191 0 003.16-1.563l40.191-42.714a4.417 4.417 0 00.042-6.042z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#7c7469' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#7c7469" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 48%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 86%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 48%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 86%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 48%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M127.984 55.607l31.187-38.268c1.492-1.989 2.2-3.03 1.492-4.723a5.142 5.142 0 00-4.481-3.161 4.024 4.024 0 00-3.008 1.108L114.546 52.33a4.769 4.769 0 00.015 6.53l47.786 51.07a3.913 3.913 0 003.137 1.192 4.394 4.394 0 004.027-2.818c.719-1.727-.076-3.438-1.4-5.23L127.987 55.61"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#aa142d' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#aa142d" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M141.668 52.558L95.004 2.13S93.291.05 91.48.006a4.607 4.607 0 00-4.338 2.788c-.705 1.692-.2 2.88 1.349 5.1l40.093 48.422"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#7c7469' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#7c7469" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 48%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 86%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 48%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 86%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 48%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M32.445 32.884c5.018 0 8.206 3.312 8.206 8.4v37.831H5.143A4.813 4.813 0 010 74.186V61.157a8.256 8.256 0 017-8.148l25.507-3.572v-8.4H4.141A4.014 4.014 0 010 36.963c0-2.87 2.143-4.074 4.355-4.074zm.059 38.081V57.672l-24.354 3.4v9.9z"
   }));
   if (!colormode) return _svgEl;

package/data1/esm/ArxivIcon.svg

@@ -1,4 +1,4 @@
-<svg xmlns="http://www.w3.org/2000/svg" data-name="primary logo" viewBox="0 0 246.978 111.119" fill="currentColor" aria-hidden="true">
+<svg width="16" height="16" xmlns="http://www.w3.org/2000/svg" data-name="primary logo" viewBox="0 0 246.978 111.119" fill="currentColor" aria-hidden="true">
   <path fill="#7c7469" d="M69.406 32.884c1.859 0 3.1 1.24 3.985 3.453 1.062-2.213 2.568-3.453 4.694-3.453h14.878a4.062 4.062 0 014.074 4.074v7.828c0 2.656-1.327 4.074-4.074 4.074-2.656 0-4.074-1.418-4.074-4.074V41.03H78.35a2.411 2.411 0 00-2.656 2.745v27.188h10.007c2.658 0 4.074 1.329 4.074 4.074s-1.416 4.074-4.074 4.074h-26.39c-2.659 0-3.986-1.328-3.986-4.074s1.327-4.074 3.986-4.074h8.236V41.03h-7.263c-2.656 0-3.985-1.329-3.985-4.074 0-2.658 1.329-4.074 3.985-4.074zM181.068 32.884c2.656 0 4.074 1.416 4.074 4.074v34.007h10.1c2.746 0 4.074 1.329 4.074 4.074s-1.328 4.074-4.074 4.074h-28.607c-2.656 0-4.074-1.328-4.074-4.074s1.418-4.074 4.074-4.074h10.362V41.03h-8.533c-2.744 0-4.073-1.329-4.073-4.074 0-2.658 1.329-4.074 4.073-4.074zm4.22-17.615a5.859 5.859 0 11-5.819-5.819 5.9 5.9 0 015.819 5.819zM246.978 36.958a4.589 4.589 0 01-.267 1.594L231.835 76.63a3.722 3.722 0 01-3.721 2.48h-5.933a3.689 3.689 0 01-3.808-2.48l-15.055-38.081a3.23 3.23 0 01-.355-1.594 4.084 4.084 0 014.164-4.074 3.8 3.8 0 013.718 2.656l14.348 36.134 13.9-36.134a3.8 3.8 0 013.72-2.656 4.084 4.084 0 014.165 4.077z"/>
   <path fill="#aa142d" d="M127.984 55.607L95.243 94.459c-1.286 1.372-2.084 3.777-1.365 5.5a4.705 4.705 0 004.4 2.914 4.191 4.191 0 003.16-1.563l40.191-42.714a4.417 4.417 0 00.042-6.042z"/>
   <path fill="#7c7469" d="M127.984 55.607l31.187-38.268c1.492-1.989 2.2-3.03 1.492-4.723a5.142 5.142 0 00-4.481-3.161 4.024 4.024 0 00-3.008 1.108L114.546 52.33a4.769 4.769 0 00.015 6.53l47.786 51.07a3.913 3.913 0 003.137 1.192 4.394 4.394 0 004.027-2.818c.719-1.727-.076-3.438-1.4-5.23L127.987 55.61"/>

package/data1/esm/ArxivIconJupyterLab.d.ts

@@ -1,3 +1,3 @@
-import { LabIcon } from "@jupyterlab/ui-components/lib/icon/labicon";
+import { LabIcon } from "@jupyterlab/ui-components";
 declare const arxivIconJupyterLab: LabIcon;
 export default arxivIconJupyterLab;

package/data1/esm/ArxivIconJupyterLab.js

@@ -1,4 +1,8 @@
-import { LabIcon } from '@jupyterlab/ui-components/lib/icon/labicon';
+// The root import, not lib/icon/labicon: inside JupyterLab the root is a
+// federation singleton, so this LabIcon is the class the host recognises
+// with instanceof — a deep import bundles a private copy the host would
+// not style (the icon then renders unstyled, at its intrinsic size).
+import { LabIcon } from '@jupyterlab/ui-components';
 import ArxivIconSvgStr from './ArxivIcon.svg';
 const arxivIconJupyterLab = new LabIcon({
     name: '@datalayer/icons:arxiv',

package/data1/esm/ArxivMarkIcon.js

@@ -11,31 +11,44 @@ function _DlIconInverseColormode({
   children
 }) {
   const ref = React.useRef(null);
-  const [resolved, setResolved] = React.useState(typeof mode === "string" ? mode : null);
+  const [appearance, setAppearance] = React.useState({
+    mode: typeof mode === "string" ? mode : null,
+    lightTheme: null,
+    darkTheme: null
+  });
   React.useLayoutEffect(() => {
-    if (typeof mode === "string") {
-      setResolved(mode);
-      return;
-    }
     if (typeof document === "undefined") return;
-    let cur = null;
+    let currentMode = null;
+    let lightTheme = null;
+    let darkTheme = null;
     let el = ref.current && ref.current.parentElement;
-    while (el) {
-      const m = el.getAttribute && el.getAttribute("data-color-mode");
-      if (m) { cur = m; break; }
+    while (el && (!currentMode || !lightTheme || !darkTheme)) {
+      if (el.getAttribute) {
+        currentMode = currentMode || el.getAttribute("data-color-mode");
+        lightTheme = lightTheme || el.getAttribute("data-light-theme");
+        darkTheme = darkTheme || el.getAttribute("data-dark-theme");
+      }
       el = el.parentElement;
     }
-    if (!cur || cur === "auto") {
-      cur = (typeof window !== "undefined" && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) ? "dark" : "light";
+    if (!currentMode || currentMode === "auto") {
+      currentMode = (typeof window !== "undefined" && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) ? "dark" : "light";
     }
-    setResolved(cur === "dark" ? "light" : "dark");
+    setAppearance({
+      mode: typeof mode === "string" ? mode : (currentMode === "dark" ? "light" : "dark"),
+      lightTheme,
+      darkTheme
+    });
   }, [mode]);
   return /*#__PURE__*/React.createElement("span", {
     ref: ref,
-    "data-color-mode": resolved || "light",
-    "data-light-theme": "light",
-    "data-dark-theme": "dark",
-    style: { display: "inline-flex", lineHeight: 0 }
+    "data-color-mode": appearance.mode || "light",
+    "data-light-theme": appearance.lightTheme || undefined,
+    "data-dark-theme": appearance.darkTheme || undefined,
+    style: {
+      display: "inline-flex",
+      lineHeight: 0,
+      color: "var(--fgColor-default, var(--color-fg-default, currentColor))"
+    }
   }, children);
 }
 
@@ -51,25 +64,27 @@ function ArxivMarkIcon({
   const _svgEl = /*#__PURE__*/React.createElement("svg", Object.assign({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 135.611 201",
-    fill: themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor',
+    fill: (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 72%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 62%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 72%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 62%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 72%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     height: size ? typeof size === "string" ? sizeMap[size] : size : "16px",
     "aria-hidden": "true",
     ref: svgRef,
     "aria-labelledby": titleId
   }, props, {
+    "data-datalayer-icon": "",
     style: props && props.color != null ? Object.assign({}, props.style, {
-      "--datalayer-icon-fg": props.color
+      "--datalayer-icon-color": props.color,
+      color: props.color
     }) : props && props.style
-  }), title ? /*#__PURE__*/React.createElement("title", {
+  }), /*#__PURE__*/React.createElement("style", null, "[data-color-mode=\"light\"]{--datalayer-icon-color-scheme:light}[data-color-mode=\"dark\"]{--datalayer-icon-color-scheme:dark}svg[data-datalayer-icon]{color-scheme:var(--datalayer-icon-color-scheme, light dark)}"), title ? /*#__PURE__*/React.createElement("title", {
     id: titleId
   }, title) : null, /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#aa142d' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#aa142d" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M65.727 82.523l-42.324 49.375c-1.885 2.01-3.054 5.535-2 8.066a6.9 6.9 0 006.443 4.27c1.6 0 2.911-.56 4.631-2.289l52.364-54.278a8.927 8.927 0 00.061-12.584z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#bdb9b4' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#bdb9b4" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 64%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 70%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 64%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 70%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 64%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M64.847 81.494l39.168-49.545c2.186-2.914 3.219-4.44 2.186-6.921a7.536 7.536 0 00-6.566-4.633 5.9 5.9 0 00-4.408 1.624L45.155 75.08c-3.816 3.816-3.808 8.753.023 12.584l70.031 73.438a5.738 5.738 0 004.6 1.748c2.833 0 4.67-1.667 5.9-4.131 1.054-2.531-.112-5.038-2.056-7.664l-58.8-69.561"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#aa142d' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#aa142d" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M84.902 75.08L16.514 3.114S14.003.066 11.349.002a6.75 6.75 0 00-6.357 4.084c-1.033 2.481-.291 4.223 1.977 7.47l58.758 70.967z"
   }), /*#__PURE__*/React.createElement("path", {
     d: "M81.361 201a2.2 2.2 0 01-1.895-1.1l-8.528-14.161-8.576 14.161a2.152 2.152 0 01-1.9 1.1 2.33 2.33 0 01-2.343-2.3 2.269 2.269 0 01.348-1.246l9.925-15.907-8.121-13.01a2.722 2.722 0 01-.351-1.247 2.331 2.331 0 012.347-2.292 2.093 2.093 0 011.894 1.046l6.779 11.42 6.734-11.42a2.011 2.011 0 011.843-1.046 2.268 2.268 0 012.346 2.292 2.7 2.7 0 01-.3 1.247l-8.079 13.015 9.825 15.907a1.956 1.956 0 01.4 1.246A2.363 2.363 0 0181.361 201zm-43.252-25.445c1.021 0 1.7.681 2.188 1.9a2.817 2.817 0 012.578-1.9h8.169a2.231 2.231 0 012.237 2.237v4.3a1.983 1.983 0 01-2.237 2.237 2 2 0 01-2.237-2.237v-2.061H43.02a1.324 1.324 0 00-1.458 1.507v14.929h5.494a2.237 2.237 0 110 4.473H32.571a2.237 2.237 0 010-4.473h4.522v-16.438h-3.992a2.238 2.238 0 010-4.474zm61.311 0a2 2 0 012.237 2.237v18.673h5.543a2.237 2.237 0 110 4.473H91.494a2.237 2.237 0 110-4.473h5.69v-16.436h-4.686a2.237 2.237 0 010-4.474zm2.317-9.672a3.217 3.217 0 11-3.194-3.195 3.241 3.241 0 013.194 3.195zm33.874 11.909a2.527 2.527 0 01-.147.875l-8.169 20.91a2.042 2.042 0 01-2.043 1.361h-3.258a2.027 2.027 0 01-2.091-1.361l-8.266-20.91a1.78 1.78 0 01-.195-.875 2.242 2.242 0 012.286-2.237 2.086 2.086 0 012.042 1.459l7.878 19.84 7.634-19.84a2.087 2.087 0 012.043-1.459 2.242 2.242 0 012.286 2.237zm-117.796-2.237a4.268 4.268 0 014.506 4.611v20.772h-19.5a2.643 2.643 0 01-2.824-2.706v-7.153a4.533 4.533 0 013.842-4.474l14-1.961v-4.615H2.271a2.2 2.2 0 01-2.274-2.237 2.173 2.173 0 012.391-2.237zm.032 20.91v-7.3L4.471 191.03v5.435z"

package/data1/esm/ArxivMarkIcon.svg

@@ -1,4 +1,4 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 135.611 201" fill="currentColor" aria-hidden="true">
+<svg width="16" height="16" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 135.611 201" fill="currentColor" aria-hidden="true">
   <path fill="#aa142d" d="M65.727 82.523l-42.324 49.375c-1.885 2.01-3.054 5.535-2 8.066a6.9 6.9 0 006.443 4.27c1.6 0 2.911-.56 4.631-2.289l52.364-54.278a8.927 8.927 0 00.061-12.584z"/>
   <path fill="#bdb9b4" d="M64.847 81.494l39.168-49.545c2.186-2.914 3.219-4.44 2.186-6.921a7.536 7.536 0 00-6.566-4.633 5.9 5.9 0 00-4.408 1.624L45.155 75.08c-3.816 3.816-3.808 8.753.023 12.584l70.031 73.438a5.738 5.738 0 004.6 1.748c2.833 0 4.67-1.667 5.9-4.131 1.054-2.531-.112-5.038-2.056-7.664l-58.8-69.561"/>
   <path fill="#aa142d" d="M84.902 75.08L16.514 3.114S14.003.066 11.349.002a6.75 6.75 0 00-6.357 4.084c-1.033 2.481-.291 4.223 1.977 7.47l58.758 70.967z"/>

package/data1/esm/ArxivMarkIconJupyterLab.d.ts

@@ -1,3 +1,3 @@
-import { LabIcon } from "@jupyterlab/ui-components/lib/icon/labicon";
+import { LabIcon } from "@jupyterlab/ui-components";
 declare const arxivMarkIconJupyterLab: LabIcon;
 export default arxivMarkIconJupyterLab;

package/data1/esm/ArxivMarkIconJupyterLab.js

@@ -1,4 +1,8 @@
-import { LabIcon } from '@jupyterlab/ui-components/lib/icon/labicon';
+// The root import, not lib/icon/labicon: inside JupyterLab the root is a
+// federation singleton, so this LabIcon is the class the host recognises
+// with instanceof — a deep import bundles a private copy the host would
+// not style (the icon then renders unstyled, at its intrinsic size).
+import { LabIcon } from '@jupyterlab/ui-components';
 import ArxivMarkIconSvgStr from './ArxivMarkIcon.svg';
 const arxivMarkIconJupyterLab = new LabIcon({
     name: '@datalayer/icons:arxiv-mark',

package/data1/esm/ArxivMarkSmallIcon.js

@@ -11,31 +11,44 @@ function _DlIconInverseColormode({
   children
 }) {
   const ref = React.useRef(null);
-  const [resolved, setResolved] = React.useState(typeof mode === "string" ? mode : null);
+  const [appearance, setAppearance] = React.useState({
+    mode: typeof mode === "string" ? mode : null,
+    lightTheme: null,
+    darkTheme: null
+  });
   React.useLayoutEffect(() => {
-    if (typeof mode === "string") {
-      setResolved(mode);
-      return;
-    }
     if (typeof document === "undefined") return;
-    let cur = null;
+    let currentMode = null;
+    let lightTheme = null;
+    let darkTheme = null;
     let el = ref.current && ref.current.parentElement;
-    while (el) {
-      const m = el.getAttribute && el.getAttribute("data-color-mode");
-      if (m) { cur = m; break; }
+    while (el && (!currentMode || !lightTheme || !darkTheme)) {
+      if (el.getAttribute) {
+        currentMode = currentMode || el.getAttribute("data-color-mode");
+        lightTheme = lightTheme || el.getAttribute("data-light-theme");
+        darkTheme = darkTheme || el.getAttribute("data-dark-theme");
+      }
       el = el.parentElement;
     }
-    if (!cur || cur === "auto") {
-      cur = (typeof window !== "undefined" && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) ? "dark" : "light";
+    if (!currentMode || currentMode === "auto") {
+      currentMode = (typeof window !== "undefined" && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches) ? "dark" : "light";
     }
-    setResolved(cur === "dark" ? "light" : "dark");
+    setAppearance({
+      mode: typeof mode === "string" ? mode : (currentMode === "dark" ? "light" : "dark"),
+      lightTheme,
+      darkTheme
+    });
   }, [mode]);
   return /*#__PURE__*/React.createElement("span", {
     ref: ref,
-    "data-color-mode": resolved || "light",
-    "data-light-theme": "light",
-    "data-dark-theme": "dark",
-    style: { display: "inline-flex", lineHeight: 0 }
+    "data-color-mode": appearance.mode || "light",
+    "data-light-theme": appearance.lightTheme || undefined,
+    "data-dark-theme": appearance.darkTheme || undefined,
+    style: {
+      display: "inline-flex",
+      lineHeight: 0,
+      color: "var(--fgColor-default, var(--color-fg-default, currentColor))"
+    }
   }, children);
 }
 
@@ -51,25 +64,27 @@ function ArxivMarkSmallIcon({
   const _svgEl = /*#__PURE__*/React.createElement("svg", Object.assign({
     xmlns: "http://www.w3.org/2000/svg",
     viewBox: "0 0 17.732 24.269",
-    fill: themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor',
+    fill: (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 72%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 62%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 72%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 62%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 72%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     height: size ? typeof size === "string" ? sizeMap[size] : size : "16px",
     "aria-hidden": "true",
     ref: svgRef,
     "aria-labelledby": titleId
   }, props, {
+    "data-datalayer-icon": "",
     style: props && props.color != null ? Object.assign({}, props.style, {
-      "--datalayer-icon-fg": props.color
+      "--datalayer-icon-color": props.color,
+      color: props.color
     }) : props && props.style
-  }), title ? /*#__PURE__*/React.createElement("title", {
+  }), /*#__PURE__*/React.createElement("style", null, "[data-color-mode=\"light\"]{--datalayer-icon-color-scheme:light}[data-color-mode=\"dark\"]{--datalayer-icon-color-scheme:dark}svg[data-datalayer-icon]{color-scheme:var(--datalayer-icon-color-scheme, light dark)}"), title ? /*#__PURE__*/React.createElement("title", {
     id: titleId
   }, title) : null, /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#bdb9b4' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#bdb9b4" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 64%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 70%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 64%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 70%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 64%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M6.565 9.368l2.266 2.738 6.674-7.84c.353-.47.52-.717.353-1.117a1.218 1.218 0 00-1.061-.748.953.953 0 00-.712.262z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#b31b1b' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#b31b1b" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 85%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 49%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M12.541 10.677L1.935.503a1.413 1.413 0 00-.834-.5 1.09 1.09 0 00-1.027.66c-.167.4-.047.681.319 1.206l8.44 10.242-6.282 7.716a1.336 1.336 0 00-.323 1.3 1.114 1.114 0 001.04.69.992.992 0 00.748-.365l8.519-7.92a1.924 1.924 0 00.006-2.855z"
   }), /*#__PURE__*/React.createElement("path", {
-    fill: colored ? '#bdb9b4' : (themed ? 'var(--datalayer-icon-fg, currentColor)' : 'currentColor'),
+    fill: colored ? "#bdb9b4" : (props.color != null ? "color-mix(in srgb, var(--datalayer-icon-color, currentColor) 64%, black)" : (themed ? "light-dark(color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 70%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, var(--datalayer-icon-fg, currentColor)) 64%, var(--bgColor-default, var(--color-canvas-default, Canvas))))" : "light-dark(color-mix(in srgb, var(--datalayer-icon-color, currentColor) 70%, var(--bgColor-default, var(--color-canvas-default, Canvas))), color-mix(in srgb, var(--datalayer-icon-color, currentColor) 64%, var(--bgColor-default, var(--color-canvas-default, Canvas))))")),
     d: "M17.336 22.364L8.811 12.089 6.546 9.352l-1.389 1.254a2.063 2.063 0 000 2.965L15.969 23.99a.925.925 0 00.742.282 1.039 1.039 0 00.953-.667 1.261 1.261 0 00-.328-1.241z"
   }));
   if (!colormode) return _svgEl;

package/data1/esm/ArxivMarkSmallIcon.svg

@@ -1,4 +1,4 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 17.732 24.269" fill="currentColor" aria-hidden="true">
+<svg width="16" height="16" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 17.732 24.269" fill="currentColor" aria-hidden="true">
   <path fill="#bdb9b4" d="M6.565 9.368l2.266 2.738 6.674-7.84c.353-.47.52-.717.353-1.117a1.218 1.218 0 00-1.061-.748.953.953 0 00-.712.262z"/>
   <path fill="#b31b1b" d="M12.541 10.677L1.935.503a1.413 1.413 0 00-.834-.5 1.09 1.09 0 00-1.027.66c-.167.4-.047.681.319 1.206l8.44 10.242-6.282 7.716a1.336 1.336 0 00-.323 1.3 1.114 1.114 0 001.04.69.992.992 0 00.748-.365l8.519-7.92a1.924 1.924 0 00.006-2.855z"/>
   <path fill="#bdb9b4" d="M17.336 22.364L8.811 12.089 6.546 9.352l-1.389 1.254a2.063 2.063 0 000 2.965L15.969 23.99a.925.925 0 00.742.282 1.039 1.039 0 00.953-.667 1.261 1.261 0 00-.328-1.241z"/>

package/data1/esm/ArxivMarkSmallIconJupyterLab.d.ts

@@ -1,3 +1,3 @@
-import { LabIcon } from "@jupyterlab/ui-components/lib/icon/labicon";
+import { LabIcon } from "@jupyterlab/ui-components";
 declare const arxivMarkSmallIconJupyterLab: LabIcon;
 export default arxivMarkSmallIconJupyterLab;

package/data1/esm/ArxivMarkSmallIconJupyterLab.js

@@ -1,4 +1,8 @@
-import { LabIcon } from '@jupyterlab/ui-components/lib/icon/labicon';
+// The root import, not lib/icon/labicon: inside JupyterLab the root is a
+// federation singleton, so this LabIcon is the class the host recognises
+// with instanceof — a deep import bundles a private copy the host would
+// not style (the icon then renders unstyled, at its intrinsic size).
+import { LabIcon } from '@jupyterlab/ui-components';
 import ArxivMarkSmallIconSvgStr from './ArxivMarkSmallIcon.svg';
 const arxivMarkSmallIconJupyterLab = new LabIcon({
     name: '@datalayer/icons:arxiv-mark-small',