@apify/ui-library 1.127.6 → 1.127.7

package/dist/src/components/collapsible_card/collapsible_card.d.ts

@@ -0,0 +1,27 @@
+import { type FC, type ReactNode } from 'react';
+interface TransientWrapperProps {
+    hideOuterBorder?: boolean;
+    hasShadow?: boolean;
+}
+export type CollapsibleCardProps = {
+    header: ReactNode;
+    children: ReactNode;
+    isExpanded?: boolean;
+    onIsExpandedChanged?: (expanded: boolean) => void;
+    noChevron?: boolean;
+    topSection?: ReactNode;
+    isClosedHeaderGrey?: boolean;
+    isHeaderGreyOnHover?: boolean;
+    className?: string;
+    style?: React.CSSProperties;
+    as?: React.ElementType;
+    id?: string;
+} & TransientWrapperProps;
+export declare const collapsibleCardClassNames: {
+    TOP_SECTION: string;
+    COLLAPSIBLE_CONTENT_WRAPPER: string;
+    CONTENT: string;
+};
+export declare const CollapsibleCard: FC<CollapsibleCardProps>;
+export {};
+//# sourceMappingURL=collapsible_card.d.ts.map

package/dist/src/components/collapsible_card/collapsible_card.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"collapsible_card.d.ts","sourceRoot":"","sources":["../../../../src/components/collapsible_card/collapsible_card.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,EAAE,EAAE,KAAK,SAAS,EAAY,MAAM,OAAO,CAAC;AAS1D,UAAU,qBAAqB;IAC3B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC;CACvB;AAWD,MAAM,MAAM,oBAAoB,GAAG;IAC/B,MAAM,EAAE,SAAS,CAAC;IAClB,QAAQ,EAAE,SAAS,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,mBAAmB,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;IAClD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;IACvB,EAAE,CAAC,EAAE,MAAM,CAAC;CACf,GAAG,qBAAqB,CAAC;AAE1B,eAAO,MAAM,yBAAyB;;;;CAIrC,CAAC;AAkEF,eAAO,MAAM,eAAe,EAAE,EAAE,CAAC,oBAAoB,CAgDpD,CAAC"}

package/dist/src/components/collapsible_card/collapsible_card.js

@@ -0,0 +1,83 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as Collapsible from '@radix-ui/react-collapsible';
+import clsx from 'clsx';
+import { useState } from 'react';
+import styled, { css } from 'styled-components';
+import { ChevronDownIcon } from '@apify/ui-icons';
+import { theme } from '../../design_system/theme.js';
+import { Box } from '../box.js';
+export const collapsibleCardClassNames = {
+    TOP_SECTION: 'CollapsibleCard-TopSection',
+    COLLAPSIBLE_CONTENT_WRAPPER: 'CollapsibleCard-Content',
+    CONTENT: 'Card-content',
+};
+const StyledCardWrapper = styled(Box) `
+    /* consoleStyle.partialStyle.card — TODO: reuse from Card once moved out of to_consolidate */
+    background-color: ${theme.color.neutral.cardBackground};
+    border: 1px solid ${theme.color.neutral.border};
+    box-shadow: var(--shadow-1);
+    border-radius: ${theme.radius.radius8};
+    box-sizing: border-box;
+
+    ${({ $hideOuterBorder }) => $hideOuterBorder && css `
+        border: none;
+        border-radius: unset;
+    `};
+    /* Reset padding, it is dealt with within header and content styles */
+    padding: 0;
+    ${({ $hasShadow }) => ($hasShadow ? '' : 'box-shadow: initial;')}
+    /* TODO: check if it this is needed, ie in publication tab it is reset back to overflow: visible */
+    overflow: hidden;
+`;
+const StyledTopSection = styled.div `
+    display: flex;
+    align-items: center;
+    padding: ${theme.space.space4} ${theme.space.space8};
+    background: ${theme.color.neutral.backgroundMuted};
+    border-bottom: solid 1px ${theme.color.neutral.border};
+    gap: ${theme.space.space8};
+`;
+const StyledHeader = styled.header `
+    display: flex;
+    gap: ${theme.space.space4};
+    align-items: center;
+    ${({ onClick }) => (onClick ? 'cursor: pointer;' : '')};
+    padding: ${theme.space.space16};
+    background-color: ${({ $isHeaderGrey }) => ($isHeaderGrey ? theme.color.neutral.backgroundMuted : 'initial')};
+    /* We want to radiuses if there is no outer border */
+    ${({ $hideOuterBorder }) => ($hideOuterBorder ? '' : `border-radius: ${theme.radius.radius8};`)}
+
+    &:hover {
+        background-color: ${({ $isHeaderGrey, $isHeaderGreyOnHover }) => (($isHeaderGrey || $isHeaderGreyOnHover) ? theme.color.neutral.hover : 'initial')};
+    }
+
+    .chevron {
+        transition: transform 100ms ease-in-out;
+    }
+
+    .chevron-open {
+        transform: rotate(0deg);
+    }
+
+    .chevron-closed {
+        transform: rotate(-90deg);
+    }
+`;
+const StyledCardContent = styled.div `
+    padding: ${theme.space.space16};
+    overflow: auto;
+`;
+const CollapsibleContent = styled(Collapsible.Content) `
+    border-top: 1px solid ${theme.color.neutral.border};
+`;
+export const CollapsibleCard = ({ header, children, isExpanded, onIsExpandedChanged, noChevron, topSection, ...rest }) => {
+    const isUncontrolled = isExpanded === undefined;
+    const [isOpen, setOpen] = useState(false);
+    let onHeaderClick;
+    if (isUncontrolled)
+        onHeaderClick = () => setOpen((prevIsOpen) => !prevIsOpen);
+    else if (onIsExpandedChanged)
+        onHeaderClick = () => onIsExpandedChanged(!isExpanded);
+    return (_jsxs(StyledCardWrapper, { forwardedAs: rest.as || 'section', "$hideOuterBorder": rest.hideOuterBorder, "$hasShadow": rest.hasShadow, className: rest.className, style: rest.style, id: rest.id, children: [topSection && _jsx(StyledTopSection, { className: collapsibleCardClassNames.TOP_SECTION, "data-test": 'collapsible-card-top-section', children: topSection }), _jsxs(StyledHeader, { "$hideOuterBorder": rest.hideOuterBorder, "$isHeaderGrey": rest.isClosedHeaderGrey && !isOpen && !isExpanded, "$isHeaderGreyOnHover": rest.isHeaderGreyOnHover, onClick: onHeaderClick, children: [!noChevron && _jsx(ChevronDownIcon, { size: "16", className: clsx('chevron', (isExpanded ?? isOpen) ? 'chevron-open' : 'chevron-closed') }), header] }), _jsx(Collapsible.Root, { open: isUncontrolled ? isOpen : isExpanded, children: _jsx(CollapsibleContent, { className: collapsibleCardClassNames.COLLAPSIBLE_CONTENT_WRAPPER, children: _jsx(StyledCardContent, { className: collapsibleCardClassNames.CONTENT, "data-test": "card-content", children: children }) }) })] }));
+};
+//# sourceMappingURL=collapsible_card.js.map

