platform/plugins/tracker-resources/src/components/templates/IssueTemplatePresenter.svelte
mrsadman99 b0b1089369
TSK-413: Implement scrum recording (#2550)
Signed-off-by: Anton Brechka <anton.brechka@xored.com>
2023-02-03 12:47:25 +07:00

83 lines
2.2 KiB
Svelte

<!--
// Copyright © 2022 Hardcore Engineering Inc.
//
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License. You may
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
//
// See the License for the specific language governing permissions and
// limitations under the License.
-->
<script lang="ts">
import { WithLookup } from '@hcengineering/core'
import type { IssueTemplate } from '@hcengineering/tracker'
import { Icon, showPanel, tooltip } from '@hcengineering/ui'
import tracker from '../../plugin'
export let value: WithLookup<IssueTemplate>
// export let inline: boolean = false
export let disableClick = false
export let noUnderline = false
function handleIssueEditorOpened () {
if (disableClick) {
return
}
showPanel(tracker.component.EditIssueTemplate, value._id, value._class, 'content')
}
$: title = `${value?.title}`
</script>
{#if value}
<!-- svelte-ignore a11y-click-events-have-key-events -->
<span class="issuePresenterRoot" class:noPointer={disableClick} class:noUnderline on:click={handleIssueEditorOpened}>
<div class="mr-2" use:tooltip={{ label: tracker.string.IssueTemplate }}>
<Icon icon={tracker.icon.Issues} size={'small'} />
</div>
<span title={value?.title}>
{title}
</span>
</span>
{/if}
<style lang="scss">
.issuePresenterRoot {
display: flex;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
flex-shrink: 0;
max-width: 15rem;
font-size: 0.8125rem;
color: var(--content-color);
cursor: pointer;
&.noPointer {
cursor: default;
}
&.noUnderline {
font-weight: 500;
color: var(--caption-color);
}
&:not(.noUnderline) {
&:hover {
color: var(--caption-color);
text-decoration: underline;
}
}
&:active {
color: var(--accent-color);
}
}
</style>