timvir 0.2.2 → 0.2.3

package/blocks/Arbitrary/index.js

@@ -41,11 +41,9 @@ const cx = function cx() {
       result.push(atomicClasses[keyHash]);
     }
   }
-
   result.push(...nonAtomicClasses);
   return result.join(' ');
 };
-
 var cx$1 = cx;
 
 const bytesToHex = (() => {
@@ -54,67 +52,53 @@ const bytesToHex = (() => {
   }).map((_, i) => i.toString(16).padStart(2, "0"));
   return uint8a => [...uint8a].map(o => s[o]).join("");
 })();
-
 const alphabet = "123456789ABCDEFGHJKLMNPQRSTUVWXYZabcdefghijkmnopqrstuvwxyz";
 function encode(input) {
   if (input.length === 0) {
     return "";
-  } // Uint8Array -> BigInt (Big Endian)
-
-
+  }
+  // Uint8Array -> BigInt (Big Endian)
   let x = BigInt("0x" + bytesToHex(input));
   const output = [];
-
   while (x > 0n) {
     const mod = x % 58n;
     x = x / 58n;
     output.push(alphabet[Number(mod)]);
   }
-
   for (let i = 0; input[i] === 0; i++) {
     output.push(alphabet[0]);
   }
-
   return output.reverse().join("");
 }
 function decode(output) {
   if (output.length === 0) {
     return new Uint8Array();
   }
-
   const bytes = [0];
   const letters = alphabet;
-
   for (const char of output) {
     const value = letters.indexOf(char);
-
     if (value === undefined) {
       throw new Error(`base58.decode received invalid input. Character '${char}' is not in the base58 alphabet.`);
     }
-
     for (let j = 0; j < bytes.length; j++) {
       bytes[j] *= 58;
     }
-
     bytes[0] += value;
     let carry = 0;
-
     for (let j = 0; j < bytes.length; j++) {
       bytes[j] += carry;
       carry = bytes[j] >> 8;
       bytes[j] &= 0xff;
     }
-
     while (carry > 0) {
       bytes.push(carry & 0xff);
       carry >>= 8;
     }
   }
-
   for (let i = 0; i < output.length && output[i] === "1"; i++) {
     bytes.push(0);
   }
-
   return new Uint8Array(bytes.reverse());
 }
 
@@ -126,9 +110,7 @@ const useContext = () => React.useContext(Context);
 /**
  * The underlying DOM element which is rendered by this component.
  */
-
 const Root = "div";
-
 function Arbitrary(props, ref) {
   const block = useBlock(props);
   const {
@@ -188,10 +170,10 @@ function Arbitrary(props, ref) {
         draft.seed = crypto.getRandomValues(new Uint32Array(1))[0];
       });
     }
-  }, "Refresh")), /*#__PURE__*/React.createElement(Exhibit, { ...ExhibitProps
+  }, "Refresh")), /*#__PURE__*/React.createElement(Exhibit, {
+    ...ExhibitProps
   }, children)));
 }
-
 var Arbitrary$1 = /*#__PURE__*/React.forwardRef(Arbitrary);
 const classes = {
   root: "r1ev38xg",

package/blocks/Arbitrary/styles.css

@@ -4,3 +4,4 @@
 .s1k50njo{display:inline-block;color:var(--timvir-secondary-text-color);margin-right:6px;}
 .i1dajnne{border:none;outline:none;font:inherit;background:transparent;align-self:stretch;padding:0;height:34px;width:100%;color:inherit;}
 .b128wsn{border:none;outline:none;height:36px;background:var(--timvir-accent-color);font:inherit;border-radius:2px;cursor:pointer;transition:background 0.2s;}.b128wsn:hover{background:var(--c-p-3);}.b128wsn:active{background:var(--c-p-4);}
+

package/blocks/Code/index.js

@@ -43,11 +43,9 @@ const cx = function cx() {
       result.push(atomicClasses[keyHash]);
     }
   }
-
   result.push(...nonAtomicClasses);
   return result.join(' ');
 };
-
 var cx$1 = cx;
 
 var theme = "tac6gx6";
