azeriand-library 1.4.0 → 1.6.0

package/dist/components/checkbox/checkbox.d.ts

@@ -0,0 +1,7 @@
+type CheckboxProps = {
+    label?: string;
+    checkedDefault: boolean;
+    onChange: (checked: boolean) => void;
+};
+export declare function Checkbox({ label, checkedDefault, onChange }: CheckboxProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/section-name/section-name.d.ts

@@ -0,0 +1,6 @@
+type SectionNameProps = {
+    section: string;
+    className?: string;
+};
+export declare function SectionName({ section, className }: SectionNameProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/index.d.ts

@@ -2,3 +2,5 @@ export { Avatar } from './components/avatar';
 export { Card } from './components/card/card';
 export { Button } from './components/button/button';
 export { Badge } from './components/badge/badge';
+export { Checkbox } from './components/checkbox/checkbox';
+export { SectionName } from './components/section-name/section-name';

package/dist/index.esm.js

@@ -3,7 +3,7 @@
   try {
     if (typeof document != "undefined") {
       var elementStyle = document.createElement("style");
-      elementStyle.appendChild(document.createTextNode(".card{\n    /* border-radius: 20px; */\n    color: var(--card-text-color, white);\n}\n\n.card.glass{\n    background-color: color-mix(in oklch, var(--glass-color), transparent 80%);\n    border: 1px solid color-mix(in oklch, var(--glass-color), transparent 40%);\n    -webkit-backface-visibility: hidden;\n    -webkit-perspective: 1000;\n    -webkit-transform: translate3d(0,0,0);\n    -webkit-transform: translateZ(0);\n    backface-visibility: hidden;\n    perspective: 1000;\n    transform: translate3d(0,0,0);\n    transform: translateZ(0);\n}\n\n.card.mate{\n    background-color: var(--glass-color);\n}\n\n.card.outlined{\n    border: solid white 2px;\n}\n\nbutton .card.ghost:hover, button .card.outlined:hover{\n    background: color-mix(in oklch, var(--glass-color), transparent 80%);\n}\n\nbutton .card.glass:hover{\n    box-shadow: 0 4px 10px color-mix(in oklch, var(--glass-color), transparent 85%);\n}\n\nbutton .card.mate:hover{\n    background-color: color-mix(in oklch, var(--glass-color), white 10%) \n}\nbutton{\n    background: none;\n	color: inherit;\n	border: none;\n	padding: 0;\n	font: inherit;\n	cursor: pointer;\n	outline: inherit;\n    font-weight: bold;\n}\n\nbutton:focus {\n    outline: revert;\n}"));
+      elementStyle.appendChild(document.createTextNode(".card{\n    /* border-radius: 20px; */\n    color: var(--card-text-color, white);\n}\n\n.card.glass{\n    background-color: color-mix(in oklch, var(--glass-color), transparent 80%);\n    border: 1px solid color-mix(in oklch, var(--glass-color), transparent 40%);\n    -webkit-backface-visibility: hidden;\n    -webkit-perspective: 1000;\n    -webkit-transform: translate3d(0,0,0);\n    -webkit-transform: translateZ(0);\n    backface-visibility: hidden;\n    perspective: 1000;\n    transform: translate3d(0,0,0);\n    transform: translateZ(0);\n}\n\n.card.mate{\n    background-color: var(--glass-color);\n}\n\n.card.outlined{\n    border: solid white 2px;\n}\n\nbutton .card.ghost:hover, button .card.outlined:hover{\n    background: color-mix(in oklch, var(--glass-color), transparent 80%);\n}\n\nbutton .card.glass:hover{\n    box-shadow: 0 4px 10px color-mix(in oklch, var(--glass-color), transparent 85%);\n}\n\nbutton .card.mate:hover{\n    background-color: color-mix(in oklch, var(--glass-color), white 10%) \n}\nbutton{\n    background: none;\n	color: inherit;\n	border: none;\n	padding: 0;\n	font: inherit;\n	cursor: pointer;\n	outline: inherit;\n    font-weight: bold;\n}\n\nbutton:focus {\n    outline: revert;\n}\n.section-name{\n    color: hsla(0, 0%, 100%, 0.7);\n}"));
       document.head.appendChild(elementStyle);
     }
   } catch (e) {
@@ -11,7 +11,7 @@
   }
 })();
 import { jsx, jsxs } from "react/jsx-runtime";
