@apify/ui-library 1.138.1 → 1.138.2-featpublictasks-2f3d3c.52

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (91) hide show
  1. package/dist/src/components/actor_example/actor_example.utils.d.ts +17 -0
  2. package/dist/src/components/actor_example/actor_example.utils.d.ts.map +1 -0
  3. package/dist/src/components/actor_example/actor_example.utils.js +41 -0
  4. package/dist/src/components/actor_example/actor_example.utils.js.map +1 -0
  5. package/dist/src/components/actor_example/actor_example_avatar.d.ts +13 -0
  6. package/dist/src/components/actor_example/actor_example_avatar.d.ts.map +1 -0
  7. package/dist/src/components/actor_example/actor_example_avatar.js +34 -0
  8. package/dist/src/components/actor_example/actor_example_avatar.js.map +1 -0
  9. package/dist/src/components/actor_example/actor_example_card.d.ts +28 -0
  10. package/dist/src/components/actor_example/actor_example_card.d.ts.map +1 -0
  11. package/dist/src/components/actor_example/actor_example_card.js +79 -0
  12. package/dist/src/components/actor_example/actor_example_card.js.map +1 -0
  13. package/dist/src/components/actor_example/actor_example_preview.d.ts +28 -0
  14. package/dist/src/components/actor_example/actor_example_preview.d.ts.map +1 -0
  15. package/dist/src/components/actor_example/actor_example_preview.js +208 -0
  16. package/dist/src/components/actor_example/actor_example_preview.js.map +1 -0
  17. package/dist/src/components/actor_example/actor_example_run_button.d.ts +33 -0
  18. package/dist/src/components/actor_example/actor_example_run_button.d.ts.map +1 -0
  19. package/dist/src/components/actor_example/actor_example_run_button.js +12 -0
  20. package/dist/src/components/actor_example/actor_example_run_button.js.map +1 -0
  21. package/dist/src/components/actor_example/actor_example_schema.d.ts +20 -0
  22. package/dist/src/components/actor_example/actor_example_schema.d.ts.map +1 -0
  23. package/dist/src/components/actor_example/actor_example_schema.js +27 -0
  24. package/dist/src/components/actor_example/actor_example_schema.js.map +1 -0
  25. package/dist/src/components/actor_example/actor_example_schema_field.d.ts +19 -0
  26. package/dist/src/components/actor_example/actor_example_schema_field.d.ts.map +1 -0
  27. package/dist/src/components/actor_example/actor_example_schema_field.js +33 -0
  28. package/dist/src/components/actor_example/actor_example_schema_field.js.map +1 -0
  29. package/dist/src/components/actor_example/actor_example_schema_field_badge.d.ts +9 -0
  30. package/dist/src/components/actor_example/actor_example_schema_field_badge.d.ts.map +1 -0
  31. package/dist/src/components/actor_example/actor_example_schema_field_badge.js +48 -0
  32. package/dist/src/components/actor_example/actor_example_schema_field_badge.js.map +1 -0
  33. package/dist/src/components/actor_example/actor_example_schema_legend.d.ts +10 -0
  34. package/dist/src/components/actor_example/actor_example_schema_legend.d.ts.map +1 -0
  35. package/dist/src/components/actor_example/actor_example_schema_legend.js +29 -0
  36. package/dist/src/components/actor_example/actor_example_schema_legend.js.map +1 -0
  37. package/dist/src/components/actor_example/actor_example_schema_property.d.ts +24 -0
  38. package/dist/src/components/actor_example/actor_example_schema_property.d.ts.map +1 -0
  39. package/dist/src/components/actor_example/actor_example_schema_property.js +122 -0
  40. package/dist/src/components/actor_example/actor_example_schema_property.js.map +1 -0
  41. package/dist/src/components/actor_example/index.d.ts +11 -0
  42. package/dist/src/components/actor_example/index.d.ts.map +1 -0
  43. package/dist/src/components/actor_example/index.js +11 -0
  44. package/dist/src/components/actor_example/index.js.map +1 -0
  45. package/dist/src/components/browser_window/browser_window.d.ts +20 -0
  46. package/dist/src/components/browser_window/browser_window.d.ts.map +1 -0
  47. package/dist/src/components/browser_window/browser_window.js +72 -0
  48. package/dist/src/components/browser_window/browser_window.js.map +1 -0
  49. package/dist/src/components/browser_window/index.d.ts +2 -0
  50. package/dist/src/components/browser_window/index.d.ts.map +1 -0
  51. package/dist/src/components/browser_window/index.js +2 -0
  52. package/dist/src/components/browser_window/index.js.map +1 -0
  53. package/dist/src/components/chip.d.ts.map +1 -1
  54. package/dist/src/components/chip.js +25 -2
  55. package/dist/src/components/chip.js.map +1 -1
  56. package/dist/src/components/collapsible_card/collapsible_card.d.ts +3 -2
  57. package/dist/src/components/collapsible_card/collapsible_card.d.ts.map +1 -1
  58. package/dist/src/components/collapsible_card/collapsible_card.js +2 -2
  59. package/dist/src/components/collapsible_card/collapsible_card.js.map +1 -1
  60. package/dist/src/components/floating/floating_component_base.d.ts +72 -1
  61. package/dist/src/components/floating/floating_component_base.d.ts.map +1 -1
  62. package/dist/src/components/floating/floating_component_base.js +66 -36
  63. package/dist/src/components/floating/floating_component_base.js.map +1 -1
  64. package/dist/src/components/floating/tooltip.d.ts +10 -3
  65. package/dist/src/components/floating/tooltip.d.ts.map +1 -1
  66. package/dist/src/components/floating/tooltip.js +24 -20
  67. package/dist/src/components/floating/tooltip.js.map +1 -1
  68. package/dist/src/components/index.d.ts +2 -0
  69. package/dist/src/components/index.d.ts.map +1 -1
  70. package/dist/src/components/index.js +2 -0
  71. package/dist/src/components/index.js.map +1 -1
  72. package/dist/tsconfig.build.tsbuildinfo +1 -1
  73. package/package.json +5 -5
  74. package/src/components/actor_example/actor_example.utils.ts +52 -0
  75. package/src/components/actor_example/actor_example_avatar.tsx +69 -0
  76. package/src/components/actor_example/actor_example_card.tsx +149 -0
  77. package/src/components/actor_example/actor_example_preview.tsx +295 -0
  78. package/src/components/actor_example/actor_example_run_button.tsx +61 -0
  79. package/src/components/actor_example/actor_example_schema.tsx +60 -0
  80. package/src/components/actor_example/actor_example_schema_field.tsx +87 -0
  81. package/src/components/actor_example/actor_example_schema_field_badge.tsx +66 -0
  82. package/src/components/actor_example/actor_example_schema_legend.tsx +49 -0
  83. package/src/components/actor_example/actor_example_schema_property.tsx +242 -0
  84. package/src/components/actor_example/index.ts +10 -0
  85. package/src/components/browser_window/browser_window.tsx +106 -0
  86. package/src/components/browser_window/index.ts +1 -0
  87. package/src/components/chip.tsx +27 -1
  88. package/src/components/collapsible_card/collapsible_card.tsx +6 -4
  89. package/src/components/floating/floating_component_base.tsx +89 -47
  90. package/src/components/floating/tooltip.tsx +53 -25
  91. package/src/components/index.ts +2 -0
