krl-alfred 1.44.0 → 1.45.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -29,10 +29,10 @@ var __importStar = (this && this.__importStar) || function (mod) {
29
29
  Object.defineProperty(exports, "__esModule", { value: true });
30
30
  exports.IconStyled = exports.ButtonStyled = void 0;
31
31
  var styled_components_1 = __importStar(require("styled-components"));
32
- var primary = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: var(--primary);\n color: white;\n border: none;\n svg{\n path, circle, rect{\n stroke : white;\n }\n circle{\n fill : white;\n }\n rect ~ path{\n stroke : white;\n }\n }\n\n &:hover {\n background-color: var(--primary-hover);\n }\n\n &:active {\n background-color: var(--primary-press);\n }\n\n &:disabled:not(.loading) {\n background-color: var(--dark-opacity-5);\n color: var(--dark-opacity-25);\n svg{\n path, circle, rect{\n stroke : var(--dark-opacity-25);\n }\n circle{\n fill : var(--dark-opacity-25);\n }\n rect ~ path{\n stroke : white;\n }\n }\n }\n"], ["\n background-color: var(--primary);\n color: white;\n border: none;\n svg{\n path, circle, rect{\n stroke : white;\n }\n circle{\n fill : white;\n }\n rect ~ path{\n stroke : white;\n }\n }\n\n &:hover {\n background-color: var(--primary-hover);\n }\n\n &:active {\n background-color: var(--primary-press);\n }\n\n &:disabled:not(.loading) {\n background-color: var(--dark-opacity-5);\n color: var(--dark-opacity-25);\n svg{\n path, circle, rect{\n stroke : var(--dark-opacity-25);\n }\n circle{\n fill : var(--dark-opacity-25);\n }\n rect ~ path{\n stroke : white;\n }\n }\n }\n"])));
33
- var secondary = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n background-color: var(--primary-opacity-5);\n color: var(--primary);\n border: none;\n svg{\n path, circle, rect{\n stroke : var(--primary);\n }\n circle{\n fill : var(--primary);\n }\n rect ~ path{\n stroke : white;\n }\n }\n\n &:hover {\n color: var(--primary-hover);\n svg{\n path, circle, rect{\n stroke : var(--primary-hover);\n }\n circle{\n fill : var(--primary-hover);\n }\n rect ~ path{\n stroke : white;\n }\n }\n }\n\n &:active {\n color: var(--primary-press);\n svg{\n path, circle, rect{\n stroke : var(--primary-press);\n }\n circle{\n fill : var(--primary-press);\n }\n rect ~ path{\n stroke : white;\n }\n }\n }\n\n &:disabled:not(.loading) {\n background-color: var(--dark-opacity-5);\n color: var(--dark-opacity-25);\n svg{\n path, circle, rect{\n stroke : var(--dark-opacity-25);\n }\n circle{\n fill : var(--dark-opacity-25);\n }\n rect ~ path{\n stroke : white;\n }\n }\n }\n"], ["\n background-color: var(--primary-opacity-5);\n color: var(--primary);\n border: none;\n svg{\n path, circle, rect{\n stroke : var(--primary);\n }\n circle{\n fill : var(--primary);\n }\n rect ~ path{\n stroke : white;\n }\n }\n\n &:hover {\n color: var(--primary-hover);\n svg{\n path, circle, rect{\n stroke : var(--primary-hover);\n }\n circle{\n fill : var(--primary-hover);\n }\n rect ~ path{\n stroke : white;\n }\n }\n }\n\n &:active {\n color: var(--primary-press);\n svg{\n path, circle, rect{\n stroke : var(--primary-press);\n }\n circle{\n fill : var(--primary-press);\n }\n rect ~ path{\n stroke : white;\n }\n }\n }\n\n &:disabled:not(.loading) {\n background-color: var(--dark-opacity-5);\n color: var(--dark-opacity-25);\n svg{\n path, circle, rect{\n stroke : var(--dark-opacity-25);\n }\n circle{\n fill : var(--dark-opacity-25);\n }\n rect ~ path{\n stroke : white;\n }\n }\n }\n"])));
34
- var inverted = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n background-color: white;\n color: var(--primary);\n border: 1px solid;\n border-color: var(--primary);\n svg{\n path, circle, rect{\n stroke : var(--primary);\n }\n circle{\n fill : var(--primary);\n }\n rect ~ path{\n stroke : white;\n }\n }\n &:hover {\n color: var(--primary-hover);\n border-color: var(--primary-hover);\n svg{\n path, circle, rect{\n stroke : var(--primary-hover);\n }\n circle{\n fill : var(--primary-hover);\n }\n rect ~ path{\n stroke : white;\n }\n }\n }\n\n &:active {\n color: var(--primary-press);\n border-color: var(--primary-press);\n svg{\n path, circle, rect{\n stroke : var(--primary-press);\n }\n circle{\n fill : var(--primary-press);\n }\n rect ~ path{\n stroke : white;\n }\n }\n }\n\n &:disabled:not(.loading) {\n color: var(--dark-opacity-25);\n border-color: var(--dark-opacity-25);\n svg{\n path, circle, rect{\n stroke : var(--dark-opacity-25);\n }\n circle{\n fill : var(--dark-opacity-25);\n }\n rect ~ path{\n stroke : white;\n }\n }\n }\n"], ["\n background-color: white;\n color: var(--primary);\n border: 1px solid;\n border-color: var(--primary);\n svg{\n path, circle, rect{\n stroke : var(--primary);\n }\n circle{\n fill : var(--primary);\n }\n rect ~ path{\n stroke : white;\n }\n }\n &:hover {\n color: var(--primary-hover);\n border-color: var(--primary-hover);\n svg{\n path, circle, rect{\n stroke : var(--primary-hover);\n }\n circle{\n fill : var(--primary-hover);\n }\n rect ~ path{\n stroke : white;\n }\n }\n }\n\n &:active {\n color: var(--primary-press);\n border-color: var(--primary-press);\n svg{\n path, circle, rect{\n stroke : var(--primary-press);\n }\n circle{\n fill : var(--primary-press);\n }\n rect ~ path{\n stroke : white;\n }\n }\n }\n\n &:disabled:not(.loading) {\n color: var(--dark-opacity-25);\n border-color: var(--dark-opacity-25);\n svg{\n path, circle, rect{\n stroke : var(--dark-opacity-25);\n }\n circle{\n fill : var(--dark-opacity-25);\n }\n rect ~ path{\n stroke : white;\n }\n }\n }\n"])));
35
- var ghost = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n background-color: transparent;\n color: var(--primary);\n border: 0;\n svg{\n path, circle, rect{\n stroke : var(--primary);\n }\n circle{\n fill : var(--primary);\n }\n rect ~ path{\n stroke : white;\n }\n }\n &:hover {\n color: var(--primary); \n background-color: var(--primary-opacity-5);\n svg{\n path, circle, rect{\n stroke : var(--primary);\n }\n circle{\n fill : var(--primary);\n }\n rect ~ path{\n stroke : white;\n }\n }\n }\n\n &:active {\n color: var(--primary-hover);\n background-color: var(--primary-opacity-5);\n svg{\n path, circle, rect{\n stroke : var(--primary-hover);\n }\n circle{\n fill : var(--primary-hover);\n }\n rect ~ path{\n stroke : white;\n }\n }\n }\n\n &:disabled:not(.loading) {\n color: var(--dark-opacity-25);\n svg{\n path, circle, rect{\n stroke : var(--dark-opacity-25);\n }\n circle{\n fill : var(--dark-opacity-25);\n }\n rect ~ path{\n stroke : white;\n }\n }\n }\n"], ["\n background-color: transparent;\n color: var(--primary);\n border: 0;\n svg{\n path, circle, rect{\n stroke : var(--primary);\n }\n circle{\n fill : var(--primary);\n }\n rect ~ path{\n stroke : white;\n }\n }\n &:hover {\n color: var(--primary); \n background-color: var(--primary-opacity-5);\n svg{\n path, circle, rect{\n stroke : var(--primary);\n }\n circle{\n fill : var(--primary);\n }\n rect ~ path{\n stroke : white;\n }\n }\n }\n\n &:active {\n color: var(--primary-hover);\n background-color: var(--primary-opacity-5);\n svg{\n path, circle, rect{\n stroke : var(--primary-hover);\n }\n circle{\n fill : var(--primary-hover);\n }\n rect ~ path{\n stroke : white;\n }\n }\n }\n\n &:disabled:not(.loading) {\n color: var(--dark-opacity-25);\n svg{\n path, circle, rect{\n stroke : var(--dark-opacity-25);\n }\n circle{\n fill : var(--dark-opacity-25);\n }\n rect ~ path{\n stroke : white;\n }\n }\n }\n"])));
32
+ var primary = (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: var(--primary);\n color: white;\n border: none;\n svg{\n path, rect{\n stroke : white;\n }\n circle{\n fill : white;\n ~ path{\n stroke : var(--primary);\n }\n } \n }\n\n &:hover {\n background-color: var(--primary-hover);\n }\n\n &:active {\n background-color: var(--primary-press);\n }\n\n &:disabled:not(.loading) {\n background-color: var(--dark-opacity-5);\n color: var(--dark-opacity-25);\n svg{\n path, rect{\n stroke : var(--dark-opacity-25);\n }\n circle{\n fill : var(--dark-opacity-25);\n ~ path{\n stroke : white;\n }\n } \n }\n }\n"], ["\n background-color: var(--primary);\n color: white;\n border: none;\n svg{\n path, rect{\n stroke : white;\n }\n circle{\n fill : white;\n ~ path{\n stroke : var(--primary);\n }\n } \n }\n\n &:hover {\n background-color: var(--primary-hover);\n }\n\n &:active {\n background-color: var(--primary-press);\n }\n\n &:disabled:not(.loading) {\n background-color: var(--dark-opacity-5);\n color: var(--dark-opacity-25);\n svg{\n path, rect{\n stroke : var(--dark-opacity-25);\n }\n circle{\n fill : var(--dark-opacity-25);\n ~ path{\n stroke : white;\n }\n } \n }\n }\n"])));
33
+ var secondary = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n background-color: var(--primary-opacity-5);\n color: var(--primary);\n border: none;\n svg{\n path, rect{\n stroke : var(--primary);\n }\n circle{\n fill : var(--primary);\n ~ path{\n stroke : white;\n }\n }\n }\n\n &:hover {\n color: var(--primary-hover);\n svg{\n path, rect{\n stroke : var(--primary-hover);\n }\n circle{\n fill : var(--primary-hover);\n ~ path{\n stroke : white;\n }\n }\n }\n }\n\n &:active {\n color: var(--primary-press);\n svg{\n path, rect{\n stroke : var(--primary-press);\n }\n circle{\n fill : var(--primary-press);\n ~ path{\n stroke : white;\n }\n }\n }\n }\n\n &:disabled:not(.loading) {\n background-color: var(--dark-opacity-5);\n color: var(--dark-opacity-25);\n svg{\n path, rect{\n stroke : var(--dark-opacity-25);\n }\n circle{\n fill : var(--dark-opacity-25);\n ~ path{\n stroke : white;\n }\n }\n }\n }\n"], ["\n background-color: var(--primary-opacity-5);\n color: var(--primary);\n border: none;\n svg{\n path, rect{\n stroke : var(--primary);\n }\n circle{\n fill : var(--primary);\n ~ path{\n stroke : white;\n }\n }\n }\n\n &:hover {\n color: var(--primary-hover);\n svg{\n path, rect{\n stroke : var(--primary-hover);\n }\n circle{\n fill : var(--primary-hover);\n ~ path{\n stroke : white;\n }\n }\n }\n }\n\n &:active {\n color: var(--primary-press);\n svg{\n path, rect{\n stroke : var(--primary-press);\n }\n circle{\n fill : var(--primary-press);\n ~ path{\n stroke : white;\n }\n }\n }\n }\n\n &:disabled:not(.loading) {\n background-color: var(--dark-opacity-5);\n color: var(--dark-opacity-25);\n svg{\n path, rect{\n stroke : var(--dark-opacity-25);\n }\n circle{\n fill : var(--dark-opacity-25);\n ~ path{\n stroke : white;\n }\n }\n }\n }\n"])));
34
+ var inverted = (0, styled_components_1.css)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n background-color: white;\n color: var(--primary);\n border: 1px solid;\n border-color: var(--primary);\n svg{\n path, rect{\n stroke : var(--primary);\n }\n circle{\n fill : var(--primary);\n ~ path{\n stroke : white;\n }\n }\n }\n &:hover {\n color: var(--primary-hover);\n border-color: var(--primary-hover);\n svg{\n path, rect{\n stroke : var(--primary-hover);\n }\n circle{\n fill : var(--primary-hover);\n ~ path{\n stroke : white;\n }\n }\n }\n }\n\n &:active {\n color: var(--primary-press);\n border-color: var(--primary-press);\n svg{\n path, rect{\n stroke : var(--primary-press);\n }\n circle{\n fill : var(--primary-press);\n ~ path{\n stroke : white;\n }\n }\n }\n }\n\n &:disabled:not(.loading) {\n color: var(--dark-opacity-25);\n border-color: var(--dark-opacity-25);\n svg{\n path, rect{\n stroke : var(--dark-opacity-25);\n }\n circle{\n fill : var(--dark-opacity-25);\n ~ path{\n stroke : white;\n }\n }\n }\n }\n"], ["\n background-color: white;\n color: var(--primary);\n border: 1px solid;\n border-color: var(--primary);\n svg{\n path, rect{\n stroke : var(--primary);\n }\n circle{\n fill : var(--primary);\n ~ path{\n stroke : white;\n }\n }\n }\n &:hover {\n color: var(--primary-hover);\n border-color: var(--primary-hover);\n svg{\n path, rect{\n stroke : var(--primary-hover);\n }\n circle{\n fill : var(--primary-hover);\n ~ path{\n stroke : white;\n }\n }\n }\n }\n\n &:active {\n color: var(--primary-press);\n border-color: var(--primary-press);\n svg{\n path, rect{\n stroke : var(--primary-press);\n }\n circle{\n fill : var(--primary-press);\n ~ path{\n stroke : white;\n }\n }\n }\n }\n\n &:disabled:not(.loading) {\n color: var(--dark-opacity-25);\n border-color: var(--dark-opacity-25);\n svg{\n path, rect{\n stroke : var(--dark-opacity-25);\n }\n circle{\n fill : var(--dark-opacity-25);\n ~ path{\n stroke : white;\n }\n }\n }\n }\n"])));
35
+ var ghost = (0, styled_components_1.css)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n background-color: transparent;\n color: var(--primary);\n border: 0;\n svg{\n path, rect{\n stroke : var(--primary);\n }\n circle{\n fill : var(--primary);\n ~ path{\n stroke : white;\n }\n }\n }\n &:hover {\n color: var(--primary); \n background-color: var(--primary-opacity-5);\n svg{\n path, rect{\n stroke : var(--primary);\n }\n circle{\n fill : var(--primary);\n ~ path{\n stroke : white;\n }\n }\n }\n }\n\n &:active {\n color: var(--primary-hover);\n background-color: var(--primary-opacity-5);\n svg{\n path, rect{\n stroke : var(--primary-hover);\n }\n circle{\n fill : var(--primary-hover);\n ~ path{\n stroke : white;\n }\n }\n }\n }\n\n &:disabled:not(.loading) {\n color: var(--dark-opacity-25);\n svg{\n path, rect{\n stroke : var(--dark-opacity-25);\n }\n circle{\n fill : var(--dark-opacity-25);\n ~ path{\n stroke : white;\n }\n }\n }\n }\n"], ["\n background-color: transparent;\n color: var(--primary);\n border: 0;\n svg{\n path, rect{\n stroke : var(--primary);\n }\n circle{\n fill : var(--primary);\n ~ path{\n stroke : white;\n }\n }\n }\n &:hover {\n color: var(--primary); \n background-color: var(--primary-opacity-5);\n svg{\n path, rect{\n stroke : var(--primary);\n }\n circle{\n fill : var(--primary);\n ~ path{\n stroke : white;\n }\n }\n }\n }\n\n &:active {\n color: var(--primary-hover);\n background-color: var(--primary-opacity-5);\n svg{\n path, rect{\n stroke : var(--primary-hover);\n }\n circle{\n fill : var(--primary-hover);\n ~ path{\n stroke : white;\n }\n }\n }\n }\n\n &:disabled:not(.loading) {\n color: var(--dark-opacity-25);\n svg{\n path, rect{\n stroke : var(--dark-opacity-25);\n }\n circle{\n fill : var(--dark-opacity-25);\n ~ path{\n stroke : white;\n }\n }\n }\n }\n"])));
36
36
  exports.ButtonStyled = styled_components_1.default.button(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n box-sizing: border-box;\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: ", ";\n padding: ", ";\n font-family: var(--font-family-sans-serif);\n cursor: pointer;\n transition: all .2s;\n width: ", ";\n ", "\n height: ", ";\n &:disabled {\n cursor: not-allowed;\n }\n"], ["\n box-sizing: border-box;\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: ", ";\n padding: ", ";\n font-family: var(--font-family-sans-serif);\n cursor: pointer;\n transition: all .2s;\n width: ", ";\n ", "\n height: ", ";\n &:disabled {\n cursor: not-allowed;\n }\n"])), function (props) { return props.size === 'xsmall' ? '4px' : '8px'; }, function (props) { return props.width ? '0' : '0 24px'; }, function (props) { return props.width; }, function (props) {
37
37
  switch (props.variant) {
38
38
  case 'primary':
@@ -36,5 +36,5 @@ var __importStar = (this && this.__importStar) || function (mod) {
36
36
  Object.defineProperty(exports, "__esModule", { value: true });
37
37
  var jsx_runtime_1 = require("react/jsx-runtime");
38
38
  var React = __importStar(require("react"));
39
- var SvgArrowSmallRightBackground = function (props) { return ((0, jsx_runtime_1.jsxs)("svg", __assign({ width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props, { children: [(0, jsx_runtime_1.jsx)("rect", { width: 16, height: 16, rx: 8, fill: "#9763F6" }), (0, jsx_runtime_1.jsx)("path", { d: "M6.66602 5.33398L9.33268 8.00065L6.66602 10.6673", stroke: "white", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" })] }))); };
39
+ var SvgArrowSmallRightBackground = function (props) { return ((0, jsx_runtime_1.jsxs)("svg", __assign({ id: "katman_1", "data-name": "katman 1", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 16 16" }, props, { children: [(0, jsx_runtime_1.jsx)("circle", { cx: 8, cy: 8, r: 8, fill: "#7564a9" }), (0, jsx_runtime_1.jsx)("path", { d: "m6.67,5.33l2.67,2.67-2.67,2.67", fill: "none", stroke: "#fff", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2 })] }))); };
40
40
  exports.default = SvgArrowSmallRightBackground;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "krl-alfred",
3
- "version": "1.44.0",
3
+ "version": "1.45.0",
4
4
  "files": [
5
5
  "dist"
6
6
  ],