package/dist/src/components/collapsible_card/collapsible_card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"collapsible_card.js","sourceRoot":"","sources":["../../../../src/components/collapsible_card/collapsible_card.tsx"],"names":[],"mappings":"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"}

package/dist/src/components/collapsible_card/index.d.ts

@@ -0,0 +1,2 @@
+export * from './collapsible_card.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/src/components/collapsible_card/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/collapsible_card/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAC"}

package/dist/src/components/collapsible_card/index.js

@@ -0,0 +1,2 @@
+export * from './collapsible_card.js';
+//# sourceMappingURL=index.js.map

package/dist/src/components/collapsible_card/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/collapsible_card/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAC"}

package/dist/src/components/index.d.ts

@@ -27,4 +27,5 @@ export * from './icon_button.js';
 export * from './spinner.js';
 export * from './store/index.js';
 export * from './checkbox/index.js';
+export * from './collapsible_card/index.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/src/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,UAAU,CAAC;AACzB,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,cAAc,CAAC;AAC7B,cAAc,qBAAqB,CAAC;AACpC,cAAc,aAAa,CAAC;AAC5B,cAAc,WAAW,CAAC;AAC1B,cAAc,kBAAkB,CAAC;AACjC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,iBAAiB,CAAC;AAChC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,iBAAiB,CAAC;AAChC,cAAc,mBAAmB,CAAC;AAClC,cAAc,aAAa,CAAC;AAC5B,cAAc,0BAA0B,CAAC;AACzC,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,qBAAqB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,UAAU,CAAC;AACzB,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,cAAc,CAAC;AAC7B,cAAc,qBAAqB,CAAC;AACpC,cAAc,aAAa,CAAC;AAC5B,cAAc,WAAW,CAAC;AAC1B,cAAc,kBAAkB,CAAC;AACjC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,iBAAiB,CAAC;AAChC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,iBAAiB,CAAC;AAChC,cAAc,mBAAmB,CAAC;AAClC,cAAc,aAAa,CAAC;AAC5B,cAAc,0BAA0B,CAAC;AACzC,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,qBAAqB,CAAC;AACpC,cAAc,6BAA6B,CAAC"}

package/dist/src/components/index.js

@@ -27,4 +27,5 @@ export * from './icon_button.js';
 export * from './spinner.js';
 export * from './store/index.js';
 export * from './checkbox/index.js';
+export * from './collapsible_card/index.js';
 //# sourceMappingURL=index.js.map

package/dist/src/components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,UAAU,CAAC;AACzB,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,cAAc,CAAC;AAC7B,cAAc,qBAAqB,CAAC;AACpC,cAAc,aAAa,CAAC;AAC5B,cAAc,WAAW,CAAC;AAC1B,cAAc,kBAAkB,CAAC;AACjC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,iBAAiB,CAAC;AAChC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,iBAAiB,CAAC;AAChC,cAAc,mBAAmB,CAAC;AAClC,cAAc,aAAa,CAAC;AAC5B,cAAc,0BAA0B,CAAC;AACzC,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,qBAAqB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,UAAU,CAAC;AACzB,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,cAAc,CAAC;AAC7B,cAAc,qBAAqB,CAAC;AACpC,cAAc,aAAa,CAAC;AAC5B,cAAc,WAAW,CAAC;AAC1B,cAAc,kBAAkB,CAAC;AACjC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,iBAAiB,CAAC;AAChC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,iBAAiB,CAAC;AAChC,cAAc,mBAAmB,CAAC;AAClC,cAAc,aAAa,CAAC;AAC5B,cAAc,0BAA0B,CAAC;AACzC,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,qBAAqB,CAAC;AACpC,cAAc,6BAA6B,CAAC"}