@gravity-ui/querieskit 1.2.0 → 1.3.1

package/build/esm/components/AttachmentList/AttachmentList.js

@@ -0,0 +1,67 @@
+import _objectSpread from "@babel/runtime/helpers/objectSpread2";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["attachments", "onEdit", "onDelete", "onRevert", "wasAddedIds", "wasEditedIds", "editingIds", "renderEditForm", "className", "isDeleted"];
+import "core-js/modules/es.array.iterator.js";
+import "core-js/modules/es.object.to-string.js";
+import "core-js/modules/es.set.js";
+import "core-js/modules/es.set.difference.v2.js";
+import "core-js/modules/es.set.intersection.v2.js";
+import "core-js/modules/es.set.is-disjoint-from.v2.js";
+import "core-js/modules/es.set.is-subset-of.v2.js";
+import "core-js/modules/es.set.is-superset-of.v2.js";
+import "core-js/modules/es.set.symmetric-difference.v2.js";
+import "core-js/modules/es.set.union.v2.js";
+import "core-js/modules/es.string.iterator.js";
+import "core-js/modules/web.dom-collections.iterator.js";
+import React, { useMemo } from 'react';
+import { Flex, List } from '@gravity-ui/uikit';
+import { AttachmentItem } from "./internal/AttachmentItem/AttachmentItem";
+import "./AttachmentList.css";
+import { jsx as _jsx } from "react/jsx-runtime";
+export var AttachmentList = function AttachmentList(_ref) {
+  var attachments = _ref.attachments,
+    onEdit = _ref.onEdit,
+    onDelete = _ref.onDelete,
+    onRevert = _ref.onRevert,
+    wasAddedIds = _ref.wasAddedIds,
+    wasEditedIds = _ref.wasEditedIds,
+    editingIds = _ref.editingIds,
+    renderEditForm = _ref.renderEditForm,
+    className = _ref.className,
+    isDeleted = _ref.isDeleted,
+    listProps = _objectWithoutProperties(_ref, _excluded);
+  var addedIdsSet = useMemo(function () {
+    return new Set(wasAddedIds);
+  }, [wasAddedIds]);
+  var editedIdsSet = useMemo(function () {
+    return new Set(wasEditedIds);
+  }, [wasEditedIds]);
+  var editingIdsSet = useMemo(function () {
+    return new Set(editingIds);
+  }, [editingIds]);
+  return /*#__PURE__*/_jsx(Flex, {
+    className: className,
+    width: "100%",
+    height: "100%",
+    children: /*#__PURE__*/_jsx(List, _objectSpread({
+      filterable: false,
+      virtualized: false,
+      items: attachments,
+      renderItem: function renderItem(attachment) {
+        if (editingIdsSet.has(attachment.id)) {
+          return renderEditForm === null || renderEditForm === void 0 ? void 0 : renderEditForm(attachment);
+        }
+        return /*#__PURE__*/_jsx(AttachmentItem, {
+          attachment: attachment,
+          wasAdded: addedIdsSet.has(attachment.id),
+          wasEdited: editedIdsSet.has(attachment.id),
+          onEdit: onEdit,
+          onRevert: onRevert,
+          onDelete: onDelete,
+          isDeleted: isDeleted
+        });
+      }
+    }, listProps))
+  });
+};
+// #sourceMappingURL=AttachmentList.js.map

