diff --git a/models/tracker/src/index.ts b/models/tracker/src/index.ts
index cab0d34593..b69998c97b 100644
--- a/models/tracker/src/index.ts
+++ b/models/tracker/src/index.ts
@@ -1315,7 +1315,7 @@ export function createModel (builder: Builder): void {
group: 'create'
}
},
- tracker.action.NewSubIssue
+ tracker.action.NewIssue
)
createAction(
diff --git a/packages/theme/styles/_colors.scss b/packages/theme/styles/_colors.scss
index b72b326e29..6fc947f62f 100644
--- a/packages/theme/styles/_colors.scss
+++ b/packages/theme/styles/_colors.scss
@@ -154,6 +154,10 @@
--theme-calendar-holiday-bgcolor: rgba(235, 87, 87, .1);
--theme-calendar-weekend-bgcolor: rgba(242, 153, 74, .05);
+ --theme-tooltip-color: rgba(255, 255, 255, .8);
+ --theme-tooltip-bg: #353347;
+ --theme-tooltip-key-bg: rgba(255, 255, 255, .08);
+
--theme-inbox-notify: #F47758;
--theme-inbox-people-notify: #2B5190;
--theme-inbox-activity-bgcolor: #1A1A28;
@@ -347,6 +351,10 @@
--theme-calendar-holiday-bgcolor: rgba(235, 87, 87, .1);
--theme-calendar-weekend-bgcolor: rgba(242, 153, 74, .1);
+ --theme-tooltip-color: #FFF;
+ --theme-tooltip-bg: #444248;
+ --theme-tooltip-key-bg: rgba(255, 255, 255, .08);
+
--theme-inbox-notify: #F47758;
--theme-inbox-people-notify: #2B5190;
--theme-inbox-activity-bgcolor: #fff;
diff --git a/packages/ui/src/components/TooltipInstance.svelte b/packages/ui/src/components/TooltipInstance.svelte
index 6c2f219517..584b18d9d4 100644
--- a/packages/ui/src/components/TooltipInstance.svelte
+++ b/packages/ui/src/components/TooltipInstance.svelte
@@ -19,6 +19,7 @@
import type { TooltipAlignment } from '../types'
import Component from './Component.svelte'
import Label from './Label.svelte'
+ import { capitalizeFirstLetter, formatKey } from '../utils'
let tooltipHTML: HTMLElement
let nubHTML: HTMLElement
@@ -236,6 +237,25 @@
{:else if $tooltip.label && $tooltip.kind !== 'submenu'}
{:else if $tooltip.kind === 'submenu'}
str.charAt(0).toUpperCase() + str.slice(1)
let days: Array = []
const getDateStyle = (date: Date): TCellStyle => {
diff --git a/packages/ui/src/components/calendar/MonthSquare.svelte b/packages/ui/src/components/calendar/MonthSquare.svelte
index 05cf8d165a..cf6bd0fc67 100644
--- a/packages/ui/src/components/calendar/MonthSquare.svelte
+++ b/packages/ui/src/components/calendar/MonthSquare.svelte
@@ -18,6 +18,7 @@
import IconNavNext from '../icons/NavNext.svelte'
import Icon from '../Icon.svelte'
import { firstDay, day, getWeekDayName, areDatesEqual, getMonthName, weekday, isWeekend } from './internal/DateUtils'
+ import { capitalizeFirstLetter } from '../../utils'
export let currentDate: Date | null
export let viewDate: Date
@@ -32,7 +33,6 @@
$: firstDayOfCurrentMonth = firstDay(viewDate, mondayStart)
let monthYear: string
const today: Date = new Date(Date.now())
- const capitalizeFirstLetter = (str: string): string => str.charAt(0).toUpperCase() + str.slice(1)
afterUpdate(() => {
monthYear = capitalizeFirstLetter(getMonthName(viewDate)) + ' ' + viewDate.getFullYear()
diff --git a/packages/ui/src/tooltips.ts b/packages/ui/src/tooltips.ts
index 82e0f9b3f4..630b61319c 100644
--- a/packages/ui/src/tooltips.ts
+++ b/packages/ui/src/tooltips.ts
@@ -10,6 +10,7 @@ const emptyTooltip: LabelAndProps = {
props: undefined,
anchor: undefined,
onUpdate: undefined,
+ keys: undefined,
kind: 'tooltip'
}
let storedValue: LabelAndProps = emptyTooltip
@@ -27,10 +28,30 @@ export function tooltip (node: HTMLElement, options?: LabelAndProps): any {
if (opt.kind !== 'submenu') {
clearTimeout(toHandler)
toHandler = setTimeout(() => {
- showTooltip(opt.label, node, opt.direction, opt.component, opt.props, opt.anchor, opt.onUpdate, opt.kind)
+ showTooltip(
+ opt.label,
+ node,
+ opt.direction,
+ opt.component,
+ opt.props,
+ opt.anchor,
+ opt.onUpdate,
+ opt.kind,
+ opt.keys
+ )
}, 250)
} else {
- showTooltip(opt.label, node, opt.direction, opt.component, opt.props, opt.anchor, opt.onUpdate, opt.kind)
+ showTooltip(
+ opt.label,
+ node,
+ opt.direction,
+ opt.component,
+ opt.props,
+ opt.anchor,
+ opt.onUpdate,
+ opt.kind,
+ opt.keys
+ )
}
}
}
@@ -45,7 +66,17 @@ export function tooltip (node: HTMLElement, options?: LabelAndProps): any {
if (node !== storedValue.element) return
const shown = !!(storedValue.label !== undefined || storedValue.component !== undefined)
if (shown) {
- showTooltip(opt.label, node, opt.direction, opt.component, opt.props, opt.anchor, opt.onUpdate, opt.kind)
+ showTooltip(
+ opt.label,
+ node,
+ opt.direction,
+ opt.component,
+ opt.props,
+ opt.anchor,
+ opt.onUpdate,
+ opt.kind,
+ opt.keys
+ )
}
},
@@ -64,7 +95,8 @@ export function showTooltip (
props?: any,
anchor?: HTMLElement,
onUpdate?: (result: any) => void,
- kind?: 'tooltip' | 'submenu' | 'popup'
+ kind?: 'tooltip' | 'submenu' | 'popup',
+ keys?: string[]
): void {
storedValue = {
label,
@@ -74,7 +106,8 @@ export function showTooltip (
props,
anchor,
onUpdate,
- kind
+ kind,
+ keys
}
tooltipstore.update((old) => {
if (old.component === storedValue.component) {
diff --git a/packages/ui/src/types.ts b/packages/ui/src/types.ts
index 5b07e5eba4..f2806ea574 100644
--- a/packages/ui/src/types.ts
+++ b/packages/ui/src/types.ts
@@ -238,6 +238,7 @@ export interface LabelAndProps {
anchor?: HTMLElement
onUpdate?: (result: any) => void
kind?: 'tooltip' | 'submenu' | 'popup'
+ keys?: string[]
}
export interface ListItem {
diff --git a/packages/ui/src/utils.ts b/packages/ui/src/utils.ts
index a65be75b66..eb058641a0 100644
--- a/packages/ui/src/utils.ts
+++ b/packages/ui/src/utils.ts
@@ -197,3 +197,36 @@ export interface IModeSelector {
config: Array<[string, IntlString, object]>
onChange: (_mode: string) => void
}
+
+/**
+ * @public
+ */
+export function capitalizeFirstLetter (str: string): string {
+ return str.charAt(0).toUpperCase() + str.slice(1)
+}
+
+const isMac = /Macintosh/i.test(navigator.userAgent)
+
+/**
+ * @public
+ */
+export function formatKey (key: string): string[][] {
+ const thens = key.split('->')
+ const result: string[][] = []
+ for (const r of thens) {
+ result.push(
+ r.split('+').map((it) =>
+ it
+ .replace(/key/g, '')
+ .replace(/Meta|meta/g, isMac ? '⌘' : 'Ctrl')
+ .replace(/ArrowUp/g, '↑')
+ .replace(/ArrowDown/g, '↓')
+ .replace(/ArrowLeft/g, '←')
+ .replace(/ArrowRight/g, '→')
+ .replace(/Backspace/g, '⌫')
+ .toLocaleLowerCase()
+ )
+ )
+ }
+ return result
+}
diff --git a/plugins/tracker-resources/src/components/NewIssueHeader.svelte b/plugins/tracker-resources/src/components/NewIssueHeader.svelte
index f5dcaa7fb1..a0fbd2c1b3 100644
--- a/plugins/tracker-resources/src/components/NewIssueHeader.svelte
+++ b/plugins/tracker-resources/src/components/NewIssueHeader.svelte
@@ -14,8 +14,9 @@
-->