@teamsparta/stack-chip
Version:
stack chip
174 lines (170 loc) • 5.73 kB
JavaScript
;
var __create = Object.create;
var __defProp = Object.defineProperty;
var __defProps = Object.defineProperties;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __propIsEnum = Object.prototype.propertyIsEnumerable;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues = (a, b) => {
for (var prop in b || (b = {}))
if (__hasOwnProp.call(b, prop))
__defNormalProp(a, prop, b[prop]);
if (__getOwnPropSymbols)
for (var prop of __getOwnPropSymbols(b)) {
if (__propIsEnum.call(b, prop))
__defNormalProp(a, prop, b[prop]);
}
return a;
};
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
var __objRest = (source, exclude) => {
var target = {};
for (var prop in source)
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
target[prop] = source[prop];
if (source != null && __getOwnPropSymbols)
for (var prop of __getOwnPropSymbols(source)) {
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
target[prop] = source[prop];
}
return target;
};
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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
// If the importer is in node compatibility mode or this is not an ESM
// file that has been converted to a CommonJS file using a Babel-
// compatible transform (i.e. "__esModule" has not been set), then set
// "default" to the CommonJS "module.exports" for node compatibility.
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
// src/ChipGroup.tsx
var ChipGroup_exports = {};
__export(ChipGroup_exports, {
ChipGroup: () => ChipGroup
});
module.exports = __toCommonJS(ChipGroup_exports);
var RovingFocusGroup = __toESM(require("@radix-ui/react-roving-focus"));
var import_stack_flex = require("@teamsparta/stack-flex");
var import_stack_utils2 = require("@teamsparta/stack-utils");
var import_react = require("react");
// src/context.ts
var import_stack_utils = require("@teamsparta/stack-utils");
var [ChipGroupProvider, useChipGroupContext] = (0, import_stack_utils.createContext)("ChipGroup");
// src/ChipGroup.tsx
var import_jsx_runtime = require("@emotion/react/jsx-runtime");
var ChipGroup = (0, import_react.forwardRef)(
(_a, ref) => {
var _b = _a, {
value: valueFromProps,
defaultValue,
onValueChange,
multiple = false,
disabled = false,
children,
orientation,
dir = "ltr",
loop = true,
direction = "row",
gap = 8,
wrap = "wrap",
align = "start",
justify = "start",
size
} = _b, restProps = __objRest(_b, [
"value",
"defaultValue",
"onValueChange",
"multiple",
"disabled",
"children",
"orientation",
"dir",
"loop",
"direction",
"gap",
"wrap",
"align",
"justify",
"size"
]);
const initialValue = multiple ? [] : "";
const [value, setValue] = (0, import_stack_utils2.useControllableState)({
prop: valueFromProps,
defaultProp: defaultValue != null ? defaultValue : initialValue,
// FIXME: 추후 타입 처리 필요
onChange: onValueChange
});
const toggleValue = (clickedValue) => {
if (multiple) {
const currentValues = Array.isArray(value) ? value : [];
const index = currentValues.indexOf(clickedValue);
if (index > -1) {
const newValue = [...currentValues];
newValue.splice(index, 1);
setValue(newValue);
} else {
setValue([...currentValues, clickedValue]);
}
} else {
const currentValue = value;
setValue(currentValue === clickedValue ? "" : clickedValue);
}
};
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
ChipGroupProvider,
{
value,
multiple,
disabled,
toggleValue,
size,
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
RovingFocusGroup.Root,
__spreadProps(__spreadValues({
asChild: true,
ref,
loop,
orientation,
dir,
role: "group"
}, restProps), {
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
import_stack_flex.Flex,
{
direction,
gap,
wrap,
align,
justify,
children
}
)
})
)
}
);
}
);
ChipGroup.displayName = "ChipGroup";
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
ChipGroup
});