package/build/esm/components/AttachmentList/AttachmentList.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useMemo","Flex","List","AttachmentItem","jsx","_jsx","AttachmentList","_ref","attachments","onEdit","onDelete","onRevert","wasAddedIds","wasEditedIds","editingIds","renderEditForm","className","isDeleted","listProps","_objectWithoutProperties","_excluded","addedIdsSet","Set","editedIdsSet","editingIdsSet","width","height","children","_objectSpread","filterable","virtualized","items","renderItem","attachment","has","id","wasAdded","wasEdited"],"sources":["AttachmentList.tsx"],"sourcesContent":["import React, {ReactNode, useMemo} from 'react';\nimport {Flex, List, ListProps} from '@gravity-ui/uikit';\nimport {AttachmentItem, AttachmentItemProps} from './internal/AttachmentItem/AttachmentItem';\nimport './AttachmentList.scss';\n\nexport type AttachmentListProps = Omit<ListProps, 'items' | 'selectedItemIndex' | 'virtualized'> & {\n    attachments: AttachmentItemProps['attachment'][];\n    className?: string;\n    onDelete?: (attachment: AttachmentItemProps['attachment']) => void;\n    onEdit?: (attachment: AttachmentItemProps['attachment']) => void;\n    onRevert?: (attachment: AttachmentItemProps['attachment']) => void;\n\n    renderEditForm?: (attachment: AttachmentItemProps['attachment']) => ReactNode;\n\n    wasAddedIds?: string[];\n    wasEditedIds?: string[];\n\n    editingIds?: string[];\n\n    isDeleted?: boolean;\n};\n\nexport const AttachmentList = ({\n    attachments,\n    onEdit,\n    onDelete,\n    onRevert,\n    wasAddedIds,\n    wasEditedIds,\n    editingIds,\n    renderEditForm,\n    className,\n    isDeleted,\n    ...listProps\n}: AttachmentListProps) => {\n    const addedIdsSet = useMemo(() => new Set(wasAddedIds), [wasAddedIds]);\n    const editedIdsSet = useMemo(() => new Set(wasEditedIds), [wasEditedIds]);\n    const editingIdsSet = useMemo(() => new Set(editingIds), [editingIds]);\n\n    return (\n        <Flex className={className} width=\"100%\" height=\"100%\">\n            <List<AttachmentListProps['attachments'][number]>\n                filterable={false}\n                virtualized={false}\n                items={attachments}\n                renderItem={(attachment) => {\n                    if (editingIdsSet.has(attachment.id)) {\n                        return renderEditForm?.(attachment);\n                    }\n\n                    return (\n                        <AttachmentItem\n                            attachment={attachment}\n                            wasAdded={addedIdsSet.has(attachment.id)}\n                            wasEdited={editedIdsSet.has(attachment.id)}\n                            onEdit={onEdit}\n                            onRevert={onRevert}\n                            onDelete={onDelete}\n                            isDeleted={isDeleted}\n                        />\n                    );\n                }}\n                {...listProps}\n            />\n        </Flex>\n    );\n};\n"],"mappings":";;;;;;;;;;;;;;;AAAA,OAAOA,KAAK,IAAcC,OAAO,QAAO,OAAO;AAC/C,SAAQC,IAAI,EAAEC,IAAI,QAAkB,mBAAmB;AACvD,SAAQC,cAAc;AACtB;AAA+B,SAAAC,GAAA,IAAAC,IAAA;AAmB/B,OAAO,IAAMC,cAAc,GAAG,SAAjBA,cAAcA,CAAAC,IAAA,EAYA;EAAA,IAXvBC,WAAW,GAAAD,IAAA,CAAXC,WAAW;IACXC,MAAM,GAAAF,IAAA,CAANE,MAAM;IACNC,QAAQ,GAAAH,IAAA,CAARG,QAAQ;IACRC,QAAQ,GAAAJ,IAAA,CAARI,QAAQ;IACRC,WAAW,GAAAL,IAAA,CAAXK,WAAW;IACXC,YAAY,GAAAN,IAAA,CAAZM,YAAY;IACZC,UAAU,GAAAP,IAAA,CAAVO,UAAU;IACVC,cAAc,GAAAR,IAAA,CAAdQ,cAAc;IACdC,SAAS,GAAAT,IAAA,CAATS,SAAS;IACTC,SAAS,GAAAV,IAAA,CAATU,SAAS;IACNC,SAAS,GAAAC,wBAAA,CAAAZ,IAAA,EAAAa,SAAA;EAEZ,IAAMC,WAAW,GAAGrB,OAAO,CAAC;IAAA,OAAM,IAAIsB,GAAG,CAACV,WAAW,CAAC;EAAA,GAAE,CAACA,WAAW,CAAC,CAAC;EACtE,IAAMW,YAAY,GAAGvB,OAAO,CAAC;IAAA,OAAM,IAAIsB,GAAG,CAACT,YAAY,CAAC;EAAA,GAAE,CAACA,YAAY,CAAC,CAAC;EACzE,IAAMW,aAAa,GAAGxB,OAAO,CAAC;IAAA,OAAM,IAAIsB,GAAG,CAACR,UAAU,CAAC;EAAA,GAAE,CAACA,UAAU,CAAC,CAAC;EAEtE,oBACIT,IAAA,CAACJ,IAAI;IAACe,SAAS,EAAEA,SAAU;IAACS,KAAK,EAAC,MAAM;IAACC,MAAM,EAAC,MAAM;IAAAC,QAAA,eAClDtB,IAAA,CAACH,IAAI,EAAA0B,aAAA;MACDC,UAAU,EAAE,KAAM;MAClBC,WAAW,EAAE,KAAM;MACnBC,KAAK,EAAEvB,WAAY;MACnBwB,UAAU,EAAE,SAAZA,UAAUA,CAAGC,UAAU,EAAK;QACxB,IAAIT,aAAa,CAACU,GAAG,CAACD,UAAU,CAACE,EAAE,CAAC,EAAE;UAClC,OAAOpB,cAAc,aAAdA,cAAc,uBAAdA,cAAc,CAAGkB,UAAU,CAAC;QACvC;QAEA,oBACI5B,IAAA,CAACF,cAAc;UACX8B,UAAU,EAAEA,UAAW;UACvBG,QAAQ,EAAEf,WAAW,CAACa,GAAG,CAACD,UAAU,CAACE,EAAE,CAAE;UACzCE,SAAS,EAAEd,YAAY,CAACW,GAAG,CAACD,UAAU,CAACE,EAAE,CAAE;UAC3C1B,MAAM,EAAEA,MAAO;UACfE,QAAQ,EAAEA,QAAS;UACnBD,QAAQ,EAAEA,QAAS;UACnBO,SAAS,EAAEA;QAAU,CACxB,CAAC;MAEV;IAAE,GACEC,SAAS,CAChB;EAAC,CACA,CAAC;AAEf,CAAC","ignoreList":[]}

package/build/esm/components/AttachmentList/AttachmentList.scss

@@ -0,0 +1,25 @@
+.qp-attachment-list {
+    display: flex;
+    flex-direction: column;
+    min-width: 0;
+    margin: 0;
+    padding: 0;
+    list-style: none;
+
+    &__item {
+        min-width: 0;
+    }
+
+    &__button {
+        --g-button-padding: var(--g-spacing-2);
+
+        min-width: 0;
+        justify-content: flex-start;
+        text-align: start;
+
+        &_active {
+            --g-button-background-color: var(--g-color-base-selection);
+            --g-button-background-color-hover: var(--g-color-base-selection-hover);
+        }
+    }
+}

package/build/esm/components/AttachmentList/AttachmentList.stories.d.ts

