@twreporter/react-components 9.4.4 → 9.5.0-rc.0

package/lib/listing-page/components/image.d.ts

@@ -0,0 +1,29 @@
+export default Image;
+declare class Image {
+    constructor(props: any);
+    state: {
+        isObjectFit: boolean;
+        isImgOnLoad: boolean;
+    };
+    handleImgOnLoad: any;
+    imgNode: HTMLImageElement;
+    componentDidMount(): void;
+    componentWillUnMount(): void;
+    _handleImgOnLoad(): void;
+    render(): JSX.Element;
+}
+declare namespace Image {
+    namespace defaultProps {
+        let alt: string;
+        let src: string;
+        let srcSet: string;
+    }
+    namespace propTypes {
+        let alt_1: any;
+        export { alt_1 as alt };
+        let src_1: any;
+        export { src_1 as src };
+        let srcSet_1: any;
+        export { srcSet_1 as srcSet };
+    }
+}

package/lib/listing-page/components/list-item.d.ts

@@ -0,0 +1,27 @@
+export default ListItem;
+declare class ListItem extends PureComponent<any, any, any> {
+    constructor(props: any);
+    constructor(props: any, context: any);
+    render(): JSX.Element;
+}
+declare namespace ListItem {
+    namespace defaultProps {
+        let tags: any[];
+        namespace link {
+            let to: string;
+            let target: string;
+        }
+    }
+    namespace propTypes {
+        export let title: any;
+        export let desc: any;
+        export let img: any;
+        let link_1: any;
+        export { link_1 as link };
+        export let category: any;
+        export let pubDate: any;
+        let tags_1: any;
+        export { tags_1 as tags };
+    }
+}
+import { PureComponent } from 'react';

package/lib/listing-page/components/list.d.ts

@@ -0,0 +1,31 @@
+export default List;
+declare class List extends PureComponent<any, any, any> {
+    constructor(props: any);
+    constructor(props: any, context: any);
+    render(): JSX.Element;
+}
+declare namespace List {
+    namespace defaultProps {
+        let data: any[];
+        let catName: string;
+        let tagName: string;
+        let isFetching: boolean;
+        let showSpinner: boolean;
+        let showCategory: boolean;
+    }
+    namespace propTypes {
+        let data_1: any;
+        export { data_1 as data };
+        let tagName_1: any;
+        export { tagName_1 as tagName };
+        let catName_1: any;
+        export { catName_1 as catName };
+        let isFetching_1: any;
+        export { isFetching_1 as isFetching };
+        let showSpinner_1: any;
+        export { showSpinner_1 as showSpinner };
+        let showCategory_1: any;
+        export { showCategory_1 as showCategory };
+    }
+}
+import { PureComponent } from 'react';

package/lib/listing-page/components/page-content.d.ts

@@ -0,0 +1,2 @@
+export default PageContent;
+declare const PageContent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/lib/listing-page/components/topics/index.d.ts

@@ -0,0 +1,25 @@
+export default Topics;
+declare class Topics extends Component<any, any, any> {
+    constructor(props: any);
+    constructor(props: any, context: any);
+    _buildRelatedPosts(posts: any): any;
+    _buildTopicBoxes(topics: any): any;
+    render(): JSX.Element;
+}
+declare namespace Topics {
+    namespace propTypes {
+        let topics: any;
+        let currentPage: any;
+        let isFetching: any;
+        let showSpinner: any;
+    }
+    namespace defaultProps {
+        let topics_1: any[];
+        export { topics_1 as topics };
+        let currentPage_1: number;
+        export { currentPage_1 as currentPage };
+        let showSpinner_1: boolean;
+        export { showSpinner_1 as showSpinner };
+    }
+}
+import { Component } from 'react';

package/lib/listing-page/components/topics/post-item.d.ts

@@ -0,0 +1,19 @@
+export default PostItem;
+declare class PostItem extends PureComponent<any, any, any> {
+    constructor(props: any);
+    constructor(props: any, context: any);
+    render(): JSX.Element;
+}
+declare namespace PostItem {
+    namespace propTypes {
+        let title: any;
+        let imgUrl: any;
+        let linkTo: any;
+        let linkTarget: any;
+    }
+    namespace defaultProps {
+        let linkTarget_1: any;
+        export { linkTarget_1 as linkTarget };
+    }
+}
+import { PureComponent } from 'react';

package/lib/listing-page/components/topics/posts.d.ts

