@yamada-ui/autocomplete
Version:
Yamada UI autocomplete component
127 lines (124 loc) • 4.4 kB
JavaScript
"use client"
;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
for (var name in all)
__defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
if (from && typeof from === "object" || typeof from === "function") {
for (let key of __getOwnPropNames(from))
if (!__hasOwnProp.call(to, key) && key !== except)
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
}
return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
// src/use-autocomplete-option-group.ts
var use_autocomplete_option_group_exports = {};
__export(use_autocomplete_option_group_exports, {
useAutocompleteOptionGroup: () => useAutocompleteOptionGroup
});
module.exports = __toCommonJS(use_autocomplete_option_group_exports);
var import_core = require("@yamada-ui/core");
var import_utils2 = require("@yamada-ui/utils");
var import_react = require("react");
// src/autocomplete-context.ts
var import_use_descendant = require("@yamada-ui/use-descendant");
var import_utils = require("@yamada-ui/utils");
var {
DescendantsContextProvider: AutocompleteDescendantsContextProvider,
useDescendant: useAutocompleteDescendant,
useDescendants: useAutocompleteDescendants,
useDescendantsContext: useAutocompleteDescendantsContext
} = (0, import_use_descendant.createDescendant)();
var [AutocompleteProvider, useAutocompleteContext] = (0, import_utils.createContext)({
name: "AutocompleteContext",
errorMessage: `useAutocompleteContext returned is 'undefined'. Seems you forgot to wrap the components in "<Autocomplete />" or "<MultiAutocomplete />"`
});
// src/use-autocomplete-option-group.ts
var useAutocompleteOptionGroup = ({
label,
...rest
}) => {
const { omitSelectedValues, value } = useAutocompleteContext();
const descendants = useAutocompleteDescendantsContext();
const labelRef = (0, import_react.useRef)(null);
const labelId = (0, import_react.useId)();
const values = descendants.values();
const multi = (0, import_utils2.isArray)(value);
const selectedValues = multi && omitSelectedValues ? descendants.values(
({ node }) => {
var _a;
return value.includes((_a = node.dataset.value) != null ? _a : "");
}
) : [];
const selectedIndexes = selectedValues.map(({ index }) => index);
const childValues = values.filter(
({ index, node }) => {
var _a;
return ((_a = node.parentElement) == null ? void 0 : _a.dataset.label) === label && !selectedIndexes.includes(index) && "target" in node.dataset;
}
);
const empty = !childValues.length;
const [containerProps, groupProps] = (0, import_utils2.splitObject)(rest, import_core.layoutStyleProperties);
const getContainerProps = (0, import_react.useCallback)(
(props = {}, ref = null) => {
var _a;
const style = {
border: "0px",
clip: "rect(0px, 0px, 0px, 0px)",
height: "1px",
margin: "-1px",
overflow: "hidden",
padding: "0px",
position: "absolute",
whiteSpace: "nowrap",
width: "1px"
};
return {
ref,
"aria-labelledby": (_a = labelRef.current) == null ? void 0 : _a.id,
role: "group",
...props,
...containerProps,
style: empty ? style : void 0
};
},
[containerProps, empty]
);
const getLabelProps = (0, import_react.useCallback)(
({ id, ...props } = {}, ref = null) => {
return {
id: id != null ? id : labelId,
ref: (0, import_utils2.mergeRefs)(ref, labelRef),
role: "presentation",
...props
};
},
[labelId]
);
const getGroupProps = (0, import_react.useCallback)(
(props = {}, ref = null) => ({
ref,
...props,
...groupProps,
"data-label": label
}),
[groupProps, label]
);
return {
label,
getContainerProps,
getGroupProps,
getLabelProps
};
};
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
useAutocompleteOptionGroup
});
//# sourceMappingURL=use-autocomplete-option-group.js.map