@@ -55,16 +53,15 @@ var theme = "tac6gx6";
 /**
  * This is documentation for the Code component.
  */
+
 /**
  * The underlying DOM element which is rendered by this component.
  */
-
 const Root = "div";
 const nullTheme = {
   plain: {},
   styles: []
 };
-
 function Code(props, ref) {
   const block = useBlock(props);
   const {
@@ -75,11 +72,9 @@ function Code(props, ref) {
     caption,
     ...rest
   } = block.props;
-
   const isHighlightedLine = (() => {
     return line => highlightedLines === null || highlightedLines === void 0 ? void 0 : highlightedLines.includes(line);
   })();
-
   const [state, mutate] = useImmer({
     mouseOver: false,
     copiedToClipboard: false
@@ -88,7 +83,8 @@ function Code(props, ref) {
     ref: ref,
     className: cx$1(classes.root, fullWidth && Page.fullWidth),
     ...rest
-  }, /*#__PURE__*/React.createElement(Highlight, { ...defaultProps,
+  }, /*#__PURE__*/React.createElement(Highlight, {
+    ...defaultProps,
     code: children.trim(),
     language: language !== null && language !== void 0 ? language : "markup",
     theme: nullTheme
@@ -158,7 +154,6 @@ function Code(props, ref) {
     className: classes.caption
   }, caption));
 }
-
 var Code$1 = /*#__PURE__*/React.forwardRef(Code);
 const classes = {
   root: "r9v2r0l",

package/blocks/Code/styles.css

@@ -1,3 +1,5 @@
+.tac6gx6{color:#393a34;background-color:#f6f8fa;}.tac6gx6 :is(.comment,.prolog,.doctype,.cdata){color:#999988;font-style:italic;}.tac6gx6 :is(.namespace){opacity:0.7;}.tac6gx6 :is(.string,.attr-value){color:#e3116c;}.tac6gx6 :is(.punctuation,.operator){color:#6cb6ff;}.tac6gx6 :is(.function,.delete,.tag){color:#d73a49;}.tac6gx6 :is(.tag,.selector,.keyword){color:#00009f;}.tac6gx6 :is(.function-variable){color:#6f42c1;}.tac6gx6 :is(.atrule,.keyword,.attr-name,.selector){color:#00a4db;}.tac6gx6 :is(.entity,.url,.symbol,.number,.boolean,.variable,.constant,.property,.regex,.inserted){color:#36acaa;}:root[data-timvir-theme="dark"] .tac6gx6{color:#adbac7;background-color:#2d333b;}:root[data-timvir-theme="dark"] .tac6gx6 :is(.comment,.prolog,.doctype,.cdata){color:#999988;font-style:italic;}:root[data-timvir-theme="dark"] .tac6gx6 :is(.namespace){opacity:0.7;}:root[data-timvir-theme="dark"] .tac6gx6 :is(.string,.attr-value){color:#96d0ff;}:root[data-timvir-theme="dark"] .tac6gx6 :is(.punctuation,.operator){color:#6cb6ff;}:root[data-timvir-theme="dark"] .tac6gx6 :is(.function,.delete,.tag){color:#d73a49;}:root[data-timvir-theme="dark"] .tac6gx6 :is(.tag,.selector,.keyword){color:#8ddb8c;}:root[data-timvir-theme="dark"] .tac6gx6 :is(.function-variable){color:#6f42c1;}:root[data-timvir-theme="dark"] .tac6gx6 :is(.atrule,.keyword,.attr-name,.selector){color:#f47067;}:root[data-timvir-theme="dark"] .tac6gx6 :is(.entity,.url,.symbol,.number,.boolean,.variable,.constant,.property,.regex,.inserted){color:#dcbdfb;}
+
 .d1513p2s{display:grid;grid-template-columns:1fr;padding-block:16px;}
 .b157mkz{--size:48px;z-index:1;position:absolute;top:0;right:0;overflow:hidden;width:var(--size);height:var(--size);display:flex;align-items:flex-start;justify-content:flex-end;outline:none;border:none;padding:6px;background:transparent;transition:all 0.2s;cursor:pointer;pointer-events:none;opacity:0;}.b157mkz:hover{color:white;}.b157mkz:hover svg:first-child{transform:translate(0,0);}.b157mkz:active svg:first-child{transform:translate(2px,-2px);}
 .b10oxtfo{pointer-events:all;opacity:1;}
@@ -11,4 +13,4 @@
 .h1xcko1i{background-color:#ffe10044;}:root[data-timvir-theme="dark"] .h1xcko1i{background-color:rgba(174,124,20,0.15);}
 .ll2b9hx{display:inline-block;width:var(--timvir-b-Code-bleed);color:var(--timvir-secondary-text-color);text-align:right;padding-inline:4px;}
 .c5vr6r2{font-size:0.75rem;color:var(--timvir-secondary-text-color);margin-top:2px;}
-.tac6gx6{color:#393a34;background-color:#f6f8fa;}.tac6gx6 :is(.comment,.prolog,.doctype,.cdata){color:#999988;font-style:italic;}.tac6gx6 :is(.namespace){opacity:0.7;}.tac6gx6 :is(.string,.attr-value){color:#e3116c;}.tac6gx6 :is(.punctuation,.operator){color:#6cb6ff;}.tac6gx6 :is(.function,.delete,.tag){color:#d73a49;}.tac6gx6 :is(.tag,.selector,.keyword){color:#00009f;}.tac6gx6 :is(.function-variable){color:#6f42c1;}.tac6gx6 :is(.atrule,.keyword,.attr-name,.selector){color:#00a4db;}.tac6gx6 :is(.entity,.url,.symbol,.number,.boolean,.variable,.constant,.property,.regex,.inserted){color:#36acaa;}:root[data-timvir-theme="dark"] .tac6gx6{color:#adbac7;background-color:#2d333b;}:root[data-timvir-theme="dark"] .tac6gx6 :is(.comment,.prolog,.doctype,.cdata){color:#999988;font-style:italic;}:root[data-timvir-theme="dark"] .tac6gx6 :is(.namespace){opacity:0.7;}:root[data-timvir-theme="dark"] .tac6gx6 :is(.string,.attr-value){color:#96d0ff;}:root[data-timvir-theme="dark"] .tac6gx6 :is(.punctuation,.operator){color:#6cb6ff;}:root[data-timvir-theme="dark"] .tac6gx6 :is(.function,.delete,.tag){color:#d73a49;}:root[data-timvir-theme="dark"] .tac6gx6 :is(.tag,.selector,.keyword){color:#8ddb8c;}:root[data-timvir-theme="dark"] .tac6gx6 :is(.function-variable){color:#6f42c1;}:root[data-timvir-theme="dark"] .tac6gx6 :is(.atrule,.keyword,.attr-name,.selector){color:#f47067;}:root[data-timvir-theme="dark"] .tac6gx6 :is(.entity,.url,.symbol,.number,.boolean,.variable,.constant,.property,.regex,.inserted){color:#dcbdfb;}
+

package/blocks/ColorBar/index.js

@@ -40,22 +40,17 @@ const cx = function cx() {
       result.push(atomicClasses[keyHash]);
     }
   }
-
   result.push(...nonAtomicClasses);
   return result.join(' ');
 };
-
 var cx$1 = cx;
 
 /**
  * The underlying DOM element which is rendered by this component.
  */
-
 const Root = "div";
-
 function ColorBar(props, ref) {
   var _selected$value;
-
   const block = useBlock(props);
   const {
     values,
@@ -84,7 +79,8 @@ function ColorBar(props, ref) {
     }
   })))), /*#__PURE__*/React.createElement("div", {
     className: classes.overlay
-  }, /*#__PURE__*/React.createElement(Swatch, { ...(typeof selected === "string" ? {
+  }, /*#__PURE__*/React.createElement(Swatch, {
+    ...(typeof selected === "string" ? {
       value: selected
     } : {
       value: (_selected$value = selected === null || selected === void 0 ? void 0 : selected.value) !== null && _selected$value !== void 0 ? _selected$value : ""
@@ -94,7 +90,6 @@ function ColorBar(props, ref) {
     }
   })));
 }
-
 var ColorBar$1 = /*#__PURE__*/React.forwardRef(ColorBar);
 const tweaks = {
   selected: "s4sqb81"

package/blocks/ColorBar/styles.css

@@ -3,3 +3,4 @@
 .b15hqsfj{display:grid;grid-auto-flow:row;grid-template-columns:repeat(auto-fit,minmax(0,1fr));transition:all 0.16s;}.b15hqsfj::before{position:absolute;top:0;right:0;bottom:0;left:0;display:block;z-index:2;border-radius:2px;box-shadow:inset 0 0 0 1px rgba(16,22,26,0.15);content:"";pointer-events:none;user-select:none;transition:all 0.16s;}.b15hqsfj:hover::before{opacity:0;}
 .v1uw85xw{height:40px;flex-grow:1;display:grid;place-items:stretch;}.v1uw85xw > div{transition:all 0.16s;cursor:pointer;}.v1uw85xw:first-child > div{border-radius:2px 0 0 2px;}.v1uw85xw:last-child > div{border-radius:0 2px 2px 0;}.v1uw85xw:hover{z-index:3;}.v1uw85xw:hover > div{border-radius:2px;margin:-3px 1px;box-shadow:inset 0 0 0 1px rgba(16,22,26,0.2),0 2px 4px rgba(16,22,26,0.1), 0 8px 24px rgba(16,22,26,0.2);}
 .o1823law{position:absolute;top:50%;right:0px;left:0px;transform:translateY(-50%);pointer-events:none;opacity:0;z-index:4;transition:opacity 0.16s;}.s4sqb81 .o1823law{pointer-events:all;opacity:1;}
+

package/blocks/ColorBook/index.js

@@ -38,19 +38,15 @@ const cx = function cx() {
       result.push(atomicClasses[keyHash]);
     }
   }
-
   result.push(...nonAtomicClasses);
   return result.join(' ');
 };
-
 var cx$1 = cx;
 
 /**
  * The underlying DOM element which is rendered by this component.
  */
-
 const Root = "div";
-
 function ColorBook(props, ref) {
   const {
     chapters,
@@ -88,7 +84,6 @@ function ColorBook(props, ref) {
     className: cx$1("d1uopbb", i === selectedChapter && "d1vwzhoa")
   }, name))));
 }
-
 var ColorBook$1 = /*#__PURE__*/React.forwardRef(ColorBook);
 const chapter = "c1xqhu04";
 const activeChapter = "a1y0tcvx";

package/blocks/ColorBook/styles.css

@@ -4,3 +4,4 @@
 .d1vwzhoa{color:var(--timvir-text-color);}
 .c1xqhu04{position:relative;cursor:pointer;display:flex;flex-direction:column;height:200px;}.c1xqhu04::before{position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;border-radius:4px;box-shadow:0 0 0 0 rgba(19,124,189,0);content:"";transition:all 0.16s cubic-bezier(0.4,1,0.75,0.9);}.c1xqhu04:hover::before{box-shadow:0 0 0 2px #00000040;opacity:1;}
 .a1y0tcvx:hover::before,.a1y0tcvx::before{box-shadow:0 0 0 2px var(--c-p-5);opacity:1;}
+

package/blocks/Cover/index.js

@@ -39,19 +39,15 @@ const cx = function cx() {
       result.push(atomicClasses[keyHash]);
     }
   }
-
   result.push(...nonAtomicClasses);
   return result.join(' ');
 };
-
 var cx$1 = cx;
 
 /**
  * The underlying DOM element which is rendered by this component.
  */
-
 const Root = "div";
-
 function Cover(props, ref) {
   const {
     metadata,
@@ -67,7 +63,8 @@ function Cover(props, ref) {
   }, /*#__PURE__*/React.createElement("picture", null, sources.map((p, i) => /*#__PURE__*/React.createElement("source", {
     key: i,
     ...p
-  })), /*#__PURE__*/React.createElement("img", { ...metadata,
+  })), /*#__PURE__*/React.createElement("img", {
+    ...metadata,
     ...img,
     style: {
       display: "block",
@@ -77,7 +74,6 @@ function Cover(props, ref) {
     }
   })));
 }
-
 var Cover$1 = /*#__PURE__*/React.forwardRef(Cover);
 
 export { Cover$1 as Cover };

package/blocks/Cover/styles.css

@@ -0,0 +1 @@
+

package/blocks/Exhibit/index.js

@@ -40,19 +40,15 @@ const cx = function cx() {
       result.push(atomicClasses[keyHash]);
     }
   }
