@up42/up-components 0.12.12 → 0.13.0

package/dist/esm/types/components/{CodeBox/CodeBox.d.ts → CodeInline/CodeInline.d.ts}

@@ -1,10 +1,10 @@
 /// <reference types="react" />
-export interface CodeBoxProps {
+export interface CodeInlineProps {
     text: string;
     label?: string;
     'data-testid'?: string;
 }
 /**
- * Documentation: https://up-components.up42.dev/?path=/docs/data-display-codebox
+ * Documentation: https://up-components.up42.dev/?path=/docs/data-display-codeinline
  */
-export declare const CodeBox: ({ label, text, "data-testid": dataTestId }: CodeBoxProps) => JSX.Element;
+export declare const CodeInline: ({ label, text, "data-testid": dataTestId }: CodeInlineProps) => JSX.Element;

package/dist/esm/types/components/CodeInline/CodeInline.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/esm/types/components/CodeSnippet/CodeSnippet.d.ts

@@ -0,0 +1,23 @@
+/// <reference types="react" />
+import { SxProps, Theme } from '@mui/material';
+import 'prismjs/plugins/line-numbers/prism-line-numbers';
+import 'prismjs/components/prism-json';
+import 'prismjs/components/prism-python';
+import 'prismjs/components/prism-kotlin';
+import 'prismjs/components/prism-java';
+import 'prismjs/components/prism-julia';
+import 'prismjs/components/prism-bash';
+export declare type Languages = 'DFS' | 'atom' | 'bash' | 'clike' | 'css' | 'extend' | 'html' | 'insertBefore' | 'java' | 'javascript' | 'js' | 'json' | 'julia' | 'kotlin' | 'kt' | 'kts' | 'markup' | 'mathml' | 'plain' | 'plaintext' | 'py' | 'python' | 'rss' | 'sh' | 'shell' | 'ssml' | 'svg' | 'text' | 'txt' | 'webmanifest' | 'xml';
+export interface CodeSnippetProps {
+    code: string;
+    language: Languages;
+    /**
+     * limit the code height. defaults to 512px, **roughly** 22 lines
+     */
+    maxCodeHeight?: string;
+    sx?: SxProps<Theme>;
+}
+/**
+ * Documentation: https://up-components.up42.dev/?path=/docs/data-display-CodeSnippet
+ */
+export declare const CodeSnippet: ({ code, language, sx, maxCodeHeight }: CodeSnippetProps) => JSX.Element;

package/dist/esm/types/components/CodeSnippet/CodeSnippet.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/esm/types/components/CodeSnippet/Pre.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const Pre: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLPreElement>, HTMLPreElement>, {}>;

package/dist/esm/types/index.d.ts

@@ -45,7 +45,8 @@ export { Badge, type BadgeProps } from './components/Badge/Badge';
 export { Tag, type TagProps } from './components/Tag/Tag';
 export { DateTime, type DateTimeProps } from './components/DateTime/DateTime';
 export { DocumentationPopover, type DocumentationPopoverProps, } from './components/DocumentationPopover/DocumentationPopover';
-export { CodeBox, type CodeBoxProps } from './components/CodeBox/CodeBox';
+export { CodeInline, type CodeInlineProps } from './components/CodeInline/CodeInline';
+export { CodeSnippet, type CodeSnippetProps } from './components/CodeSnippet/CodeSnippet';
 export { Table, TableBody, TableCell, TableHead, TableContainer, TableRow, TableFooter, TablePagination, TableSortLabel, type TableProps, type TableBodyProps, type TableCellProps, type TableHeadProps, type TableContainerProps, type TableRowProps, type TableFooterProps, type TablePaginationProps, type TableSortLabelProps, } from './components/Table/Table';
 export { DataGrid, type DataGridProps, type GridColDef, type GridRenderCellParams, type GridRowId, type GridSelectionModel, type GridSortModel, } from './components/DataGrid/DataGrid';
 export { capitalize } from './utils/helpers/capitalize';

package/dist/index.d.ts

@@ -2025,15 +2025,30 @@ declare type DocumentationPopoverProps = {
  */
 declare const DocumentationPopover: ({ content, linkPath, linkText, heading, id }: DocumentationPopoverProps) => JSX.Element;
 
-interface CodeBoxProps {
+interface CodeInlineProps {
     text: string;
     label?: string;
     'data-testid'?: string;
 }
 /**
- * Documentation: https://up-components.up42.dev/?path=/docs/data-display-codebox
+ * Documentation: https://up-components.up42.dev/?path=/docs/data-display-codeinline
  */
-declare const CodeBox: ({ label, text, "data-testid": dataTestId }: CodeBoxProps) => JSX.Element;
+declare const CodeInline: ({ label, text, "data-testid": dataTestId }: CodeInlineProps) => JSX.Element;
+
+declare type Languages = 'DFS' | 'atom' | 'bash' | 'clike' | 'css' | 'extend' | 'html' | 'insertBefore' | 'java' | 'javascript' | 'js' | 'json' | 'julia' | 'kotlin' | 'kt' | 'kts' | 'markup' | 'mathml' | 'plain' | 'plaintext' | 'py' | 'python' | 'rss' | 'sh' | 'shell' | 'ssml' | 'svg' | 'text' | 'txt' | 'webmanifest' | 'xml';
+interface CodeSnippetProps {
+    code: string;
+    language: Languages;
+    /**
+     * limit the code height. defaults to 512px, **roughly** 22 lines
+     */
+    maxCodeHeight?: string;
+    sx?: SxProps<Theme>;
+}
+/**
+ * Documentation: https://up-components.up42.dev/?path=/docs/data-display-CodeSnippet
+ */
+declare const CodeSnippet: ({ code, language, sx, maxCodeHeight }: CodeSnippetProps) => JSX.Element;
 
 declare type TableProps = MUIGlobalOmit<TableProps$1>;
 /**
@@ -2153,4 +2168,4 @@ declare type ContextState = {
  */
 declare const useAlert: () => ContextState;
 
-export { Alert, AlertProps, Avatar, AvatarProps, Badge, BadgeProps, Banner, BannerProps, Box, BoxProps, Button, ButtonProps, Checkbox, CheckboxProps, Chip, ChipProps, CodeBox, CodeBoxProps, Container, ContainerProps, ControlButton, ControlButtonProps, CopyButton, CopyButtonProps, CreateAlertProps, DataGrid, DataGridProps, DatePickerDateType, DateTime, DateTimeProps, DocumentationPopover, DocumentationPopoverProps, EmptyState, EmptyStateProps, FormCheckbox, FormCheckboxProps, FormDatePicker, FormDatePickerProps, FormDateRangePicker, FormDateRangePickerProps, FormInput, FormInputProps, FormRadio, FormRadioProps, FormSelect, FormSelectProps, FormSwitch, FormSwitchProps, Icon, IconProps, InfoCard, InfoCardProps, InfoModal, InfoModalProps, InfoPopover, InfoPopoverProps, Input, InputProps, Link, LinkProps, Loading, LoadingProps, Menu, MenuItem, MenuItemProps, MenuProps, Modal, ModalProps, NotFound, PageHeader, PageHeaderProps, PaginatedResponse, Popover, PopoverProps, Radio, RadioProps, Select, SelectProps, Slider, SliderProps, Switch, SwitchProps, Tab, TabGroup, TabGroupProps, TabProps, Table, TableBody, TableBodyProps, TableCell, TableCellProps, TableContainer, TableContainerProps, TableFooter, TableFooterProps, TableHead, TableHeadProps, TablePagination, TablePaginationProps, TableProps, TableRow, TableRowProps, TableSortLabel, TableSortLabelProps, Tabs, TabsProps, Tag, TagProps, Tooltip, TooltipProps, Typography, TypographyProps, UpComponentsProvider, capitalize, copyToClipboard, formatDate, formatFileSize, formatNumber, theme, useAlert, useQueryParams, useRemotePagination };
+export { Alert, AlertProps, Avatar, AvatarProps, Badge, BadgeProps, Banner, BannerProps, Box, BoxProps, Button, ButtonProps, Checkbox, CheckboxProps, Chip, ChipProps, CodeInline, CodeInlineProps, CodeSnippet, CodeSnippetProps, Container, ContainerProps, ControlButton, ControlButtonProps, CopyButton, CopyButtonProps, CreateAlertProps, DataGrid, DataGridProps, DatePickerDateType, DateTime, DateTimeProps, DocumentationPopover, DocumentationPopoverProps, EmptyState, EmptyStateProps, FormCheckbox, FormCheckboxProps, FormDatePicker, FormDatePickerProps, FormDateRangePicker, FormDateRangePickerProps, FormInput, FormInputProps, FormRadio, FormRadioProps, FormSelect, FormSelectProps, FormSwitch, FormSwitchProps, Icon, IconProps, InfoCard, InfoCardProps, InfoModal, InfoModalProps, InfoPopover, InfoPopoverProps, Input, InputProps, Link, LinkProps, Loading, LoadingProps, Menu, MenuItem, MenuItemProps, MenuProps, Modal, ModalProps, NotFound, PageHeader, PageHeaderProps, PaginatedResponse, Popover, PopoverProps, Radio, RadioProps, Select, SelectProps, Slider, SliderProps, Switch, SwitchProps, Tab, TabGroup, TabGroupProps, TabProps, Table, TableBody, TableBodyProps, TableCell, TableCellProps, TableContainer, TableContainerProps, TableFooter, TableFooterProps, TableHead, TableHeadProps, TablePagination, TablePaginationProps, TableProps, TableRow, TableRowProps, TableSortLabel, TableSortLabelProps, Tabs, TabsProps, Tag, TagProps, Tooltip, TooltipProps, Typography, TypographyProps, UpComponentsProvider, capitalize, copyToClipboard, formatDate, formatFileSize, formatNumber, theme, useAlert, useQueryParams, useRemotePagination };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@up42/up-components",
-  "version": "0.12.12",
+  "version": "0.13.0",
   "description": "UP42 Component Library",
   "author": "Axel Fuhrmann axel.fuhrmann@up42.com",
   "license": "ISC",
@@ -27,6 +27,7 @@
   "dependencies": {
     "@up42/design-system-tokens": "^3.0.1",
     "dayjs": "^1.11.7",
+    "prismjs": "^1.29.0",
     "react-markdown": "^8.0.3"
   },
   "devDependencies": {
@@ -59,6 +60,7 @@
     "@testing-library/react": "^12.1.2",
     "@testing-library/react-hooks": "^8.0.1",
     "@types/jest": "^27.4.0",
+    "@types/prismjs": "^1.26.0",
     "@types/react": "^17.0.38",
     "@typescript-eslint/eslint-plugin": "^5.10.0",
     "@typescript-eslint/parser": "^5.10.0",