@@ -0,0 +1,2 @@
+export default PostsContainer;
+declare const PostsContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/lib/listing-page/components/topics/section.d.ts

@@ -0,0 +1,20 @@
+export function TopSectionContent(props: any): JSX.Element;
+export namespace TopSectionContent {
+    namespace propTypes {
+        let children: any;
+        let topicUrl: any;
+        let topicName: any;
+    }
+    namespace defaultProps {
+        let topicName_1: string;
+        export { topicName_1 as topicName };
+    }
+}
+export function ListSectionContent(props: any): JSX.Element;
+export namespace ListSectionContent {
+    export namespace propTypes_1 {
+        let children_1: any;
+        export { children_1 as children };
+    }
+    export { propTypes_1 as propTypes };
+}

package/lib/listing-page/components/topics/topic-item.d.ts

@@ -0,0 +1,22 @@
+export default TopicItem;
+declare class TopicItem extends PureComponent<any, any, any> {
+    constructor(props: any);
+    constructor(props: any, context: any);
+    render(): JSX.Element;
+}
+declare namespace TopicItem {
+    namespace propTypes {
+        let title: any;
+        let updatedAt: any;
+        let description: any;
+        let imgUrl: any;
+        let imgAlt: any;
+        let linkTo: any;
+        let isTop: any;
+    }
+    namespace defaultProps {
+        let isTop_1: boolean;
+        export { isTop_1 as isTop };
+    }
+}
+import { PureComponent } from 'react';

package/lib/listing-page/constants/mockup-spec.d.ts

@@ -0,0 +1,46 @@
+declare namespace _default {
+    export { marginBetweenItems };
+    export namespace mobile {
+        let maxWidth: number;
+        let cardWidth: number;
+        let tagsWidth: number;
+        let imgHeight: number;
+    }
+    export namespace desktop {
+        let maxWidth_1: number;
+        export { maxWidth_1 as maxWidth };
+        let cardWidth_1: number;
+        export { cardWidth_1 as cardWidth };
+        export let textWidth: number;
+        let tagsWidth_1: number;
+        export { tagsWidth_1 as tagsWidth };
+        let imgHeight_1: number;
+        export { imgHeight_1 as imgHeight };
+    }
+    export namespace tablet {
+        let maxWidth_2: number;
+        export { maxWidth_2 as maxWidth };
+        let cardWidth_2: number;
+        export { cardWidth_2 as cardWidth };
+        let textWidth_1: number;
+        export { textWidth_1 as textWidth };
+        let tagsWidth_2: number;
+        export { tagsWidth_2 as tagsWidth };
+        let imgHeight_2: number;
+        export { imgHeight_2 as imgHeight };
+    }
+    export namespace hd {
+        let maxWidth_3: number;
+        export { maxWidth_3 as maxWidth };
+        let cardWidth_3: number;
+        export { cardWidth_3 as cardWidth };
+        let textWidth_2: number;
+        export { textWidth_2 as textWidth };
+        let tagsWidth_3: number;
+        export { tagsWidth_3 as tagsWidth };
+        let imgHeight_3: number;
+        export { imgHeight_3 as imgHeight };
+    }
+}
+export default _default;
+declare const marginBetweenItems: 20;

package/lib/listing-page/constants/predefined-css.d.ts

@@ -0,0 +1,2 @@
+export const linkHoverFadeOut: import("styled-components").RuleSet<object>;
+export const resetLinkStyle: "a:hover,a:active,a:link,a:visited { color: inherit; text-decoration: none; }";

package/lib/listing-page/constants/prop-types.d.ts

@@ -0,0 +1 @@
+export const ARTICLE_PROP_TYPES: any;

package/lib/listing-page/constants/topics.d.ts

@@ -0,0 +1,6 @@
+export namespace TEXT {
+    let TOPICS_PAGE_TITLE: string;
+    let SECTION_TITLE_FEATURED: string;
+    let SECTION_TITLE_OTHERS: string;
+    let LAST_UPDATED: string;
+}

package/lib/listing-page/index.d.ts

@@ -0,0 +1,10 @@
+declare namespace _default {
+    export { TopicsList };
+    export { List };
+    export { CardList };
+}
+export default _default;
+import TopicsList from './components/topics';
+import List from './components/list';
+import CardList from './components/card-list';
+export { TopicsList, List, CardList };

package/lib/listing-page/stories/cardList.stories.d.ts