@@ -0,0 +1,17 @@
1
+ import type { IconComponent } from '@apify/ui-icons';
2
+ import type { ActorExampleSchemaFieldType } from '@apify-packages/types';
3
+ export type ActorExampleSchemaPropertyConfig = {
4
+ Icon: IconComponent;
5
+ title: string;
6
+ backgroundColor: string;
7
+ textColor: string;
8
+ };
9
+ /**
10
+ * Per-type display config used by the schema field components (badge icon, hover tooltip,
11
+ * background/text colors). The `var(--actor-schema-field-*)` references are declared on the
12
+ * `ActorExampleSchemaFieldBadgeWrapper` styled component itself (with a dark-mode override via
13
+ * `html[data-theme='dark'] &`), so the vars are scoped to the badge — no globals are injected.
14
+ */
15
+ export declare const actorExampleSchemaPropertyMap: Record<ActorExampleSchemaFieldType, ActorExampleSchemaPropertyConfig>;
16
+ export declare const actorExampleSchemaPropertyDefaultIcon: ({ size, className, title, titleId, ...props }: import("@apify/ui-icons").IconProps) => React.JSX.Element;
17
+ //# sourceMappingURL=actor_example.utils.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"actor_example.utils.d.ts","sourceRoot":"","sources":["../../../../src/components/actor_example/actor_example.utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAGrD,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,uBAAuB,CAAC;AAEzE,MAAM,MAAM,gCAAgC,GAAG;IAC3C,IAAI,EAAE,aAAa,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,eAAe,EAAE,MAAM,CAAC;IACxB,SAAS,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,6BAA6B,EAAE,MAAM,CAAC,2BAA2B,EAAE,gCAAgC,CA+B/G,CAAC;AAEF,eAAO,MAAM,qCAAqC,2GAAU,CAAC"}
@@ -0,0 +1,41 @@
1
+ import { AnyIcon, BooleanIcon, MenuIcon, NumberIcon, ObjectIcon, TextIcon } from '@apify/ui-icons';
2
+ /**
3
+ * Per-type display config used by the schema field components (badge icon, hover tooltip,
4
+ * background/text colors). The `var(--actor-schema-field-*)` references are declared on the
5
+ * `ActorExampleSchemaFieldBadgeWrapper` styled component itself (with a dark-mode override via
6
+ * `html[data-theme='dark'] &`), so the vars are scoped to the badge — no globals are injected.
7
+ */
8
+ export const actorExampleSchemaPropertyMap = {
9
+ string: {
10
+ Icon: TextIcon,
11
+ title: 'Text',
12
+ backgroundColor: 'var(--actor-schema-field-string-background)',
13
+ textColor: 'var(--actor-schema-field-string-text)',
14
+ },
15
+ number: {
16
+ Icon: NumberIcon,
17
+ title: 'Number',
18
+ backgroundColor: 'var(--actor-schema-field-number-background)',
19
+ textColor: 'var(--actor-schema-field-number-text)',
20
+ },
21
+ boolean: {
22
+ Icon: BooleanIcon,
23
+ title: 'Boolean',
24
+ backgroundColor: 'var(--actor-schema-field-boolean-background)',
25
+ textColor: 'var(--actor-schema-field-boolean-text)',
26
+ },
27
+ array: {
28
+ Icon: MenuIcon,
29
+ title: 'List',
30
+ backgroundColor: 'var(--actor-schema-field-array-background)',
31
+ textColor: 'var(--actor-schema-field-array-text)',
32
+ },
33
+ object: {
34
+ Icon: ObjectIcon,
35
+ title: 'Object',
36
+ backgroundColor: 'var(--actor-schema-field-object-background)',
37
+ textColor: 'var(--actor-schema-field-object-text)',
38
+ },
39
+ };
40
+ export const actorExampleSchemaPropertyDefaultIcon = AnyIcon;
41
+ //# sourceMappingURL=actor_example.utils.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"actor_example.utils.js","sourceRoot":"","sources":["../../../../src/components/actor_example/actor_example.utils.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAWnG;;;;;GAKG;AACH,MAAM,CAAC,MAAM,6BAA6B,GAA0E;IAChH,MAAM,EAAE;QACJ,IAAI,EAAE,QAAQ;QACd,KAAK,EAAE,MAAM;QACb,eAAe,EAAE,6CAA6C;QAC9D,SAAS,EAAE,uCAAuC;KACrD;IACD,MAAM,EAAE;QACJ,IAAI,EAAE,UAAU;QAChB,KAAK,EAAE,QAAQ;QACf,eAAe,EAAE,6CAA6C;QAC9D,SAAS,EAAE,uCAAuC;KACrD;IACD,OAAO,EAAE;QACL,IAAI,EAAE,WAAW;QACjB,KAAK,EAAE,SAAS;QAChB,eAAe,EAAE,8CAA8C;QAC/D,SAAS,EAAE,wCAAwC;KACtD;IACD,KAAK,EAAE;QACH,IAAI,EAAE,QAAQ;QACd,KAAK,EAAE,MAAM;QACb,eAAe,EAAE,4CAA4C;QAC7D,SAAS,EAAE,sCAAsC;KACpD;IACD,MAAM,EAAE;QACJ,IAAI,EAAE,UAAU;QAChB,KAAK,EAAE,QAAQ;QACf,eAAe,EAAE,6CAA6C;QAC9D,SAAS,EAAE,uCAAuC;KACrD;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,qCAAqC,GAAG,OAAO,CAAC"}
@@ -0,0 +1,13 @@
1
+ export declare const actorExampleAvatarClassNames: {
2
+ ROOT: string;
3
+ };
4
+ export type ActorExampleAvatarProps = {
5
+ title?: string;
6
+ name: string;
7
+ pictureUrl?: string;
8
+ fallbackPictureUrl: string;
9
+ size?: number;
10
+ className?: string;
11
+ };
12
+ export declare const ActorExampleAvatar: ({ title, name, pictureUrl, fallbackPictureUrl, size, className, }: ActorExampleAvatarProps) => import("react/jsx-runtime").JSX.Element;
13
+ //# sourceMappingURL=actor_example_avatar.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"actor_example_avatar.d.ts","sourceRoot":"","sources":["../../../../src/components/actor_example/actor_example_avatar.tsx"],"names":[],"mappings":"AASA,eAAO,MAAM,4BAA4B;;CAExC,CAAC;AAOF,MAAM,MAAM,uBAAuB,GAAG;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,mEAOhC,uBAAuB,4CAkCzB,CAAC"}
@@ -0,0 +1,34 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { clsx } from 'clsx';
3
+ import { useCallback, useMemo } from 'react';
4
+ import styled from 'styled-components';
5
+ import { useSharedUiDependencies } from '../../ui_dependency_provider.js';
6
+ const DEFAULT_SIZE = 36;
7
+ export const actorExampleAvatarClassNames = {
8
+ ROOT: 'actor-example-avatar',
9
+ };
10
+ const ActorExampleAvatarWrapper = styled.img `
11
+ flex-shrink: 0;
12
+ object-fit: cover;
13
+ `;
14
+ export const ActorExampleAvatar = ({ title, name, pictureUrl, fallbackPictureUrl, size = DEFAULT_SIZE, className, }) => {
15
+ const { generateProxyImageUrl } = useSharedUiDependencies();
16
+ // Mirrors apify-web's `<Image defaultSrc=…>` behaviour: if the primary src fails to load,
17
+ // swap in the fallback so the `<img>` element is always present.
18
+ const handlePictureError = useCallback((event) => {
19
+ if (!event.currentTarget.src.endsWith(fallbackPictureUrl)) {
20
+ // eslint-disable-next-line no-param-reassign
21
+ event.currentTarget.src = fallbackPictureUrl;
22
+ // eslint-disable-next-line no-param-reassign
23
+ event.currentTarget.srcset = fallbackPictureUrl;
24
+ }
25
+ }, [fallbackPictureUrl]);
26
+ const proxyPictureUrl = useMemo(() => {
27
+ if (!generateProxyImageUrl || !pictureUrl)
28
+ return pictureUrl;
29
+ return generateProxyImageUrl(pictureUrl, { resize: { height: size * 2, width: size * 2 } });
30
+ }, [pictureUrl, generateProxyImageUrl, size]);
31
+ const src = proxyPictureUrl || fallbackPictureUrl;
32
+ return (_jsx(ActorExampleAvatarWrapper, { src: src, alt: title ?? name, width: size, height: size, className: clsx(actorExampleAvatarClassNames.ROOT, className), onError: handlePictureError }));
33
+ };
34
+ //# sourceMappingURL=actor_example_avatar.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"actor_example_avatar.js","sourceRoot":"","sources":["../../../../src/components/actor_example/actor_example_avatar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,MAAM,CAAC;AAE5B,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAC7C,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,OAAO,EAAE,uBAAuB,EAAE,MAAM,iCAAiC,CAAC;AAE1E,MAAM,YAAY,GAAG,EAAE,CAAC;AAExB,MAAM,CAAC,MAAM,4BAA4B,GAAG;IACxC,IAAI,EAAE,sBAAsB;CAC/B,CAAC;AAEF,MAAM,yBAAyB,GAAG,MAAM,CAAC,GAAG,CAAA;;;CAG3C,CAAC;AAWF,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,EAC/B,KAAK,EACL,IAAI,EACJ,UAAU,EACV,kBAAkB,EAClB,IAAI,GAAG,YAAY,EACnB,SAAS,GACa,EAAE,EAAE;IAC1B,MAAM,EAAE,qBAAqB,EAAE,GAAG,uBAAuB,EAAE,CAAC;IAE5D,0FAA0F;IAC1F,iEAAiE;IACjE,MAAM,kBAAkB,GAAG,WAAW,CAClC,CAAC,KAA6C,EAAE,EAAE;QAC9C,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,QAAQ,CAAC,kBAAkB,CAAC,EAAE,CAAC;YACxD,6CAA6C;YAC7C,KAAK,CAAC,aAAa,CAAC,GAAG,GAAG,kBAAkB,CAAC;YAC7C,6CAA6C;YAC7C,KAAK,CAAC,aAAa,CAAC,MAAM,GAAG,kBAAkB,CAAC;QACpD,CAAC;IACL,CAAC,EACD,CAAC,kBAAkB,CAAC,CACvB,CAAC;IAEF,MAAM,eAAe,GAAG,OAAO,CAAC,GAAG,EAAE;QACjC,IAAI,CAAC,qBAAqB,IAAI,CAAC,UAAU;YAAE,OAAO,UAAU,CAAC;QAC7D,OAAO,qBAAqB,CAAC,UAAU,EAAE,EAAE,MAAM,EAAE,EAAE,MAAM,EAAE,IAAI,GAAG,CAAC,EAAE,KAAK,EAAE,IAAI,GAAG,CAAC,EAAE,EAAE,CAAC,CAAC;IAChG,CAAC,EAAE,CAAC,UAAU,EAAE,qBAAqB,EAAE,IAAI,CAAC,CAAC,CAAC;IAE9C,MAAM,GAAG,GAAG,eAAe,IAAI,kBAAkB,CAAC;IAElD,OAAO,CACH,KAAC,yBAAyB,IACtB,GAAG,EAAE,GAAG,EACR,GAAG,EAAE,KAAK,IAAI,IAAI,EAClB,KAAK,EAAE,IAAI,EACX,MAAM,EAAE,IAAI,EACZ,SAAS,EAAE,IAAI,CAAC,4BAA4B,CAAC,IAAI,EAAE,SAAS,CAAC,EAC7D,OAAO,EAAE,kBAAkB,GAC7B,CACL,CAAC;AACN,CAAC,CAAC"}
@@ -0,0 +1,28 @@
1
+ export declare const actorExampleCardClassNames: {
2
+ ROOT: string;
3
+ CONTENT: string;
4
+ BADGE: string;
5
+ TITLE: string;
6
+ FOOTER: string;
7
+ RUN_BUTTON: string;
8
+ DETAIL_BUTTON: string;
9
+ };
10
+ export type ActorExampleCardProps = {
11
+ title: string;
12
+ badge?: string;
13
+ /** Owning actor's id — flows into the run button's analytics event. */
14
+ actorId: string;
15
+ runUrl: string;
16
+ runLabel: string;
17
+ /**
18
+ * Tracking element id for the run button (e.g. `actorInfo.examples.run`). The card's
19
+ * `title` is forwarded as `cardTitle` automatically.
20
+ */
21
+ runTrackingElement: string;
22
+ detailUrl?: string;
23
+ detailLabel: string;
24
+ detailOpensInNewTab?: boolean;
25
+ className?: string;
26
+ };
27
+ export declare const ActorExampleCard: ({ title, badge, actorId, runUrl, runLabel, runTrackingElement, detailUrl, detailLabel, detailOpensInNewTab, className, }: ActorExampleCardProps) => import("react/jsx-runtime").JSX.Element;
28
+ //# sourceMappingURL=actor_example_card.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"actor_example_card.d.ts","sourceRoot":"","sources":["../../../../src/components/actor_example/actor_example_card.tsx"],"names":[],"mappings":"AAYA,eAAO,MAAM,0BAA0B;;;;;;;;CAQtC,CAAC;AA6DF,MAAM,MAAM,qBAAqB,GAAG;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uEAAuE;IACvE,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,kBAAkB,EAAE,MAAM,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,0HAW9B,qBAAqB,4CAsCvB,CAAC"}
@@ -0,0 +1,79 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { clsx } from 'clsx';
3
+ import styled from 'styled-components';
4
+ import { ExternalLinkIcon } from '@apify/ui-icons';
5
+ import { theme } from '../../design_system/theme.js';
6
+ import { Badge } from '../badge.js';
7
+ import { Box } from '../box.js';
8
+ import { Button } from '../button.js';
9
+ import { Heading } from '../text/index.js';
10
+ import { ActorExampleRunButton, ActorExampleRunButtonLightningIcon } from './actor_example_run_button.js';
11
+ export const actorExampleCardClassNames = {
12
+ ROOT: 'actor-example-card',
13
+ CONTENT: 'actor-example-card__content',
14
+ BADGE: 'actor-example-card__badge',
15
+ TITLE: 'actor-example-card__title',
16
+ FOOTER: 'actor-example-card__footer',
17
+ RUN_BUTTON: 'actor-example-card__run-button',
18
+ DETAIL_BUTTON: 'actor-example-card__detail-button',
19
+ };
20
+ const ActorExampleCardWrapper = styled(Box) `
21
+ min-width: 0;
22
+ background-color: ${theme.color.neutral.background};
23
+ border: 1px solid ${theme.color.neutral.border};
24
+ border-radius: ${theme.radius.radius12};
25
+ overflow: hidden;
26
+
27
+ .${actorExampleCardClassNames.CONTENT} {
28
+ padding: ${theme.space.space16};
29
+ display: flex;
30
+ flex-direction: column;
31
+ gap: ${theme.space.space8};
32
+ }
33
+
34
+ .${actorExampleCardClassNames.BADGE} {
35
+ min-width: 0;
36
+ max-width: 100%;
37
+
38
+ span {
39
+ min-width: 0;
40
+ overflow: hidden;
41
+ text-overflow: ellipsis;
42
+ white-space: nowrap;
43
+ }
44
+ }
45
+
46
+ .${actorExampleCardClassNames.TITLE} {
47
+ min-height: 7.2rem; /* 3 lines of text with line-height 2.4rem */
48
+ overflow: hidden;
49
+ text-overflow: ellipsis;
50
+ display: -webkit-box;
51
+ -webkit-line-clamp: 3;
52
+ -webkit-box-orient: vertical;
53
+ }
54
+
55
+ .${actorExampleCardClassNames.FOOTER} {
56
+ padding: ${theme.space.space12} ${theme.space.space16};
57
+ background-color: ${theme.color.neutral.backgroundMuted};
58
+ display: grid;
59
+ grid-template-columns: repeat(2, minmax(0, 1fr));
60
+ gap: ${theme.space.space4};
61
+ }
62
+
63
+ .${actorExampleCardClassNames.RUN_BUTTON}, .${actorExampleCardClassNames.DETAIL_BUTTON} {
64
+ min-width: 0;
65
+
66
+ span {
67
+ min-width: 0;
68
+ overflow: hidden;
69
+ text-overflow: ellipsis;
70
+ white-space: nowrap;
71
+ }
72
+
73
+ svg {
74
+ flex-shrink: 0;
75
+ }
76
+ }
77
+ `;
78
+ export const ActorExampleCard = ({ title, badge, actorId, runUrl, runLabel, runTrackingElement, detailUrl, detailLabel, detailOpensInNewTab = true, className, }) => (_jsxs(ActorExampleCardWrapper, { className: clsx(actorExampleCardClassNames.ROOT, className), children: [_jsxs(Box, { className: actorExampleCardClassNames.CONTENT, children: [badge && (_jsx(Badge, { size: "extra_small", variant: "primary_blue", className: actorExampleCardClassNames.BADGE, children: badge })), _jsx(Heading, { as: "h2", className: actorExampleCardClassNames.TITLE, children: title })] }), _jsxs(Box, { className: actorExampleCardClassNames.FOOTER, children: [_jsx(ActorExampleRunButton, { size: "small", variant: "secondary", actorId: actorId, consoleUrl: runUrl, trackingProps: { element: runTrackingElement, cardTitle: title }, className: actorExampleCardClassNames.RUN_BUTTON, LeftIcon: ActorExampleRunButtonLightningIcon, children: runLabel }), detailUrl && detailLabel && (_jsx(Button, { size: "small", variant: "tertiary", to: detailUrl, target: detailOpensInNewTab ? '_blank' : undefined, className: actorExampleCardClassNames.DETAIL_BUTTON, RightIcon: ExternalLinkIcon, children: detailLabel }))] })] }));
79
+ //# sourceMappingURL=actor_example_card.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"actor_example_card.js","sourceRoot":"","sources":["../../../../src/components/actor_example/actor_example_card.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,28 @@
1
+ export declare const actorExamplePreviewClassNames: {
2
+ CONTAINER: string;
3
+ CONTENT: string;
4
+ BADGE: string;
5
+ BADGE_PICTURE: string;
6
+ BADGE_CONTENT: string;
7
+ BADGE_NAME: string;
8
+ BADGE_TECHNICAL_NAME: string;
9
+ SCHEMA: string;
10
+ SCHEMA_FIELD: string;
11
+ SCHEMA_FIELD_NAME: string;
12
+ SCHEMA_MORE: string;
13
+ };
14
+ export type ActorExamplePreviewField = {
15
+ name: string;
16
+ title?: string;
17
+ };
18
+ export type ActorExamplePreviewProps = {
19
+ actorName: string;
20
+ actorTitle: string | undefined;
21
+ actorPictureUrl: string | undefined;
22
+ actorPictureFallbackUrl: string;
23
+ outputFields: ActorExamplePreviewField[];
24
+ staticWebUrl: string;
25
+ username: string;
26
+ };
27
+ export declare const ActorExamplePreview: ({ actorName, actorTitle, actorPictureUrl, actorPictureFallbackUrl, outputFields, staticWebUrl, username, }: ActorExamplePreviewProps) => import("react/jsx-runtime").JSX.Element;
28
+ //# sourceMappingURL=actor_example_preview.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"actor_example_preview.d.ts","sourceRoot":"","sources":["../../../../src/components/actor_example/actor_example_preview.tsx"],"names":[],"mappings":"AASA,eAAO,MAAM,6BAA6B;;;;;;;;;;;;CAYzC,CAAC;AA2LF,MAAM,MAAM,wBAAwB,GAAG;IACnC,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG;IACnC,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,eAAe,EAAE,MAAM,GAAG,SAAS,CAAC;IACpC,uBAAuB,EAAE,MAAM,CAAC;IAChC,YAAY,EAAE,wBAAwB,EAAE,CAAC;IACzC,YAAY,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAI,4GAQjC,wBAAwB,4CA+D1B,CAAC"}
@@ -0,0 +1,208 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import styled, { keyframes } from 'styled-components';
3
+ import { theme } from '../../design_system/theme.js';
4
+ import { Heading, Text } from '../text/index.js';
5
+ import { ActorExampleAvatar } from './actor_example_avatar.js';
6
+ const MAX_VISIBLE_FIELDS = 4;
7
+ const BADGE_PICTURE_SIZE = 36;
8
+ export const actorExamplePreviewClassNames = {
9
+ CONTAINER: 'actor-example-preview',
10
+ CONTENT: 'actor-example-preview__content',
11
+ BADGE: 'actor-example-preview__badge',
12
+ BADGE_PICTURE: 'actor-example-preview__badge-picture',
13
+ BADGE_CONTENT: 'actor-example-preview__badge-content',
14
+ BADGE_NAME: 'actor-example-preview__badge-name',
15
+ BADGE_TECHNICAL_NAME: 'actor-example-preview__badge-technical-name',
16
+ SCHEMA: 'actor-example-preview__schema',
17
+ SCHEMA_FIELD: 'actor-example-preview__schema-field',
18
+ SCHEMA_FIELD_NAME: 'actor-example-preview__schema-field-name',
19
+ SCHEMA_MORE: 'actor-example-preview__schema-more',
20
+ };
21
+ const VISUAL_SEPARATOR_SIZE = '0.6rem';
22
+ const VISUAL_CONNECTOR_LENGTH = '2.4rem';
23
+ const noisePulse = keyframes `
24
+ 0%, 100% { opacity: 0.1; }
25
+ 50% { opacity: 0.4; }
26
+ `;
27
+ const ActorExamplePreviewWrapper = styled.div `
28
+ @property --noise-cx {
29
+ syntax: '<percentage>';
30
+ inherits: false;
31
+ initial-value: 50%;
32
+ }
33
+
34
+ @property --noise-cy {
35
+ syntax: '<percentage>';
36
+ inherits: false;
37
+ initial-value: 50%;
38
+ }
39
+
40
+ position: relative;
41
+ display: flex;
42
+ flex-direction: column;
43
+ align-items: center;
44
+ justify-content: center;
45
+ flex-shrink: 0;
46
+
47
+ &::before {
48
+ content: '';
49
+ position: absolute;
50
+ top: -${theme.space.space32};
51
+ bottom: 0;
52
+ inset-inline: -${theme.space.space32};
53
+ background-image: url(${({ $noiseImageUrl }) => $noiseImageUrl});
54
+ background-position: center;
55
+ background-repeat: repeat;
56
+ mask-image:
57
+ linear-gradient(to bottom, transparent, black 30%, black 70%, transparent),
58
+ linear-gradient(to right, transparent, black 30%, black 70%, transparent);
59
+ mask-composite: intersect;
60
+ -webkit-mask-image:
61
+ linear-gradient(to bottom, transparent, black 30%, black 70%, transparent),
62
+ linear-gradient(to right, transparent, black 30%, black 70%, transparent);
63
+ -webkit-mask-composite: destination-in;
64
+ animation: ${noisePulse} 4s ease-in-out infinite;
65
+ opacity: 0.1;
66
+ pointer-events: none;
67
+
68
+ @media ${theme.device.desktop} {
69
+ inset: 0;
70
+ mask-image: radial-gradient(circle at var(--noise-cx) var(--noise-cy), black 30%, transparent 70%);
71
+ -webkit-mask-image: radial-gradient(circle at var(--noise-cx) var(--noise-cy), black 30%, transparent 70%);
72
+ }
73
+
74
+ @media (prefers-reduced-motion: reduce) {
75
+ animation: none;
76
+ mask-image: none;
77
+ -webkit-mask-image: none;
78
+ }
79
+ }
80
+
81
+ .${actorExamplePreviewClassNames.CONTENT} {
82
+ max-width: 100%;
83
+ display: flex;
84
+ gap: ${theme.space.space32};
85
+ flex-direction: column;
86
+ align-items: center;
87
+ justify-content: center;
88
+ }
89
+
90
+ .${actorExamplePreviewClassNames.BADGE} {
91
+ width: 100%;
92
+ min-width: 0;
93
+ padding: ${theme.space.space12};
94
+ border: 1px solid ${theme.color.neutral.separatorSubtle};
95
+ border-radius: ${theme.radius.radius12};
96
+ background-color: ${theme.color.neutral.background};
97
+ display: flex;
98
+ gap: ${theme.space.space8};
99
+ align-items: center;
100
+ position: relative;
101
+ }
102
+
103
+ .${actorExamplePreviewClassNames.BADGE_PICTURE} {
104
+ border: 1px solid ${theme.color.neutral.separatorSubtle};
105
+ border-radius: ${theme.radius.radius8};
106
+ flex-shrink: 0;
107
+ object-fit: cover;
108
+ }
109
+
110
+ .${actorExamplePreviewClassNames.BADGE_CONTENT} {
111
+ min-width: 0;
112
+ display: flex;
113
+ flex-direction: column;
114
+ flex-grow: 1;
115
+ }
116
+
117
+ .${actorExamplePreviewClassNames.BADGE_NAME}, .${actorExamplePreviewClassNames.BADGE_TECHNICAL_NAME} {
118
+ text-overflow: ellipsis;
119
+ white-space: nowrap;
120
+ overflow: hidden;
121
+ }
122
+
123
+ .${actorExamplePreviewClassNames.SCHEMA} {
124
+ width: 100%;
125
+ min-width: 0;
126
+ padding: ${theme.space.space8};
127
+ border: 1px solid ${theme.color.primary.text};
128
+ border-radius: ${theme.radius.radius12};
129
+ background-color: ${theme.color.neutral.background};
130
+ display: flex;
131
+ flex-direction: column;
132
+ align-items: center;
133
+ gap: ${theme.space.space4};
134
+ position: relative;
135
+
136
+ &::before {
137
+ bottom: calc(100% + 0.5rem);
138
+ left: calc(50% - 0.5px);
139
+ width: 1px;
140
+ height: ${VISUAL_CONNECTOR_LENGTH};
141
+ background-color: ${theme.color.primary.text};
142
+ content: '';
143
+ display: block;
144
+ position: absolute;
145
+ }
146
+
147
+ &::after {
148
+ bottom: calc(100% + 0.5rem);
149
+ left: calc(50% - (${VISUAL_SEPARATOR_SIZE} / 2));
150
+ margin: 0 auto;
151
+ width: ${VISUAL_SEPARATOR_SIZE};
152
+ height: ${VISUAL_CONNECTOR_LENGTH};
153
+ border-block: 1px solid ${theme.color.primary.text};
154
+ box-sizing: border-box;
155
+ content: '';
156
+ display: block;
157
+ position: absolute;
158
+ }
159
+ }
160
+
161
+ .${actorExamplePreviewClassNames.SCHEMA_FIELD} {
162
+ width: 100%;
163
+ padding: ${theme.space.space4};
164
+ border: 1px solid ${theme.color.primary.borderSubtle};
165
+ border-radius: ${theme.radius.radius6};
166
+ display: flex;
167
+ gap: ${theme.space.space8};
168
+ align-items: center;
169
+ justify-content: center;
170
+ }
171
+
172
+ .${actorExamplePreviewClassNames.SCHEMA_FIELD_NAME} {
173
+ min-width: 0;
174
+ text-overflow: ellipsis;
175
+ white-space: nowrap;
176
+ overflow: hidden;
177
+ }
178
+
179
+ .${actorExamplePreviewClassNames.SCHEMA_MORE} {
180
+ height: 2.4rem;
181
+ margin-top: 2rem;
182
+ padding: 0 ${theme.space.space8};
183
+ border: 1px solid ${theme.color.primary.borderSubtle};
184
+ border-radius: ${theme.radius.radius12};
185
+ background-color: ${theme.color.primary.background};
186
+ display: flex;
187
+ align-items: center;
188
+ justify-content: center;
189
+ position: relative;
190
+
191
+ &::before {
192
+ top: calc(-1px - 1.6rem);
193
+ left: calc(50% - 0.5px);
194
+ width: 1px;
195
+ height: 0.8rem;
196
+ background-color: ${theme.color.primary.text};
197
+ content: '';
198
+ display: block;
199
+ position: absolute;
200
+ }
201
+ }
202
+ `;
203
+ export const ActorExamplePreview = ({ actorName, actorTitle, actorPictureUrl, actorPictureFallbackUrl, outputFields, staticWebUrl, username, }) => {
204
+ const visibleFields = outputFields.slice(0, MAX_VISIBLE_FIELDS);
205
+ const remainingCount = Math.max(0, outputFields.length - MAX_VISIBLE_FIELDS);
206
+ return (_jsx(ActorExamplePreviewWrapper, { className: actorExamplePreviewClassNames.CONTAINER, "$noiseImageUrl": `${staticWebUrl}/img/pattern/noise.svg`, children: _jsxs("div", { className: actorExamplePreviewClassNames.CONTENT, children: [_jsxs("div", { className: actorExamplePreviewClassNames.BADGE, children: [_jsx(ActorExampleAvatar, { title: actorTitle, name: actorName, pictureUrl: actorPictureUrl, fallbackPictureUrl: actorPictureFallbackUrl, size: BADGE_PICTURE_SIZE, className: actorExamplePreviewClassNames.BADGE_PICTURE }), _jsxs("div", { className: actorExamplePreviewClassNames.BADGE_CONTENT, children: [_jsx(Heading, { as: "span", type: "titleS", className: actorExamplePreviewClassNames.BADGE_NAME, children: actorTitle ?? actorName }), _jsxs(Text, { as: "span", type: "code", size: "small", color: theme.color.neutral.textSubtle, className: actorExamplePreviewClassNames.BADGE_TECHNICAL_NAME, children: [username, "/", actorName] })] })] }), visibleFields.length > 0 && (_jsxs("div", { className: actorExamplePreviewClassNames.SCHEMA, children: [visibleFields.map((field) => (_jsx("div", { className: actorExamplePreviewClassNames.SCHEMA_FIELD, children: _jsx(Text, { as: "span", size: "small", color: theme.color.neutral.text, className: actorExamplePreviewClassNames.SCHEMA_FIELD_NAME, children: field.title ?? field.name }) }, field.name))), remainingCount > 0 && (_jsxs(Text, { as: "span", size: "small", color: theme.color.primary.text, className: actorExamplePreviewClassNames.SCHEMA_MORE, children: ["+", remainingCount, " ", remainingCount === 1 ? 'field' : 'fields'] }))] }))] }) }));
207
+ };
208
+ //# sourceMappingURL=actor_example_preview.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"actor_example_preview.js","sourceRoot":"","sources":["../../../../src/components/actor_example/actor_example_preview.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,33 @@
1
+ import type React from 'react';
2
+ import { type IconProps } from '@apify/ui-icons';
3
+ import { type ButtonProps } from '../button.js';
4
+ import type { SharedTextProps } from '../text/text_shared.js';
5
+ /**
6
+ * Brand-coloured lightning icon — the standard leading slot for the card variant of the run
7
+ * button. Hero-style call sites typically render without an icon; pass this explicitly via
8
+ * `LeftIcon` when you want it.
9
+ */
10
+ export declare const ActorExampleRunButtonLightningIcon: (props: IconProps) => import("react/jsx-runtime").JSX.Element;
11
+ /**
12
+ * "Run example" CTA shared by the actor-detail Examples tab (apify-core Console) and the
13
+ * public actor-example landing/hero pages (apify-web). Encapsulates two universal defaults
14
+ * for this CTA — `target="_self"` so external `console.apify.com` links don't open in a new
15
+ * tab, and `hideExternalIcon` so the lightning leading icon (when present) is the only
16
+ * action affordance — and pins the analytics shape to `{ element, cardTitle, actorId }`.
17
+ *
18
+ * Tracking flows through the host app's `trackClick` (apify-web's analytics, console's
19
+ * client tracker) via the underlying `Button`.
20
+ */
21
+ export type ActorExampleRunButtonProps = Pick<ButtonProps, 'size' | 'variant' | 'LeftIcon' | 'RightIcon'> & {
22
+ actorId: string;
23
+ consoleUrl: string;
24
+ trackingProps: {
25
+ element: string;
26
+ cardTitle: string;
27
+ };
28
+ textSize?: SharedTextProps['size'];
29
+ className?: string;
30
+ children: React.ReactNode;
31
+ };
32
+ export declare const ActorExampleRunButton: ({ actorId, consoleUrl, size, variant, trackingProps, children, ...buttonProps }: ActorExampleRunButtonProps) => import("react/jsx-runtime").JSX.Element;
33
+ //# sourceMappingURL=actor_example_run_button.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"actor_example_run_button.d.ts","sourceRoot":"","sources":["../../../../src/components/actor_example/actor_example_run_button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,KAAK,SAAS,EAAiB,MAAM,iBAAiB,CAAC;AAGhE,OAAO,EAAE,KAAK,WAAW,EAAU,MAAM,cAAc,CAAC;AACxD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAE9D;;;;GAIG;AACH,eAAO,MAAM,kCAAkC,GAAI,OAAO,SAAS,4CAElE,CAAC;AAEF;;;;;;;;;GASG;AACH,MAAM,MAAM,0BAA0B,GAAG,IAAI,CAAC,WAAW,EAAE,MAAM,GAAG,SAAS,GAAG,UAAU,GAAG,WAAW,CAAC,GAAG;IACxG,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE;QACX,OAAO,EAAE,MAAM,CAAC;QAChB,SAAS,EAAE,MAAM,CAAC;KACrB,CAAC;IACF,QAAQ,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC7B,CAAC;AAEF,eAAO,MAAM,qBAAqB,GAAI,iFAQnC,0BAA0B,4CAa5B,CAAC"}
@@ -0,0 +1,12 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { LightningIcon } from '@apify/ui-icons';
3
+ import { theme } from '../../design_system/theme.js';
4
+ import { Button } from '../button.js';
5
+ /**
6
+ * Brand-coloured lightning icon — the standard leading slot for the card variant of the run
7
+ * button. Hero-style call sites typically render without an icon; pass this explicitly via
8
+ * `LeftIcon` when you want it.
9
+ */
10
+ export const ActorExampleRunButtonLightningIcon = (props) => (_jsx(LightningIcon, { ...props, color: theme.color.primary.action }));
11
+ export const ActorExampleRunButton = ({ actorId, consoleUrl, size = 'extraLarge', variant = 'primary', trackingProps, children, ...buttonProps }) => (_jsx(Button, { ...buttonProps, to: consoleUrl, size: size, variant: variant, target: "_self", hideExternalIcon: true, trackingId: trackingProps.element, trackingData: { cardTitle: trackingProps.cardTitle, actorId }, children: children }));
12
+ //# sourceMappingURL=actor_example_run_button.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"actor_example_run_button.js","sourceRoot":"","sources":["../../../../src/components/actor_example/actor_example_run_button.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAkB,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhE,OAAO,EAAE,KAAK,EAAE,MAAM,8BAA8B,CAAC;AACrD,OAAO,EAAoB,MAAM,EAAE,MAAM,cAAc,CAAC;AAGxD;;;;GAIG;AACH,MAAM,CAAC,MAAM,kCAAkC,GAAG,CAAC,KAAgB,EAAE,EAAE,CAAC,CACpE,KAAC,aAAa,OAAK,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM,GAAI,CAClE,CAAC;AAwBF,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAAC,EAClC,OAAO,EACP,UAAU,EACV,IAAI,GAAG,YAAY,EACnB,OAAO,GAAG,SAAS,EACnB,aAAa,EACb,QAAQ,EACR,GAAG,WAAW,EACW,EAAE,EAAE,CAAC,CAC9B,KAAC,MAAM,OACC,WAAW,EACf,EAAE,EAAE,UAAU,EACd,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,MAAM,EAAC,OAAO,EACd,gBAAgB,QAChB,UAAU,EAAE,aAAa,CAAC,OAAO,EACjC,YAAY,EAAE,EAAE,SAAS,EAAE,aAAa,CAAC,SAAS,EAAE,OAAO,EAAE,YAE5D,QAAQ,GACJ,CACZ,CAAC"}
@@ -0,0 +1,20 @@
1
+ import type { ActorExampleSchemaFieldSerialized } from '@apify-packages/types';
2
+ export declare const actorExampleSchemaClassNames: {
3
+ ROOT: string;
4
+ };
5
+ type Props = {
6
+ fields: ActorExampleSchemaFieldSerialized[];
7
+ canCollapse?: boolean;
8
+ className?: string;
9
+ /**
10
+ * Per-row slot rendered before the type badge on each top-level field
11
+ * (nested children render plain). Useful for configurators that need a
12
+ * checkbox or other control alongside each field.
13
+ */
14
+ LeadingSlot?: (props: {
15
+ field: ActorExampleSchemaFieldSerialized;
16
+ }) => React.ReactNode;
17
+ };
18
+ export declare const ActorExampleSchema: ({ fields, canCollapse, className, LeadingSlot }: Props) => import("react/jsx-runtime").JSX.Element;
19
+ export {};
20
+ //# sourceMappingURL=actor_example_schema.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"actor_example_schema.d.ts","sourceRoot":"","sources":["../../../../src/components/actor_example/actor_example_schema.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,iCAAiC,EAAE,MAAM,uBAAuB,CAAC;AAK/E,eAAO,MAAM,4BAA4B;;CAExC,CAAC;AAaF,KAAK,KAAK,GAAG;IACT,MAAM,EAAE,iCAAiC,EAAE,CAAC;IAC5C,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,KAAK,EAAE,iCAAiC,CAAA;KAAE,KAAK,KAAK,CAAC,SAAS,CAAC;CAC1F,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,iDAAyD,KAAK,4CAuBhG,CAAC"}
@@ -0,0 +1,27 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import clsx from 'clsx';
3
+ import { useState } from 'react';
4
+ import styled from 'styled-components';
5
+ import { theme } from '../../design_system/theme.js';
6
+ import { ActorExampleSchemaField } from './actor_example_schema_field.js';
7
+ export const actorExampleSchemaClassNames = {
8
+ ROOT: 'actor-example-schema',
9
+ };
10
+ const ActorExampleSchemaWrapper = styled.div `
11
+ width: 100%;
12
+ padding: ${theme.space.space16};
13
+ background-color: ${theme.color.neutral.background};
14
+ border-radius: 1rem;
15
+ display: flex;
16
+ flex-direction: column;
17
+ flex-grow: 1;
18
+ gap: ${theme.space.space16};
19
+ `;
20
+ export const ActorExampleSchema = ({ fields, canCollapse = false, className, LeadingSlot }) => {
21
+ const [collapsedFields, setCollapsedFields] = useState([]);
22
+ const handleToggleCollapse = (id) => {
23
+ setCollapsedFields((current) => current.includes(id) ? current.filter((currentId) => currentId !== id) : [...current, id]);
24
+ };
25
+ return (_jsx(ActorExampleSchemaWrapper, { className: clsx(actorExampleSchemaClassNames.ROOT, className), children: fields.map((field) => (_jsx(ActorExampleSchemaField, { field: field, canCollapse: canCollapse, collapsedFields: collapsedFields, onToggleCollapsed: handleToggleCollapse, leadingSlot: LeadingSlot ? _jsx(LeadingSlot, { field: field }) : undefined }, field._id))) }));
26
+ };
27
+ //# sourceMappingURL=actor_example_schema.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"actor_example_schema.js","sourceRoot":"","sources":["../../../../src/components/actor_example/actor_example_schema.tsx"],"names":[],"mappings":";AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAIvC,OAAO,EAAE,KAAK,EAAE,MAAM,8BAA8B,CAAC;AACrD,OAAO,EAAE,uBAAuB,EAAE,MAAM,iCAAiC,CAAC;AAE1E,MAAM,CAAC,MAAM,4BAA4B,GAAG;IACxC,IAAI,EAAE,sBAAsB;CAC/B,CAAC;AAEF,MAAM,yBAAyB,GAAG,MAAM,CAAC,GAAG,CAAA;;eAE7B,KAAK,CAAC,KAAK,CAAC,OAAO;wBACV,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU;;;;;WAK3C,KAAK,CAAC,KAAK,CAAC,OAAO;CAC7B,CAAC;AAcF,MAAM,CAAC,MAAM,kBAAkB,GAAG,CAAC,EAAE,MAAM,EAAE,WAAW,GAAG,KAAK,EAAE,SAAS,EAAE,WAAW,EAAS,EAAE,EAAE;IACjG,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAW,EAAE,CAAC,CAAC;IAErE,MAAM,oBAAoB,GAAG,CAAC,EAAU,EAAE,EAAE;QACxC,kBAAkB,CAAC,CAAC,OAAO,EAAE,EAAE,CAC3B,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,SAAS,EAAE,EAAE,CAAC,SAAS,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,OAAO,EAAE,EAAE,CAAC,CAC5F,CAAC;IACN,CAAC,CAAC;IAEF,OAAO,CACH,KAAC,yBAAyB,IAAC,SAAS,EAAE,IAAI,CAAC,4BAA4B,CAAC,IAAI,EAAE,SAAS,CAAC,YACnF,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CACnB,KAAC,uBAAuB,IAEpB,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,eAAe,EAAE,eAAe,EAChC,iBAAiB,EAAE,oBAAoB,EACvC,WAAW,EAAE,WAAW,CAAC,CAAC,CAAC,KAAC,WAAW,IAAC,KAAK,EAAE,KAAK,GAAI,CAAC,CAAC,CAAC,SAAS,IAL/D,KAAK,CAAC,GAAG,CAMhB,CACL,CAAC,GACsB,CAC/B,CAAC;AACN,CAAC,CAAC"}
@@ -0,0 +1,19 @@
1
+ import type { ReactNode } from 'react';
2
+ import type { ActorExampleSchemaFieldSerialized } from '@apify-packages/types';
3
+ export declare const actorExampleSchemaFieldClassNames: {
4
+ FIELD: string;
5
+ CHILDREN: string;
6
+ };
7
+ type Props = {
8
+ field: ActorExampleSchemaFieldSerialized;
9
+ collapsedFields: string[];
10
+ canCollapse?: boolean;
11
+ onToggleCollapsed: (id: string) => void;
12
+ depth?: number;
13
+ className?: string;
14
+ /** Slot rendered on the outer property only — nested children render plain. */
15
+ leadingSlot?: ReactNode;
16
+ };
17
+ export declare const ActorExampleSchemaField: ({ field, collapsedFields, canCollapse, onToggleCollapsed, depth, className, leadingSlot, }: Props) => import("react/jsx-runtime").JSX.Element;
18
+ export {};
19
+ //# sourceMappingURL=actor_example_schema_field.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"actor_example_schema_field.d.ts","sourceRoot":"","sources":["../../../../src/components/actor_example/actor_example_schema_field.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAO,KAAK,EAAE,iCAAiC,EAAE,MAAM,uBAAuB,CAAC;AAK/E,eAAO,MAAM,iCAAiC;;;CAG7C,CAAC;AAmBF,KAAK,KAAK,GAAG;IACT,KAAK,EAAE,iCAAiC,CAAC;IACzC,eAAe,EAAE,MAAM,EAAE,CAAC;IAC1B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,iBAAiB,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,+EAA+E;IAC/E,WAAW,CAAC,EAAE,SAAS,CAAC;CAC3B,CAAC;AAEF,eAAO,MAAM,uBAAuB,GAAI,4FAQrC,KAAK,4CAoCP,CAAC"}