timvir 0.2.38 → 0.2.42

package/blocks/ColorBook/index.js

@@ -1,77 +1,239 @@
 import * as React from 'react';
+import { layoutStyles } from 'timvir/core';
+import { jsx, jsxs } from 'react/jsx-runtime';
 
-// src/css.ts
-
-// src/cx.ts
-var cx = function cx2() {
-  const presentClassNames = Array.prototype.slice.call(arguments).filter(Boolean);
-  const atomicClasses = {};
-  const nonAtomicClasses = [];
-  presentClassNames.forEach((arg) => {
-    const individualClassNames = arg ? arg.split(" ") : [];
-    individualClassNames.forEach((className) => {
-      if (className.startsWith("atm_")) {
-        const [, keyHash] = className.split("_");
-        atomicClasses[keyHash] = className;
-      } else {
-        nonAtomicClasses.push(className);
-      }
+var styleq = {};
+var hasRequiredStyleq;
+function requireStyleq() {
+    if (hasRequiredStyleq) return styleq;
+    hasRequiredStyleq = 1;
+    Object.defineProperty(styleq, "__esModule", {
+        value: true
     });
-  });
-  const result = [];
-  for (const keyHash in atomicClasses) {
-    if (Object.prototype.hasOwnProperty.call(atomicClasses, keyHash)) {
-      result.push(atomicClasses[keyHash]);
+    styleq.styleq = void 0;
+    var cache = new WeakMap();
+    var compiledKey = '$$css';
+    function createStyleq(options) {
+        var disableCache;
+        var disableMix;
+        var transform;
+        if (options != null) {
+            disableCache = options.disableCache === true;
+            disableMix = options.disableMix === true;
+            transform = options.transform;
+        }
+        return function styleq() {
+            var definedProperties = [];
+            var className = '';
+            var inlineStyle = null;
+            var debugString = '';
+            var nextCache = disableCache ? null : cache;
+            var styles = new Array(arguments.length);
+            for(var i = 0; i < arguments.length; i++){
+                styles[i] = arguments[i];
+            }
+            while(styles.length > 0){
+                var possibleStyle = styles.pop();
+                if (possibleStyle == null || possibleStyle === false) {
+                    continue;
+                }
+                if (Array.isArray(possibleStyle)) {
+                    for(var _i = 0; _i < possibleStyle.length; _i++){
+                        styles.push(possibleStyle[_i]);
+                    }
+                    continue;
+                }
+                var style = transform != null ? transform(possibleStyle) : possibleStyle;
+                if (style.$$css != null) {
+                    var classNameChunk = '';
+                    if (nextCache != null && nextCache.has(style)) {
+                        var cacheEntry = nextCache.get(style);
+                        if (cacheEntry != null) {
+                            classNameChunk = cacheEntry[0];
+                            debugString = cacheEntry[2];
+                            definedProperties.push.apply(definedProperties, cacheEntry[1]);
+                            nextCache = cacheEntry[3];
+                        }
+                    } else {
+                        var definedPropertiesChunk = [];
+                        for(var prop in style){
+                            var value = style[prop];
+                            if (prop === compiledKey) {
+                                var compiledKeyValue = style[prop];
+                                if (compiledKeyValue !== true) {
+                                    debugString = debugString ? compiledKeyValue + '; ' + debugString : compiledKeyValue;
+                                }
+                                continue;
+                            }
+                            if (typeof value === 'string' || value === null) {
+                                if (!definedProperties.includes(prop)) {
+                                    definedProperties.push(prop);
+                                    if (nextCache != null) {
+                                        definedPropertiesChunk.push(prop);
+                                    }
+                                    if (typeof value === 'string') {
+                                        classNameChunk += classNameChunk ? ' ' + value : value;
+                                    }
+                                }
+                            } else {
+                                console.error("styleq: ".concat(prop, " typeof ").concat(String(value), " is not \"string\" or \"null\"."));
+                            }
+                        }
+                        if (nextCache != null) {
+                            var weakMap = new WeakMap();
+                            nextCache.set(style, [
+                                classNameChunk,
+                                definedPropertiesChunk,
+                                debugString,
+                                weakMap
+                            ]);
+                            nextCache = weakMap;
+                        }
+                    }
+                    if (classNameChunk) {
+                        className = className ? classNameChunk + ' ' + className : classNameChunk;
+                    }
+                } else {
+                    if (disableMix) {
+                        if (inlineStyle == null) {
+                            inlineStyle = {};
+                        }
+                        inlineStyle = Object.assign({}, style, inlineStyle);
+                    } else {
+                        var subStyle = null;
+                        for(var _prop in style){
+                            var _value = style[_prop];
+                            if (_value !== undefined) {
+                                if (!definedProperties.includes(_prop)) {
+                                    if (_value != null) {
+                                        if (inlineStyle == null) {
+                                            inlineStyle = {};
+                                        }
+                                        if (subStyle == null) {
+                                            subStyle = {};
+                                        }
+                                        subStyle[_prop] = _value;
+                                    }
+                                    definedProperties.push(_prop);
+                                    nextCache = null;
+                                }
+                            }
+                        }
+                        if (subStyle != null) {
+                            inlineStyle = Object.assign(subStyle, inlineStyle);
+                        }
+                    }
+                }
+            }
+            var styleProps = [
+                className,
+                inlineStyle,
+                debugString
+            ];
+            return styleProps;
+        };
     }
-  }
-  result.push(...nonAtomicClasses);
-  return result.join(" ");
-};
-var cx_default = cx;
+    var styleq$1 = styleq.styleq = createStyleq();
+    styleq$1.factory = createStyleq;
+    return styleq;
+}
+var styleqExports = requireStyleq();
+function props(...styles) {
+    const [className, style, dataStyleSrc] = styleqExports.styleq(styles);
+    const result = {};
+    if (className != null && className !== '') {
+        result.className = className;
+    }
+    if (style != null && Object.keys(style).length > 0) {
+        result.style = style;
+    }
+    if (dataStyleSrc != null && dataStyleSrc !== '') {
+        result['data-style-src'] = dataStyleSrc;
+    }
+    return result;
+}
 
-/**
- * The underlying DOM element which is rendered by this component.
- */
 const Root = "div";
-function ColorBook(props, ref) {
+function ColorBook(props$1, ref) {
   const {
     chapters,
     selectedChapter,
     onSelectChapter,
-    className,
     ...rest
-  } = props;
-  return /*#__PURE__*/React.createElement(Root, {
+  } = props$1;
+  return /*#__PURE__*/jsx(Root, {
     ref: ref,
     ...rest,
-    className: cx_default(className, "rmv2wrl")
-  }, chapters.map(({
-    name,
-    values
-  }, i) => /*#__PURE__*/React.createElement("div", {
-    key: i,
-    style: {
-      gridColumn: i + 1
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    className: cx_default(chapter, i === selectedChapter && activeChapter),
-    onClick: () => {
-      if (onSelectChapter) {
-        onSelectChapter(i);
-      }
-    }
-  }, values.map(value => /*#__PURE__*/React.createElement("div", {
-    key: value,
-    style: {
-      background: value
-    },
-    className: "d1l94wnr"
-  }))), name && /*#__PURE__*/React.createElement("div", {
-    className: cx_default("d1uopbb", i === selectedChapter && "d1vwzhoa")
-  }, name))));
+    ...props(layoutStyles.block, styles.root),
+    children: chapters.map(({
+      name,
+      values
+    }, i) => /*#__PURE__*/jsxs("div", {
+      style: {
+        gridColumn: i + 1
+      },
+      children: [/*#__PURE__*/jsx("div", {
+        ...{
+          0: {
+            className: "timvir-s-1n2onr6 timvir-s-1ypdohk timvir-s-78zum5 timvir-s-dt5ytf timvir-s-1m3v4wt timvir-s-1hmns74 timvir-s-51xajf timvir-s-1ydowbf timvir-s-e80sof timvir-s-abwq6t timvir-s-b52w3a timvir-s-ktd1bz timvir-s-1cpjm7i timvir-s-k53niv timvir-s-115iamj timvir-s-s2hnm7"
+          },
+          1: {
+            className: "timvir-s-1n2onr6 timvir-s-1ypdohk timvir-s-78zum5 timvir-s-dt5ytf timvir-s-1m3v4wt timvir-s-1hmns74 timvir-s-51xajf timvir-s-1ydowbf timvir-s-e80sof timvir-s-abwq6t timvir-s-b52w3a timvir-s-1cpjm7i timvir-s-k53niv timvir-s-ach7vw timvir-s-s2hnm7 timvir-s-su9jc6 timvir-s-fbg1o9"
+          }
+        }[!!(i === selectedChapter) << 0],
+        onClick: () => {
+          if (onSelectChapter) {
+            onSelectChapter(i);
+          }
+        },
+        children: values.map((value, i) => /*#__PURE__*/jsx("div", {
+          style: {
+            background: value
+          },
+          ...props(styles.colorValue, i === 0 ? styles.colorValueFirst : null, i === values.length - 1 ? styles.colorValueLast : null)
+        }, value))
+      }), name && /*#__PURE__*/jsx("div", {
+        ...{
+          0: {
+            className: "timvir-s-2b8uid timvir-s-boafo0 timvir-s-vgvpxu timvir-s-1nmq0fv timvir-s-o5v014"
+          },
+          1: {
+            className: "timvir-s-2b8uid timvir-s-boafo0 timvir-s-1nmq0fv timvir-s-o5v014 timvir-s-1cdhzux"
+          }
+        }[!!(i === selectedChapter) << 0],
+        children: name
+      })]
+    }, i))
+  });
 }
 var ColorBook$1 = /*#__PURE__*/React.forwardRef(ColorBook);
-const chapter = "c1xqhu04";
-const activeChapter = "a1y0tcvx";
+const styles = {
+  root: {
+    k1xSpc: "timvir-s-rvj5dj",
+    kxK9yV: "timvir-s-1p3d3bo",
+    klIVar: "timvir-s-u6a5m6",
+    kGNEyG: "timvir-s-7a106z",
+    kzqmXN: "timvir-s-h8yej3",
+    $$css: true
+  },
+  colorValue: {
+    kzQI83: "timvir-s-1iyjqo2",
+    $$css: true
+  },
+  colorValueFirst: {
+    kIxVMA: "timvir-s-1nrfd8m",
+    ksF3WI: "timvir-s-16gx4na",
+    kqGeR4: "timvir-s-frllxf",
+    kYm2EN: "timvir-s-jppbhk",
+    $$css: true
+  },
+  colorValueLast: {
+    kIxVMA: "timvir-s-1ia1hqs",
+    ksF3WI: "timvir-s-1a2w583",
+    kqGeR4: "timvir-s-1v8xtx2",
+    kYm2EN: "timvir-s-uvn51i",
+    $$css: true
+  }
+};
 
 export { ColorBook$1 as ColorBook };

package/blocks/ColorBook/samples/basic.d.ts

@@ -1,2 +1 @@
-import * as React from "react";
-export default function Sample(): React.JSX.Element;
+export default function Sample(): import("react/jsx-runtime").JSX.Element;

package/blocks/ColorBook/styles.css

@@ -1,7 +1,167 @@
-.rmv2wrl{display:-ms-grid;display:grid;-ms-grid-gap:16px;grid-gap:16px;-ms-grid-auto-columns:1fr;grid-auto-columns:1fr;-webkit-align-items:start;-webkit-box-align:start;-ms-flex-align:start;align-items:start;width:100%;}
-.d1l94wnr{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}.d1l94wnr:first-child{border-radius:3px 3px 0 0;}.d1l94wnr:last-child{border-radius:0 0 3px 3px;}
-.d1uopbb{text-align:center;font-size:0.75rem;color:var(--timvir-secondary-text-color);margin-top:0.8em;line-height:1;}
-.d1vwzhoa{color:var(--timvir-text-color);}
-.c1xqhu04{position:relative;cursor:pointer;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;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:"";-webkit-transition:all 0.16s cubic-bezier(0.4, 1, 0.75, 0.9);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;}
+@layer priority1 {
+  .timvir-s-1p3d3bo {
+    grid-gap: 16px;
+  }
+}
 
+@layer priority2 {
+  .timvir-s-7a106z {
+    align-items: start;
+  }
+
+  .timvir-s-vgvpxu {
+    color: var(--timvir-secondary-text-color);
+  }
+
+  .timvir-s-1cdhzux {
+    color: var(--timvir-text-color);
+  }
+
+  .timvir-s-1ypdohk {
+    cursor: pointer;
+  }
+
+  .timvir-s-78zum5 {
+    display: flex;
+  }
+
+  .timvir-s-rvj5dj {
+    display: grid;
+  }
+
+  .timvir-s-dt5ytf {
+    flex-direction: column;
+  }
+
+  .timvir-s-1iyjqo2 {
+    flex-grow: 1;
+  }
+
+  .timvir-s-boafo0 {
+    font-size: .75rem;
+  }
+
+  .timvir-s-u6a5m6 {
+    grid-auto-columns: 1fr;
+  }
+
+  .timvir-s-o5v014 {
+    line-height: 1;
+  }
+
+  .timvir-s-1n2onr6 {
+    position: relative;
+  }
+
+  .timvir-s-2b8uid {
+    text-align: center;
+  }
+
+  .timvir-s-115iamj:hover:before {
+    box-shadow: 0 0 0 2px #00000040;
+  }
+
+  .timvir-s-ach7vw:hover:before {
+    box-shadow: 0 0 0 2px var(--c-p-5);
+  }
+
+  .timvir-s-s2hnm7:hover:before {
+    opacity: 1;
+  }
+}
+
+@layer priority3 {
+  .timvir-s-frllxf {
+    border-bottom-left-radius: 0;
+  }
+
+  .timvir-s-1v8xtx2 {
+    border-bottom-left-radius: 3px;
+  }
+
+  .timvir-s-jppbhk {
+    border-bottom-right-radius: 0;
+  }
+
+  .timvir-s-uvn51i {
+    border-bottom-right-radius: 3px;
+  }
+
+  .timvir-s-1ia1hqs {
+    border-top-left-radius: 0;
+  }
+
+  .timvir-s-1nrfd8m {
+    border-top-left-radius: 3px;
+  }
+
+  .timvir-s-1a2w583 {
+    border-top-right-radius: 0;
+  }
+
+  .timvir-s-16gx4na {
+    border-top-right-radius: 3px;
+  }
+
+  .timvir-s-1m3v4wt {
+    height: 200px;
+  }
+
+  .timvir-s-1nmq0fv {
+    margin-top: .8em;
+  }
+
+  .timvir-s-h8yej3 {
+    width: 100%;
+  }
+}
+
+@layer priority4 {
+  .timvir-s-b52w3a:before {
+    border-radius: 4px;
+  }
+
+  .timvir-s-k53niv:before {
+    transition: all .16s cubic-bezier(.4, 1, .75, .9);
+  }
+}
+
+@layer priority5 {
+  .timvir-s-ktd1bz:before {
+    box-shadow: 0 0 #137cbd00;
+  }
+
+  .timvir-s-su9jc6:before {
+    box-shadow: 0 0 0 2px var(--c-p-5);
+  }
+
+  .timvir-s-1cpjm7i:before {
+    content: "";
+  }
+
+  .timvir-s-fbg1o9:before {
+    opacity: 1;
+  }
+
+  .timvir-s-1hmns74:before {
+    position: absolute;
+  }
+}
+
+@layer priority6 {
+  .timvir-s-e80sof:before {
+    bottom: -2px;
+  }
+
+  .timvir-s-abwq6t:before {
+    left: -2px;
+  }
+
+  .timvir-s-1ydowbf:before {
+    right: -2px;
+  }
+
+  .timvir-s-51xajf:before {
+    top: -2px;
+  }
+}