@@ -0,0 +1,72 @@
+declare namespace _default {
+    export let title: string;
+    export { CardList as component };
+    export namespace argTypes {
+        export { BRANCH_STORYBOOK_ARG_TYPE as releaseBranch };
+    }
+}
+export default _default;
+export namespace card {
+    namespace args {
+        let data: ({
+            id: string;
+            title: string;
+            og_description: string;
+            category_set: {
+                category: {
+                    name: string;
+                };
+                subcategory: {
+                    name: string;
+                };
+            }[];
+            published_date: string;
+            hero_image: {
+                description: string;
+                resized_targets?: undefined;
+            };
+            slug: string;
+            is_bookmarked: boolean;
+        } | {
+            id: string;
+            title: string;
+            og_description: string;
+            published_date: string;
+            hero_image: {
+                description: string;
+                resized_targets?: undefined;
+            };
+            slug: string;
+            category_set?: undefined;
+            is_bookmarked?: undefined;
+        } | {
+            id: string;
+            title: string;
+            og_description: string;
+            category_set: {
+                category: {
+                    name: string;
+                };
+                subcategory: {
+                    name: string;
+                };
+            }[];
+            published_date: string;
+            hero_image: {
+                description: string;
+                resized_targets: {
+                    mobile: {
+                        url: string;
+                    };
+                };
+            };
+            slug: string;
+            is_bookmarked?: undefined;
+        })[];
+        let releaseBranch: string;
+        let showIsBookmarked: boolean;
+        let width: number;
+    }
+}
+import CardList from '../components/card-list';
+import { BRANCH_STORYBOOK_ARG_TYPE } from '../../storybook/constants';

package/lib/logo/components/logo-footer.d.ts

@@ -0,0 +1,17 @@
+export default LogoFooter;
+declare function LogoFooter({ releaseBranch, type, }: {
+    releaseBranch?: string;
+    type?: string;
+}): JSX.Element;
+declare namespace LogoFooter {
+    export namespace propTypes {
+        export { BRANCH_PROP_TYPES as releaseBranch };
+        export let type: any;
+    }
+    export { logoType as Type };
+}
+import { BRANCH_PROP_TYPES } from '@twreporter/core/lib/constants/release-branch';
+declare namespace logoType {
+    let DEFAULT: string;
+    let WHITE: string;
+}

package/lib/logo/components/logo-header.d.ts

@@ -0,0 +1,18 @@
+export default LogoHeader;
+declare function LogoHeader({ type, releaseBranch, ...props }: {
+    [x: string]: any;
+    type?: string;
+    releaseBranch?: string;
+}): JSX.Element;
+declare namespace LogoHeader {
+    export namespace propTypes {
+        export let type: any;
+        export { BRANCH_PROP_TYPES as releaseBranch };
+    }
+    export { logoType as Type };
+}
+import { BRANCH_PROP_TYPES } from '@twreporter/core/lib/constants/release-branch';
+declare namespace logoType {
+    let DEFAULT: string;
+    let WHITE: string;
+}

package/lib/logo/components/logo-loading-fallback.d.ts

@@ -0,0 +1,10 @@
+export default LogoFallback;
+declare function LogoFallback({ releaseBranch }: {
+    releaseBranch?: string;
+}): JSX.Element;
+declare namespace LogoFallback {
+    namespace propTypes {
+        export { BRANCH_PROP_TYPES as releaseBranch };
+    }
+}
+import { BRANCH_PROP_TYPES } from '@twreporter/core/lib/constants/release-branch';

package/lib/logo/components/logo-symbol.d.ts

@@ -0,0 +1,19 @@
+export default LogoSymbol;
+declare function LogoSymbol({ type, releaseBranch, ...props }: {
+    [x: string]: any;
+    type?: string;
+    releaseBranch?: string;
+}): JSX.Element;
+declare namespace LogoSymbol {
+    export namespace propTypes {
+        export let type: any;
+        export { BRANCH_PROP_TYPES as releaseBranch };
+    }
+    export { logoType as Type };
+}
+import { BRANCH_PROP_TYPES } from '@twreporter/core/lib/constants/release-branch';
+declare namespace logoType {
+    let DEFAULT: string;
+    let BLACK: string;
+    let WHITE: string;
+}

package/lib/logo/index.d.ts

