pallote-react 0.14.3 → 0.14.5

package/index.js

@@ -1,7 +1,8 @@
-import React, { useState, useEffect, useRef } from 'react';
+import React, { useState, useEffect, useRef, createContext, useContext } from 'react';
 import classnames from 'classnames';
 import PropTypes from 'prop-types';
-import { CalendarBlank, Clock, CaretUpDown, ArrowSquareOut } from '@phosphor-icons/react';
+import { createPortal } from 'react-dom';
+import { X, CalendarBlank, Clock, CaretUpDown, ArrowSquareOut, CaretDoubleLeft, CaretLeft, CaretRight, CaretDoubleRight } from '@phosphor-icons/react';
 import SyntaxHighlighter from 'react-syntax-highlighter';
 
 const Color = ({
@@ -43,6 +44,11 @@ Color.propTypes = {
   children: PropTypes.node
 };
 
+var Color$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Color: Color
+});
+
 const viewportSizes = {
   'mobile-sm': 375,
   'mobile': 576,
@@ -83,6 +89,11 @@ Display.propTypes = {
   children: PropTypes.node
 };
 
+var Display$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Display: Display
+});
+
 function _extends() {
   return _extends = Object.assign ? Object.assign.bind() : function (n) {
     for (var e = 1; e < arguments.length; e++) {
@@ -146,6 +157,11 @@ Grid.propTypes = {
   children: PropTypes.node
 };
 
+var Grid$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Grid: Grid
+});
+
 const Text = ({
   variant,
   align,
@@ -191,6 +207,86 @@ Text.propTypes = {
   children: PropTypes.node
 };
 
+var Text$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Text: Text
+});
+
+const Alert = ({
+  color = 'success',
+  variant = 'toast',
+  title,
+  subtitle,
+  dense,
+  noIcon,
+  show,
+  onClose,
+  className,
+  ...props
+}) => {
+  const [shouldRender, setRender] = useState(show);
+  const [container] = useState(() => {
+    let el = document.getElementById('alerts');
+    if (!el) {
+      el = document.createElement('div');
+      el.id = 'alerts';
+      document.body.appendChild(el);
+    }
+    return el;
+  });
+  useEffect(() => {
+    if (show) setRender(true);
+  }, [show]);
+  const onAnimationEnd = () => {
+    if (!show) setRender(false);
+  };
+  let alert = /*#__PURE__*/React.createElement("div", _extends({
+    className: classnames(['alert', {
+      [`alert-${color}`]: color,
+      [`alert-${variant}`]: variant,
+      'alert-slideIn': show,
+      'alert-slideOut': !show,
+      'alert-dense': dense,
+      'alert-noIcon': noIcon
+    }, className]),
+    onAnimationEnd: onAnimationEnd
+  }, props), /*#__PURE__*/React.createElement("div", {
+    className: classnames('alert_content')
+  }, title ? /*#__PURE__*/React.createElement(Text, {
+    className: classnames('alert_title'),
+    variant: dense ? 'caption' : 'body',
+    weight: "bold"
+  }, title) : null, subtitle ? /*#__PURE__*/React.createElement(Text, {
+    variant: dense ? 'overline' : 'caption',
+    className: classnames('alert_subtitle')
+  }, subtitle) : null), onClose ? /*#__PURE__*/React.createElement(X, {
+    className: classnames('alert_close'),
+    onClick: onClose,
+    size: dense ? 14 : 16
+  }) : null);
+  if (variant === 'notice') {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, alert);
+  } else {
+    return /*#__PURE__*/createPortal(shouldRender && alert, container);
+  }
+};
+Alert.propTypes = {
+  color: PropTypes.oneOf(['success', 'info', 'warning', 'error']),
+  variant: PropTypes.oneOf(['bar', 'toast', 'notice']),
+  title: PropTypes.string.isRequired,
+  subtitle: PropTypes.string,
+  dense: PropTypes.bool,
+  noIcon: PropTypes.bool,
+  show: PropTypes.bool,
+  onClose: PropTypes.func,
+  className: PropTypes.node
+};
+
+var Alert$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Alert: Alert
+});
+
 const Breadcrumbs = ({
   items,
   separator = "slash",
@@ -214,6 +310,11 @@ Breadcrumbs.propTypes = {
   className: PropTypes.node
 };
 
+var Breadcrumbs$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Breadcrumbs: Breadcrumbs
+});
+
 const Button = /*#__PURE__*/React.forwardRef(({
   component = 'button',
   kind,
@@ -263,6 +364,11 @@ Button.propTypes = {
   children: PropTypes.node.isRequired
 };
 
+var Button$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Button: Button
+});
+
 const Buttons = ({
   direction = 'landscape',
   fullWidth,
@@ -287,6 +393,11 @@ Buttons.propTypes = {
   children: PropTypes.node.isRequired
 };
 
+var Buttons$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Buttons: Buttons
+});
+
 const Card = ({
   size = 'md',
   fill = 'paper',
@@ -321,6 +432,11 @@ Card.propTypes = {
   children: PropTypes.node.isRequired
 };
 
+var Card$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Card: Card
+});
+
 const CardActions = ({
   direction,
   className,
@@ -339,6 +455,11 @@ CardActions.propTypes = {
   children: PropTypes.node.isRequired
 };
 
+var CardActions$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  CardActions: CardActions
+});
+
 const CardContent = ({
   fullWidth,
   className,
@@ -357,6 +478,11 @@ CardContent.propTypes = {
   children: PropTypes.node.isRequired
 };
 
+var CardContent$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  CardContent: CardContent
+});
+
 const CardHeader = ({
   label,
   title,
@@ -386,6 +512,11 @@ CardHeader.propTypes = {
   children: PropTypes.node
 };
 
+var CardHeader$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  CardHeader: CardHeader
+});
+
 const CardMedia = ({
   width,
   height,
@@ -415,6 +546,11 @@ CardMedia.propTypes = {
   className: PropTypes.node
 };
 
+var CardMedia$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  CardMedia: CardMedia
+});
+
 const Checkbox = ({
   id,
   value,
@@ -454,6 +590,11 @@ Checkbox.propTypes = {
   className: PropTypes.node
 };
 
+var Checkbox$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Checkbox: Checkbox
+});
+
 const InputLabel = ({
   isLegend = false,
   htmlFor,
@@ -486,6 +627,11 @@ InputLabel.propTypes = {
   error: PropTypes.string
 };
 
+var InputLabel$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  InputLabel: InputLabel
+});
+
 const Checkboxes = ({
   onChange,
   id,
@@ -534,6 +680,11 @@ Checkboxes.propTypes = {
   className: PropTypes.node
 };
 
+var Checkboxes$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Checkboxes: Checkboxes
+});
+
 const Divider = ({
   direction = 'landscape',
   padding = 'md',
@@ -553,6 +704,11 @@ Divider.propTypes = {
   className: PropTypes.node
 };
 
+var Divider$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Divider: Divider
+});
+
 const Input = ({
   onChange,
   type = 'text',
@@ -618,6 +774,11 @@ Input.propTypes = {
   className: PropTypes.node
 };
 
+var Input$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Input: Input
+});
+
 const Link = ({
   component = 'a',
   icon,
@@ -651,6 +812,11 @@ Link.propTypes = {
   children: PropTypes.node.isRequired
 };
 
+var Link$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Link: Link
+});
+
 const List = ({
   dense,
   className,
@@ -669,6 +835,11 @@ List.propTypes = {
   children: PropTypes.node.isRequired
 };
 
+var List$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  List: List
+});
+
 const ListItem = ({
   icon,
   bold,
@@ -691,6 +862,11 @@ ListItem.propTypes = {
   children: PropTypes.node.isRequired
 };
 
+var ListItem$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  ListItem: ListItem
+});
+
 const Nav = ({
   direction,
   dense,
@@ -714,6 +890,11 @@ Nav.propTypes = {
   children: PropTypes.node.isRequired
 };
 
+var Nav$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Nav: Nav
+});
+
 const SectionHeader = ({
   label,
   title,
@@ -747,6 +928,11 @@ SectionHeader.propTypes = {
   className: PropTypes.node
 };
 
+var SectionHeader$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  SectionHeader: SectionHeader
+});
+
 const Section = ({
   align = 'left',
   color = 'default',
@@ -783,6 +969,11 @@ Section.propTypes = {
   children: PropTypes.node.isRequired
 };
 
+var Section$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Section: Section
+});
+
 const NavBar = ({
   logo,
   align,
@@ -826,6 +1017,11 @@ NavBar.propTypes = {
   children: PropTypes.node.isRequired
 };
 
+var NavBar$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  NavBar: NavBar
+});
+
 const NavItem = ({
   component,
   label,
@@ -875,6 +1071,11 @@ NavItem.propTypes = {
   className: PropTypes.node
 };
 
+var NavItem$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  NavItem: NavItem
+});
+
 const Radio = ({
   id,
   name,
@@ -916,6 +1117,11 @@ Radio.propTypes = {
   className: PropTypes.node
 };
 
+var Radio$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Radio: Radio
+});
+
 const RadioButtons = ({
   onChange,
   id,
@@ -964,6 +1170,11 @@ RadioButtons.propTypes = {
   className: PropTypes.node
 };
 
+var RadioButtons$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  RadioButtons: RadioButtons
+});
+
 const SectionContent = ({
   align = 'left',
   className,
@@ -982,6 +1193,11 @@ SectionContent.propTypes = {
   children: PropTypes.node.isRequired
 };
 
+var SectionContent$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  SectionContent: SectionContent
+});
+
 const Select = ({
   onChange,
   id,
@@ -1041,6 +1257,11 @@ Select.propTypes = {
   className: PropTypes.node
 };
 
+var Select$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Select: Select
+});
+
 var nnfxDark = {
   "hljs": {
     "display": "block",
@@ -1184,6 +1405,11 @@ Snippet.propTypes = {
   className: PropTypes.node
 };
 
+var Snippet$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Snippet: Snippet
+});
+
 const Status = ({
   color = 'inactive',
   dense,
@@ -1205,6 +1431,11 @@ Status.propTypes = {
   children: PropTypes.node.isRequired
 };
 
+var Status$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Status: Status
+});
+
 const Switch = ({
   id,
   startLabel,
@@ -1244,6 +1475,323 @@ Switch.propTypes = {
   className: PropTypes.node
 };
 
+var Switch$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Switch: Switch
+});
+
+const TabsContext = /*#__PURE__*/createContext();
+const Tabs = ({
+  direction,
+  dense,
+  hasBorder,
+  className,
+  children
+}) => {
+  const [activeIndex, setActiveIndex] = useState(0);
+  return /*#__PURE__*/React.createElement(TabsContext.Provider, {
+    value: {
+      activeIndex,
+      setActiveIndex
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classnames(['tabs', {
+      [`tabs-${direction}`]: direction,
+      'tabs-dense': dense,
+      'tabs-hasBorder': hasBorder
+    }, className])
+  }, children));
+};
+Tabs.propTypes = {
+  direction: PropTypes.oneOf(['portrait', 'landscape']),
+  dense: PropTypes.bool,
+  hasBorder: PropTypes.bool,
+  className: PropTypes.node,
+  children: PropTypes.node.isRequired
+};
+
+var Tabs$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Tabs: Tabs,
+  TabsContext: TabsContext
+});
+
+const Tab = ({
+  index,
+  label,
+  className
+}) => {
+  const {
+    activeIndex,
+    setActiveIndex
+  } = useContext(TabsContext);
+  const isSelected = activeIndex === index;
+  return /*#__PURE__*/React.createElement("button", {
+    className: classnames(['tab', {
+      'tab-active': isSelected
+    }, className]),
+    role: "tab",
+    "aria-selected": isSelected,
+    "aria-controls": `tabpanel-${index}`,
+    id: `tab-${index}`,
+    tabIndex: isSelected ? 0 : -1,
+    onClick: () => setActiveIndex(index)
+  }, label);
+};
+Tab.propTypes = {
+  label: PropTypes.string,
+  className: PropTypes.node.isRequired
+};
+
+var Tab$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Tab: Tab
+});
+
+const TableFooter = ({
+  className,
+  ...props
+}) => {
+  return /*#__PURE__*/React.createElement("div", _extends({
+    className: classnames(['table_footer', className])
+  }, props), /*#__PURE__*/React.createElement(Select, {
+    dense: true,
+    id: "rows",
+    className: "table_rowSelect"
+  }, /*#__PURE__*/React.createElement("option", {
+    value: "1"
+  }, "10"), /*#__PURE__*/React.createElement("option", {
+    value: "2"
+  }, "25"), /*#__PURE__*/React.createElement("option", {
+    value: "2"
+  }, "50"), /*#__PURE__*/React.createElement("option", {
+    value: "2"
+  }, "100"), /*#__PURE__*/React.createElement("option", {
+    value: "2"
+  }, "All")), /*#__PURE__*/React.createElement(Buttons, {
+    className: "table_pagination"
+  }, /*#__PURE__*/React.createElement(Button, {
+    kind: "icon",
+    variant: "transparent",
+    size: "sm"
+  }, /*#__PURE__*/React.createElement(CaretDoubleLeft, null)), /*#__PURE__*/React.createElement(Button, {
+    kind: "icon",
+    variant: "transparent",
+    size: "sm"
+  }, /*#__PURE__*/React.createElement(CaretLeft, null)), /*#__PURE__*/React.createElement(Button, {
+    kind: "icon",
+    size: "sm"
+  }, "1"), /*#__PURE__*/React.createElement(Button, {
+    kind: "icon",
+    variant: "transparent",
+    size: "sm"
+  }, "2"), /*#__PURE__*/React.createElement(Button, {
+    kind: "icon",
+    variant: "transparent",
+    size: "sm"
+  }, "3"), /*#__PURE__*/React.createElement(Button, {
+    kind: "icon",
+    variant: "transparent",
+    size: "sm"
+  }, "\u2026"), /*#__PURE__*/React.createElement(Button, {
+    kind: "icon",
+    variant: "transparent",
+    size: "sm"
+  }, "8"), /*#__PURE__*/React.createElement(Button, {
+    kind: "icon",
+    variant: "transparent",
+    size: "sm"
+  }, /*#__PURE__*/React.createElement(CaretRight, null)), /*#__PURE__*/React.createElement(Button, {
+    kind: "icon",
+    variant: "transparent",
+    size: "sm"
+  }, /*#__PURE__*/React.createElement(CaretDoubleRight, null))));
+};
+TableFooter.propTypes = {
+  className: PropTypes.node
+};
+
+var TableFooter$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  TableFooter: TableFooter
+});
+
+const DenseContext = /*#__PURE__*/createContext(false);
+const Table = ({
+  striped,
+  hasHover,
+  dense,
+  border,
+  withFooter,
+  className,
+  children,
+  ...props
+}) => {
+  return /*#__PURE__*/React.createElement(DenseContext.Provider, {
+    value: dense
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classnames(['table', {
+      'table-striped': striped,
+      'table-hasHover': hasHover,
+      'table-dense': dense,
+      'table-border': border
+    }, className])
+  }, /*#__PURE__*/React.createElement("table", _extends({
+    cellPadding: 0,
+    cellSpacing: 0,
+    className: classnames('table_content')
+  }, props), children), withFooter ? /*#__PURE__*/React.createElement(TableFooter, {
+    dense: dense ? dense : null
+  }) : null));
+};
+Table.propTypes = {
+  striped: PropTypes.bool,
+  hasHover: PropTypes.bool,
+  dense: PropTypes.bool,
+  border: PropTypes.bool,
+  withFooter: PropTypes.bool,
+  className: PropTypes.node,
+  children: PropTypes.node.isRequired
+};
+
+var Table$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  DenseContext: DenseContext,
+  Table: Table
+});
+
+const TableBody = ({
+  className,
+  children,
+  ...props
+}) => {
+  return /*#__PURE__*/React.createElement("tbody", _extends({
+    className: classnames(['table_body', className])
+  }, props), children);
+};
+TableBody.propTypes = {
+  className: PropTypes.node,
+  children: PropTypes.node.isRequired
+};
+
+var TableBody$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  TableBody: TableBody
+});
+
+const TableCellComponentContext = /*#__PURE__*/createContext('td');
+const TableHead = ({
+  className,
+  children,
+  ...props
+}) => {
+  return /*#__PURE__*/React.createElement(TableCellComponentContext.Provider, {
+    value: "th"
+  }, /*#__PURE__*/React.createElement("thead", _extends({
+    className: classnames(['table_head', className])
+  }, props), children));
+};
+TableHead.propTypes = {
+  className: PropTypes.node,
+  children: PropTypes.node.isRequired
+};
+
+var TableHead$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  TableCellComponentContext: TableCellComponentContext,
+  TableHead: TableHead
+});
+
+const TableCell = ({
+  kind = 'default',
+  className,
+  children,
+  ...props
+}) => {
+  const useTableCellComponent = () => useContext(TableCellComponentContext);
+  const Component = useTableCellComponent();
+  return /*#__PURE__*/React.createElement(Component, _extends({
+    className: classnames(['table_cell', {
+      [`table_cell-${kind}`]: kind
+    }, className])
+  }, props), children);
+};
+TableCell.propTypes = {
+  kind: PropTypes.oneOf(['default', 'number', 'action']),
+  className: PropTypes.node,
+  children: PropTypes.node.isRequired
+};
+
+var TableCell$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  TableCell: TableCell
+});
+
+const TableRow = ({
+  className,
+  children,
+  ...props
+}) => {
+  return /*#__PURE__*/React.createElement("tr", _extends({
+    className: classnames(['table_row', className])
+  }, props), children);
+};
+TableRow.propTypes = {
+  className: PropTypes.node,
+  children: PropTypes.node.isRequired
+};
+
+var TableRow$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  TableRow: TableRow
+});
+
+const TabsControl = ({
+  className,
+  children
+}) => {
+  return /*#__PURE__*/React.createElement("div", {
+    role: "tablist",
+    className: classnames(['tabs_controls', className])
+  }, children);
+};
+TabsControl.propTypes = {
+  className: PropTypes.node,
+  children: PropTypes.node.isRequired
+};
+
+var TabsControl$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  TabsControl: TabsControl
+});
+
+const TabsPanel = ({
+  index,
+  className,
+  children
+}) => {
+  const {
+    activeIndex
+  } = useContext(TabsContext);
+  const isActive = activeIndex === index;
+  return isActive ? /*#__PURE__*/React.createElement("div", {
+    className: classnames(['tabs_panel', className]),
+    role: "tabpanel",
+    id: `tabpanel-${index}`,
+    "aria-labelledby": `tab-${index}`,
+    hidden: !isActive
+  }, children) : null;
+};
+TabsPanel.propTypes = {
+  className: PropTypes.node,
+  children: PropTypes.node.isRequired
+};
+
+var TabsPanel$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  TabsPanel: TabsPanel
+});
+
 const Tag = ({
   color = 'primary',
   dense,
@@ -1265,6 +1813,11 @@ Tag.propTypes = {
   children: PropTypes.node.isRequired
 };
 
+var Tag$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Tag: Tag
+});
+
 const Textarea = ({
   onChange,
   id,
@@ -1322,4 +1875,9 @@ Textarea.propTypes = {
   className: PropTypes.node
 };
 
-export { Breadcrumbs, Button, Buttons, Card, CardActions, CardContent, CardHeader, CardMedia, Checkbox, Checkboxes, Color, Display, Divider, Grid, Input, InputLabel, Link, List, ListItem, Nav, NavBar, NavItem, Radio, RadioButtons, Section, SectionContent, SectionHeader, Select, Snippet, Status, Switch, Tag, Text, Textarea };
+var Textarea$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  Textarea: Textarea
+});
+
+export { Alert$1 as Alert, Breadcrumbs$1 as Breadcrumbs, Button$1 as Button, Buttons$1 as Buttons, Card$1 as Card, CardActions$1 as CardActions, CardContent$1 as CardContent, CardHeader$1 as CardHeader, CardMedia$1 as CardMedia, Checkbox$1 as Checkbox, Checkboxes$1 as Checkboxes, Color$1 as Color, Display$1 as Display, Divider$1 as Divider, Grid$1 as Grid, Input$1 as Input, InputLabel$1 as InputLabel, Link$1 as Link, List$1 as List, ListItem$1 as ListItem, Nav$1 as Nav, NavBar$1 as NavBar, NavItem$1 as NavItem, Radio$1 as Radio, RadioButtons$1 as RadioButtons, Section$1 as Section, SectionContent$1 as SectionContent, SectionHeader$1 as SectionHeader, Select$1 as Select, Snippet$1 as Snippet, Status$1 as Status, Switch$1 as Switch, Tab$1 as Tab, Table$1 as Table, TableBody$1 as TableBody, TableCell$1 as TableCell, TableFooter$1 as TableFooter, TableHead$1 as TableHead, TableRow$1 as TableRow, Tabs$1 as Tabs, TabsControl$1 as TabsControl, TabsPanel$1 as TabsPanel, Tag$1 as Tag, Text$1 as Text, Textarea$1 as Textarea };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pallote-react",
-  "version": "0.14.3",
+  "version": "0.14.5",
   "description": "",
   "main": "dist/index.js",
   "styles": "dist/index.css",
@@ -19,9 +19,7 @@
     "react-router-dom": "^7.3.0"
   },
   "dependencies": {
-    "@babel/preset-react": "^7.26.3",
     "@phosphor-icons/react": "^2.1.7",
-    "@rollup/plugin-json": "^6.1.0",
     "classnames": "^2.5.1",
     "react-syntax-highlighter": "^15.6.1",
     "sass": "^1.71.1",