-
   result.push(...nonAtomicClasses);
   return result.join(' ');
 };
-
 var cx$1 = cx;
 
 /**
  * The underlying DOM element which is rendered by this component.
  */
-
 const Root = "figure";
-
 function Exhibit(props, ref) {
   const block = useBlock(props);
   const components = {
@@ -72,7 +68,8 @@ function Exhibit(props, ref) {
   return /*#__PURE__*/React.createElement(React.Fragment, null, title && /*#__PURE__*/React.createElement(components.h3, null, title), /*#__PURE__*/React.createElement(Root, {
     ref: ref,
     className: cx$1(className, classes.root),
-    style: { ...style,
+    style: {
+      ...style,
       [cssVariables.bleed]: typeof bleed === "number" ? `${bleed}px` : bleed
     },
     ...rest
@@ -86,7 +83,6 @@ function Exhibit(props, ref) {
     className: classes.caption
   }, caption)));
 }
-
 var Exhibit$1 = /*#__PURE__*/React.forwardRef(Exhibit);
 const cssVariables = {
   bleed: "--timvir-b-Exhibit-bleed",

package/blocks/Exhibit/styles.css

@@ -1,3 +1,4 @@
 .r1nql2f9{margin:0 0 1.5rem;--timvir-b-Exhibit-bleed:0px;--timvir-b-Exhibit-borderColor:#EFEFEF;--timvir-b-Exhibit-background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAAAAACoWZBhAAAAF0lEQVQI12P4BAI/QICBFCaYBPNJYQIAkUZftTbC4sIAAAAASUVORK5CYII=);}:root[data-timvir-theme="dark"] .r1nql2f9{--timvir-b-Exhibit-borderColor:#101010;--timvir-b-Exhibit-background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAAAAACoWZBhAAAAFklEQVQI12NQBQF2EGAghQkmwXxSmADZJQiZ2ZZ46gAAAABJRU5ErkJggg==);}
 .c4ji594{display:flow-root;background:var(--timvir-b-Exhibit-background);margin:0 calc(-1 * var(--timvir-b-Exhibit-bleed));padding:var(--timvir-b-Exhibit-bleed);}
 .cf43jjx{font-size:0.75rem;color:var(--timvir-secondary-text-color);margin-top:2px;}
+

package/blocks/Font/index.js

@@ -40,22 +40,18 @@ const cx = function cx() {
       result.push(atomicClasses[keyHash]);
     }
   }
-
   result.push(...nonAtomicClasses);
   return result.join(' ');
 };
-
 var cx$1 = cx;
 
 /**
  * The underlying DOM element which is rendered by this component.
  */
-
 const Root = "div";
 const classes = {
   meta: "mby32tn"
 };
-
 function Font(props, ref) {
   const components = {
     h3: "h3",
@@ -78,7 +74,6 @@ function Font(props, ref) {
       const intervalId = setInterval(() => {
         if (fontSizeRef) {
           const innerText = `${name} – ${Math.round(parseInt(computedStyle.fontSize))}px`;
-
           if (fontSizeRef.innerText !== innerText) {
             fontSizeRef.innerText = innerText;
           }
@@ -105,14 +100,17 @@ function Font(props, ref) {
       if (infoRef && contentRef) {
         // const contentParent = contentRef.parentElement;
         const infoParent = infoRef.parentElement;
-
         if (infoParent.style.height === "0px") {
           infoParent.style.height = `${infoRef.getBoundingClientRect().height}px`;
-          infoParent.style.opacity = "1"; // contentParent.style.height = "0px";
+          infoParent.style.opacity = "1";
+
+          // contentParent.style.height = "0px";
           // contentParent.style.opacity = "0";
         } else {
           infoParent.style.height = "0px";
-          infoParent.style.opacity = "0"; // contentParent.style.height = window.getComputedStyle(contentRef).height;
+          infoParent.style.opacity = "0";
+
+          // contentParent.style.height = window.getComputedStyle(contentRef).height;
           // contentParent.style.opacity = "1";
         }
       }
@@ -144,7 +142,6 @@ function Font(props, ref) {
     style: font.style
   }, children || "The quick brown fox jumps over the lazy dog"))));
 }
-
 var Font$1 = /*#__PURE__*/React.forwardRef(Font);
 
 export { Font$1 as Font };

package/blocks/Font/styles.css

@@ -7,3 +7,4 @@
 .ddlplux{padding:0 0 16px;display:flex;flex-direction:column;}
 .dw285p4{overflow:hidden;transition:height 0.2s,opacity 0.2s 0.1s;}
 .dx3nfmc{outline:none;user-select:text;white-space:pre-wrap;overflow-wrap:break-word;}
+

package/blocks/Grid/index.js

@@ -38,19 +38,15 @@ const cx = function cx() {
       result.push(atomicClasses[keyHash]);
     }
   }
-
   result.push(...nonAtomicClasses);
   return result.join(' ');
 };
-
 var cx$1 = cx;
 
 /**
  * The underlying DOM element which is rendered by this component.
  */
-
 const Root = "div";
-
 function Grid(props, ref) {
   const {
     children,
@@ -63,7 +59,6 @@ function Grid(props, ref) {
     ...rest
   }, children);
 }
-
 var Grid$1 = /*#__PURE__*/React.forwardRef(Grid);
 const classes = {
   root: "r1c1ozpm"

package/blocks/Grid/styles.css

@@ -1 +1,2 @@
 .r1c1ozpm{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px;}
+

package/blocks/Icon/index.js

@@ -39,11 +39,9 @@ const cx = function cx() {
       result.push(atomicClasses[keyHash]);
     }
   }
-
   result.push(...nonAtomicClasses);
   return result.join(' ');
 };
-
 var cx$1 = cx;
 
 const Root$1 = "div";
@@ -51,7 +49,6 @@ const classes$1 = {
   backdrop: "b1a0xzv7",
   grid: "g10obtzp"
 };
-
 function Canvas(props) {
   const {
     width,
@@ -77,7 +74,6 @@ function Canvas(props) {
     }
   }, /*#__PURE__*/React.createElement(Component, null)));
 }