@@ -0,0 +1,12 @@
+declare namespace _default {
+    export { LogoHeader };
+    export { LogoFooter };
+    export { LogoSymbol };
+    export { LogoFallback };
+}
+export default _default;
+import LogoHeader from './components/logo-header';
+import LogoFooter from './components/logo-footer';
+import LogoSymbol from './components/logo-symbol';
+import LogoFallback from './components/logo-loading-fallback';
+export { LogoHeader, LogoFooter, LogoSymbol, LogoFallback };

package/lib/logo/stories/logoFooter.stories.d.ts

@@ -0,0 +1,11 @@
+declare namespace _default {
+    export let title: string;
+    export { LogoFooter as component };
+    export namespace argTypes {
+        export { BRANCH_STORYBOOK_ARG_TYPE as releaseBranch };
+    }
+}
+export default _default;
+export const footer: {};
+import LogoFooter from '../components/logo-footer';
+import { BRANCH_STORYBOOK_ARG_TYPE } from '../../storybook/constants';

package/lib/logo/stories/logoHeader.stories.d.ts

@@ -0,0 +1,15 @@
+declare namespace _default {
+    export let title: string;
+    export { LogoHeader as component };
+    export namespace argTypes {
+        export { BRANCH_STORYBOOK_ARG_TYPE as releaseBranch };
+    }
+}
+export default _default;
+export namespace header {
+    namespace args {
+        let type: string;
+    }
+}
+import LogoHeader from '../components/logo-header';
+import { BRANCH_STORYBOOK_ARG_TYPE } from '../../storybook/constants';

package/lib/logo/stories/logoLoadingFallback.stories.d.ts

@@ -0,0 +1,11 @@
+declare namespace _default {
+    export let title: string;
+    export { LogoFallback as component };
+    export namespace argTypes {
+        export { BRANCH_STORYBOOK_ARG_TYPE as releaseBranch };
+    }
+}
+export default _default;
+export const fallback: {};
+import LogoFallback from '../components/logo-loading-fallback';
+import { BRANCH_STORYBOOK_ARG_TYPE } from '../../storybook/constants';

package/lib/logo/stories/logoSymbol.stories.d.ts

@@ -0,0 +1,15 @@
+declare namespace _default {
+    export let title: string;
+    export { LogoSymbol as component };
+    export namespace argTypes {
+        export { BRANCH_STORYBOOK_ARG_TYPE as releaseBranch };
+    }
+}
+export default _default;
+export namespace symbol {
+    namespace args {
+        let type: string;
+    }
+}
+import LogoSymbol from '../components/logo-symbol';
+import { BRANCH_STORYBOOK_ARG_TYPE } from '../../storybook/constants';

package/lib/logo/utils/path.d.ts

@@ -0,0 +1,5 @@
+declare namespace _default {
+    export { selectLogoPath };
+}
+export default _default;
+declare function selectLogoPath(logoType: any, branch: any, type: any): any;

package/lib/material-icon.d.ts

@@ -0,0 +1,17 @@
+export default MeterialSymbol;
+declare function MeterialSymbol({ icon, fill, weight, grade, size, }: {
+    icon: any;
+    fill?: boolean;
+    weight?: number;
+    grade?: number;
+    size?: number;
+}): JSX.Element;
+declare namespace MeterialSymbol {
+    namespace propTypes {
+        let icon: any;
+        let fill: any;
+        let weight: any;
+        let grade: any;
+        let size: any;
+    }
+}

package/lib/mobile-member-role-card/index.d.ts

@@ -0,0 +1,26 @@
+export default MobileMemberRoleCard;
+declare function MobileMemberRoleCard({ role, releaseBranch, email, joinDate, name, articleReadCount, articleReadingTimeUnit, articleReadingTime, hideInfo, }: {
+    role?: string;
+    releaseBranch?: string;
+    email?: string;
+    joinDate?: string;
+    name?: string;
+    articleReadCount?: number;
+    articleReadingTimeUnit?: "minute";
+    articleReadingTime?: number;
+    hideInfo?: boolean;
+}): JSX.Element;
+declare namespace MobileMemberRoleCard {
+    namespace propTypes {
+        export let role: any;
+        export { BRANCH_PROP_TYPES as releaseBranch };
+        export let email: any;
+        export let joinDate: any;
+        export let name: any;
+        export let articleReadCount: any;
+        export let articleReadingTimeUnit: any;
+        export let articleReadingTime: any;
+        export let hideInfo: any;
+    }
+}
+import { BRANCH_PROP_TYPES } from '@twreporter/core/lib/constants/release-branch';

