{
  "version": 3,
  "sources": ["../../board/scroll_indicator.tsx"],
  "sourcesContent": ["import * as React from \"react\"\nimport type {Board} from \"@cling/lib.shared.model\"\nimport {observer} from \"mobx-react\"\nimport {ui_state, ui_actions} from \"../state/index\"\nimport {running_on_mobile_device} from \"@cling/lib.web.utils\"\nimport {classNames} from \"@cling/lib.web.utils\"\nimport {IconButton} from \"@cling/lib.web.mdc/icon_button\"\nimport {i18n} from \"@cling/lib.web.i18n\"\nimport {GlobalBackdrop} from \"../misc/global_backdrop\"\nimport {simple_tooltip_event_handlers} from \"@cling/lib.web.mdc/simple_tooltip\"\n\nexport const ScrollIndicator = observer(({board}: {board?: Board}) => {\n    if (ui_state.search_state.all_boards || !board || ui_state.is_card_editor_open) {\n        return null\n    }\n    const columns = board ? [...ui_state.visible_columns(board)] : []\n    const column_indexes_with_updates = []\n    const columns_fully_visible = []\n    const layout = ui_state.layout_state.layout\n    for (let i = 0; i < columns.length; i++) {\n        if (ui_state.is_new_or_changed(columns[i])) {\n            column_indexes_with_updates.push(i)\n        }\n    }\n    for (let i = 0; i < layout.main_layout.num_columns; i++) {\n        columns_fully_visible.push(ui_state.layout_state.is_column_fully_visible(i))\n    }\n    if (running_on_mobile_device()) {\n        return (\n            <MobileScrollIndicator\n                columns_fully_visible={columns_fully_visible}\n                columns_indexes_with_updates={column_indexes_with_updates}\n            />\n        )\n    }\n    return (\n        <DesktopScrollIndicator\n            columns_fully_visible={columns_fully_visible}\n            columns_indexes_with_updates={column_indexes_with_updates}\n        />\n    )\n})\n\nconst DesktopScrollIndicator = observer(\n    ({\n        columns_indexes_with_updates,\n        columns_fully_visible,\n    }: {\n        columns_indexes_with_updates: number[]\n        columns_fully_visible: boolean[]\n    }) => {\n        const scroll_left = React.useCallback(() => {\n            ui_state.layout_state.scroll_to_column(\n                ui_state.layout_state.first_visible_column_index - 1,\n            )\n        }, [])\n        const scroll_right = React.useCallback(() => {\n            ui_state.layout_state.scroll_to_column(\n                ui_state.layout_state.first_visible_column_index + 1,\n            )\n        }, [])\n        return (\n            <nav\n                className=\"scroll-indicator__container--desktop\"\n                onMouseEnter={ui_actions.hide_card_menus}\n            >\n                <ol className=\"scroll-indicator__overview scroll-indicator__overview--desktop\">\n                    <GlobalBackdrop />\n                    <li>\n                        <IconButton\n                            className=\"scroll-indicator__overview-button\"\n                            icon=\"navigate_before\"\n                            onClick={scroll_left}\n                            data-test-id=\"ScrollIndicator_left\"\n                            disabled={columns_fully_visible[0]}\n                            tooltip={i18n.scroll_left}\n                        />\n                    </li>\n                    <li>\n                        <IconButton\n                            className=\"scroll-indicator__overview-button\"\n                            icon=\"remove\"\n                            data-test-id=\"ScrollIndicator_zoom_out\"\n                            disabled={!ui_state.is_layout_zoom_out_enabled}\n                            small\n                            onClick={ui_actions.layout_zoom_out}\n                            tooltip={i18n.make_cards_smaller}\n                        />\n                    </li>\n                    {columns_fully_visible.map((fully_visible, i) => {\n                        return (\n                            <li\n                                key={i}\n                                className={classNames(\"scroll-indicator__overview-item\", {\n                                    \"scroll-indicator__overview-item--not-visible\": !fully_visible,\n                                    \"scroll-indicator__overview-item--visible\": fully_visible,\n                                    \"scroll-indicator__overview-item--has-updates\":\n                                        columns_indexes_with_updates?.includes(i),\n                                })}\n                                onClick={() => ui_state.layout_state.scroll_column_into_view(i)}\n                                aria-label={fully_visible ? undefined : i18n.jump_to_column}\n                                {...(!fully_visible ? simple_tooltip_event_handlers : {})}\n                            />\n                        )\n                    })}\n                    <li>\n                        <IconButton\n                            className=\"scroll-indicator__overview-button\"\n                            data-test-id=\"ScrollIndicator_zoom_in\"\n                            icon=\"add\"\n                            small\n                            onClick={ui_actions.layout_zoom_in}\n                            disabled={!ui_state.is_layout_zoom_in_enabled}\n                            tooltip={i18n.make_cards_larger}\n                        />\n                    </li>\n                    <li>\n                        <IconButton\n                            className=\"scroll-indicator__overview-button\"\n                            icon=\"navigate_next\"\n                            onClick={scroll_right}\n                            disabled={\n                                columns_fully_visible[columns_fully_visible.length - 1] &&\n                                (ui_state.layout_state.first_visible_column_index !== 0 ||\n                                    !ui_state.layout_state.layout.main_layout.inbox_shown)\n                            }\n                            data-test-id=\"ScrollIndicator_right\"\n                            tooltip={i18n.scroll_right}\n                        />\n                    </li>\n                </ol>\n            </nav>\n        )\n    },\n)\n\nconst MobileScrollIndicator = ({\n    columns_indexes_with_updates,\n    columns_fully_visible,\n}: {\n    columns_indexes_with_updates: number[]\n    columns_fully_visible: boolean[]\n}) => {\n    return (\n        <ol className=\"scroll-indicator__overview scroll-indicator__overview--mobile\">\n            {columns_fully_visible.map((fully_visible, i) => {\n                return (\n                    <li\n                        key={i}\n                        className={classNames(\"scroll-indicator__overview-item\", {\n                            \"scroll-indicator__overview-item--not-visible\": !fully_visible,\n                            \"scroll-indicator__overview-item--visible\": fully_visible,\n                            \"scroll-indicator__overview-item--has-updates\":\n                                columns_indexes_with_updates?.includes(i),\n                        })}\n                    />\n                )\n            })}\n        </ol>\n    )\n}\n"],
  "mappings": "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",
  "names": ["init_compat_module", "ScrollIndicator", "observer", "board", "ui_state", "columns", "column_indexes_with_updates", "columns_fully_visible", "layout", "i", "running_on_mobile_device", "_", "MobileScrollIndicator", "DesktopScrollIndicator", "columns_indexes_with_updates", "scroll_left", "q", "scroll_right", "ui_actions", "GlobalBackdrop", "IconButton", "i18n", "fully_visible", "classNames", "simple_tooltip_event_handlers", "__name"]
}