@ultraviolet/plus 0.15.0 → 0.15.2

package/dist/components/Navigation/components/Group.d.ts

@@ -0,0 +1,7 @@
+import type { ReactNode } from 'react';
+type GroupProps = {
+    children: ReactNode;
+    label: string;
+};
+export declare const Group: ({ children, label }: GroupProps) => import("@emotion/react/jsx-runtime").JSX.Element | null;
+export {};

package/dist/components/Navigation/components/Group.js

@@ -0,0 +1,55 @@
+import { jsx, jsxs } from "@emotion/react/jsx-runtime";
+import _styled from "@emotion/styled/base";
+import { Text, Stack } from "@ultraviolet/ui";
+import { Children } from "react";
+import { useNavigation } from "../NavigationProvider.js";
+import { ANIMATION_DURATION, groupAnimation } from "../constants.js";
+const StyledText = /* @__PURE__ */ _styled(Text, process.env.NODE_ENV === "production" ? {
+  target: "eh4zgrv2"
+} : {
+  target: "eh4zgrv2",
+  label: "StyledText"
+})("padding-bottom:", ({
+  theme
+}) => theme.space["1"], ";padding-left:", ({
+  theme
+}) => theme.space["1"], ";transition:opacity ", ANIMATION_DURATION, "ms ease-in-out,height ", ANIMATION_DURATION, "ms ease-in-out;height:", ({
+  theme
+}) => `calc(${theme.typography.bodySmallStrong.lineHeight} + ${theme.space["1"]})`, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3BsdXMvc3JjL2NvbXBvbmVudHMvTmF2aWdhdGlvbi9jb21wb25lbnRzL0dyb3VwLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFZK0IiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvdWx0cmF2aW9sZXQvdWx0cmF2aW9sZXQvcGFja2FnZXMvcGx1cy9zcmMvY29tcG9uZW50cy9OYXZpZ2F0aW9uL2NvbXBvbmVudHMvR3JvdXAudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnXG5pbXBvcnQgeyBTdGFjaywgVGV4dCB9IGZyb20gJ0B1bHRyYXZpb2xldC91aSdcbmltcG9ydCB0eXBlIHsgUmVhY3ROb2RlIH0gZnJvbSAncmVhY3QnXG5pbXBvcnQgeyBDaGlsZHJlbiB9IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgdXNlTmF2aWdhdGlvbiB9IGZyb20gJy4uL05hdmlnYXRpb25Qcm92aWRlcidcbmltcG9ydCB7IEFOSU1BVElPTl9EVVJBVElPTiwgZ3JvdXBBbmltYXRpb24gfSBmcm9tICcuLi9jb25zdGFudHMnXG5cbnR5cGUgR3JvdXBQcm9wcyA9IHtcbiAgY2hpbGRyZW46IFJlYWN0Tm9kZVxuICBsYWJlbDogc3RyaW5nXG59XG5cbmNvbnN0IFN0eWxlZFRleHQgPSBzdHlsZWQoVGV4dClgXG4gIHBhZGRpbmctYm90dG9tOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLnNwYWNlWycxJ119O1xuICBwYWRkaW5nLWxlZnQ6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuc3BhY2VbJzEnXX07XG5cbiAgdHJhbnNpdGlvbjpcbiAgICBvcGFjaXR5ICR7QU5JTUFUSU9OX0RVUkFUSU9OfW1zIGVhc2UtaW4tb3V0LFxuICAgIGhlaWdodCAke0FOSU1BVElPTl9EVVJBVElPTn1tcyBlYXNlLWluLW91dDtcbiAgaGVpZ2h0OiAkeyh7IHRoZW1lIH0pID0+XG4gICAgYGNhbGMoJHt0aGVtZS50eXBvZ3JhcGh5LmJvZHlTbWFsbFN0cm9uZy5saW5lSGVpZ2h0fSArICR7dGhlbWUuc3BhY2VbJzEnXX0pYH07IC8vIFRoaXMgaXMgb25seSBmb3IgYW5pbWF0aW9uXG5gXG5cbmNvbnN0IFN0eWxlZFN0YWNrID0gc3R5bGVkKFN0YWNrKWBcbiAgcGFkZGluZy10b3A6ICR7KHsgdGhlbWUgfSkgPT4gdGhlbWUuc3BhY2VbJzEnXX07XG5gXG5cbmNvbnN0IENvbnRhaW5lciA9IHN0eWxlZC5kaXZgXG4gICZbZGF0YS1hbmltYXRpb249J2V4cGFuZCddIHtcbiAgICAke1N0eWxlZFRleHR9IHtcbiAgICAgIGFuaW1hdGlvbjogJHtncm91cEFuaW1hdGlvbn0gJHtBTklNQVRJT05fRFVSQVRJT059bXMgZWFzZS1pbi1vdXQ7XG4gICAgfVxuICB9XG5cbiAgJltkYXRhLWFuaW1hdGlvbj0nY29sbGFwc2UnXSB7XG4gICAgJHtTdHlsZWRUZXh0fSB7XG4gICAgICBhbmltYXRpb246ICR7Z3JvdXBBbmltYXRpb259ICR7QU5JTUFUSU9OX0RVUkFUSU9OfW1zIGVhc2UtaW4tb3V0IHJldmVyc2U7XG4gICAgfVxuICB9XG5gXG5cbmV4cG9ydCBjb25zdCBHcm91cCA9ICh7IGNoaWxkcmVuLCBsYWJlbCB9OiBHcm91cFByb3BzKSA9PiB7XG4gIGNvbnN0IGNvbnRleHQgPSB1c2VOYXZpZ2F0aW9uKClcblxuICBpZiAoIWNvbnRleHQpIHtcbiAgICB0aHJvdyBuZXcgRXJyb3IoXG4gICAgICAnTmF2aWdhdGlvbi5Hcm91cCBjYW4gb25seSBiZSB1c2VkIGluc2lkZSBhIE5hdmlnYXRpb25Qcm92aWRlci4nLFxuICAgIClcbiAgfVxuXG4gIGNvbnN0IHsgZXhwYW5kZWQsIGFuaW1hdGlvbiB9ID0gY29udGV4dFxuXG4gIGlmIChDaGlsZHJlbi5jb3VudChjaGlsZHJlbikgPiAwKSB7XG4gICAgcmV0dXJuIChcbiAgICAgIDxDb250YWluZXIgZGF0YS1hbmltYXRpb249e2FuaW1hdGlvbn0+XG4gICAgICAgIDxTdHlsZWRTdGFjayBkaXJlY3Rpb249XCJjb2x1bW5cIj5cbiAgICAgICAgICB7ZXhwYW5kZWQgfHwgYW5pbWF0aW9uID09PSAnZXhwYW5kJyA/IChcbiAgICAgICAgICAgIDxTdHlsZWRUZXh0XG4gICAgICAgICAgICAgIGFzPVwic3BhblwiXG4gICAgICAgICAgICAgIHZhcmlhbnQ9XCJib2R5U21hbGxTdHJvbmdcIlxuICAgICAgICAgICAgICBzZW50aW1lbnQ9XCJuZXV0cmFsXCJcbiAgICAgICAgICAgICAgcHJvbWluZW5jZT1cIndlYWtcIlxuICAgICAgICAgICAgPlxuICAgICAgICAgICAgICB7bGFiZWx9XG4gICAgICAgICAgICA8L1N0eWxlZFRleHQ+XG4gICAgICAgICAgKSA6IG51bGx9XG4gICAgICAgICAge2NoaWxkcmVufVxuICAgICAgICA8L1N0eWxlZFN0YWNrPlxuICAgICAgPC9Db250YWluZXI+XG4gICAgKVxuICB9XG5cbiAgcmV0dXJuIG51bGxcbn1cbiJdfQ== */"));
+const StyledStack = /* @__PURE__ */ _styled(Stack, process.env.NODE_ENV === "production" ? {
+  target: "eh4zgrv1"
+} : {
+  target: "eh4zgrv1",
+  label: "StyledStack"
+})("padding-top:", ({
+  theme
+}) => theme.space["1"], ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3BsdXMvc3JjL2NvbXBvbmVudHMvTmF2aWdhdGlvbi9jb21wb25lbnRzL0dyb3VwLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF1QmlDIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3BsdXMvc3JjL2NvbXBvbmVudHMvTmF2aWdhdGlvbi9jb21wb25lbnRzL0dyb3VwLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuaW1wb3J0IHsgU3RhY2ssIFRleHQgfSBmcm9tICdAdWx0cmF2aW9sZXQvdWknXG5pbXBvcnQgdHlwZSB7IFJlYWN0Tm9kZSB9IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgQ2hpbGRyZW4gfSBmcm9tICdyZWFjdCdcbmltcG9ydCB7IHVzZU5hdmlnYXRpb24gfSBmcm9tICcuLi9OYXZpZ2F0aW9uUHJvdmlkZXInXG5pbXBvcnQgeyBBTklNQVRJT05fRFVSQVRJT04sIGdyb3VwQW5pbWF0aW9uIH0gZnJvbSAnLi4vY29uc3RhbnRzJ1xuXG50eXBlIEdyb3VwUHJvcHMgPSB7XG4gIGNoaWxkcmVuOiBSZWFjdE5vZGVcbiAgbGFiZWw6IHN0cmluZ1xufVxuXG5jb25zdCBTdHlsZWRUZXh0ID0gc3R5bGVkKFRleHQpYFxuICBwYWRkaW5nLWJvdHRvbTogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5zcGFjZVsnMSddfTtcbiAgcGFkZGluZy1sZWZ0OiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLnNwYWNlWycxJ119O1xuXG4gIHRyYW5zaXRpb246XG4gICAgb3BhY2l0eSAke0FOSU1BVElPTl9EVVJBVElPTn1tcyBlYXNlLWluLW91dCxcbiAgICBoZWlnaHQgJHtBTklNQVRJT05fRFVSQVRJT059bXMgZWFzZS1pbi1vdXQ7XG4gIGhlaWdodDogJHsoeyB0aGVtZSB9KSA9PlxuICAgIGBjYWxjKCR7dGhlbWUudHlwb2dyYXBoeS5ib2R5U21hbGxTdHJvbmcubGluZUhlaWdodH0gKyAke3RoZW1lLnNwYWNlWycxJ119KWB9OyAvLyBUaGlzIGlzIG9ubHkgZm9yIGFuaW1hdGlvblxuYFxuXG5jb25zdCBTdHlsZWRTdGFjayA9IHN0eWxlZChTdGFjaylgXG4gIHBhZGRpbmctdG9wOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLnNwYWNlWycxJ119O1xuYFxuXG5jb25zdCBDb250YWluZXIgPSBzdHlsZWQuZGl2YFxuICAmW2RhdGEtYW5pbWF0aW9uPSdleHBhbmQnXSB7XG4gICAgJHtTdHlsZWRUZXh0fSB7XG4gICAgICBhbmltYXRpb246ICR7Z3JvdXBBbmltYXRpb259ICR7QU5JTUFUSU9OX0RVUkFUSU9OfW1zIGVhc2UtaW4tb3V0O1xuICAgIH1cbiAgfVxuXG4gICZbZGF0YS1hbmltYXRpb249J2NvbGxhcHNlJ10ge1xuICAgICR7U3R5bGVkVGV4dH0ge1xuICAgICAgYW5pbWF0aW9uOiAke2dyb3VwQW5pbWF0aW9ufSAke0FOSU1BVElPTl9EVVJBVElPTn1tcyBlYXNlLWluLW91dCByZXZlcnNlO1xuICAgIH1cbiAgfVxuYFxuXG5leHBvcnQgY29uc3QgR3JvdXAgPSAoeyBjaGlsZHJlbiwgbGFiZWwgfTogR3JvdXBQcm9wcykgPT4ge1xuICBjb25zdCBjb250ZXh0ID0gdXNlTmF2aWdhdGlvbigpXG5cbiAgaWYgKCFjb250ZXh0KSB7XG4gICAgdGhyb3cgbmV3IEVycm9yKFxuICAgICAgJ05hdmlnYXRpb24uR3JvdXAgY2FuIG9ubHkgYmUgdXNlZCBpbnNpZGUgYSBOYXZpZ2F0aW9uUHJvdmlkZXIuJyxcbiAgICApXG4gIH1cblxuICBjb25zdCB7IGV4cGFuZGVkLCBhbmltYXRpb24gfSA9IGNvbnRleHRcblxuICBpZiAoQ2hpbGRyZW4uY291bnQoY2hpbGRyZW4pID4gMCkge1xuICAgIHJldHVybiAoXG4gICAgICA8Q29udGFpbmVyIGRhdGEtYW5pbWF0aW9uPXthbmltYXRpb259PlxuICAgICAgICA8U3R5bGVkU3RhY2sgZGlyZWN0aW9uPVwiY29sdW1uXCI+XG4gICAgICAgICAge2V4cGFuZGVkIHx8IGFuaW1hdGlvbiA9PT0gJ2V4cGFuZCcgPyAoXG4gICAgICAgICAgICA8U3R5bGVkVGV4dFxuICAgICAgICAgICAgICBhcz1cInNwYW5cIlxuICAgICAgICAgICAgICB2YXJpYW50PVwiYm9keVNtYWxsU3Ryb25nXCJcbiAgICAgICAgICAgICAgc2VudGltZW50PVwibmV1dHJhbFwiXG4gICAgICAgICAgICAgIHByb21pbmVuY2U9XCJ3ZWFrXCJcbiAgICAgICAgICAgID5cbiAgICAgICAgICAgICAge2xhYmVsfVxuICAgICAgICAgICAgPC9TdHlsZWRUZXh0PlxuICAgICAgICAgICkgOiBudWxsfVxuICAgICAgICAgIHtjaGlsZHJlbn1cbiAgICAgICAgPC9TdHlsZWRTdGFjaz5cbiAgICAgIDwvQ29udGFpbmVyPlxuICAgIClcbiAgfVxuXG4gIHJldHVybiBudWxsXG59XG4iXX0= */"));
+const Container = /* @__PURE__ */ _styled("div", process.env.NODE_ENV === "production" ? {
+  target: "eh4zgrv0"
+} : {
+  target: "eh4zgrv0",
+  label: "Container"
+})("&[data-animation='expand']{", StyledText, "{animation:", groupAnimation, " ", ANIMATION_DURATION, "ms ease-in-out;}}&[data-animation='collapse']{", StyledText, "{animation:", groupAnimation, " ", ANIMATION_DURATION, "ms ease-in-out reverse;}}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3BsdXMvc3JjL2NvbXBvbmVudHMvTmF2aWdhdGlvbi9jb21wb25lbnRzL0dyb3VwLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUEyQjRCIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL3VsdHJhdmlvbGV0L3VsdHJhdmlvbGV0L3BhY2thZ2VzL3BsdXMvc3JjL2NvbXBvbmVudHMvTmF2aWdhdGlvbi9jb21wb25lbnRzL0dyb3VwLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJ1xuaW1wb3J0IHsgU3RhY2ssIFRleHQgfSBmcm9tICdAdWx0cmF2aW9sZXQvdWknXG5pbXBvcnQgdHlwZSB7IFJlYWN0Tm9kZSB9IGZyb20gJ3JlYWN0J1xuaW1wb3J0IHsgQ2hpbGRyZW4gfSBmcm9tICdyZWFjdCdcbmltcG9ydCB7IHVzZU5hdmlnYXRpb24gfSBmcm9tICcuLi9OYXZpZ2F0aW9uUHJvdmlkZXInXG5pbXBvcnQgeyBBTklNQVRJT05fRFVSQVRJT04sIGdyb3VwQW5pbWF0aW9uIH0gZnJvbSAnLi4vY29uc3RhbnRzJ1xuXG50eXBlIEdyb3VwUHJvcHMgPSB7XG4gIGNoaWxkcmVuOiBSZWFjdE5vZGVcbiAgbGFiZWw6IHN0cmluZ1xufVxuXG5jb25zdCBTdHlsZWRUZXh0ID0gc3R5bGVkKFRleHQpYFxuICBwYWRkaW5nLWJvdHRvbTogJHsoeyB0aGVtZSB9KSA9PiB0aGVtZS5zcGFjZVsnMSddfTtcbiAgcGFkZGluZy1sZWZ0OiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLnNwYWNlWycxJ119O1xuXG4gIHRyYW5zaXRpb246XG4gICAgb3BhY2l0eSAke0FOSU1BVElPTl9EVVJBVElPTn1tcyBlYXNlLWluLW91dCxcbiAgICBoZWlnaHQgJHtBTklNQVRJT05fRFVSQVRJT059bXMgZWFzZS1pbi1vdXQ7XG4gIGhlaWdodDogJHsoeyB0aGVtZSB9KSA9PlxuICAgIGBjYWxjKCR7dGhlbWUudHlwb2dyYXBoeS5ib2R5U21hbGxTdHJvbmcubGluZUhlaWdodH0gKyAke3RoZW1lLnNwYWNlWycxJ119KWB9OyAvLyBUaGlzIGlzIG9ubHkgZm9yIGFuaW1hdGlvblxuYFxuXG5jb25zdCBTdHlsZWRTdGFjayA9IHN0eWxlZChTdGFjaylgXG4gIHBhZGRpbmctdG9wOiAkeyh7IHRoZW1lIH0pID0+IHRoZW1lLnNwYWNlWycxJ119O1xuYFxuXG5jb25zdCBDb250YWluZXIgPSBzdHlsZWQuZGl2YFxuICAmW2RhdGEtYW5pbWF0aW9uPSdleHBhbmQnXSB7XG4gICAgJHtTdHlsZWRUZXh0fSB7XG4gICAgICBhbmltYXRpb246ICR7Z3JvdXBBbmltYXRpb259ICR7QU5JTUFUSU9OX0RVUkFUSU9OfW1zIGVhc2UtaW4tb3V0O1xuICAgIH1cbiAgfVxuXG4gICZbZGF0YS1hbmltYXRpb249J2NvbGxhcHNlJ10ge1xuICAgICR7U3R5bGVkVGV4dH0ge1xuICAgICAgYW5pbWF0aW9uOiAke2dyb3VwQW5pbWF0aW9ufSAke0FOSU1BVElPTl9EVVJBVElPTn1tcyBlYXNlLWluLW91dCByZXZlcnNlO1xuICAgIH1cbiAgfVxuYFxuXG5leHBvcnQgY29uc3QgR3JvdXAgPSAoeyBjaGlsZHJlbiwgbGFiZWwgfTogR3JvdXBQcm9wcykgPT4ge1xuICBjb25zdCBjb250ZXh0ID0gdXNlTmF2aWdhdGlvbigpXG5cbiAgaWYgKCFjb250ZXh0KSB7XG4gICAgdGhyb3cgbmV3IEVycm9yKFxuICAgICAgJ05hdmlnYXRpb24uR3JvdXAgY2FuIG9ubHkgYmUgdXNlZCBpbnNpZGUgYSBOYXZpZ2F0aW9uUHJvdmlkZXIuJyxcbiAgICApXG4gIH1cblxuICBjb25zdCB7IGV4cGFuZGVkLCBhbmltYXRpb24gfSA9IGNvbnRleHRcblxuICBpZiAoQ2hpbGRyZW4uY291bnQoY2hpbGRyZW4pID4gMCkge1xuICAgIHJldHVybiAoXG4gICAgICA8Q29udGFpbmVyIGRhdGEtYW5pbWF0aW9uPXthbmltYXRpb259PlxuICAgICAgICA8U3R5bGVkU3RhY2sgZGlyZWN0aW9uPVwiY29sdW1uXCI+XG4gICAgICAgICAge2V4cGFuZGVkIHx8IGFuaW1hdGlvbiA9PT0gJ2V4cGFuZCcgPyAoXG4gICAgICAgICAgICA8U3R5bGVkVGV4dFxuICAgICAgICAgICAgICBhcz1cInNwYW5cIlxuICAgICAgICAgICAgICB2YXJpYW50PVwiYm9keVNtYWxsU3Ryb25nXCJcbiAgICAgICAgICAgICAgc2VudGltZW50PVwibmV1dHJhbFwiXG4gICAgICAgICAgICAgIHByb21pbmVuY2U9XCJ3ZWFrXCJcbiAgICAgICAgICAgID5cbiAgICAgICAgICAgICAge2xhYmVsfVxuICAgICAgICAgICAgPC9TdHlsZWRUZXh0PlxuICAgICAgICAgICkgOiBudWxsfVxuICAgICAgICAgIHtjaGlsZHJlbn1cbiAgICAgICAgPC9TdHlsZWRTdGFjaz5cbiAgICAgIDwvQ29udGFpbmVyPlxuICAgIClcbiAgfVxuXG4gIHJldHVybiBudWxsXG59XG4iXX0= */"));
+const Group = ({
+  children,
+  label
+}) => {
+  const context = useNavigation();
+  if (!context) {
+    throw new Error("Navigation.Group can only be used inside a NavigationProvider.");
+  }
+  const {
+    expanded,
+    animation
+  } = context;
+  if (Children.count(children) > 0) {
+    return /* @__PURE__ */ jsx(Container, { "data-animation": animation, children: /* @__PURE__ */ jsxs(StyledStack, { direction: "column", children: [
+      expanded || animation === "expand" ? /* @__PURE__ */ jsx(StyledText, { as: "span", variant: "bodySmallStrong", sentiment: "neutral", prominence: "weak", children: label }) : null,
+      children
+    ] }) });
+  }
+  return null;
+};
+export {
+  Group
+};

package/dist/components/Navigation/components/Item.d.ts

@@ -0,0 +1,81 @@
+import { CategoryIcon } from '@ultraviolet/icons';
+import { Badge } from '@ultraviolet/ui';
+import type { ComponentProps, JSX, MouseEvent, ReactNode } from 'react';
+type ItemType = 'default' | 'pinned' | 'pinnedGroup';
+type ItemProps = {
+    children?: ReactNode;
+    /**
+     * Sets a category icon on the left of the item
+     */
+    categoryIcon?: ComponentProps<typeof CategoryIcon>['name'];
+    categoryIconVariant?: ComponentProps<typeof CategoryIcon>['variant'];
+    /**
+     * The label of the item that will be shown.
+     * It is also used as the key for pinning.
+     */
+    label: string;
+    /**
+     * It should be a unique id and will be used for pin/unpin feature.
+     */
+    id: string;
+    /**
+     * Text shown under the label with a lighter color and smaller font size
+     */
+    subLabel?: string;
+    /**
+     * Badge is added on the right of the item. It is hidden on hover if pinned
+     * feature is enabled
+     */
+    badgeText?: string;
+    /**
+     * Defined the sentiment of the badge according to Badge component from
+     * `@ultraviolet/ui`
+     */
+    badgeSentiment?: ComponentProps<typeof Badge>['sentiment'];
+    href?: string;
+    /**
+     * This function will be triggered on click of the item. If the item is expandable
+     * toggle will be passed with it.
+     */
+    onClick?: (toggle?: true | false) => void;
+    onPinUnpinClick?: (event: MouseEvent<HTMLDivElement>) => void;
+    /**
+     * This prop is used to control if the item is expanded or collapsed
+     */
+    toggle?: boolean;
+    /**
+     * Set this to true if your current page is this item.
+     */
+    active?: boolean;
+    /**
+     * If you want to remove pin button on your item use this prop
+     */
+    noPinButton?: boolean;
+    /**
+     * You don't need to use this prop it's used internally to control the type of the item
+     */
+    type?: ItemType;
+    /**
+     * You don't need to use this prop it's used internally to control if the item has a parent
+     */
+    hasParents?: boolean;
+    /**
+     * You don't need to use this prop it's used internally for pinned item to be reorganized with drag and drop
+     */
+    index?: number;
+    /**
+     * When the item has href it becomes a link if not it is a button.
+     * When using an external routing tool you might need to remove both of them and use
+     * a non focusable element. This option allows you to choose the tag of the
+     * item.
+     */
+    as?: keyof JSX.IntrinsicElements;
+    /**
+     * Use this prop if you want to remove the expand behavior when the item
+     * has sub items.
+     */
+    noExpand?: boolean;
+    disabled?: boolean;
+};
+export declare const Item: ({ children, categoryIcon, categoryIconVariant, label, subLabel, badgeText, badgeSentiment, href, onClick, onPinUnpinClick, toggle, active, noPinButton, type, hasParents, as, disabled, noExpand, index, id, }: ItemProps) => import("@emotion/react/jsx-runtime").JSX.Element | null;
+export {};