diff --git a/notNeededPackages.json b/notNeededPackages.json index 7199ca022a..159b854949 100644 --- a/notNeededPackages.json +++ b/notNeededPackages.json @@ -216,6 +216,12 @@ "sourceRepoURL": "https://github.com/brianloveswords/base64url", "asOfVersion": "2.0.0" }, + { + "libraryName": "baseui", + "typingsPackageName": "baseui", + "sourceRepoURL": "https://github.com/uber-web/baseui", + "asOfVersion": "8.0.0" + }, { "libraryName": "beeper", "typingsPackageName": "beeper", diff --git a/types/baseui/accordion/index.d.ts b/types/baseui/accordion/index.d.ts deleted file mode 100644 index 483b931cb0..0000000000 --- a/types/baseui/accordion/index.d.ts +++ /dev/null @@ -1,101 +0,0 @@ -/// -import * as React from 'react'; -import { StyletronComponent } from 'styletron-react'; - -export interface STATE_CHANGE_TYPE { - expand: 'expand'; -} - -export interface AccordionOverrides { - Root?: Override; -} - -export interface SharedProps { - $color?: string; - $disabled?: boolean; - $expanded?: boolean; - $size?: string | number; -} - -export type StateReducer = ( - stateChangeType: STATE_CHANGE_TYPE[keyof STATE_CHANGE_TYPE], - nextState: T, - currentState: T, -) => T; - -export interface AccordionProps { - accordion?: boolean; - children: React.ReactNode; - disabled?: boolean; - initialState?: AccordionState; - onChange?: (args: { expanded: React.Key[] }) => any; - overrides?: AccordionOverrides; - stateReducer?: StateReducer; -} - -export interface AccordionState { - expanded: React.Key[]; -} - -export class Accordion extends React.Component { - onPanelChange(key: React.Key, onChange: () => any, ...args: any): void; - internalSetState(type: STATE_CHANGE_TYPE[keyof STATE_CHANGE_TYPE], changes: AccordionState): void; - getItems(): React.ReactNode; -} - -export interface PanelOverrides { - PanelContainer?: Override; - Header?: Override; - ToggleIcon?: Override; - Content?: Override; -} - -export interface SharedPanelProps { - children: React.ReactNode; - disabled?: boolean; - key?: React.Key; - onChange?: (args: {expanded: boolean}) => any; - onClick?: (e: Event) => any; - onKeyDown?: (e: KeyboardEvent) => any; - overrides?: PanelOverrides; - title?: React.ReactNode; -} - -export interface SharedStatefulPanelContainerProps { - initialState?: PanelState; - onChange?: (args: { expanded: boolean}) => any; - stateReducer?: StateReducer; -} - -export type PanelProps = SharedPanelProps & { expanded?: boolean; }; - -export class Panel extends React.Component { - onClick(e: Event): void; - onKeyDown(e: KeyboardEvent): void; - getSharedProps(): SharedProps; -} - -export type StatefulPanelProps = SharedPanelProps & SharedStatefulPanelContainerProps; - -export const StatefulPanel: React.FC; - -export type StatefulPanelContainerProps = SharedStatefulPanelContainerProps & { - children: React.ReactNode; -}; - -export interface PanelState { - expanded: boolean; -} - -export class StatefulPanelContainer extends React.Component { - onChange(args: any): void; - internalSetState(type: STATE_CHANGE_TYPE[keyof STATE_CHANGE_TYPE], changes: PanelState): void; -} - -export const StyledRoot: StyletronComponent; -export const StyledPanelContainer: StyletronComponent; -export const StyledHeader: StyletronComponent; -export const StyledContent: StyletronComponent; -export const StyledToggleIcon: StyletronComponent; - -export const STATE_CHANGE_TYPE: STATE_CHANGE_TYPE; diff --git a/types/baseui/avatar/index.d.ts b/types/baseui/avatar/index.d.ts deleted file mode 100644 index d19491e515..0000000000 --- a/types/baseui/avatar/index.d.ts +++ /dev/null @@ -1,33 +0,0 @@ -/// -import * as React from 'react'; -import { StyletronComponent } from 'styletron-react'; - -export interface AvatarOverrides { - Avatar?: Override; - Initials?: Override; - Root?: Override; -} - -export interface StyleProps { - $didImageFailToLoad: boolean; - $size?: string; -} - -export interface AvatarProps { - name: string; - overrides?: AvatarOverrides; - size?: string; - src?: string; -} - -export interface AvatarState { - noImageAvailable: boolean; -} - -export class Avatar extends React.Component { - handleError(): void; -} - -export const StyledAvatar: StyletronComponent; -export const StyledInitials: StyletronComponent; -export const StyledRoot: StyletronComponent; diff --git a/types/baseui/baseui-tests.tsx b/types/baseui/baseui-tests.tsx deleted file mode 100644 index 032c2b0221..0000000000 --- a/types/baseui/baseui-tests.tsx +++ /dev/null @@ -1,1087 +0,0 @@ -import * as React from 'react'; -import { createTheme, lightThemePrimitives, mergeOverrides, BaseProvider, styled } from 'baseui'; -import { Block } from 'baseui/block'; -import { FlexGrid, FlexGridItem } from 'baseui/flex-grid'; -import { Accordion, Panel, StatefulPanel } from 'baseui/accordion'; -import { Avatar } from 'baseui/avatar'; -import { Breadcrumbs } from 'baseui/breadcrumbs'; -import { Button, KIND as BUTTON_KIND, SHAPE as BUTTON_SHAPE, SIZE as BUTTON_SIZE } from 'baseui/button'; -import { ButtonGroup, StatefulButtonGroup, MODE as BUTTON_GROUP_MODE } from 'baseui/button-group'; -import { Card, StyledBody } from 'baseui/card'; -import { Checkbox, StatefulCheckbox } from 'baseui/checkbox'; -import { StatefulCalendar, StatefulDatepicker, TimePicker, TimezonePicker, Datepicker } from 'baseui/datepicker'; -import { StatefulList, List } from 'baseui/dnd-list'; -import { FileUploader } from 'baseui/file-uploader'; -import { FormControl } from 'baseui/form-control'; -import { - HeaderNavigation, - StyledNavigationItem as NavigationItem, - StyledNavigationList as NavigationList, - ALIGN as NAV_ALIGN, -} from 'baseui/header-navigation'; -import { Heading, HeadingLevel } from 'baseui/heading'; -import ArrowUp from 'baseui/icon/arrow-up'; -import ArrowRight from 'baseui/icon/arrow-right'; -import ArrowDown from 'baseui/icon/arrow-down'; -import ArrowLeft from 'baseui/icon/arrow-left'; -import { Input, MaskedInput, StatefulInput, SIZE as INPUT_SIZE } from 'baseui/input'; -import { Layer, TetherBehavior } from 'baseui/layer'; -import { StyledLink } from 'baseui/link'; -import { Menu, StatefulMenu, NestedMenus } from 'baseui/menu'; -import { - Modal, - ModalHeader, - ModalBody, - ModalFooter, - ModalButton, -} from 'baseui/modal'; -import { Notification } from 'baseui/notification'; -import { Pagination, StatefulPagination } from 'baseui/pagination'; -import { Popover, StatefulPopover } from 'baseui/popover'; -import { ProgressBar } from 'baseui/progress-bar'; -import { NumberedStep, ProgressSteps, Step, StyledProgressSteps, StyleProps as ProgressStepsStyleProps } from 'baseui/progress-steps'; -import { Radio, RadioGroup, StatefulRadioGroup } from 'baseui/radio'; -import { StarRating, EmoticonRating } from 'baseui/rating'; -import { StatefulSelect, Select } from 'baseui/select'; -import { Navigation } from 'baseui/side-navigation'; -import { Slider, StatefulSlider } from 'baseui/slider'; -import { Spinner } from 'baseui/spinner'; -import { - StyledTable, - StyledHead, - StyledHeadCell, - StyledBody as StyledTableBody, - StyledRow, - StyledCell, - StyledAction, - Table, -} from 'baseui/table'; -import { Tab, Tabs, StatefulTabs, ORIENTATION as TAB_ORIENTATION } from 'baseui/tabs'; -import { Tag, KIND as TAG_KIND, VARIANT as TAG_VARIANT } from 'baseui/tag'; -import { StatefulTextarea as Textarea } from 'baseui/textarea'; -import { ToasterContainer, Toast, KIND as TOAST_KIND } from 'baseui/toast'; -import { StatefulTooltip } from 'baseui/tooltip'; -import { - Label1, - Label2, - Caption1, - Caption2, - Paragraph1, - Paragraph2, -} from 'baseui/typography'; -import { PaymentCard, StatefulPaymentCard } from 'baseui/payment-card'; -import { PhoneInput, StatefulPhoneInput, COUNTRIES } from 'baseui/phone-input'; - -// Base API -const newTheme = createTheme({...lightThemePrimitives}, {}); // $ExpectType Theme -createTheme({primary: 'red'}, {}); // $ExpectError - -mergeOverrides({style: {}}, {props: {}}); -mergeOverrides({style: {}}, 'hello'); // $ExpectError -mergeOverrides({style: {}}, {name: 'override'}); // $ExpectError - -styled(StyledProgressSteps, { marginTop: '10px' }); -styled(StyledProgressSteps, { marginTop: null }); // $ExpectError -styled(StyledProgressSteps, ({ $theme }) => ({ marginTop: '10px' })); -const StyledAnchor = styled('a', { marginTop: '10px' }); -const NewStyledProgressSteps = styled( - StyledProgressSteps, - ({ $theme, $disabled }) => ({ marginTop: '10px' }) -); - -; -; // $ExpectError -; - -; // $ExpectError - -// Accordion - - Content -; - - - Content // $ExpectError -; - -; // $ExpectError -Test Panel; - -// Avatar -; -; // $ExpectError - ({ height: $theme.sizing && $theme.sizing.scale1000 }) } }} -/>; - ({ height: $didImageFailToLoad ? '0' : '10px' }) } }} -/>; - ({ height: children ? '10px' : '0'})} }} />; - ({ height: $theme.sizing && $theme.sizing.notasize })} }} />; // $ExpectError - ({}) }}} />; // $ExpectError - -// Block -; -; // $ExpectError -; // $ExpectError - -// Breadcrumbs - - Parent Page - Sub-Parent Page - Current Page -; -; - -// Button -; -; -; -; // $ExpectError -; -; // $ExpectError -; -; // $ExpectError -; -; -; -; -; -; // $ExpectError -; - -// Button-Group - - - - -; - - - -; - - - -; - // $ExpectError - - -; - -// Card - - - Proin ut dui sed metus pharetra hend rerit vel non mi. Nulla ornare - faucibus ex, non facilisis nisl. - -; -; // $ExpectError -; // $ExpectError -; -}/>; // $ExpectError -; - -// Checkbox - false}> - Click Me -; -click me; - (
Custom
)}} -> - With style overrides -; -
Custom
}} // $ExpectError -> - With style overrides -; - - - toggle me -; - // $ExpectError - toggle me -; - -// Datepicker -; -; -; - ({ - backgroundColor: 'red', - }), - }, - }} -/>; - ({})} />; - ({})} />; // $ExpectError - ({})} />; -; // $ExpectError -; - ({})} - formatDisplayValue={(date) => 'formatted date'} - timeSelectStart - range -/>; - -// DND List -; - ({})} -/>; -; -; // $ExpectError -; -Drag Me, - }} - onChange={console.log} -/>; - ({}), - }, - }} - onChange={console.log} -/>; - -// File Uploader - ({})} - onDrop={() => ({})} - progressAmount={10} - progressMessage={'Uploading'} -/>; - ({})} - onDrop={() => ({})} - progressAmount={'10'} // $ExpectError - progressMessage={'Uploading'} -/>; - - ({})} - onDrop={() => ({})} - progressAmount={10} - progressMessage={'Uploading'} -/>; - ({})} - onDrop={() => ({})} - progressAmount={10} - progressMessage={'Uploading'} -/>; - -// FlexGrid + FlexGridItem -; -; // $ExpectError - - 1 -; -// $ExpectError - - 1 -; - -// Form Control - - Checkbox control -; - - Positive -; - - Negative -; -; // $ExpectError - -// Header Navigation - - - Uber - - - - - - - - - - - - - - - -; - -// Heading -Base Web [L1]; - - Subtitle [L5] -; -Span; -; // $ExpectError -; // $ExpectError - -// Icon -; -; -; -; -; -; -; -; -; - -// Input - ({})} - placeholder="Controlled Input" - value={'Hey'} -/>; -; -; -; -; // $ExpectError -; -; -; -; -; -; -; -; -; -; // $ExpectError - -// Layer -; // $ExpectError - - -; - ({})} - placement={'right'} -> - -; - ({})} - placement='offtotheright' // $ExpectError -> - -; - -// Link -Link to baseui.design; - -// Menu -const ITEMS = [ - {label: 'Item One'}, - {label: 'Item Two'}, - {label: 'Item Three'}, - {label: 'Item Four'}, - {label: 'Item Five'}, - {label: 'Item Six'}, - {label: 'Item Seven'}, - {label: 'Item Eight'}, - {label: 'Item Nine'}, - {label: 'Item Ten'}, - {label: 'Item Eleven'}, - {label: 'Item Twelve'}, -]; - 'Some label', - }, - }, - }} -/>; - 'Some label', - }, - }, - }} -/>; - 'Some label', - size: 'compact' - }, - }, - }} -/>; - 'Some label', - }, - }, - }} -/>; - - -; -; // $ExpectError - -// Modal - - Hello world - - Proin ut dui sed metus pharetra hend rerit vel non mi. Nulla ornare - faucibus ex, non facilisis nisl. Maecenas aliquet mauris ut tempus. - - - Cancel - Okay - -; -; // $ExpectError - -// Notification -Default info notification; -Positive notification; -Warning notification; -Negative notification; -Negative notification; // $ExpectError -Negative notification; - -// Pagination - ({})} -/>; - ({})} -/>; -; -; - -// Popover -hello world} -> - - Always open - -; -hello world} - accessibilityType={'tooltip'} -> - -; -hello world} - accessibilityType={'tooltip'} - triggerType={'hover'} -> - - Hover - -; -hello world} - placement={'topRight'} -> - - Hover - -; -hello world} - placement={'center'} // $ExpectError -> - - Hover - -; - - - -; - - -; - -// Progress Bar -; -; -; // $ExpectError - 'Label'}/>; - -// Progress Steps - - - Here is some step content - - - - - Here too! - -; - - - Here is some NumberedStep content - - - - - Here too! - -; -; - -// Radio - ({})} - value={1} // $ExpectError -> - First - - Second - - Third -; - - ({})} - value={'1'} -> - First - - Second - - Third -; - - First - Second - Third -; - - Checked - Unchecked -; - ({})} - value={'1'} -> - First - Second - Third -; - ({})} - value={'2'} -> - First - Second - Third -; - ({})} - value={'1'} -> - ( -
Choose me
- ), - RadioMarkOuter: { - style: ({$theme}) => ({borderColor: $theme.colors.positive}), - }, - }} - value="1" - > - First - -; - -// Rating - ({})} -/>; - ({})} -/>; - ({})} -/>; - -// Select -const SELECT_OPTIONS = [ - {id: 'AliceBlue', color: '#F0F8FF'}, - {id: 'AntiqueWhite', color: '#FAEBD7'}, -]; -; -; -; -; -