@@ -0,0 +1,93 @@
+import React from 'react';
+import type { StoryObj } from '@storybook/react';
+import { type AttachmentListProps } from './AttachmentList';
+declare const meta: {
+    title: string;
+    component: ({ attachments, onEdit, onDelete, onRevert, wasAddedIds, wasEditedIds, editingIds, renderEditForm, className, isDeleted, ...listProps }: AttachmentListProps) => React.JSX.Element;
+    tags: string[];
+    parameters: {
+        layout: string;
+    };
+    decorators: ((Story: import("storybook/internal/csf").PartialStoryFn<import("@storybook/react").ReactRenderer, {
+        className?: string | undefined;
+        qa?: string | undefined;
+        autoFocus?: boolean | undefined;
+        id?: string | undefined;
+        role?: React.AriaRole | undefined;
+        filter?: string | undefined;
+        loading?: boolean | undefined;
+        size?: import("@gravity-ui/uikit").TextInputSize | undefined;
+        sortable?: boolean | undefined;
+        itemHeight?: number | ((item: {
+            disabled?: boolean;
+        }, itemIndex: number) => number) | undefined;
+        renderItem?: ((item: {
+            disabled?: boolean;
+        }, isItemActive: boolean, itemIndex: number) => React.ReactNode) | undefined;
+        onLoadMore?: (() => void) | undefined;
+        onItemClick?: ((item: {
+            disabled?: boolean;
+        }, index: number, fromKeyboard?: boolean, event?: React.MouseEvent<HTMLDivElement, MouseEvent> | React.KeyboardEvent<HTMLElement>) => void) | undefined;
+        filterable?: boolean | undefined;
+        itemClassName?: string | undefined;
+        itemsClassName?: string | undefined;
+        filterClassName?: string | undefined;
+        emptyPlaceholder?: React.ReactNode;
+        filterPlaceholder?: string | undefined;
+        activeItemIndex?: number | undefined;
+        itemKey?: ((item: {
+            disabled?: boolean;
+        }) => string) | undefined;
+        itemsHeight?: number | ((items: unknown[]) => number) | undefined;
+        deactivateOnLeave?: boolean | undefined;
+        sortHandleAlign?: import("@gravity-ui/uikit").ListSortHandleAlign | undefined;
+        filterItem?: ((filter: string) => (item: {
+            disabled?: boolean;
+        }) => boolean) | undefined;
+        onFilterUpdate?: ((filter: string) => void) | undefined;
+        onFilterEnd?: (({ items }: {
+            items: {
+                disabled?: boolean;
+            }[];
+        }) => void) | undefined;
+        onSortEnd?: ((params: import("@gravity-ui/uikit").ListSortParams) => void) | undefined;
+        onChangeActive?: ((index?: number) => void) | undefined;
+        onScrollToItem?: ((node: HTMLElement) => boolean) | undefined;
+        attachments: import(".").AttachmentItemProps["attachment"][];
+        onDelete?: ((attachment: import(".").AttachmentItemProps["attachment"]) => void) | undefined;
+        onEdit?: ((attachment: import(".").AttachmentItemProps["attachment"]) => void) | undefined;
+        onRevert?: ((attachment: import(".").AttachmentItemProps["attachment"]) => void) | undefined;
+        renderEditForm?: ((attachment: import(".").AttachmentItemProps["attachment"]) => React.ReactNode) | undefined;
+        wasAddedIds?: string[] | undefined;
+        wasEditedIds?: string[] | undefined;
+        editingIds?: string[] | undefined;
+        isDeleted?: boolean | undefined;
+    }>) => React.JSX.Element)[];
+    args: {
+        attachments: {
+            id: string;
+            name: string;
+            link?: string;
+        }[];
+        onDelete: import("@vitest/spy").Mock<(...args: any[]) => any>;
+        onEdit: import("@vitest/spy").Mock<(...args: any[]) => any>;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+/** Attachments with supported extensions use their corresponding icons. Row actions appear on hover. */
+export declare const Default: Story;
+/** `wasAddedIds` and `wasEditedIds` highlight attachments with their current change state. */
+export declare const ChangeStates: Story;
+/** The inherited List filtering API can be enabled when a consumer needs local attachment search. */
+export declare const Filterable: Story;
+/** Hover a row: edit toggles its edited state and delete removes it from the list. */
+export declare const InteractiveActions: Story;
+/** Hover a row and click edit to replace it with a consumer-provided rename form. */
+export declare const CustomEditForm: Story;
+/** Drag attachments by the handle to reorder them using the inherited List sorting API. */
+export declare const Sortable: Story;
+/** Consumer-provided content is displayed when the attachment array is empty. */
+export declare const Empty: Story;
+/** The inherited loading state can be used while the attachment collection is being fetched. */
+export declare const Loading: Story;

package/build/esm/components/AttachmentList/AttachmentList.stories.js

@@ -0,0 +1,315 @@
+import _objectSpread from "@babel/runtime/helpers/objectSpread2";
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import "core-js/modules/es.array.concat.js";
+import "core-js/modules/es.array.filter.js";
+import "core-js/modules/es.array.includes.js";
+import "core-js/modules/es.array.map.js";
+import "core-js/modules/es.array.splice.js";
+import "core-js/modules/es.function.name.js";
+import "core-js/modules/es.iterator.constructor.js";
+import "core-js/modules/es.iterator.filter.js";
+import "core-js/modules/es.iterator.map.js";
+import "core-js/modules/es.object.to-string.js";
+import "core-js/modules/es.string.includes.js";
+import "core-js/modules/es.string.link.js";
+import React, { useState } from 'react';
+import { Text } from '@gravity-ui/uikit';
+import { EditAttachmentItem } from "./internal/EditAttachmentItem";
+import { fn } from 'storybook/test';
+import { AttachmentList } from "./AttachmentList";
+import { jsx as _jsx } from "react/jsx-runtime";
+var attachments = [{
+  id: 'readme',
+  name: 'README'
+}, {
+  id: 'javascript',
+  name: 'index.js'
+}, {
+  id: 'python',
+  name: 'main.py'
+}, {
+  id: 'csv',
+  name: 'sales.csv'
+}, {
+  id: 'link-image',
+  name: 'https://home/tutorial',
+  link: 'https://home/tutorial'
+}, {
+  id: 'excel',
+  name: 'forecast.xlsx'
+}, {
+  id: 'cpp',
+  name: 'processor.cpp'
+}, {
+  id: 'ql',
+  name: 'analytics.ql'
+}, {
+  id: 'yql',
+  name: 'events.yql'
+}, {
+  id: 'sql',
+  name: 'report.sql'
+}, {
+  id: 'link',
+  name: 'link to file.cpp',
+  link: 'link/to/file.cpp'
+}];
+var meta = {
+  title: 'Components/AttachmentList',
+  component: AttachmentList,
+  tags: ['autodocs'],
+  parameters: {
+    layout: 'padded'
+  },
+  decorators: [function (Story) {
+    return /*#__PURE__*/_jsx("div", {
+      style: {
+        width: 360,
+        height: 360
+      },
+      children: /*#__PURE__*/_jsx(Story, {})
+    });
+  }],
+  args: {
+    attachments: attachments,
+    onDelete: fn(),
+    onEdit: fn()
+  }
+};
+export default meta;
+/** Attachments with supported extensions use their corresponding icons. Row actions appear on hover. */
+export var Default = {};
+
+/** `wasAddedIds` and `wasEditedIds` highlight attachments with their current change state. */
+export var ChangeStates = {
+  args: {
+    wasAddedIds: ['javascript', 'csv'],
+    wasEditedIds: ['python', 'sql']
+  }
+};
+
+/** The inherited List filtering API can be enabled when a consumer needs local attachment search. */
+export var Filterable = {
+  args: {
+    filterable: true,
+    filterPlaceholder: 'Filter by attachment name',
+    filterItem: function filterItem(filter) {
+      return function (attachment) {
+        return attachment.name.toLocaleLowerCase().includes(filter.toLocaleLowerCase());
+      };
+    }
+  }
+};
+var InteractiveAttachmentList = function InteractiveAttachmentList(props) {
+  var _useState = useState(props.attachments),
+    _useState2 = _slicedToArray(_useState, 2),
+    currentAttachments = _useState2[0],
+    setCurrentAttachments = _useState2[1];
+  var _useState3 = useState([]),
+    _useState4 = _slicedToArray(_useState3, 2),
+    editedIds = _useState4[0],
+    setEditedIds = _useState4[1];
+  return /*#__PURE__*/_jsx(AttachmentList, _objectSpread(_objectSpread({}, props), {}, {
+    attachments: currentAttachments,
+    wasEditedIds: editedIds,
+    onDelete: function onDelete(attachment) {
+      var _props$onDelete;
+      (_props$onDelete = props.onDelete) === null || _props$onDelete === void 0 || _props$onDelete.call(props, attachment);
+      setCurrentAttachments(function (current) {
+        return current.filter(function (item) {
+          return item.id !== attachment.id;
+        });
+      });
+      setEditedIds(function (current) {
+        return current.filter(function (id) {
+          return id !== attachment.id;
+        });
+      });
+    },
+    onEdit: function onEdit(attachment) {
+      var _props$onEdit;
+      (_props$onEdit = props.onEdit) === null || _props$onEdit === void 0 || _props$onEdit.call(props, attachment);
+      setEditedIds(function (current) {
+        return current.includes(attachment.id) ? current.filter(function (id) {
+          return id !== attachment.id;
+        }) : [].concat(_toConsumableArray(current), [attachment.id]);
+      });
+    }
+  }));
+};
+
+/** Hover a row: edit toggles its edited state and delete removes it from the list. */
+export var InteractiveActions = {
+  render: function render(args) {
+    return /*#__PURE__*/_jsx(InteractiveAttachmentList, _objectSpread({}, args));
+  }
+};
+var EditableAttachmentList = function EditableAttachmentList(props) {
+  var _useState5 = useState(props.attachments),
+    _useState6 = _slicedToArray(_useState5, 2),
+    currentAttachments = _useState6[0],
+    setCurrentAttachments = _useState6[1];
+  var _useState7 = useState(),
+    _useState8 = _slicedToArray(_useState7, 2),
+    editingId = _useState8[0],
+    setEditingId = _useState8[1];
+  var _useState9 = useState(''),
+    _useState0 = _slicedToArray(_useState9, 2),
+    draftName = _useState0[0],
+    setDraftName = _useState0[1];
+  var _useState1 = useState({
+      link: '',
+      token: '',
+      name: ''
+    }),
+    _useState10 = _slicedToArray(_useState1, 2),
+    draftLink = _useState10[0],
+    setDraftLink = _useState10[1];
+  var handleAcceptDraft = function handleAcceptDraft() {
+    setCurrentAttachments(function (prevState) {
+      return prevState.map(function (attach) {
+        if (attach.id === editingId && attach.link === undefined) {
+          return _objectSpread(_objectSpread({}, attach), {}, {
+            name: draftName
+          });
+        }
+        if (attach.id === editingId && typeof attach.link === 'string') {
+          return _objectSpread(_objectSpread({}, attach), {}, {
+            name: draftLink.name,
+            link: draftLink.link
+          });
+        }
+        return attach;
+      });
+    });
+    setDraftName('');
+    setEditingId('');
+  };
+  return /*#__PURE__*/_jsx(AttachmentList, _objectSpread(_objectSpread({}, props), {}, {
+    attachments: currentAttachments,
+    editingIds: editingId ? [editingId] : [],
+    onDelete: function onDelete(attach) {
+      return setCurrentAttachments(function (list) {
+        return list.filter(function (l) {
+          return l.id !== attach.id;
+        });
+      });
+    },
+    onEdit: function onEdit(attachment) {
+      var _props$onEdit2;
+      (_props$onEdit2 = props.onEdit) === null || _props$onEdit2 === void 0 || _props$onEdit2.call(props, attachment);
+      setEditingId(attachment.id);
+      setDraftName(attachment.name);
+      if (typeof attachment.link === 'string') {
+        setDraftLink(_objectSpread(_objectSpread({}, draftLink), {}, {
+          name: attachment.name,
+          link: attachment.link
+        }));
+      }
+    },
+    renderEditForm: function renderEditForm(attachment) {
+      var isLink = typeof attachment.link === 'string';
+      if (isLink) {
+        return /*#__PURE__*/_jsx(EditAttachmentItem, {
+          onCancel: function onCancel() {
+            return setEditingId('');
+          },
+          onAccept: handleAcceptDraft,
+          values: draftLink,
+          onChange: setDraftLink,
+          tokens: [{
+            value: 'default_database_logs',
+            title: 'default_database_logs'
+          }, {
+            value: 'default_yt',
+            title: 'default_yt'
+          }, {
+            value: 'default_yql',
+            title: 'default_yql'
+          }, {
+            value: 'default_long_token_title',
+            title: 'default_long_token_title'
+          }],
+          type: 'link'
+        });
+      }
+      return /*#__PURE__*/_jsx(EditAttachmentItem, {
+        fileName: draftName,
+        onChangeFileName: setDraftName,
+        onCancel: function onCancel() {
+          return setEditingId('');
+        },
+        onAccept: handleAcceptDraft,
+        type: 'file'
+      });
+    }
+  }));
+};
+
+/** Hover a row and click edit to replace it with a consumer-provided rename form. */
+export var CustomEditForm = {
+  render: function render(args) {
+    return /*#__PURE__*/_jsx(EditableAttachmentList, _objectSpread({}, args));
+  }
+};
+var SortableAttachmentList = function SortableAttachmentList(props) {
+  var _useState11 = useState(props.attachments),
+    _useState12 = _slicedToArray(_useState11, 2),
+    orderedAttachments = _useState12[0],
+    setOrderedAttachments = _useState12[1];
+  return /*#__PURE__*/_jsx(AttachmentList, _objectSpread(_objectSpread({}, props), {}, {
+    attachments: orderedAttachments,
+    onSortEnd: function onSortEnd(_ref) {
+      var _props$onSortEnd;
+      var oldIndex = _ref.oldIndex,
+        newIndex = _ref.newIndex;
+      (_props$onSortEnd = props.onSortEnd) === null || _props$onSortEnd === void 0 || _props$onSortEnd.call(props, {
+        oldIndex: oldIndex,
+        newIndex: newIndex
+      });
+      setOrderedAttachments(function (current) {
+        var next = _toConsumableArray(current);
+        var _next$splice = next.splice(oldIndex, 1),
+          _next$splice2 = _slicedToArray(_next$splice, 1),
+          movedAttachment = _next$splice2[0];
+        if (movedAttachment) {
+          next.splice(newIndex, 0, movedAttachment);
+        }
+        return next;
+      });
+    }
+  }));
+};
+
+/** Drag attachments by the handle to reorder them using the inherited List sorting API. */
+export var Sortable = {
+  args: {
+    sortable: true,
+    sortHandleAlign: 'left',
+    onSortEnd: fn()
+  },
+  render: function render(args) {
+    return /*#__PURE__*/_jsx(SortableAttachmentList, _objectSpread({}, args));
+  }
+};
+
+/** Consumer-provided content is displayed when the attachment array is empty. */
+export var Empty = {
+  args: {
+    attachments: [],
+    emptyPlaceholder: /*#__PURE__*/_jsx(Text, {
+      color: "secondary",
+      children: "No attachments yet"
+    })
+  }
+};
+
+/** The inherited loading state can be used while the attachment collection is being fetched. */
+export var Loading = {
+  args: {
+    attachments: [],
+    loading: true
+  }
+};
+// #sourceMappingURL=AttachmentList.stories.js.map

package/build/esm/components/AttachmentList/AttachmentList.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useState","Text","EditAttachmentItem","fn","AttachmentList","jsx","_jsx","attachments","id","name","link","meta","title","component","tags","parameters","layout","decorators","Story","style","width","height","children","args","onDelete","onEdit","Default","ChangeStates","wasAddedIds","wasEditedIds","Filterable","filterable","filterPlaceholder","filterItem","filter","attachment","toLocaleLowerCase","includes","InteractiveAttachmentList","props","_useState","_useState2","_slicedToArray","currentAttachments","setCurrentAttachments","_useState3","_useState4","editedIds","setEditedIds","_objectSpread","_props$onDelete","call","current","item","_props$onEdit","concat","_toConsumableArray","InteractiveActions","render","EditableAttachmentList","_useState5","_useState6","_useState7","_useState8","editingId","setEditingId","_useState9","_useState0","draftName","setDraftName","_useState1","token","_useState10","draftLink","setDraftLink","handleAcceptDraft","prevState","map","attach","undefined","editingIds","list","l","_props$onEdit2","renderEditForm","isLink","onCancel","onAccept","values","onChange","tokens","value","type","fileName","onChangeFileName","CustomEditForm","SortableAttachmentList","_useState11","_useState12","orderedAttachments","setOrderedAttachments","onSortEnd","_ref","_props$onSortEnd","oldIndex","newIndex","next","_next$splice","splice","_next$splice2","movedAttachment","Sortable","sortable","sortHandleAlign","Empty","emptyPlaceholder","color","Loading","loading"],"sources":["AttachmentList.stories.tsx"],"sourcesContent":["import React, {useState} from 'react';\nimport type {Meta, StoryObj} from '@storybook/react';\nimport {Text} from '@gravity-ui/uikit';\nimport {EditAttachmentItem, EditLinkValues} from './internal/EditAttachmentItem';\nimport {fn} from 'storybook/test';\n\nimport {AttachmentList, type AttachmentListProps} from './AttachmentList';\n\nconst attachments: AttachmentListProps['attachments'] = [\n    {id: 'readme', name: 'README'},\n    {id: 'javascript', name: 'index.js'},\n    {id: 'python', name: 'main.py'},\n    {id: 'csv', name: 'sales.csv'},\n    {id: 'link-image', name: 'https://home/tutorial', link: 'https://home/tutorial'},\n    {id: 'excel', name: 'forecast.xlsx'},\n    {id: 'cpp', name: 'processor.cpp'},\n    {id: 'ql', name: 'analytics.ql'},\n    {id: 'yql', name: 'events.yql'},\n    {id: 'sql', name: 'report.sql'},\n    {id: 'link', name: 'link to file.cpp', link: 'link/to/file.cpp'},\n];\n\nconst meta = {\n    title: 'Components/AttachmentList',\n    component: AttachmentList,\n    tags: ['autodocs'],\n    parameters: {\n        layout: 'padded',\n    },\n    decorators: [\n        (Story) => (\n            <div style={{width: 360, height: 360}}>\n                <Story />\n            </div>\n        ),\n    ],\n    args: {\n        attachments,\n        onDelete: fn(),\n        onEdit: fn(),\n    },\n} satisfies Meta<typeof AttachmentList>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\n/** Attachments with supported extensions use their corresponding icons. Row actions appear on hover. */\nexport const Default: Story = {};\n\n/** `wasAddedIds` and `wasEditedIds` highlight attachments with their current change state. */\nexport const ChangeStates: Story = {\n    args: {\n        wasAddedIds: ['javascript', 'csv'],\n        wasEditedIds: ['python', 'sql'],\n    },\n};\n\n/** The inherited List filtering API can be enabled when a consumer needs local attachment search. */\nexport const Filterable: Story = {\n    args: {\n        filterable: true,\n        filterPlaceholder: 'Filter by attachment name',\n        filterItem: (filter) => (attachment) =>\n            (attachment as AttachmentListProps['attachments'][number]).name\n                .toLocaleLowerCase()\n                .includes(filter.toLocaleLowerCase()),\n    },\n};\n\nconst InteractiveAttachmentList = (props: AttachmentListProps) => {\n    const [currentAttachments, setCurrentAttachments] = useState(props.attachments);\n    const [editedIds, setEditedIds] = useState<string[]>([]);\n\n    return (\n        <AttachmentList\n            {...props}\n            attachments={currentAttachments}\n            wasEditedIds={editedIds}\n            onDelete={(attachment) => {\n                props.onDelete?.(attachment);\n                setCurrentAttachments((current) =>\n                    current.filter((item) => item.id !== attachment.id),\n                );\n                setEditedIds((current) => current.filter((id) => id !== attachment.id));\n            }}\n            onEdit={(attachment) => {\n                props.onEdit?.(attachment);\n                setEditedIds((current) =>\n                    current.includes(attachment.id)\n                        ? current.filter((id) => id !== attachment.id)\n                        : [...current, attachment.id],\n                );\n            }}\n        />\n    );\n};\n\n/** Hover a row: edit toggles its edited state and delete removes it from the list. */\nexport const InteractiveActions: Story = {\n    render: (args) => <InteractiveAttachmentList {...args} />,\n};\n\nconst EditableAttachmentList = (props: AttachmentListProps) => {\n    const [currentAttachments, setCurrentAttachments] = useState(props.attachments);\n    const [editingId, setEditingId] = useState<string>();\n    const [draftName, setDraftName] = useState('');\n    const [draftLink, setDraftLink] = useState<EditLinkValues>({\n        link: '',\n        token: '',\n        name: '',\n    });\n\n    const handleAcceptDraft = () => {\n        setCurrentAttachments((prevState) => {\n            return prevState.map((attach) => {\n                if (attach.id === editingId && attach.link === undefined) {\n                    return {\n                        ...attach,\n                        name: draftName,\n                    };\n                }\n                if (attach.id === editingId && typeof attach.link === 'string') {\n                    return {\n                        ...attach,\n                        name: draftLink.name,\n                        link: draftLink.link,\n                    };\n                }\n                return attach;\n            });\n        });\n        setDraftName('');\n        setEditingId('');\n    };\n\n    return (\n        <AttachmentList\n            {...props}\n            attachments={currentAttachments}\n            editingIds={editingId ? [editingId] : []}\n            onDelete={(attach) =>\n                setCurrentAttachments((list) => list.filter((l) => l.id !== attach.id))\n            }\n            onEdit={(attachment) => {\n                props.onEdit?.(attachment);\n                setEditingId(attachment.id);\n                setDraftName(attachment.name);\n                if (typeof attachment.link === 'string') {\n                    setDraftLink({...draftLink, name: attachment.name, link: attachment.link});\n                }\n            }}\n            renderEditForm={(attachment) => {\n                const isLink = typeof attachment.link === 'string';\n\n                if (isLink) {\n                    return (\n                        <EditAttachmentItem\n                            onCancel={() => setEditingId('')}\n                            onAccept={handleAcceptDraft}\n                            values={draftLink}\n                            onChange={setDraftLink}\n                            tokens={[\n                                {value: 'default_database_logs', title: 'default_database_logs'},\n                                {value: 'default_yt', title: 'default_yt'},\n                                {value: 'default_yql', title: 'default_yql'},\n                                {\n                                    value: 'default_long_token_title',\n                                    title: 'default_long_token_title',\n                                },\n                            ]}\n                            type={'link'}\n                        />\n                    );\n                }\n\n                return (\n                    <EditAttachmentItem\n                        fileName={draftName}\n                        onChangeFileName={setDraftName}\n                        onCancel={() => setEditingId('')}\n                        onAccept={handleAcceptDraft}\n                        type={'file'}\n                    />\n                );\n            }}\n        />\n    );\n};\n\n/** Hover a row and click edit to replace it with a consumer-provided rename form. */\nexport const CustomEditForm: Story = {\n    render: (args) => <EditableAttachmentList {...args} />,\n};\n\nconst SortableAttachmentList = (props: AttachmentListProps) => {\n    const [orderedAttachments, setOrderedAttachments] = useState(props.attachments);\n\n    return (\n        <AttachmentList\n            {...props}\n            attachments={orderedAttachments}\n            onSortEnd={({oldIndex, newIndex}) => {\n                props.onSortEnd?.({oldIndex, newIndex});\n                setOrderedAttachments((current) => {\n                    const next = [...current];\n                    const [movedAttachment] = next.splice(oldIndex, 1);\n\n                    if (movedAttachment) {\n                        next.splice(newIndex, 0, movedAttachment);\n                    }\n\n                    return next;\n                });\n            }}\n        />\n    );\n};\n\n/** Drag attachments by the handle to reorder them using the inherited List sorting API. */\nexport const Sortable: Story = {\n    args: {\n        sortable: true,\n        sortHandleAlign: 'left',\n        onSortEnd: fn(),\n    },\n    render: (args) => <SortableAttachmentList {...args} />,\n};\n\n/** Consumer-provided content is displayed when the attachment array is empty. */\nexport const Empty: Story = {\n    args: {\n        attachments: [],\n        emptyPlaceholder: <Text color=\"secondary\">No attachments yet</Text>,\n    },\n};\n\n/** The inherited loading state can be used while the attachment collection is being fetched. */\nexport const Loading: Story = {\n    args: {\n        attachments: [],\n        loading: true,\n    },\n};\n"],"mappings":"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","ignoreList":[]}

package/build/esm/components/AttachmentList/helpers/getIconByAttachmentName.d.ts

@@ -0,0 +1,2 @@
+export declare const getAttachmentExtension: (attachmentName: string) => "unknown" | "yql" | "js" | "ql" | "sql" | "py" | "csv" | "xls" | "xlsx" | "cpp";
+export declare const getAttachmentIcon: (attachmentName: string) => (() => import("react").JSX.Element) | ((props: import("react").SVGProps<SVGSVGElement>) => React.JSX.Element) | ((props: import("react").SVGProps<SVGSVGElement>) => React.JSX.Element) | ((props: import("react").SVGProps<SVGSVGElement>) => React.JSX.Element) | ((props: import("react").SVGProps<SVGSVGElement>) => React.JSX.Element) | ((props: import("react").SVGProps<SVGSVGElement>) => React.JSX.Element) | ((props: import("react").SVGProps<SVGSVGElement>) => React.JSX.Element);

package/build/esm/components/AttachmentList/helpers/getIconByAttachmentName.js

@@ -0,0 +1,30 @@
+import "core-js/modules/es.array.last-index-of.js";
+import "core-js/modules/es.array.slice.js";
+import { AbbrQl, AbbrSql, FileCode, LayoutList, LogoNodejs, LogoPython } from '@gravity-ui/icons';
+import { LogoCPlusPlus } from "../../Icons";
+var iconMatcher = {
+  js: LogoNodejs,
+  ql: AbbrQl,
+  sql: AbbrSql,
+  yql: AbbrSql,
+  py: LogoPython,
+  csv: LayoutList,
+  xls: LayoutList,
+  xlsx: LayoutList,
+  cpp: LogoCPlusPlus,
+  unknown: FileCode
+};
+export var getAttachmentExtension = function getAttachmentExtension(attachmentName) {
+  var name = attachmentName.split('/').pop();
+  if (name === undefined) return 'unknown';
+  var index = name === null || name === void 0 ? void 0 : name.lastIndexOf('.');
+  if (index === undefined) return 'unknown';
+  var extension = index > 0 ? name.slice(index + 1) : '';
+  if (extension in iconMatcher) return extension;
+  return 'unknown';
+};
+export var getAttachmentIcon = function getAttachmentIcon(attachmentName) {
+  var extension = getAttachmentExtension(attachmentName);
+  return iconMatcher[extension];
+};
+// #sourceMappingURL=getIconByAttachmentName.js.map

package/build/esm/components/AttachmentList/helpers/getIconByAttachmentName.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["AbbrQl","AbbrSql","FileCode","LayoutList","LogoNodejs","LogoPython","LogoCPlusPlus","iconMatcher","js","ql","sql","yql","py","csv","xls","xlsx","cpp","unknown","getAttachmentExtension","attachmentName","name","split","pop","undefined","index","lastIndexOf","extension","slice","getAttachmentIcon"],"sources":["getIconByAttachmentName.ts"],"sourcesContent":["import {AbbrQl, AbbrSql, FileCode, LayoutList, LogoNodejs, LogoPython} from '@gravity-ui/icons';\nimport {LogoCPlusPlus} from '../../Icons';\n\nconst iconMatcher = {\n    js: LogoNodejs,\n    ql: AbbrQl,\n    sql: AbbrSql,\n    yql: AbbrSql,\n    py: LogoPython,\n    csv: LayoutList,\n    xls: LayoutList,\n    xlsx: LayoutList,\n    cpp: LogoCPlusPlus,\n    unknown: FileCode,\n} as const;\n\nexport const getAttachmentExtension = (attachmentName: string) => {\n    const name = attachmentName.split('/').pop();\n\n    if (name === undefined) return 'unknown';\n\n    const index = name?.lastIndexOf('.');\n\n    if (index === undefined) return 'unknown';\n\n    const extension = index > 0 ? name.slice(index + 1) : '';\n\n    if (extension in iconMatcher) return extension as keyof typeof iconMatcher;\n\n    return 'unknown';\n};\n\nexport const getAttachmentIcon = (attachmentName: string) => {\n    const extension = getAttachmentExtension(attachmentName);\n    return iconMatcher[extension];\n};\n"],"mappings":";;AAAA,SAAQA,MAAM,EAAEC,OAAO,EAAEC,QAAQ,EAAEC,UAAU,EAAEC,UAAU,EAAEC,UAAU,QAAO,mBAAmB;AAC/F,SAAQC,aAAa;AAErB,IAAMC,WAAW,GAAG;EAChBC,EAAE,EAAEJ,UAAU;EACdK,EAAE,EAAET,MAAM;EACVU,GAAG,EAAET,OAAO;EACZU,GAAG,EAAEV,OAAO;EACZW,EAAE,EAAEP,UAAU;EACdQ,GAAG,EAAEV,UAAU;EACfW,GAAG,EAAEX,UAAU;EACfY,IAAI,EAAEZ,UAAU;EAChBa,GAAG,EAAEV,aAAa;EAClBW,OAAO,EAAEf;AACb,CAAU;AAEV,OAAO,IAAMgB,sBAAsB,GAAG,SAAzBA,sBAAsBA,CAAIC,cAAsB,EAAK;EAC9D,IAAMC,IAAI,GAAGD,cAAc,CAACE,KAAK,CAAC,GAAG,CAAC,CAACC,GAAG,CAAC,CAAC;EAE5C,IAAIF,IAAI,KAAKG,SAAS,EAAE,OAAO,SAAS;EAExC,IAAMC,KAAK,GAAGJ,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEK,WAAW,CAAC,GAAG,CAAC;EAEpC,IAAID,KAAK,KAAKD,SAAS,EAAE,OAAO,SAAS;EAEzC,IAAMG,SAAS,GAAGF,KAAK,GAAG,CAAC,GAAGJ,IAAI,CAACO,KAAK,CAACH,KAAK,GAAG,CAAC,CAAC,GAAG,EAAE;EAExD,IAAIE,SAAS,IAAInB,WAAW,EAAE,OAAOmB,SAAS;EAE9C,OAAO,SAAS;AACpB,CAAC;AAED,OAAO,IAAME,iBAAiB,GAAG,SAApBA,iBAAiBA,CAAIT,cAAsB,EAAK;EACzD,IAAMO,SAAS,GAAGR,sBAAsB,CAACC,cAAc,CAAC;EACxD,OAAOZ,WAAW,CAACmB,SAAS,CAAC;AACjC,CAAC","ignoreList":[]}

package/build/esm/components/AttachmentList/helpers/objectLinkValidator.d.ts

@@ -0,0 +1,11 @@
+export type EditLinkErrors = Partial<{
+    link: string;
+    token: string;
+    name: string;
+}>;
+export type ObjectLinkValidator = (values: Record<string, unknown>, isTokenRequired?: boolean) => EditLinkErrors | null;
+export declare const objectLinkValidator: (values: Record<string, unknown>, isTokenRequired?: boolean) => Partial<Partial<{
+    link: string;
+    token: string;
+    name: string;
+}>> | null;

package/build/esm/components/AttachmentList/helpers/objectLinkValidator.js

@@ -0,0 +1,24 @@
+import "core-js/modules/es.function.name.js";
+import "core-js/modules/es.object.keys.js";
+import "core-js/modules/es.string.link.js";
+import { stringRequiredValidator } from "./stringRequiredValidator";
+export var objectLinkValidator = function objectLinkValidator(values, isTokenRequired) {
+  var patchErrors = {};
+  var linkError = stringRequiredValidator(values.link);
+  if (linkError) {
+    patchErrors['link'] = linkError;
+  }
+  var tokenError = isTokenRequired ? stringRequiredValidator(values.token) : null;
+  if (tokenError) {
+    patchErrors['token'] = tokenError;
+  }
+  var nameError = stringRequiredValidator(values.name);
+  if (nameError) {
+    patchErrors['name'] = nameError;
+  }
+  if (Object.keys(patchErrors).length === 0) {
+    return null;
+  }
+  return patchErrors;
+};
+// #sourceMappingURL=objectLinkValidator.js.map

package/build/esm/components/AttachmentList/helpers/objectLinkValidator.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["stringRequiredValidator","objectLinkValidator","values","isTokenRequired","patchErrors","linkError","link","tokenError","token","nameError","name","Object","keys","length"],"sources":["objectLinkValidator.ts"],"sourcesContent":["import {stringRequiredValidator} from './stringRequiredValidator';\n\nexport type EditLinkErrors = Partial<{\n    link: string;\n    token: string;\n    name: string;\n}>;\n\nexport type ObjectLinkValidator = (\n    values: Record<string, unknown>,\n    isTokenRequired?: boolean,\n) => EditLinkErrors | null;\n\nexport const objectLinkValidator = (values: Record<string, unknown>, isTokenRequired?: boolean) => {\n    const patchErrors: Partial<EditLinkErrors> = {};\n\n    const linkError = stringRequiredValidator(values.link);\n\n    if (linkError) {\n        patchErrors['link'] = linkError;\n    }\n\n    const tokenError = isTokenRequired ? stringRequiredValidator(values.token) : null;\n\n    if (tokenError) {\n        patchErrors['token'] = tokenError;\n    }\n\n    const nameError = stringRequiredValidator(values.name);\n\n    if (nameError) {\n        patchErrors['name'] = nameError;\n    }\n\n    if (Object.keys(patchErrors).length === 0) {\n        return null;\n    }\n\n    return patchErrors;\n};\n"],"mappings":";;;AAAA,SAAQA,uBAAuB;AAa/B,OAAO,IAAMC,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAIC,MAA+B,EAAEC,eAAyB,EAAK;EAC/F,IAAMC,WAAoC,GAAG,CAAC,CAAC;EAE/C,IAAMC,SAAS,GAAGL,uBAAuB,CAACE,MAAM,CAACI,IAAI,CAAC;EAEtD,IAAID,SAAS,EAAE;IACXD,WAAW,CAAC,MAAM,CAAC,GAAGC,SAAS;EACnC;EAEA,IAAME,UAAU,GAAGJ,eAAe,GAAGH,uBAAuB,CAACE,MAAM,CAACM,KAAK,CAAC,GAAG,IAAI;EAEjF,IAAID,UAAU,EAAE;IACZH,WAAW,CAAC,OAAO,CAAC,GAAGG,UAAU;EACrC;EAEA,IAAME,SAAS,GAAGT,uBAAuB,CAACE,MAAM,CAACQ,IAAI,CAAC;EAEtD,IAAID,SAAS,EAAE;IACXL,WAAW,CAAC,MAAM,CAAC,GAAGK,SAAS;EACnC;EAEA,IAAIE,MAAM,CAACC,IAAI,CAACR,WAAW,CAAC,CAACS,MAAM,KAAK,CAAC,EAAE;IACvC,OAAO,IAAI;EACf;EAEA,OAAOT,WAAW;AACtB,CAAC","ignoreList":[]}

package/build/esm/components/AttachmentList/helpers/stringRequiredValidator.d.ts

@@ -0,0 +1,2 @@
+export type Validator = (value: unknown) => string | null;
+export declare const stringRequiredValidator: Validator;