-import { createContext, useState, useContext, useEffect } from "react";
+import React, { createContext, useState, useContext, useEffect } from "react";
 function Avatar({ src, className = "", style }) {
   return /* @__PURE__ */ jsx(
     "img",
@@ -80,10 +80,160 @@ function Button({ children, label, icon, position = "left", onClick, size, class
 function Badge({ label, ...cardProps }) {
   return /* @__PURE__ */ jsx(Card, { noBlur: true, noPadding: true, className: "rounded-sm w-fit", ...cardProps, children: /* @__PURE__ */ jsx("div", { className: "px-0.5 py-0.10 text-[0.5rem] font-bold", children: label }) });
 }
+var DefaultContext = {
+  color: void 0,
+  size: void 0,
+  className: void 0,
+  style: void 0,
+  attr: void 0
+};
+var IconContext = React.createContext && /* @__PURE__ */ React.createContext(DefaultContext);
+var _excluded = ["attr", "size", "title"];
+function _objectWithoutProperties(source, excluded) {
+  if (source == null) return {};
+  var target = _objectWithoutPropertiesLoose(source, excluded);
+  var key, i;
+  if (Object.getOwnPropertySymbols) {
+    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+    for (i = 0; i < sourceSymbolKeys.length; i++) {
+      key = sourceSymbolKeys[i];
+      if (excluded.indexOf(key) >= 0) continue;
+      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+      target[key] = source[key];
+    }
+  }
+  return target;
+}
+function _objectWithoutPropertiesLoose(source, excluded) {
+  if (source == null) return {};
+  var target = {};
+  for (var key in source) {
+    if (Object.prototype.hasOwnProperty.call(source, key)) {
+      if (excluded.indexOf(key) >= 0) continue;
+      target[key] = source[key];
+    }
+  }
+  return target;
+}
+function _extends() {
+  _extends = Object.assign ? Object.assign.bind() : function(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends.apply(this, arguments);
+}
+function ownKeys(e, r) {
+  var t = Object.keys(e);
+  if (Object.getOwnPropertySymbols) {
+    var o = Object.getOwnPropertySymbols(e);
+    r && (o = o.filter(function(r2) {
+      return Object.getOwnPropertyDescriptor(e, r2).enumerable;
+    })), t.push.apply(t, o);
+  }
+  return t;
+}
+function _objectSpread(e) {
+  for (var r = 1; r < arguments.length; r++) {
+    var t = null != arguments[r] ? arguments[r] : {};
+    r % 2 ? ownKeys(Object(t), true).forEach(function(r2) {
+      _defineProperty(e, r2, t[r2]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function(r2) {
+      Object.defineProperty(e, r2, Object.getOwnPropertyDescriptor(t, r2));
+    });
+  }
+  return e;
+}
+function _defineProperty(obj, key, value) {
+  key = _toPropertyKey(key);
+  if (key in obj) {
+    Object.defineProperty(obj, key, { value, enumerable: true, configurable: true, writable: true });
+  } else {
+    obj[key] = value;
+  }
+  return obj;
+}
+function _toPropertyKey(t) {
+  var i = _toPrimitive(t, "string");
+  return "symbol" == typeof i ? i : i + "";
+}
+function _toPrimitive(t, r) {
+  if ("object" != typeof t || !t) return t;
+  var e = t[Symbol.toPrimitive];
+  if (void 0 !== e) {
+    var i = e.call(t, r);
+    if ("object" != typeof i) return i;
+    throw new TypeError("@@toPrimitive must return a primitive value.");
+  }
+  return ("string" === r ? String : Number)(t);
+}
+function Tree2Element(tree) {
+  return tree && tree.map((node, i) => /* @__PURE__ */ React.createElement(node.tag, _objectSpread({
+    key: i
+  }, node.attr), Tree2Element(node.child)));
+}
+function GenIcon(data) {
+  return (props) => /* @__PURE__ */ React.createElement(IconBase, _extends({
+    attr: _objectSpread({}, data.attr)
+  }, props), Tree2Element(data.child));
+}
+function IconBase(props) {
+  var elem = (conf) => {
+    var {
+      attr,
+      size,
+      title
+    } = props, svgProps = _objectWithoutProperties(props, _excluded);
+    var computedSize = size || conf.size || "1em";
+    var className;
+    if (conf.className) className = conf.className;
+    if (props.className) className = (className ? className + " " : "") + props.className;
+    return /* @__PURE__ */ React.createElement("svg", _extends({
+      stroke: "currentColor",
+      fill: "currentColor",
+      strokeWidth: "0"
+    }, conf.attr, attr, svgProps, {
+      className,
+      style: _objectSpread(_objectSpread({
+        color: props.color || conf.color
+      }, conf.style), props.style),
+      height: computedSize,
+      width: computedSize,
+      xmlns: "http://www.w3.org/2000/svg"
+    }), title && /* @__PURE__ */ React.createElement("title", null, title), props.children);
+  };
+  return IconContext !== void 0 ? /* @__PURE__ */ React.createElement(IconContext.Consumer, null, (conf) => elem(conf)) : elem(DefaultContext);
+}
+function FaCheck(props) {
+  return GenIcon({ "attr": { "viewBox": "0 0 512 512" }, "child": [{ "tag": "path", "attr": { "d": "M173.898 439.404l-166.4-166.4c-9.997-9.997-9.997-26.206 0-36.204l36.203-36.204c9.997-9.998 26.207-9.998 36.204 0L192 312.69 432.095 72.596c9.997-9.997 26.207-9.997 36.204 0l36.203 36.204c9.997 9.997 9.997 26.206 0 36.204l-294.4 294.401c-9.998 9.997-26.207 9.997-36.204-.001z" }, "child": [] }] })(props);
+}
+function Checkbox({ label, checkedDefault = false, onChange }) {
+  const [checked, setChecked] = useState(checkedDefault);
+  function checkboxClicked() {
+    const newValue = !checked;
+    setChecked(newValue);
+    onChange(newValue);
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-0.5 w-fit", onClick: checkboxClicked, children: [
+    /* @__PURE__ */ jsx(Button, { icon: checked ? /* @__PURE__ */ jsx(FaCheck, {}) : null }),
+    label
+  ] });
+}
+function SectionName({ section, className }) {
+  return /* @__PURE__ */ jsx("div", { className: `uppercase font-bold tracking-[0.15rem] w-fit section-name ${className}`, children: section });
+}
 export {
   Avatar,
   Badge,
   Button,
-  Card
+  Card,
+  Checkbox,
+  SectionName
 };
 //# sourceMappingURL=index.esm.js.map