@activecollab/components 1.0.299 → 1.0.301
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.
- package/dist/cjs/components/AvatarGroup/Styles.js +6 -3
- package/dist/cjs/components/AvatarGroup/Styles.js.map +1 -1
- package/dist/cjs/components/CommandPalette/CommandPalette.styles.js +1 -1
- package/dist/cjs/components/CommandPalette/CommandPalette.styles.js.map +1 -1
- package/dist/cjs/components/CommandPalette/CommandPaletteCommandItem.js +2 -2
- package/dist/cjs/components/CommandPalette/CommandPaletteCommandItem.js.map +1 -1
- package/dist/cjs/components/CommandPalette/CommandPaletteHeader.js +3 -25
- package/dist/cjs/components/CommandPalette/CommandPaletteHeader.js.map +1 -1
- package/dist/cjs/components/CommandPalette/CommandPaletteItem.js +2 -2
- package/dist/cjs/components/CommandPalette/CommandPaletteItem.js.map +1 -1
- package/dist/esm/components/AvatarGroup/Styles.d.ts.map +1 -1
- package/dist/esm/components/AvatarGroup/Styles.js +6 -3
- package/dist/esm/components/AvatarGroup/Styles.js.map +1 -1
- package/dist/esm/components/CommandPalette/CommandPalette.d.ts +2 -2
- package/dist/esm/components/CommandPalette/CommandPalette.styles.d.ts +2 -2
- package/dist/esm/components/CommandPalette/CommandPalette.styles.d.ts.map +1 -1
- package/dist/esm/components/CommandPalette/CommandPalette.styles.js +1 -1
- package/dist/esm/components/CommandPalette/CommandPalette.styles.js.map +1 -1
- package/dist/esm/components/CommandPalette/CommandPaletteCommandItem.d.ts +4 -6
- package/dist/esm/components/CommandPalette/CommandPaletteCommandItem.d.ts.map +1 -1
- package/dist/esm/components/CommandPalette/CommandPaletteCommandItem.js +2 -2
- package/dist/esm/components/CommandPalette/CommandPaletteCommandItem.js.map +1 -1
- package/dist/esm/components/CommandPalette/CommandPaletteHeader.d.ts.map +1 -1
- package/dist/esm/components/CommandPalette/CommandPaletteHeader.js +3 -25
- package/dist/esm/components/CommandPalette/CommandPaletteHeader.js.map +1 -1
- package/dist/esm/components/CommandPalette/CommandPaletteItem.d.ts +2 -2
- package/dist/esm/components/CommandPalette/CommandPaletteItem.d.ts.map +1 -1
- package/dist/esm/components/CommandPalette/CommandPaletteItem.js +2 -2
- package/dist/esm/components/CommandPalette/CommandPaletteItem.js.map +1 -1
- package/dist/index.js +14 -33
- package/dist/index.js.map +1 -1
- package/dist/index.min.js +1 -1
- package/dist/index.min.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, { ComponentPropsWithoutRef, ReactNode } from "react";
|
|
2
|
-
export interface CommandPaletteItemProps extends ComponentPropsWithoutRef<"
|
|
2
|
+
export interface CommandPaletteItemProps extends ComponentPropsWithoutRef<"a"> {
|
|
3
3
|
title?: string;
|
|
4
4
|
renderIcon?: () => ReactNode;
|
|
5
5
|
className?: string;
|
|
@@ -7,5 +7,5 @@ export interface CommandPaletteItemProps extends ComponentPropsWithoutRef<"li">
|
|
|
7
7
|
selected?: number;
|
|
8
8
|
loading?: boolean;
|
|
9
9
|
}
|
|
10
|
-
export declare const CommandPaletteItem: React.ForwardRefExoticComponent<CommandPaletteItemProps & React.RefAttributes<
|
|
10
|
+
export declare const CommandPaletteItem: React.ForwardRefExoticComponent<CommandPaletteItemProps & React.RefAttributes<HTMLAnchorElement>>;
|
|
11
11
|
//# sourceMappingURL=CommandPaletteItem.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CommandPaletteItem.d.ts","sourceRoot":"","sources":["../../../../src/components/CommandPalette/CommandPaletteItem.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EACZ,wBAAwB,EAExB,SAAS,EAEV,MAAM,OAAO,CAAC;AAmBf,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"CommandPaletteItem.d.ts","sourceRoot":"","sources":["../../../../src/components/CommandPalette/CommandPaletteItem.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EACZ,wBAAwB,EAExB,SAAS,EAEV,MAAM,OAAO,CAAC;AAmBf,MAAM,WAAW,uBAAwB,SAAQ,wBAAwB,CAAC,GAAG,CAAC;IAC5E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,MAAM,SAAS,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,kBAAkB,mGAwD9B,CAAC"}
|
|
@@ -40,7 +40,7 @@ export var CommandPaletteItem = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
40
40
|
$_css: generateRandomWidth()
|
|
41
41
|
}));
|
|
42
42
|
}
|
|
43
|
-
return /*#__PURE__*/React.createElement(StyledCommandPaletteItem, _extends({}, rest, {
|
|
43
|
+
return /*#__PURE__*/React.createElement("li", null, /*#__PURE__*/React.createElement(StyledCommandPaletteItem, _extends({}, rest, {
|
|
44
44
|
ref: ref,
|
|
45
45
|
className: classNames("cp-item", className),
|
|
46
46
|
tabIndex: 1,
|
|
@@ -55,7 +55,7 @@ export var CommandPaletteItem = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
55
55
|
dangerouslySetInnerHTML: {
|
|
56
56
|
__html: findHighlightedSearch(search, title)
|
|
57
57
|
}
|
|
58
|
-
}) : null);
|
|
58
|
+
}) : null));
|
|
59
59
|
});
|
|
60
60
|
CommandPaletteItem.displayName = "CommandPaletteItem";
|
|
61
61
|
var _StyledLinearLoader = _styled(LinearLoader).withConfig({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CommandPaletteItem.js","names":["classNames","React","forwardRef","findHighlightedSearch","LinearLoader","Typography","StyledCommandPaletteItem","StyledCommandPaletteItemLoader","StyledIcon","useSelectedContext","useSearchContext","generateRandomWidth","randomNum","Math","round","random","CommandPaletteItem","ref","title","renderIcon","className","index","loading","rest","icon","selected","setSelected","search","onMouseEnter","__html","displayName","width","height","borderRadius"],"sources":["../../../../src/components/CommandPalette/CommandPaletteItem.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport React, {\n ComponentPropsWithoutRef,\n forwardRef,\n ReactNode,\n Ref,\n} from \"react\";\nimport { findHighlightedSearch } from \"../../utils/findHighlightedSearch\";\nimport { LinearLoader } from \"../Loaders\";\nimport { Typography } from \"../Typography/Typography\";\nimport {\n StyledCommandPaletteItem,\n StyledCommandPaletteItemLoader,\n StyledIcon,\n} from \"./CommandPalette.styles\";\nimport { useSelectedContext } from \"./context\";\nimport { useSearchContext } from \"./context/SearchContext\";\n\nconst generateRandomWidth = () => {\n // generate range 30-80\n const randomNum = Math.round(Math.random() * 30 + 30);\n\n return randomNum + \"%\";\n};\n\nexport interface CommandPaletteItemProps
|
|
1
|
+
{"version":3,"file":"CommandPaletteItem.js","names":["classNames","React","forwardRef","findHighlightedSearch","LinearLoader","Typography","StyledCommandPaletteItem","StyledCommandPaletteItemLoader","StyledIcon","useSelectedContext","useSearchContext","generateRandomWidth","randomNum","Math","round","random","CommandPaletteItem","ref","title","renderIcon","className","index","loading","rest","icon","selected","setSelected","search","onMouseEnter","__html","displayName","width","height","borderRadius"],"sources":["../../../../src/components/CommandPalette/CommandPaletteItem.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport React, {\n ComponentPropsWithoutRef,\n forwardRef,\n ReactNode,\n Ref,\n} from \"react\";\nimport { findHighlightedSearch } from \"../../utils/findHighlightedSearch\";\nimport { LinearLoader } from \"../Loaders\";\nimport { Typography } from \"../Typography/Typography\";\nimport {\n StyledCommandPaletteItem,\n StyledCommandPaletteItemLoader,\n StyledIcon,\n} from \"./CommandPalette.styles\";\nimport { useSelectedContext } from \"./context\";\nimport { useSearchContext } from \"./context/SearchContext\";\n\nconst generateRandomWidth = () => {\n // generate range 30-80\n const randomNum = Math.round(Math.random() * 30 + 30);\n\n return randomNum + \"%\";\n};\n\nexport interface CommandPaletteItemProps extends ComponentPropsWithoutRef<\"a\"> {\n title?: string;\n renderIcon?: () => ReactNode;\n className?: string;\n index?: number;\n selected?: number;\n loading?: boolean;\n}\n\nexport const CommandPaletteItem = forwardRef(\n (\n {\n title,\n renderIcon,\n className,\n index,\n loading,\n ...rest\n }: CommandPaletteItemProps,\n ref: Ref<HTMLAnchorElement>\n ) => {\n const icon = renderIcon && renderIcon();\n const { selected, setSelected } = useSelectedContext();\n const { search } = useSearchContext();\n\n const onMouseEnter = () => {\n setSelected(index as number);\n };\n\n if (loading) {\n return (\n <StyledCommandPaletteItemLoader aria-busy={true} aria-disabled={true}>\n <LinearLoader css={{ width: 24, height: 24, borderRadius: \"100%\" }} />\n <LinearLoader css={{ width: generateRandomWidth(), height: 16 }} />\n </StyledCommandPaletteItemLoader>\n );\n }\n\n return (\n <li>\n <StyledCommandPaletteItem\n {...rest}\n ref={ref}\n className={classNames(\"cp-item\", className)}\n tabIndex={1}\n aria-selected={selected === index}\n onMouseEnter={onMouseEnter}\n $selected={index === selected}\n >\n <StyledIcon>{icon}</StyledIcon>\n {search && title ? (\n <Typography\n overflow=\"truncate\"\n whitespace=\"no-wrap\"\n variant=\"Body 1\"\n color=\"primary\"\n dangerouslySetInnerHTML={{\n __html: findHighlightedSearch(search, title),\n }}\n />\n ) : null}\n </StyledCommandPaletteItem>\n </li>\n );\n }\n);\n\nCommandPaletteItem.displayName = \"CommandPaletteItem\";\n"],"mappings":";;;;;AAAA,OAAOA,UAAU,MAAM,YAAY;AACnC,OAAOC,KAAK,IAEVC,UAAU,QAGL,OAAO;AACd,SAASC,qBAAqB,QAAQ,mCAAmC;AACzE,SAASC,YAAY,QAAQ,YAAY;AACzC,SAASC,UAAU,QAAQ,0BAA0B;AACrD,SACEC,wBAAwB,EACxBC,8BAA8B,EAC9BC,UAAU,QACL,yBAAyB;AAChC,SAASC,kBAAkB,QAAQ,WAAW;AAC9C,SAASC,gBAAgB,QAAQ,yBAAyB;AAE1D,IAAMC,mBAAmB,GAAG,SAAtBA,mBAAmB,GAAS;EAChC;EACA,IAAMC,SAAS,GAAGC,IAAI,CAACC,KAAK,CAACD,IAAI,CAACE,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;EAErD,OAAOH,SAAS,GAAG,GAAG;AACxB,CAAC;AAWD,OAAO,IAAMI,kBAAkB,gBAAGd,UAAU,CAC1C,gBASEe,GAA2B,EACxB;EAAA,IARDC,KAAK,QAALA,KAAK;IACLC,UAAU,QAAVA,UAAU;IACVC,SAAS,QAATA,SAAS;IACTC,KAAK,QAALA,KAAK;IACLC,OAAO,QAAPA,OAAO;IACJC,IAAI;EAIT,IAAMC,IAAI,GAAGL,UAAU,IAAIA,UAAU,EAAE;EACvC,0BAAkCV,kBAAkB,EAAE;IAA9CgB,QAAQ,uBAARA,QAAQ;IAAEC,WAAW,uBAAXA,WAAW;EAC7B,wBAAmBhB,gBAAgB,EAAE;IAA7BiB,MAAM,qBAANA,MAAM;EAEd,IAAMC,YAAY,GAAG,SAAfA,YAAY,GAAS;IACzBF,WAAW,CAACL,KAAK,CAAW;EAC9B,CAAC;EAED,IAAIC,OAAO,EAAE;IACX,oBACE,oBAAC,8BAA8B;MAAC,aAAW,IAAK;MAAC,iBAAe;IAAK,gBACnE,8CAAsE,eACtE;MAAA,OAA4BX,mBAAmB;IAAE,EAAkB,CACpC;EAErC;EAEA,oBACE,6CACE,oBAAC,wBAAwB,eACnBY,IAAI;IACR,GAAG,EAAEN,GAAI;IACT,SAAS,EAAEjB,UAAU,CAAC,SAAS,EAAEoB,SAAS,CAAE;IAC5C,QAAQ,EAAE,CAAE;IACZ,iBAAeK,QAAQ,KAAKJ,KAAM;IAClC,YAAY,EAAEO,YAAa;IAC3B,SAAS,EAAEP,KAAK,KAAKI;EAAS,iBAE9B,oBAAC,UAAU,QAAED,IAAI,CAAc,EAC9BG,MAAM,IAAIT,KAAK,gBACd,oBAAC,UAAU;IACT,QAAQ,EAAC,UAAU;IACnB,UAAU,EAAC,SAAS;IACpB,OAAO,EAAC,QAAQ;IAChB,KAAK,EAAC,SAAS;IACf,uBAAuB,EAAE;MACvBW,MAAM,EAAE1B,qBAAqB,CAACwB,MAAM,EAAET,KAAK;IAC7C;EAAE,EACF,GACA,IAAI,CACiB,CACxB;AAET,CAAC,CACF;AAEDF,kBAAkB,CAACc,WAAW,GAAG,oBAAoB;AAAC;EAAA;EAAA;AAAA,GAnCzB;EAAEC,KAAK,EAAE,EAAE;EAAEC,MAAM,EAAE,EAAE;EAAEC,YAAY,EAAE;AAAO,CAAC;AAAA;EAAA;EAAA;AAAA;EAAA,OAC/C;IAAEF,KAAK;IAAyBC,MAAM,EAAE;EAAG,CAAC;AAAA"}
|
package/dist/index.js
CHANGED
|
@@ -16044,11 +16044,14 @@
|
|
|
16044
16044
|
var AvatarGroupsStyles = styled__default["default"].div.withConfig({
|
|
16045
16045
|
displayName: "Styles__AvatarGroupsStyles",
|
|
16046
16046
|
componentId: "sc-1padv46-0"
|
|
16047
|
-
})(["", " align-items:center;align-items:center;
|
|
16048
|
-
return !props.hasTooltip && "var(--color-theme-300)";
|
|
16049
|
-
}, function (_ref) {
|
|
16047
|
+
})(["", " align-items:center;align-items:center;border-radius:var(--ac-br-6);cursor:", ";display:flex;justify-content:center;padding:", ";user-select:none;width:fit-content;&:hover{background-color:", ";transition:all 0.2s ease-in-out;}"], FontStyle, function (_ref) {
|
|
16050
16048
|
var hasTooltip = _ref.hasTooltip;
|
|
16049
|
+
return hasTooltip ? "default" : "pointer";
|
|
16050
|
+
}, function (_ref2) {
|
|
16051
|
+
var hasTooltip = _ref2.hasTooltip;
|
|
16051
16052
|
return hasTooltip ? "5px 0" : "5px";
|
|
16053
|
+
}, function (props) {
|
|
16054
|
+
return !props.hasTooltip && "var(--color-theme-300)";
|
|
16052
16055
|
});
|
|
16053
16056
|
var LengthCountStyles = styled__default["default"].div.withConfig({
|
|
16054
16057
|
displayName: "Styles__LengthCountStyles",
|
|
@@ -16177,7 +16180,7 @@
|
|
|
16177
16180
|
})(["font-size:12px;margin-top:12px;margin-bottom:4px;font-weight:bold;padding-left:18px;letter-spacing:0.5px;color:var(--color-theme-600);"]);
|
|
16178
16181
|
|
|
16179
16182
|
// prettier-ignore
|
|
16180
|
-
var StyledCommandPaletteItem = styled__default["default"].
|
|
16183
|
+
var StyledCommandPaletteItem = styled__default["default"].a.withConfig({
|
|
16181
16184
|
displayName: "CommandPalettestyles__StyledCommandPaletteItem",
|
|
16182
16185
|
componentId: "sc-na3mad-10"
|
|
16183
16186
|
})(["align-items:center;cursor:pointer;display:flex;padding-bottom:12px;padding-left:18px;padding-right:18px;padding-top:12px;position:relative;background-color:", ";&:focus{background-color:var(--color-theme-200);}&::before{display:", ";background-color:var(--color-primary);content:\"\";height:100%;left:0;position:absolute;width:2px;}&:focus{outline:none;}"], function (_ref) {
|
|
@@ -16248,7 +16251,7 @@
|
|
|
16248
16251
|
var onMouseEnter = function onMouseEnter() {
|
|
16249
16252
|
setSelected(index);
|
|
16250
16253
|
};
|
|
16251
|
-
return /*#__PURE__*/React__default["default"].createElement(StyledCommandPaletteCommandItem, _extends({}, rest, {
|
|
16254
|
+
return /*#__PURE__*/React__default["default"].createElement("li", null, /*#__PURE__*/React__default["default"].createElement(StyledCommandPaletteCommandItem, _extends({}, rest, {
|
|
16252
16255
|
ref: ref,
|
|
16253
16256
|
className: classNames__default["default"]("cp-item cp-command", className),
|
|
16254
16257
|
tabIndex: 1,
|
|
@@ -16260,7 +16263,7 @@
|
|
|
16260
16263
|
whitespace: "no-wrap",
|
|
16261
16264
|
variant: "Body 1",
|
|
16262
16265
|
color: "primary"
|
|
16263
|
-
}, title), /*#__PURE__*/React__default["default"].createElement(ArrowRightIcon$1, null));
|
|
16266
|
+
}, title), /*#__PURE__*/React__default["default"].createElement(ArrowRightIcon$1, null)));
|
|
16264
16267
|
});
|
|
16265
16268
|
CommandPaletteCommandItem.displayName = "CommandPaletteCommandItem";
|
|
16266
16269
|
var _StyledTypography = styled__default["default"](Typography).withConfig({
|
|
@@ -16327,19 +16330,6 @@
|
|
|
16327
16330
|
selectedItem.click();
|
|
16328
16331
|
}
|
|
16329
16332
|
}
|
|
16330
|
-
|
|
16331
|
-
// mode === 'id' TYPE NUMBER PREVENTING KEYS
|
|
16332
|
-
|
|
16333
|
-
if (mode === "id") {
|
|
16334
|
-
// enableNumbers && key combos
|
|
16335
|
-
var isNumber = isFinite(e.key);
|
|
16336
|
-
var enabledKeyCombos = e.metaKey && "a" || e.metaKey && "c" || e.metaKey && "v" || e.metaKey && "x" || e.key === "Backspace" || e.key === "Tab";
|
|
16337
|
-
|
|
16338
|
-
// check conditions and remove keys
|
|
16339
|
-
if (!enabledKeyCombos && !isNumber) {
|
|
16340
|
-
e.preventDefault();
|
|
16341
|
-
}
|
|
16342
|
-
}
|
|
16343
16333
|
};
|
|
16344
16334
|
return /*#__PURE__*/React__default["default"].createElement(StyledCommandPaletteHeader, {
|
|
16345
16335
|
className: "cp-header"
|
|
@@ -16347,7 +16337,7 @@
|
|
|
16347
16337
|
ref: inputRef,
|
|
16348
16338
|
autoFocus: true,
|
|
16349
16339
|
placeholder: handleInputPlaceholder,
|
|
16350
|
-
type:
|
|
16340
|
+
type: "text",
|
|
16351
16341
|
"aria-autocomplete": "list",
|
|
16352
16342
|
autoCapitalize: "none",
|
|
16353
16343
|
autoComplete: "off",
|
|
@@ -16358,21 +16348,12 @@
|
|
|
16358
16348
|
onKeyDown: handleKeyDown,
|
|
16359
16349
|
onChange: function onChange(e) {
|
|
16360
16350
|
var inputText = e.target.value;
|
|
16361
|
-
if (inputText.startsWith("#") && idModeEnabled) {
|
|
16351
|
+
if (inputText.startsWith("#") && idModeEnabled && search.length === 0) {
|
|
16362
16352
|
setMode("id");
|
|
16363
|
-
|
|
16353
|
+
onChangeSearch(inputText.slice(1));
|
|
16364
16354
|
return;
|
|
16365
16355
|
}
|
|
16366
16356
|
onChangeSearch(inputText);
|
|
16367
|
-
},
|
|
16368
|
-
onPaste: function onPaste(e) {
|
|
16369
|
-
e.preventDefault();
|
|
16370
|
-
var pastedText = e.clipboardData.getData("text");
|
|
16371
|
-
if (pastedText.startsWith("#") && idModeEnabled) {
|
|
16372
|
-
pastedText = pastedText.split("#")[1];
|
|
16373
|
-
setMode("id");
|
|
16374
|
-
onChangeSearch(pastedText);
|
|
16375
|
-
}
|
|
16376
16357
|
}
|
|
16377
16358
|
}), /*#__PURE__*/React__default["default"].createElement(StyledActionWrapper, null, loading ? /*#__PURE__*/React__default["default"].createElement(StyledSpinnerLoader, {
|
|
16378
16359
|
"aria-busy": true,
|
|
@@ -16459,7 +16440,7 @@
|
|
|
16459
16440
|
$_css: generateRandomWidth()
|
|
16460
16441
|
}));
|
|
16461
16442
|
}
|
|
16462
|
-
return /*#__PURE__*/React__default["default"].createElement(StyledCommandPaletteItem, _extends({}, rest, {
|
|
16443
|
+
return /*#__PURE__*/React__default["default"].createElement("li", null, /*#__PURE__*/React__default["default"].createElement(StyledCommandPaletteItem, _extends({}, rest, {
|
|
16463
16444
|
ref: ref,
|
|
16464
16445
|
className: classNames__default["default"]("cp-item", className),
|
|
16465
16446
|
tabIndex: 1,
|
|
@@ -16474,7 +16455,7 @@
|
|
|
16474
16455
|
dangerouslySetInnerHTML: {
|
|
16475
16456
|
__html: findHighlightedSearch(search, title)
|
|
16476
16457
|
}
|
|
16477
|
-
}) : null);
|
|
16458
|
+
}) : null));
|
|
16478
16459
|
});
|
|
16479
16460
|
CommandPaletteItem.displayName = "CommandPaletteItem";
|
|
16480
16461
|
var _StyledLinearLoader = styled__default["default"](LinearLoader).withConfig({
|