package/lib/mobile-member-role-card/stories/member-role-card.stories.d.ts

@@ -0,0 +1,34 @@
+declare namespace _default {
+    export let title: string;
+    export { MobileMemberRoleCard as component };
+    export namespace argTypes {
+        export { BRANCH_STORYBOOK_ARG_TYPE as releaseBranch };
+        export let role: {
+            defaultValue: any;
+            options: any[];
+            control: {
+                type: string;
+            };
+        };
+        export let articleReadingTimeUnit: {
+            defaultValue: any;
+            options: any[];
+            control: {
+                type: string;
+            };
+        };
+    }
+}
+export default _default;
+export namespace moblieMemberRoleCard {
+    namespace args {
+        let email: string;
+        let joinDate: string;
+        let name: string;
+        let articleReadCount: number;
+        let articleReadingTime: number;
+        let hideInfo: boolean;
+    }
+}
+import MobileMemberRoleCard from '../index';
+import { BRANCH_STORYBOOK_ARG_TYPE } from '../../storybook/constants';

package/lib/mobile-pop-up-modal.d.ts

@@ -0,0 +1,28 @@
+export default MobileModal;
+declare class MobileModal {
+    static propTypes: {
+        modalHeight: any;
+        modalWidth: any;
+    };
+    static defaultProps: {
+        modalHeight: string;
+        modalWidth: string;
+    };
+    constructor(props: any);
+    state: {
+        modalHeight: any;
+    };
+    startY: number;
+    panel: any;
+    handleTouchstartWhenPanning: any;
+    handleTouchendWhenPanning: any;
+    handleTouchmoveWhenPanning: any;
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    _updateStartY(startY: any): void;
+    _updateScrollY(endY: any): void;
+    _handleTouchstartWhenPanning(event: any): void;
+    _handleTouchendWhenPanning(event: any): void;
+    _handleTouchmoveWhenPanning(event: any): void;
+    render(): JSX.Element;
+}

package/lib/more.d.ts

@@ -0,0 +1,10 @@
+export default class More extends Component<any, any, any> {
+    static propTypes: {
+        children: any;
+        loadMore: any;
+    };
+    constructor(props: any);
+    constructor(props: any, context: any);
+    render(): JSX.Element;
+}
+import { Component } from 'react';

package/lib/pagination/index.d.ts

@@ -0,0 +1,36 @@
+export default Pagination;
+declare class Pagination {
+    constructor(props: any);
+    _buildPagesArray(currentPage: any, totalPages: any): any;
+    _buildPageBox(index: any, currentPage: any): JSX.Element;
+    _buildCenterJSX(startAt: any, length: any, currentPage: any): JSX.Element[];
+    _buildMobilePagesArray(currentPage: any, totalPages: any): JSX.Element[];
+    render(): JSX.Element;
+}
+declare namespace Pagination {
+    namespace propTypes {
+        let currentPage: any;
+        let ellipsis: any;
+        let handleClickNext: any;
+        let handleClickPage: any;
+        let handleClickPrev: any;
+        let nOfCenterPages: any;
+        let nOfMarginPages: any;
+        let totalPages: any;
+        let className: any;
+    }
+    namespace defaultProps {
+        let currentPage_1: number;
+        export { currentPage_1 as currentPage };
+        let totalPages_1: number;
+        export { totalPages_1 as totalPages };
+        let ellipsis_1: string;
+        export { ellipsis_1 as ellipsis };
+        let nOfCenterPages_1: number;
+        export { nOfCenterPages_1 as nOfCenterPages };
+        let nOfMarginPages_1: number;
+        export { nOfMarginPages_1 as nOfMarginPages };
+        let className_1: string;
+        export { className_1 as className };
+    }
+}

package/lib/podcast-link.d.ts

@@ -0,0 +1,7 @@
+export default PodcastLandingPageLink;
+declare class PodcastLandingPageLink {
+    static propTypes: {
+        children: any;
+    };
+    render(): JSX.Element;
+}

package/lib/rwd.d.ts

@@ -0,0 +1,5 @@
+export const DesktopOnly: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export const MobileOnly: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export const DesktopAndAbove: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export const TabletAndBelow: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export const TabletAndAbove: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/lib/shared-enum.d.ts

@@ -0,0 +1,4 @@
+export const Size: Readonly<{
+    S: "S";
+    L: "L";
+}>;