How to use the reakit/Tabs.Container function in reakit

To help you get started, we’ve selected a few reakit examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github fannypackui / fannypack / packages / fannypack / src / Tabs / Tabs.tsx View on Github external
export type TabsComponents = {
  Tab: React.FunctionComponent;
  Panel: React.FunctionComponent;
  Container: React.FunctionComponent<{ children: (...args: any) => React.ReactNode }>;
};

export const Tabs: React.FunctionComponent & TabsComponents = ({ children, ...props }) => (
  <_Tabs use={ReakitTabs} {...props}>
    {children}
  
);

Tabs.Tab = Tab;
Tabs.Panel = TabPanel;
Tabs.Container = ReakitTabs.Container;

export const tabsPropTypes = {
  align: PropTypes.oneOf(['left', 'center', 'right']) as PropTypes.Validator,
  children: PropTypes.node.isRequired,
  className: PropTypes.string,
  isFitted: PropTypes.bool,
  type: PropTypes.oneOf(['default', 'boxed']) as PropTypes.Validator
};
Tabs.propTypes = tabsPropTypes;

export const tabsDefaultProps: Partial = {
  align: undefined,
  className: undefined,
  isFitted: false,
  type: 'default'
};
github fannypackui / fannypack / src / Tabs / Tabs.tsx View on Github external
export type TabsComponents = {
  Tab: React.FunctionComponent;
  Panel: React.FunctionComponent;
  Container: React.FunctionComponent<{ children: (...args: any) => React.ReactNode }>;
};

export const Tabs: React.FunctionComponent & TabsComponents = ({ children, ...props }) => (
  <_Tabs use={ReakitTabs} {...props}>
    {children}
  
);

Tabs.Tab = Tab;
Tabs.Panel = TabPanel;
Tabs.Container = ReakitTabs.Container;

Tabs.propTypes = {
  align: PropTypes.oneOf(['left', 'center', 'right']) as PropTypes.Validator,
  children: PropTypes.node.isRequired,
  className: PropTypes.string,
  isFitted: PropTypes.bool,
  type: PropTypes.oneOf(['default', 'boxed']) as PropTypes.Validator
};
Tabs.defaultProps = {
  align: undefined,
  className: undefined,
  isFitted: false,
  type: 'default'
};

const C: React.FunctionComponent & TabsComponents = Tabs;
github fannypackui / fannypack / src / Tabs / Tabs.js View on Github external
type Props = {
  children: Node,
  className?: string,
  /** Visual type of the tab */
  type?: 'default' | 'boxed'
};

const Tabs = ({ children, ...props }: Props) => (
  <_Tabs use={ReakitTabs} {...props}>
    {children}
  
);

Tabs.Tab = Tab;
Tabs.Panel = TabPanel;
Tabs.Container = ReakitTabs.Container;

Tabs.defaultProps = {
  className: undefined,
  type: 'default'
};

export default Tabs;