@parrot-co/parrot-ui 0.0.92 → 0.0.93
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/main.js +86 -32
- package/dist/main.js.map +1 -1
- package/dist/module.js +87 -33
- package/dist/module.js.map +1 -1
- package/dist/types.d.ts +15 -8
- package/dist/types.d.ts.map +1 -1
- package/package.json +4 -4
- package/styles.css +1 -1
package/dist/main.js
CHANGED
|
@@ -1030,6 +1030,8 @@ function $0f347092d3465402$export$5b6b19405a83ff9d({ state: state, children: chi
|
|
|
1030
1030
|
|
|
1031
1031
|
|
|
1032
1032
|
|
|
1033
|
+
|
|
1034
|
+
|
|
1033
1035
|
const $724eace27ebf345b$var$DropdownContext = /*#__PURE__*/ $8zHUo$react.createContext(null);
|
|
1034
1036
|
function $724eace27ebf345b$export$e44a253a59704894({ children: children, ...props }) {
|
|
1035
1037
|
const triggerRef = $8zHUo$react.useRef(null);
|
|
@@ -1066,12 +1068,12 @@ function $724eace27ebf345b$export$e7eb525bc415b4b4({ asChild: asChild, children:
|
|
|
1066
1068
|
children: children
|
|
1067
1069
|
});
|
|
1068
1070
|
}
|
|
1069
|
-
function $724eace27ebf345b$export$d9b273488cd8ce6f(props) {
|
|
1071
|
+
function $724eace27ebf345b$export$d9b273488cd8ce6f({ placement: placement = "bottom start", offset: offset = 8, ...props }) {
|
|
1070
1072
|
const ctx = $8zHUo$react.useContext($724eace27ebf345b$var$DropdownContext);
|
|
1071
1073
|
if (!ctx?.triggerState.isOpen) return null;
|
|
1072
1074
|
return /*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsx)((0, $0f347092d3465402$export$5b6b19405a83ff9d), {
|
|
1073
|
-
placement:
|
|
1074
|
-
offset:
|
|
1075
|
+
placement: placement,
|
|
1076
|
+
offset: offset,
|
|
1075
1077
|
state: ctx?.triggerState,
|
|
1076
1078
|
triggerRef: ctx?.triggerRef,
|
|
1077
1079
|
children: /*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsx)($724eace27ebf345b$var$MenuInner, {
|
|
@@ -1079,7 +1081,7 @@ function $724eace27ebf345b$export$d9b273488cd8ce6f(props) {
|
|
|
1079
1081
|
})
|
|
1080
1082
|
});
|
|
1081
1083
|
}
|
|
1082
|
-
function $724eace27ebf345b$var$MenuInner({ menuHeader: menuHeader, menuFooter: menuFooter, ...props }) {
|
|
1084
|
+
function $724eace27ebf345b$var$MenuInner({ menuHeader: menuHeader, menuFooter: menuFooter, className: className, color: color, maxHeight: maxHeight = 300, minWidth: minWidth = 200, maxWidth: maxWidth, ...props }) {
|
|
1083
1085
|
const state = (0, $8zHUo$reactstately.useTreeState)(props);
|
|
1084
1086
|
const ref = $8zHUo$react.useRef(null);
|
|
1085
1087
|
const { menuProps: menuProps } = (0, $8zHUo$reactaria.useMenu)({
|
|
@@ -1100,11 +1102,13 @@ function $724eace27ebf345b$var$MenuInner({ menuHeader: menuHeader, menuFooter: m
|
|
|
1100
1102
|
stack: true,
|
|
1101
1103
|
ref: ref,
|
|
1102
1104
|
...menuProps,
|
|
1103
|
-
"data-color": theme?.color ?? "violet",
|
|
1105
|
+
"data-color": color ?? theme?.color ?? "violet",
|
|
1104
1106
|
"data-radius": theme?.radius ?? "lg",
|
|
1105
|
-
className: "p-list-box-wrapper",
|
|
1107
|
+
className: (0, $62f1c614c0962470$export$a274e22fb40f762e)("p-list-box-wrapper", className),
|
|
1106
1108
|
style: {
|
|
1107
|
-
minWidth: `max(200px, ${`${
|
|
1109
|
+
minWidth: `max(200px, ${`${minWidth}`.replace("px", "")}px)`,
|
|
1110
|
+
maxWidth: `${`${maxWidth}`.replace("px", "")}px`,
|
|
1111
|
+
maxHeight: `${`${maxHeight}`.replace("px", "")}px`
|
|
1108
1112
|
},
|
|
1109
1113
|
children: [
|
|
1110
1114
|
resolvedMenuHeader(),
|
|
@@ -1114,7 +1118,8 @@ function $724eace27ebf345b$var$MenuInner({ menuHeader: menuHeader, menuFooter: m
|
|
|
1114
1118
|
].map((item)=>{
|
|
1115
1119
|
if (item.type === "section") return /*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsx)($724eace27ebf345b$var$MenuSectionInner, {
|
|
1116
1120
|
state: state,
|
|
1117
|
-
section: item
|
|
1121
|
+
section: item,
|
|
1122
|
+
...item.props
|
|
1118
1123
|
}, item.key);
|
|
1119
1124
|
return /*#__PURE__*/ (0, $8zHUo$react.createElement)($724eace27ebf345b$var$MenuItemInner, {
|
|
1120
1125
|
...item.props,
|
|
@@ -1130,24 +1135,59 @@ function $724eace27ebf345b$var$MenuInner({ menuHeader: menuHeader, menuFooter: m
|
|
|
1130
1135
|
}
|
|
1131
1136
|
function $724eace27ebf345b$var$MenuItemInner({ state: state, item: item, ...otherProps }) {
|
|
1132
1137
|
const ref = $8zHUo$react.useRef(null);
|
|
1133
|
-
const { menuItemProps: menuItemProps, isSelected: isSelected, isFocused: isFocused, isPressed: isPressed, isDisabled: isDisabled } = (0, $8zHUo$reactaria.useMenuItem)({
|
|
1138
|
+
const { menuItemProps: menuItemProps, isSelected: isSelected, isFocused: isFocused, isPressed: isPressed, isDisabled: isDisabled, descriptionProps: descriptionProps } = (0, $8zHUo$reactaria.useMenuItem)({
|
|
1134
1139
|
key: item?.key
|
|
1135
1140
|
}, state, ref);
|
|
1136
|
-
const { className: className, style: style, isReadOnly: isReadOnly } = otherProps;
|
|
1137
|
-
return /*#__PURE__*/ (0, $8zHUo$reactjsxruntime.
|
|
1141
|
+
const { className: className, style: style, isReadOnly: isReadOnly, icon: icon, color: color, description: description, label: label } = otherProps;
|
|
1142
|
+
return /*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsxs)("li", {
|
|
1138
1143
|
ref: ref,
|
|
1139
|
-
className: (0, $62f1c614c0962470$export$a274e22fb40f762e)(className, "p-list-option"),
|
|
1144
|
+
className: (0, $62f1c614c0962470$export$a274e22fb40f762e)(className, "p-list-option p-menu-item"),
|
|
1140
1145
|
"data-selected": isSelected,
|
|
1141
1146
|
"data-focused": isFocused,
|
|
1142
1147
|
"data-pressed": isPressed,
|
|
1143
1148
|
"data-disabled": isDisabled,
|
|
1144
1149
|
"data-readonly": isReadOnly,
|
|
1145
1150
|
style: style,
|
|
1151
|
+
"data-color": color,
|
|
1146
1152
|
...menuItemProps,
|
|
1147
|
-
children:
|
|
1153
|
+
children: [
|
|
1154
|
+
/*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsxs)((0, $c3a954a7c0cb5109$export$f51f4c4ede09e011), {
|
|
1155
|
+
align: "center",
|
|
1156
|
+
children: [
|
|
1157
|
+
icon && /*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsx)((0, $c3a954a7c0cb5109$export$f51f4c4ede09e011), {
|
|
1158
|
+
className: "p-list-option-icon-wrapper",
|
|
1159
|
+
children: /*#__PURE__*/ $8zHUo$react.isValidElement(icon) && /*#__PURE__*/ $8zHUo$react.cloneElement(icon, {
|
|
1160
|
+
className: "p-list-option-icon",
|
|
1161
|
+
size: 18,
|
|
1162
|
+
...icon?.props
|
|
1163
|
+
})
|
|
1164
|
+
}),
|
|
1165
|
+
/*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsxs)((0, $c3a954a7c0cb5109$export$f51f4c4ede09e011), {
|
|
1166
|
+
gap: "3xs",
|
|
1167
|
+
stack: true,
|
|
1168
|
+
children: [
|
|
1169
|
+
/*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsx)((0, $88fa102d91bf323a$export$5f1af8db9871e1d6), {
|
|
1170
|
+
as: "div",
|
|
1171
|
+
color: "black",
|
|
1172
|
+
children: label ?? item.rendered
|
|
1173
|
+
}),
|
|
1174
|
+
description && /*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsx)((0, $88fa102d91bf323a$export$5f1af8db9871e1d6), {
|
|
1175
|
+
as: "div",
|
|
1176
|
+
lineHeight: "base",
|
|
1177
|
+
...descriptionProps,
|
|
1178
|
+
children: description
|
|
1179
|
+
})
|
|
1180
|
+
]
|
|
1181
|
+
})
|
|
1182
|
+
]
|
|
1183
|
+
}),
|
|
1184
|
+
isSelected && /*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsx)((0, $8zHUo$reacticonshi.HiCheck), {
|
|
1185
|
+
className: "selected-marker"
|
|
1186
|
+
})
|
|
1187
|
+
]
|
|
1148
1188
|
});
|
|
1149
1189
|
}
|
|
1150
|
-
function $724eace27ebf345b$var$MenuSectionInner({ state: state, section: section }) {
|
|
1190
|
+
function $724eace27ebf345b$var$MenuSectionInner({ state: state, section: section, className: className, style: style }) {
|
|
1151
1191
|
const { itemProps: itemProps, headingProps: headingProps, groupProps: groupProps } = (0, $8zHUo$reactaria.useMenuSection)({
|
|
1152
1192
|
heading: section?.rendered,
|
|
1153
1193
|
"aria-label": section?.["aria-label"]
|
|
@@ -1159,30 +1199,41 @@ function $724eace27ebf345b$var$MenuSectionInner({ state: state, section: section
|
|
|
1159
1199
|
if (state?.collection.getChildren) return [
|
|
1160
1200
|
...state.collection.getChildren(section.key)
|
|
1161
1201
|
];
|
|
1162
|
-
return [
|
|
1202
|
+
return [
|
|
1203
|
+
...section.childNodes
|
|
1204
|
+
];
|
|
1163
1205
|
}
|
|
1164
1206
|
return /*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsxs)((0, $c3a954a7c0cb5109$export$f51f4c4ede09e011), {
|
|
1165
|
-
|
|
1207
|
+
stack: true,
|
|
1208
|
+
as: "ul",
|
|
1209
|
+
style: style,
|
|
1210
|
+
className: (0, $62f1c614c0962470$export$a274e22fb40f762e)(className, "p-list-section"),
|
|
1166
1211
|
children: [
|
|
1167
1212
|
/*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsx)("li", {
|
|
1168
1213
|
className: "p-list-separator",
|
|
1169
1214
|
...separatorProps
|
|
1170
1215
|
}),
|
|
1171
|
-
/*#__PURE__*/ (0, $8zHUo$reactjsxruntime.
|
|
1216
|
+
/*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsxs)("li", {
|
|
1172
1217
|
...itemProps,
|
|
1173
|
-
children:
|
|
1174
|
-
|
|
1175
|
-
|
|
1176
|
-
|
|
1177
|
-
|
|
1178
|
-
|
|
1179
|
-
|
|
1180
|
-
|
|
1181
|
-
|
|
1182
|
-
|
|
1183
|
-
|
|
1184
|
-
|
|
1185
|
-
|
|
1218
|
+
children: [
|
|
1219
|
+
section?.rendered && /*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsx)((0, $88fa102d91bf323a$export$5f1af8db9871e1d6), {
|
|
1220
|
+
as: "h4",
|
|
1221
|
+
className: "p-list-section-header",
|
|
1222
|
+
...headingProps,
|
|
1223
|
+
children: section?.rendered
|
|
1224
|
+
}),
|
|
1225
|
+
/*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsx)("ul", {
|
|
1226
|
+
...groupProps,
|
|
1227
|
+
children: getChildren().map((item)=>{
|
|
1228
|
+
return /*#__PURE__*/ (0, $8zHUo$react.createElement)($724eace27ebf345b$var$MenuItemInner, {
|
|
1229
|
+
...item.props,
|
|
1230
|
+
state: state,
|
|
1231
|
+
item: item,
|
|
1232
|
+
key: item.key
|
|
1233
|
+
});
|
|
1234
|
+
})
|
|
1235
|
+
})
|
|
1236
|
+
]
|
|
1186
1237
|
})
|
|
1187
1238
|
]
|
|
1188
1239
|
});
|
|
@@ -1229,7 +1280,6 @@ function $fc43ab93aaa777d9$export$3d7d0414f6db67e7({ children: children, renderO
|
|
|
1229
1280
|
const label = item?.[labelKey ?? "label"];
|
|
1230
1281
|
const value = item?.[valueKey ?? "id"];
|
|
1231
1282
|
const sectionChildren = item?.[sectionKey ?? "children"] ?? [];
|
|
1232
|
-
console.log(label, "label");
|
|
1233
1283
|
if (item?.[sectionKey]) return /*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsx)((0, $dcfc4542aa84c062$export$6e2c8f0811a474ce), {
|
|
1234
1284
|
items: sectionChildren,
|
|
1235
1285
|
title: getSectionLabel?.(item),
|
|
@@ -1844,7 +1894,9 @@ function $e37831ebf64d8e7d$export$ef9b1a59e592288f({ label: label, selectionMode
|
|
|
1844
1894
|
position: "relative",
|
|
1845
1895
|
stretchX: true,
|
|
1846
1896
|
children: [
|
|
1847
|
-
selectionMode === "single" &&
|
|
1897
|
+
selectionMode === "single" && // Implement a hidden select element to allow for native form submission
|
|
1898
|
+
// should work for both single and multiple selection modes
|
|
1899
|
+
/*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsx)((0, $8zHUo$reactaria.HiddenSelect), {
|
|
1848
1900
|
triggerRef: triggerRef,
|
|
1849
1901
|
label: label,
|
|
1850
1902
|
name: props.name,
|
|
@@ -2918,6 +2970,7 @@ function $1278141024f0bc4d$var$Dialog({ width: width = 400, title: title, onCanc
|
|
|
2918
2970
|
...dialogProps,
|
|
2919
2971
|
children: [
|
|
2920
2972
|
/*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsxs)((0, $c3a954a7c0cb5109$export$f51f4c4ede09e011), {
|
|
2973
|
+
align: "center",
|
|
2921
2974
|
as: "header",
|
|
2922
2975
|
justify: "space-between",
|
|
2923
2976
|
gap: "2xl",
|
|
@@ -2956,6 +3009,7 @@ function $1278141024f0bc4d$var$Dialog({ width: width = 400, title: title, onCanc
|
|
|
2956
3009
|
]
|
|
2957
3010
|
}),
|
|
2958
3011
|
/*#__PURE__*/ (0, $8zHUo$reactjsxruntime.jsx)((0, $c3a954a7c0cb5109$export$f51f4c4ede09e011), {
|
|
3012
|
+
stack: true,
|
|
2959
3013
|
className: "p-modal-body",
|
|
2960
3014
|
children: children
|
|
2961
3015
|
}),
|