-
 function Grid({
   size,
   ...rest
@@ -85,7 +81,6 @@ function Grid({
   const halfSize = size / 2;
   const center = 60;
   const whiskerLength = Math.min(16, size / 2);
-
   const Corner = ({
     dx,
     dy
@@ -104,11 +99,8 @@ function Grid({
     strokeWidth: 1,
     stroke: "#EEEEEE"
   }));
-
   const add = (a, b) => a + b;
-
   const sub = (a, b) => a - b;
-
   return /*#__PURE__*/React.createElement("svg", {
     width: "120",
     height: "120",
@@ -142,7 +134,6 @@ const Root = "div";
 const classes = {
   name: "n1xsexuc"
 };
-
 function Icon(props, ref) {
   const {
     descriptor,
@@ -160,15 +151,12 @@ function Icon(props, ref) {
   }, width !== undefined && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Canvas, {
     width: width,
     height: width,
-    size: 32
-    /*descriptor.instances[0].size as number */
-    ,
+    size: 32 /*descriptor.instances[0].size as number */,
     Component: descriptor.instances[0].Component
   }), /*#__PURE__*/React.createElement("div", {
     className: classes.name
   }, descriptor.name))));
 }
-
 var Icon$1 = /*#__PURE__*/React.forwardRef(Icon);
 
 export { Icon$1 as Icon };

package/blocks/Icon/styles.css

@@ -1,5 +1,7 @@
-.n1xsexuc{margin-top:6px;white-space:nowrap;font-size:0.75rem;opacity:0;transition:all 0.16s;z-index:-1;color:var(--timvir-secondary-text-color);text-align:center;user-select:none;pointer-events:none;position:absolute;left:50%;bottom:-20px;transform:translateX(-50%);}
-.r1k0w618{position:relative;z-index:1;}.r1k0w618 svg{display:block;}.r1k0w618:hover .n1xsexuc{opacity:1;bottom:-26px;color:var(--timvir-text-color);}.r1k0w618:active .n1xsexuc{bottom:-24px;}
 .b1a0xzv7{background:white;place-self:stretch;border-radius:2px;transition:all 0.2s;box-shadow:0 0 0 0 rgba(0,0,0,0.1);}
 .g10obtzp{opacity:0;transition:all 0.2s;pointer-events:none;}
 .r1bcczis{display:grid;place-items:center;cursor:pointer;}.r1bcczis > *{grid-column:1;grid-row:1;}.r1bcczis:hover .b1a0xzv7{box-shadow:inset 0 0 0 1px rgba(16,22,26,0.2),0 2px 4px rgba(16,22,26,0.1), 0 8px 24px rgba(16,22,26,0.2);}.r1bcczis:active .b1a0xzv7{margin:1px;box-shadow:inset 0 0 0 1px rgba(16,22,26,0.2),0 1px 1px rgba(16,22,26,0.2);}.r1bcczis:hover .g10obtzp{opacity:1;}
+
+.n1xsexuc{margin-top:6px;white-space:nowrap;font-size:0.75rem;opacity:0;transition:all 0.16s;z-index:-1;color:var(--timvir-secondary-text-color);text-align:center;user-select:none;pointer-events:none;position:absolute;left:50%;bottom:-20px;transform:translateX(-50%);}
+.r1k0w618{position:relative;z-index:1;}.r1k0w618 svg{display:block;}.r1k0w618:hover .n1xsexuc{opacity:1;bottom:-26px;color:var(--timvir-text-color);}.r1k0w618:active .n1xsexuc{bottom:-24px;}
+

package/blocks/Message/index.js

@@ -39,19 +39,15 @@ const cx = function cx() {
       result.push(atomicClasses[keyHash]);
     }
   }
-
   result.push(...nonAtomicClasses);
   return result.join(' ');
 };
-
 var cx$1 = cx;
 
 /**
  * The underlying DOM element which is rendered by this component.
  */
-
 const Root = "div";
-
 function Message(props, ref) {
   const {
     variant,
@@ -79,7 +75,6 @@ function Message(props, ref) {
     className: "dhvu07f"
   }, children));
 }
-
 var Message$1 = /*#__PURE__*/React.forwardRef(Message);
 const icon = "i1dz18jz";
 const variantStyles = {

package/blocks/Message/styles.css

@@ -4,3 +4,4 @@
 .i41wipx{background:#f0f2fc;color:black;}.i41wipx .i1dz18jz{color:#2a47d5;}
 .wi7iy6{background:#fcf9f0;color:black;}.wi7iy6 .i1dz18jz{color:#a68521;}
 .a1d5oxsn{background:#fcf0f0;color:black;}.a1d5oxsn .i1dz18jz{color:#da4444;}
+

package/blocks/Swatch/index.js

@@ -39,19 +39,15 @@ const cx = function cx() {
       result.push(atomicClasses[keyHash]);
     }
   }
-
   result.push(...nonAtomicClasses);
   return result.join(' ');
 };
-
 var cx$1 = cx;
 
 /**
  * The underlying DOM element which is rendered by this component.
  */
-
 const Root = "div";
-
 function Swatch(props, ref) {
   const block = useBlock(props);
   const {
@@ -97,7 +93,6 @@ function Swatch(props, ref) {
     className: "dho7t08"
   }, ancestry)));
 }
-
 var Swatch$1 = /*#__PURE__*/React.forwardRef(Swatch);
 
 export { Swatch$1 as Swatch };

package/blocks/Swatch/styles.css

@@ -2,3 +2,4 @@
 .dhgsgky{display:flex;flex-direction:column;justify-content:center;position:absolute;top:0;right:0;bottom:0;left:0;transition:all 0.16s;padding:0px 12px;cursor:pointer;}
 .dobecwk{display:flex;justify-content:space-between;align-items:center;line-height:1;}
 .dho7t08{padding-top:6px;opacity:0.5;font-size:0.8em;line-height:1;}
+