@limetech/lime-elements 37.32.3 → 37.32.5

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 (23) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/dist/cjs/limel-dock-button.cjs.entry.js +2 -2
  3. package/dist/cjs/limel-dock-button.cjs.entry.js.map +1 -1
  4. package/dist/cjs/limel-prosemirror-adapter.cjs.entry.js +2 -2
  5. package/dist/cjs/limel-prosemirror-adapter.cjs.entry.js.map +1 -1
  6. package/dist/collection/components/dock/dock-button/dock-button.css +3 -0
  7. package/dist/collection/components/dock/dock-button/dock-button.js +1 -1
  8. package/dist/collection/components/dock/dock-button/dock-button.js.map +1 -1
  9. package/dist/collection/components/text-editor/prosemirror-adapter/prosemirror-adapter.css +8 -1
  10. package/dist/collection/components/text-editor/prosemirror-adapter/prosemirror-adapter.js +1 -1
  11. package/dist/collection/components/text-editor/prosemirror-adapter/prosemirror-adapter.js.map +1 -1
  12. package/dist/esm/limel-dock-button.entry.js +2 -2
  13. package/dist/esm/limel-dock-button.entry.js.map +1 -1
  14. package/dist/esm/limel-prosemirror-adapter.entry.js +2 -2
  15. package/dist/esm/limel-prosemirror-adapter.entry.js.map +1 -1
  16. package/dist/lime-elements/lime-elements.esm.js +1 -1
  17. package/dist/lime-elements/{p-a59595ad.entry.js → p-30f1fe5a.entry.js} +2 -2
  18. package/dist/lime-elements/{p-a59595ad.entry.js.map → p-30f1fe5a.entry.js.map} +1 -1
  19. package/dist/lime-elements/p-5983b027.entry.js +2 -0
  20. package/dist/lime-elements/p-5983b027.entry.js.map +1 -0
  21. package/package.json +1 -1
  22. package/dist/lime-elements/p-16c3a81a.entry.js +0 -2
  23. package/dist/lime-elements/p-16c3a81a.entry.js.map +0 -1
@@ -118,6 +118,9 @@ limel-popover {
118
118
  display: grid;
119
119
  grid-template-columns: 100%;
120
120
  }
121
+ limel-popover button[slot=trigger][aria-expanded=true] {
122
+ box-shadow: var(--button-shadow-inset);
123
+ }
121
124
 
122
125
  .text {
123
126
  overflow: hidden;
@@ -61,7 +61,7 @@ export class DockButton {
61
61
  renderPopover() {
62
62
  var _a;
63
63
  const CustomComponent = (_a = this.item) === null || _a === void 0 ? void 0 : _a.dockMenu.componentName;
64
- return (h("limel-popover", { openDirection: this.useMobileLayout ? 'top' : 'right', open: this.isOpen || this.item.dockMenu.menuOpen, onClose: this.onPopoverClose }, this.renderButton(this.openPopover, 'trigger'), h(CustomComponent, Object.assign({ ref: this.setCustomComponentElement }, (this.item.dockMenu.props || {}), { onClose: this.onPopoverClose }))));
64
+ return (h("limel-popover", { openDirection: this.useMobileLayout ? 'top' : 'right-start', open: this.isOpen || this.item.dockMenu.menuOpen, onClose: this.onPopoverClose }, this.renderButton(this.openPopover, 'trigger'), h(CustomComponent, Object.assign({ ref: this.setCustomComponentElement }, (this.item.dockMenu.props || {}), { onClose: this.onPopoverClose }))));
65
65
  }
66
66
  renderButton(handleClick, slot) {
67
67
  var _a;
@@ -1 +1 @@
1
- {"version":3,"file":"dock-button.js","sourceRoot":"","sources":["../../../../src/components/dock/dock-button/dock-button.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Event,\n EventEmitter,\n h,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { DockItem } from '../dock.types';\nimport { createRandomString } from '../../../util/random-string';\n\n/**\n * @private\n */\n@Component({\n tag: 'limel-dock-button',\n shadow: false,\n styleUrl: 'dock-button.scss',\n})\nexport class DockButton {\n /**\n * Item that is placed in the dock.\n */\n @Prop()\n public item!: DockItem;\n\n /**\n * When the dock is expanded or collapsed, dock items\n * show labels and tooltips as suitable for the layout.\n */\n @Prop({ reflect: true })\n public expanded? = false;\n\n /**\n * When dock is using mobile layout, dock items\n * show labels and tooltips as suitable for the layout.\n */\n @Prop({ reflect: true })\n public useMobileLayout? = false;\n\n /**\n * Fired when a dock item has been selected from the dock.\n */\n @Event()\n public itemSelected: EventEmitter<DockItem>;\n\n /**\n * Fired when a dock menu is opened.\n */\n @Event()\n public menuOpen: EventEmitter<DockItem>;\n\n /**\n * Indicated whether the popover that renders a component is open.\n */\n @State()\n private isOpen = false;\n\n /**\n * Fired when the popover is closed.\n */\n @Event()\n public close: EventEmitter<void>;\n\n private tooltipId: string;\n private customComponentElement: HTMLElement;\n\n constructor() {\n this.tooltipId = createRandomString();\n }\n\n public render() {\n if (this.item?.dockMenu?.componentName) {\n return this.renderPopover();\n }\n\n return this.renderButton(this.handleClick);\n }\n\n @Watch('isOpen')\n protected openWatcher() {\n if (!this.isOpen) {\n return;\n }\n\n const observer = new IntersectionObserver(\n this.focusCustomComponentElement,\n );\n observer.observe(this.customComponentElement);\n }\n\n private renderPopover() {\n const CustomComponent = this.item?.dockMenu.componentName;\n\n return (\n <limel-popover\n openDirection={this.useMobileLayout ? 'top' : 'right'}\n open={this.isOpen || this.item.dockMenu.menuOpen}\n onClose={this.onPopoverClose}\n >\n {this.renderButton(this.openPopover, 'trigger')}\n <CustomComponent\n ref={this.setCustomComponentElement}\n {...(this.item.dockMenu.props || {})}\n onClose={this.onPopoverClose}\n />\n </limel-popover>\n );\n }\n\n private renderButton(\n handleClick: (event: MouseEvent) => void,\n slot?: string,\n ) {\n return (\n <button\n slot={slot}\n tabindex=\"0\"\n id={this.tooltipId}\n type=\"button\"\n class={{\n button: true,\n selected: this.item?.selected,\n }}\n onClick={handleClick}\n aria-live=\"polite\"\n >\n {this.renderIcon()}\n {this.renderLabel()}\n {this.renderTooltip()}\n {this.renderNotification()}\n </button>\n );\n }\n\n private renderNotification = () => {\n if (this.item.badge !== undefined) {\n return <limel-badge label={this.item.badge} />;\n }\n };\n\n private openPopover = (event: MouseEvent) => {\n event.stopPropagation();\n this.isOpen = true;\n this.menuOpen.emit(this.item);\n };\n\n private setCustomComponentElement = (element: HTMLElement) => {\n this.customComponentElement = element;\n };\n\n private onPopoverClose = () => {\n this.isOpen = false;\n this.close.emit();\n };\n\n private handleClick = (event: MouseEvent) => {\n event.stopPropagation();\n this.itemSelected.emit(this.item);\n };\n\n private renderIcon() {\n if (!this.item.icon) {\n return;\n }\n\n return <limel-icon name={this.item.icon} class=\"icon\" />;\n }\n\n private renderLabel() {\n if (this.expanded) {\n return <span class=\"text\">{this.item.label}</span>;\n }\n }\n\n private renderTooltip() {\n if (!this.expanded && this.item.label) {\n return (\n <limel-tooltip\n elementId={this.tooltipId}\n label={this.item.label}\n helperLabel={this.item.helperLabel}\n openDirection={this.getOpenDirection()}\n />\n );\n }\n\n if (this.expanded && this.item.helperLabel) {\n return (\n <limel-tooltip\n elementId={this.tooltipId}\n label={this.item.helperLabel}\n openDirection={this.getOpenDirection()}\n />\n );\n }\n }\n\n private focusCustomComponentElement = () => {\n if (this.customComponentElement?.shadowRoot?.delegatesFocus) {\n this.customComponentElement?.focus();\n }\n };\n\n private getOpenDirection = () => {\n if (this.useMobileLayout) {\n return 'top';\n }\n\n return 'right';\n };\n}\n"]}
1
+ {"version":3,"file":"dock-button.js","sourceRoot":"","sources":["../../../../src/components/dock/dock-button/dock-button.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Event,\n EventEmitter,\n h,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { DockItem } from '../dock.types';\nimport { createRandomString } from '../../../util/random-string';\n\n/**\n * @private\n */\n@Component({\n tag: 'limel-dock-button',\n shadow: false,\n styleUrl: 'dock-button.scss',\n})\nexport class DockButton {\n /**\n * Item that is placed in the dock.\n */\n @Prop()\n public item!: DockItem;\n\n /**\n * When the dock is expanded or collapsed, dock items\n * show labels and tooltips as suitable for the layout.\n */\n @Prop({ reflect: true })\n public expanded? = false;\n\n /**\n * When dock is using mobile layout, dock items\n * show labels and tooltips as suitable for the layout.\n */\n @Prop({ reflect: true })\n public useMobileLayout? = false;\n\n /**\n * Fired when a dock item has been selected from the dock.\n */\n @Event()\n public itemSelected: EventEmitter<DockItem>;\n\n /**\n * Fired when a dock menu is opened.\n */\n @Event()\n public menuOpen: EventEmitter<DockItem>;\n\n /**\n * Indicated whether the popover that renders a component is open.\n */\n @State()\n private isOpen = false;\n\n /**\n * Fired when the popover is closed.\n */\n @Event()\n public close: EventEmitter<void>;\n\n private tooltipId: string;\n private customComponentElement: HTMLElement;\n\n constructor() {\n this.tooltipId = createRandomString();\n }\n\n public render() {\n if (this.item?.dockMenu?.componentName) {\n return this.renderPopover();\n }\n\n return this.renderButton(this.handleClick);\n }\n\n @Watch('isOpen')\n protected openWatcher() {\n if (!this.isOpen) {\n return;\n }\n\n const observer = new IntersectionObserver(\n this.focusCustomComponentElement,\n );\n observer.observe(this.customComponentElement);\n }\n\n private renderPopover() {\n const CustomComponent = this.item?.dockMenu.componentName;\n\n return (\n <limel-popover\n openDirection={this.useMobileLayout ? 'top' : 'right-start'}\n open={this.isOpen || this.item.dockMenu.menuOpen}\n onClose={this.onPopoverClose}\n >\n {this.renderButton(this.openPopover, 'trigger')}\n <CustomComponent\n ref={this.setCustomComponentElement}\n {...(this.item.dockMenu.props || {})}\n onClose={this.onPopoverClose}\n />\n </limel-popover>\n );\n }\n\n private renderButton(\n handleClick: (event: MouseEvent) => void,\n slot?: string,\n ) {\n return (\n <button\n slot={slot}\n tabindex=\"0\"\n id={this.tooltipId}\n type=\"button\"\n class={{\n button: true,\n selected: this.item?.selected,\n }}\n onClick={handleClick}\n aria-live=\"polite\"\n >\n {this.renderIcon()}\n {this.renderLabel()}\n {this.renderTooltip()}\n {this.renderNotification()}\n </button>\n );\n }\n\n private renderNotification = () => {\n if (this.item.badge !== undefined) {\n return <limel-badge label={this.item.badge} />;\n }\n };\n\n private openPopover = (event: MouseEvent) => {\n event.stopPropagation();\n this.isOpen = true;\n this.menuOpen.emit(this.item);\n };\n\n private setCustomComponentElement = (element: HTMLElement) => {\n this.customComponentElement = element;\n };\n\n private onPopoverClose = () => {\n this.isOpen = false;\n this.close.emit();\n };\n\n private handleClick = (event: MouseEvent) => {\n event.stopPropagation();\n this.itemSelected.emit(this.item);\n };\n\n private renderIcon() {\n if (!this.item.icon) {\n return;\n }\n\n return <limel-icon name={this.item.icon} class=\"icon\" />;\n }\n\n private renderLabel() {\n if (this.expanded) {\n return <span class=\"text\">{this.item.label}</span>;\n }\n }\n\n private renderTooltip() {\n if (!this.expanded && this.item.label) {\n return (\n <limel-tooltip\n elementId={this.tooltipId}\n label={this.item.label}\n helperLabel={this.item.helperLabel}\n openDirection={this.getOpenDirection()}\n />\n );\n }\n\n if (this.expanded && this.item.helperLabel) {\n return (\n <limel-tooltip\n elementId={this.tooltipId}\n label={this.item.helperLabel}\n openDirection={this.getOpenDirection()}\n />\n );\n }\n }\n\n private focusCustomComponentElement = () => {\n if (this.customComponentElement?.shadowRoot?.delegatesFocus) {\n this.customComponentElement?.focus();\n }\n };\n\n private getOpenDirection = () => {\n if (this.useMobileLayout) {\n return 'top';\n }\n\n return 'right';\n };\n}\n"]}
@@ -66,7 +66,14 @@
66
66
  }
67
67
 
68
68
  :host(limel-prosemirror-adapter) {
69
- display: block;
69
+ display: flex;
70
+ flex-direction: column;
71
+ }
72
+ :host(limel-prosemirror-adapter) limel-action-bar {
73
+ order: 1;
74
+ }
75
+ :host(limel-prosemirror-adapter) div#editor {
76
+ order: 2;
70
77
  }
71
78
 
72
79
  * {
@@ -83,8 +83,8 @@ export class ProsemirrorAdapter {
83
83
  }
84
84
  render() {
85
85
  return [
86
- h("limel-action-bar", { accessibleLabel: "Toolbar", actions: this.actionBarItems, onItemSelected: this.handleActionBarItem }),
87
86
  h("div", { id: "editor" }),
87
+ h("limel-action-bar", { accessibleLabel: "Toolbar", actions: this.actionBarItems, onItemSelected: this.handleActionBarItem }),
88
88
  ];
89
89
  }
90
90
  executeCommand(command) {
@@ -1 +1 @@
1
- {"version":3,"file":"prosemirror-adapter.js","sourceRoot":"","sources":["../../../../src/components/text-editor/prosemirror-adapter/prosemirror-adapter.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Element,\n Event,\n EventEmitter,\n Prop,\n State,\n h,\n} from '@stencil/core';\nimport { EditorState } from 'prosemirror-state';\nimport { EditorView } from 'prosemirror-view';\nimport { Schema, DOMParser } from 'prosemirror-model';\nimport { schema } from 'prosemirror-schema-basic';\nimport { addListNodes } from 'prosemirror-schema-list';\nimport { exampleSetup } from 'prosemirror-example-setup';\nimport { ActionBarItem } from 'src/components/action-bar/action-bar.types';\nimport { ListSeparator } from 'src/components/list/list-item.types';\nimport { MenuCommandFactory } from './menu/menu-commands';\nimport { textEditorMenuItems } from './menu/menu-items';\nimport { ContentTypeConverter } from '../utils/content-type-converter';\nimport { markdownConverter } from '../utils/markdown-converter';\nimport { HTMLConverter } from '../utils/html-converter';\n\n/**\n * The ProseMirror adapter offers a rich text editing experience with markdown support.\n * [Read more...](https://prosemirror.net/)\n *\n * @exampleComponent limel-example-prosemirror-adapter-basic\n * @exampleComponent limel-example-prosemirror-adapter-with-custom-menu\n * @beta\n * @private\n */\n@Component({\n tag: 'limel-prosemirror-adapter',\n shadow: true,\n styleUrl: 'prosemirror-adapter.scss',\n})\nexport class ProsemirrorAdapter {\n /**\n * The type of content that the editor should handle and emit, defaults to `markdown`\n *\n * Assumed to be set only once, so not reactive to changes\n */\n @Prop()\n public contentType: 'markdown' | 'html' = 'markdown';\n\n /**\n * The value of the editor, expected to be markdown\n */\n @Prop()\n public value: string;\n\n @Element()\n private host: HTMLLimelTextEditorElement;\n\n @State()\n private view: EditorView;\n\n @State()\n private actionBarItems: Array<ActionBarItem | ListSeparator> = [];\n\n private menuCommandFactory: MenuCommandFactory;\n\n /**\n * Dispatched when a change is made to the editor\n */\n @Event()\n private change: EventEmitter<string>;\n\n private contentConverter: ContentTypeConverter;\n\n public componentWillLoad() {\n if (this.contentType === 'markdown') {\n this.contentConverter = new markdownConverter();\n } else if (this.contentType === 'html') {\n this.contentConverter = new HTMLConverter();\n }\n }\n\n public componentDidLoad() {\n // Stencil complains loudly about triggering rerenders in\n // componentDidLoad, but we have to, so we're using setTimeout to\n // suppress the warning. /Ads\n setTimeout(this.initializeTextEditor, 0);\n }\n\n public render() {\n return [\n <limel-action-bar\n accessibleLabel=\"Toolbar\"\n actions={this.actionBarItems}\n onItemSelected={this.handleActionBarItem}\n />,\n <div id=\"editor\" />,\n ];\n }\n\n private initializeTextEditor = async () => {\n this.actionBarItems = textEditorMenuItems;\n\n const mySchema = new Schema({\n nodes: addListNodes(schema.spec.nodes, 'paragraph block*', 'block'),\n marks: schema.spec.marks,\n });\n\n // Parse initial content directly if 'value' is provided\n const initialContentElement = document.createElement('div');\n initialContentElement.innerHTML = '<p></p>';\n if (this.value) {\n initialContentElement.innerHTML =\n await this.contentConverter.parseAsHTML(this.value, schema);\n }\n\n const initialDoc = DOMParser.fromSchema(mySchema).parse(\n initialContentElement,\n );\n\n this.view = new EditorView(\n this.host.shadowRoot.querySelector('#editor'),\n {\n state: EditorState.create({\n doc: initialDoc,\n plugins: exampleSetup({\n schema: mySchema,\n menuBar: false,\n }),\n }),\n dispatchTransaction: (transaction) => {\n const newState = this.view.state.apply(transaction);\n this.view.updateState(newState);\n\n this.change.emit(\n this.contentConverter.serialize(this.view, schema),\n );\n },\n },\n );\n\n this.menuCommandFactory = new MenuCommandFactory(mySchema);\n };\n\n private handleActionBarItem = (event: CustomEvent<ActionBarItem>) => {\n event.preventDefault();\n\n const { text } = event.detail;\n const mark = text.replace(/\\s/g, '').toLowerCase();\n try {\n const command = this.menuCommandFactory.createCommand(mark);\n this.executeCommand(command);\n } catch (error) {\n throw new Error(`Error executing command: ${error}`);\n }\n };\n\n private executeCommand(command) {\n const { state } = this.view;\n const selection = state.selection;\n\n let transaction = state.tr;\n\n if (!selection.empty) {\n transaction.setSelection(selection);\n }\n\n command(state, (tr) => {\n transaction = tr;\n });\n this.view.dispatch(transaction);\n\n this.view.focus();\n }\n}\n"]}
1
+ {"version":3,"file":"prosemirror-adapter.js","sourceRoot":"","sources":["../../../../src/components/text-editor/prosemirror-adapter/prosemirror-adapter.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Element,\n Event,\n EventEmitter,\n Prop,\n State,\n h,\n} from '@stencil/core';\nimport { EditorState } from 'prosemirror-state';\nimport { EditorView } from 'prosemirror-view';\nimport { Schema, DOMParser } from 'prosemirror-model';\nimport { schema } from 'prosemirror-schema-basic';\nimport { addListNodes } from 'prosemirror-schema-list';\nimport { exampleSetup } from 'prosemirror-example-setup';\nimport { ActionBarItem } from 'src/components/action-bar/action-bar.types';\nimport { ListSeparator } from 'src/components/list/list-item.types';\nimport { MenuCommandFactory } from './menu/menu-commands';\nimport { textEditorMenuItems } from './menu/menu-items';\nimport { ContentTypeConverter } from '../utils/content-type-converter';\nimport { markdownConverter } from '../utils/markdown-converter';\nimport { HTMLConverter } from '../utils/html-converter';\n\n/**\n * The ProseMirror adapter offers a rich text editing experience with markdown support.\n * [Read more...](https://prosemirror.net/)\n *\n * @exampleComponent limel-example-prosemirror-adapter-basic\n * @exampleComponent limel-example-prosemirror-adapter-with-custom-menu\n * @beta\n * @private\n */\n@Component({\n tag: 'limel-prosemirror-adapter',\n shadow: true,\n styleUrl: 'prosemirror-adapter.scss',\n})\nexport class ProsemirrorAdapter {\n /**\n * The type of content that the editor should handle and emit, defaults to `markdown`\n *\n * Assumed to be set only once, so not reactive to changes\n */\n @Prop()\n public contentType: 'markdown' | 'html' = 'markdown';\n\n /**\n * The value of the editor, expected to be markdown\n */\n @Prop()\n public value: string;\n\n @Element()\n private host: HTMLLimelTextEditorElement;\n\n @State()\n private view: EditorView;\n\n @State()\n private actionBarItems: Array<ActionBarItem | ListSeparator> = [];\n\n private menuCommandFactory: MenuCommandFactory;\n\n /**\n * Dispatched when a change is made to the editor\n */\n @Event()\n private change: EventEmitter<string>;\n\n private contentConverter: ContentTypeConverter;\n\n public componentWillLoad() {\n if (this.contentType === 'markdown') {\n this.contentConverter = new markdownConverter();\n } else if (this.contentType === 'html') {\n this.contentConverter = new HTMLConverter();\n }\n }\n\n public componentDidLoad() {\n // Stencil complains loudly about triggering rerenders in\n // componentDidLoad, but we have to, so we're using setTimeout to\n // suppress the warning. /Ads\n setTimeout(this.initializeTextEditor, 0);\n }\n\n public render() {\n return [\n <div id=\"editor\" />,\n <limel-action-bar\n accessibleLabel=\"Toolbar\"\n actions={this.actionBarItems}\n onItemSelected={this.handleActionBarItem}\n />,\n ];\n }\n\n private initializeTextEditor = async () => {\n this.actionBarItems = textEditorMenuItems;\n\n const mySchema = new Schema({\n nodes: addListNodes(schema.spec.nodes, 'paragraph block*', 'block'),\n marks: schema.spec.marks,\n });\n\n // Parse initial content directly if 'value' is provided\n const initialContentElement = document.createElement('div');\n initialContentElement.innerHTML = '<p></p>';\n if (this.value) {\n initialContentElement.innerHTML =\n await this.contentConverter.parseAsHTML(this.value, schema);\n }\n\n const initialDoc = DOMParser.fromSchema(mySchema).parse(\n initialContentElement,\n );\n\n this.view = new EditorView(\n this.host.shadowRoot.querySelector('#editor'),\n {\n state: EditorState.create({\n doc: initialDoc,\n plugins: exampleSetup({\n schema: mySchema,\n menuBar: false,\n }),\n }),\n dispatchTransaction: (transaction) => {\n const newState = this.view.state.apply(transaction);\n this.view.updateState(newState);\n\n this.change.emit(\n this.contentConverter.serialize(this.view, schema),\n );\n },\n },\n );\n\n this.menuCommandFactory = new MenuCommandFactory(mySchema);\n };\n\n private handleActionBarItem = (event: CustomEvent<ActionBarItem>) => {\n event.preventDefault();\n\n const { text } = event.detail;\n const mark = text.replace(/\\s/g, '').toLowerCase();\n try {\n const command = this.menuCommandFactory.createCommand(mark);\n this.executeCommand(command);\n } catch (error) {\n throw new Error(`Error executing command: ${error}`);\n }\n };\n\n private executeCommand(command) {\n const { state } = this.view;\n const selection = state.selection;\n\n let transaction = state.tr;\n\n if (!selection.empty) {\n transaction.setSelection(selection);\n }\n\n command(state, (tr) => {\n transaction = tr;\n });\n this.view.dispatch(transaction);\n\n this.view.focus();\n }\n}\n"]}
@@ -1,7 +1,7 @@
1
1
  import { r as registerInstance, c as createEvent, h } from './index-6156b4fd.js';
2
2
  import { c as createRandomString } from './random-string-812b1c35.js';
3
3
 
4
- const dockButtonCss = "@charset \"UTF-8\";.button{all:unset;isolation:isolate;position:relative;transition:color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;cursor:pointer;color:var(--limel-dock-item-text-color);background-color:var(--dock-background-color);box-sizing:border-box;display:flex;align-items:center;width:100%;height:var(--dock-item-height);border-radius:0.375rem;font-size:0.875rem;padding:0 0.5rem;min-width:var(--dock-item-height)}.button:hover{color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}.button:active{background-color:var(--mdc-theme-surface);box-shadow:var(--button-shadow-inset-pressed);transform:translate3d(0, 0.05rem, 0)}.button:focus{outline:none}.button:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}.button:hover{z-index:1}.button.selected{color:var(--limel-dock-item-text-color--selected);background-color:var(--dock-item-background-color--selected, rgb(var(--contrast-200)));box-shadow:var(--button-shadow-inset)}.button.selected:focus-visible{box-shadow:var(--button-shadow-inset), var(--shadow-depth-8-focused)}.button.selected .icon{color:var(--limel-dock-item-text--selected)}limel-popover{display:grid;grid-template-columns:100%}.text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding-left:0.5rem;padding-right:0.75rem}.icon{flex-shrink:0;width:calc(var(--dock-item-height) - 1rem);height:calc(var(--dock-item-height) - 1rem);color:var(--dock-item-icon-color, var(--limel-dock-item-text-color))}limel-badge{position:absolute;top:-0.125rem;right:-0.125rem}.icon{position:relative}.icon:before{text-align:center;pointer-events:none;position:absolute;inset:0;background-color:var(--dock-background-color, rgb(var(--contrast-100)));background-position:center;background-repeat:no-repeat;background-size:contain;background-image:var(--limel-custom-home-icon);content:var(--limel-custom-home-icon-enabler)}.button.selected .icon:before{background-color:var(--dock-item-background-color--selected, rgb(var(--contrast-200)))}";
4
+ const dockButtonCss = "@charset \"UTF-8\";.button{all:unset;isolation:isolate;position:relative;transition:color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;cursor:pointer;color:var(--limel-dock-item-text-color);background-color:var(--dock-background-color);box-sizing:border-box;display:flex;align-items:center;width:100%;height:var(--dock-item-height);border-radius:0.375rem;font-size:0.875rem;padding:0 0.5rem;min-width:var(--dock-item-height)}.button:hover{color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}.button:active{background-color:var(--mdc-theme-surface);box-shadow:var(--button-shadow-inset-pressed);transform:translate3d(0, 0.05rem, 0)}.button:focus{outline:none}.button:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}.button:hover{z-index:1}.button.selected{color:var(--limel-dock-item-text-color--selected);background-color:var(--dock-item-background-color--selected, rgb(var(--contrast-200)));box-shadow:var(--button-shadow-inset)}.button.selected:focus-visible{box-shadow:var(--button-shadow-inset), var(--shadow-depth-8-focused)}.button.selected .icon{color:var(--limel-dock-item-text--selected)}limel-popover{display:grid;grid-template-columns:100%}limel-popover button[slot=trigger][aria-expanded=true]{box-shadow:var(--button-shadow-inset)}.text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding-left:0.5rem;padding-right:0.75rem}.icon{flex-shrink:0;width:calc(var(--dock-item-height) - 1rem);height:calc(var(--dock-item-height) - 1rem);color:var(--dock-item-icon-color, var(--limel-dock-item-text-color))}limel-badge{position:absolute;top:-0.125rem;right:-0.125rem}.icon{position:relative}.icon:before{text-align:center;pointer-events:none;position:absolute;inset:0;background-color:var(--dock-background-color, rgb(var(--contrast-100)));background-position:center;background-repeat:no-repeat;background-size:contain;background-image:var(--limel-custom-home-icon);content:var(--limel-custom-home-icon-enabler)}.button.selected .icon:before{background-color:var(--dock-item-background-color--selected, rgb(var(--contrast-200)))}";
5
5
 
6
6
  const DockButton = class {
7
7
  constructor(hostRef) {
@@ -65,7 +65,7 @@ const DockButton = class {
65
65
  renderPopover() {
66
66
  var _a;
67
67
  const CustomComponent = (_a = this.item) === null || _a === void 0 ? void 0 : _a.dockMenu.componentName;
68
- return (h("limel-popover", { openDirection: this.useMobileLayout ? 'top' : 'right', open: this.isOpen || this.item.dockMenu.menuOpen, onClose: this.onPopoverClose }, this.renderButton(this.openPopover, 'trigger'), h(CustomComponent, Object.assign({ ref: this.setCustomComponentElement }, (this.item.dockMenu.props || {}), { onClose: this.onPopoverClose }))));
68
+ return (h("limel-popover", { openDirection: this.useMobileLayout ? 'top' : 'right-start', open: this.isOpen || this.item.dockMenu.menuOpen, onClose: this.onPopoverClose }, this.renderButton(this.openPopover, 'trigger'), h(CustomComponent, Object.assign({ ref: this.setCustomComponentElement }, (this.item.dockMenu.props || {}), { onClose: this.onPopoverClose }))));
69
69
  }
70
70
  renderButton(handleClick, slot) {
71
71
  var _a;
@@ -1 +1 @@
1
- {"file":"limel-dock-button.entry.js","mappings":"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","names":[],"sources":["./src/components/dock/dock-button/dock-button.scss?tag=limel-dock-button","./src/components/dock/dock-button/dock-button.tsx"],"sourcesContent":["@use '../../../style/mixins';\n@use '../../../style/functions';\n@use '../../../style/internal/variables';\n\n.button {\n all: unset;\n isolation: isolate;\n position: relative;\n\n @include mixins.is-flat-inset-clickable(\n $color: var(--limel-dock-item-text-color),\n $background-color: var(--dock-background-color)\n );\n @include mixins.visualize-keyboard-focus;\n\n box-sizing: border-box;\n display: flex;\n align-items: center;\n\n width: 100%;\n height: var(--dock-item-height);\n\n border-radius: functions.pxToRem(6);\n font-size: functions.pxToRem(14);\n padding: 0 0.5rem;\n min-width: var(--dock-item-height);\n\n &:hover {\n z-index: 1;\n }\n\n &.selected {\n color: var(--limel-dock-item-text-color--selected);\n background-color: var(\n --dock-item-background-color--selected,\n rgb(var(--contrast-200))\n );\n\n box-shadow: var(--button-shadow-inset);\n\n &:focus-visible {\n box-shadow: var(--button-shadow-inset),\n var(--shadow-depth-8-focused);\n }\n\n .icon {\n color: var(--limel-dock-item-text--selected);\n }\n }\n}\n\nlimel-popover {\n // makes buttons that are wrapped in a popover become fullwidth\n display: grid;\n grid-template-columns: 100%;\n}\n\n.text {\n @include mixins.truncate-text();\n padding-left: 0.5rem;\n padding-right: 0.75rem;\n}\n\n.icon {\n flex-shrink: 0;\n width: calc(var(--dock-item-height) - 1rem);\n height: calc(var(--dock-item-height) - 1rem);\n color: var(--dock-item-icon-color, var(--limel-dock-item-text-color));\n}\n\nlimel-badge {\n position: absolute;\n top: -0.125rem;\n right: -0.125rem;\n}\n\n// 👇 Below is a hidden and private hack\n// only for usage in Lime CRM components.\n// It enables our customers to override\n// the default Home icon, using an external URL\n// or an SVG code.\n.icon {\n position: relative;\n\n &:before {\n text-align: center;\n pointer-events: none;\n position: absolute;\n inset: 0;\n background: {\n color: var(--dock-background-color, rgb(var(--contrast-100)));\n position: center;\n repeat: no-repeat;\n size: contain;\n image: var(--limel-custom-home-icon);\n }\n // Since `content` defaults to `undefined`\n // no pseudo element will be rendered, unless\n // the consumer defines something.\n content: var(--limel-custom-home-icon-enabler);\n\n .button.selected & {\n background-color: var(\n --dock-item-background-color--selected,\n rgb(var(--contrast-200))\n );\n }\n }\n}\n","import {\n Component,\n Event,\n EventEmitter,\n h,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { DockItem } from '../dock.types';\nimport { createRandomString } from '../../../util/random-string';\n\n/**\n * @private\n */\n@Component({\n tag: 'limel-dock-button',\n shadow: false,\n styleUrl: 'dock-button.scss',\n})\nexport class DockButton {\n /**\n * Item that is placed in the dock.\n */\n @Prop()\n public item!: DockItem;\n\n /**\n * When the dock is expanded or collapsed, dock items\n * show labels and tooltips as suitable for the layout.\n */\n @Prop({ reflect: true })\n public expanded? = false;\n\n /**\n * When dock is using mobile layout, dock items\n * show labels and tooltips as suitable for the layout.\n */\n @Prop({ reflect: true })\n public useMobileLayout? = false;\n\n /**\n * Fired when a dock item has been selected from the dock.\n */\n @Event()\n public itemSelected: EventEmitter<DockItem>;\n\n /**\n * Fired when a dock menu is opened.\n */\n @Event()\n public menuOpen: EventEmitter<DockItem>;\n\n /**\n * Indicated whether the popover that renders a component is open.\n */\n @State()\n private isOpen = false;\n\n /**\n * Fired when the popover is closed.\n */\n @Event()\n public close: EventEmitter<void>;\n\n private tooltipId: string;\n private customComponentElement: HTMLElement;\n\n constructor() {\n this.tooltipId = createRandomString();\n }\n\n public render() {\n if (this.item?.dockMenu?.componentName) {\n return this.renderPopover();\n }\n\n return this.renderButton(this.handleClick);\n }\n\n @Watch('isOpen')\n protected openWatcher() {\n if (!this.isOpen) {\n return;\n }\n\n const observer = new IntersectionObserver(\n this.focusCustomComponentElement,\n );\n observer.observe(this.customComponentElement);\n }\n\n private renderPopover() {\n const CustomComponent = this.item?.dockMenu.componentName;\n\n return (\n <limel-popover\n openDirection={this.useMobileLayout ? 'top' : 'right'}\n open={this.isOpen || this.item.dockMenu.menuOpen}\n onClose={this.onPopoverClose}\n >\n {this.renderButton(this.openPopover, 'trigger')}\n <CustomComponent\n ref={this.setCustomComponentElement}\n {...(this.item.dockMenu.props || {})}\n onClose={this.onPopoverClose}\n />\n </limel-popover>\n );\n }\n\n private renderButton(\n handleClick: (event: MouseEvent) => void,\n slot?: string,\n ) {\n return (\n <button\n slot={slot}\n tabindex=\"0\"\n id={this.tooltipId}\n type=\"button\"\n class={{\n button: true,\n selected: this.item?.selected,\n }}\n onClick={handleClick}\n aria-live=\"polite\"\n >\n {this.renderIcon()}\n {this.renderLabel()}\n {this.renderTooltip()}\n {this.renderNotification()}\n </button>\n );\n }\n\n private renderNotification = () => {\n if (this.item.badge !== undefined) {\n return <limel-badge label={this.item.badge} />;\n }\n };\n\n private openPopover = (event: MouseEvent) => {\n event.stopPropagation();\n this.isOpen = true;\n this.menuOpen.emit(this.item);\n };\n\n private setCustomComponentElement = (element: HTMLElement) => {\n this.customComponentElement = element;\n };\n\n private onPopoverClose = () => {\n this.isOpen = false;\n this.close.emit();\n };\n\n private handleClick = (event: MouseEvent) => {\n event.stopPropagation();\n this.itemSelected.emit(this.item);\n };\n\n private renderIcon() {\n if (!this.item.icon) {\n return;\n }\n\n return <limel-icon name={this.item.icon} class=\"icon\" />;\n }\n\n private renderLabel() {\n if (this.expanded) {\n return <span class=\"text\">{this.item.label}</span>;\n }\n }\n\n private renderTooltip() {\n if (!this.expanded && this.item.label) {\n return (\n <limel-tooltip\n elementId={this.tooltipId}\n label={this.item.label}\n helperLabel={this.item.helperLabel}\n openDirection={this.getOpenDirection()}\n />\n );\n }\n\n if (this.expanded && this.item.helperLabel) {\n return (\n <limel-tooltip\n elementId={this.tooltipId}\n label={this.item.helperLabel}\n openDirection={this.getOpenDirection()}\n />\n );\n }\n }\n\n private focusCustomComponentElement = () => {\n if (this.customComponentElement?.shadowRoot?.delegatesFocus) {\n this.customComponentElement?.focus();\n }\n };\n\n private getOpenDirection = () => {\n if (this.useMobileLayout) {\n return 'top';\n }\n\n return 'right';\n };\n}\n"],"version":3}
1
+ {"file":"limel-dock-button.entry.js","mappings":"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","names":[],"sources":["./src/components/dock/dock-button/dock-button.scss?tag=limel-dock-button","./src/components/dock/dock-button/dock-button.tsx"],"sourcesContent":["@use '../../../style/mixins';\n@use '../../../style/functions';\n@use '../../../style/internal/variables';\n\n.button {\n all: unset;\n isolation: isolate;\n position: relative;\n\n @include mixins.is-flat-inset-clickable(\n $color: var(--limel-dock-item-text-color),\n $background-color: var(--dock-background-color)\n );\n @include mixins.visualize-keyboard-focus;\n\n box-sizing: border-box;\n display: flex;\n align-items: center;\n\n width: 100%;\n height: var(--dock-item-height);\n\n border-radius: functions.pxToRem(6);\n font-size: functions.pxToRem(14);\n padding: 0 0.5rem;\n min-width: var(--dock-item-height);\n\n &:hover {\n z-index: 1;\n }\n\n &.selected {\n color: var(--limel-dock-item-text-color--selected);\n background-color: var(\n --dock-item-background-color--selected,\n rgb(var(--contrast-200))\n );\n\n box-shadow: var(--button-shadow-inset);\n\n &:focus-visible {\n box-shadow: var(--button-shadow-inset),\n var(--shadow-depth-8-focused);\n }\n\n .icon {\n color: var(--limel-dock-item-text--selected);\n }\n }\n}\n\nlimel-popover {\n // makes buttons that are wrapped in a popover become fullwidth\n display: grid;\n grid-template-columns: 100%;\n\n button[slot='trigger'][aria-expanded='true'] {\n box-shadow: var(--button-shadow-inset);\n }\n}\n\n.text {\n @include mixins.truncate-text();\n padding-left: 0.5rem;\n padding-right: 0.75rem;\n}\n\n.icon {\n flex-shrink: 0;\n width: calc(var(--dock-item-height) - 1rem);\n height: calc(var(--dock-item-height) - 1rem);\n color: var(--dock-item-icon-color, var(--limel-dock-item-text-color));\n}\n\nlimel-badge {\n position: absolute;\n top: -0.125rem;\n right: -0.125rem;\n}\n\n// 👇 Below is a hidden and private hack\n// only for usage in Lime CRM components.\n// It enables our customers to override\n// the default Home icon, using an external URL\n// or an SVG code.\n.icon {\n position: relative;\n\n &:before {\n text-align: center;\n pointer-events: none;\n position: absolute;\n inset: 0;\n background: {\n color: var(--dock-background-color, rgb(var(--contrast-100)));\n position: center;\n repeat: no-repeat;\n size: contain;\n image: var(--limel-custom-home-icon);\n }\n // Since `content` defaults to `undefined`\n // no pseudo element will be rendered, unless\n // the consumer defines something.\n content: var(--limel-custom-home-icon-enabler);\n\n .button.selected & {\n background-color: var(\n --dock-item-background-color--selected,\n rgb(var(--contrast-200))\n );\n }\n }\n}\n","import {\n Component,\n Event,\n EventEmitter,\n h,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { DockItem } from '../dock.types';\nimport { createRandomString } from '../../../util/random-string';\n\n/**\n * @private\n */\n@Component({\n tag: 'limel-dock-button',\n shadow: false,\n styleUrl: 'dock-button.scss',\n})\nexport class DockButton {\n /**\n * Item that is placed in the dock.\n */\n @Prop()\n public item!: DockItem;\n\n /**\n * When the dock is expanded or collapsed, dock items\n * show labels and tooltips as suitable for the layout.\n */\n @Prop({ reflect: true })\n public expanded? = false;\n\n /**\n * When dock is using mobile layout, dock items\n * show labels and tooltips as suitable for the layout.\n */\n @Prop({ reflect: true })\n public useMobileLayout? = false;\n\n /**\n * Fired when a dock item has been selected from the dock.\n */\n @Event()\n public itemSelected: EventEmitter<DockItem>;\n\n /**\n * Fired when a dock menu is opened.\n */\n @Event()\n public menuOpen: EventEmitter<DockItem>;\n\n /**\n * Indicated whether the popover that renders a component is open.\n */\n @State()\n private isOpen = false;\n\n /**\n * Fired when the popover is closed.\n */\n @Event()\n public close: EventEmitter<void>;\n\n private tooltipId: string;\n private customComponentElement: HTMLElement;\n\n constructor() {\n this.tooltipId = createRandomString();\n }\n\n public render() {\n if (this.item?.dockMenu?.componentName) {\n return this.renderPopover();\n }\n\n return this.renderButton(this.handleClick);\n }\n\n @Watch('isOpen')\n protected openWatcher() {\n if (!this.isOpen) {\n return;\n }\n\n const observer = new IntersectionObserver(\n this.focusCustomComponentElement,\n );\n observer.observe(this.customComponentElement);\n }\n\n private renderPopover() {\n const CustomComponent = this.item?.dockMenu.componentName;\n\n return (\n <limel-popover\n openDirection={this.useMobileLayout ? 'top' : 'right-start'}\n open={this.isOpen || this.item.dockMenu.menuOpen}\n onClose={this.onPopoverClose}\n >\n {this.renderButton(this.openPopover, 'trigger')}\n <CustomComponent\n ref={this.setCustomComponentElement}\n {...(this.item.dockMenu.props || {})}\n onClose={this.onPopoverClose}\n />\n </limel-popover>\n );\n }\n\n private renderButton(\n handleClick: (event: MouseEvent) => void,\n slot?: string,\n ) {\n return (\n <button\n slot={slot}\n tabindex=\"0\"\n id={this.tooltipId}\n type=\"button\"\n class={{\n button: true,\n selected: this.item?.selected,\n }}\n onClick={handleClick}\n aria-live=\"polite\"\n >\n {this.renderIcon()}\n {this.renderLabel()}\n {this.renderTooltip()}\n {this.renderNotification()}\n </button>\n );\n }\n\n private renderNotification = () => {\n if (this.item.badge !== undefined) {\n return <limel-badge label={this.item.badge} />;\n }\n };\n\n private openPopover = (event: MouseEvent) => {\n event.stopPropagation();\n this.isOpen = true;\n this.menuOpen.emit(this.item);\n };\n\n private setCustomComponentElement = (element: HTMLElement) => {\n this.customComponentElement = element;\n };\n\n private onPopoverClose = () => {\n this.isOpen = false;\n this.close.emit();\n };\n\n private handleClick = (event: MouseEvent) => {\n event.stopPropagation();\n this.itemSelected.emit(this.item);\n };\n\n private renderIcon() {\n if (!this.item.icon) {\n return;\n }\n\n return <limel-icon name={this.item.icon} class=\"icon\" />;\n }\n\n private renderLabel() {\n if (this.expanded) {\n return <span class=\"text\">{this.item.label}</span>;\n }\n }\n\n private renderTooltip() {\n if (!this.expanded && this.item.label) {\n return (\n <limel-tooltip\n elementId={this.tooltipId}\n label={this.item.label}\n helperLabel={this.item.helperLabel}\n openDirection={this.getOpenDirection()}\n />\n );\n }\n\n if (this.expanded && this.item.helperLabel) {\n return (\n <limel-tooltip\n elementId={this.tooltipId}\n label={this.item.helperLabel}\n openDirection={this.getOpenDirection()}\n />\n );\n }\n }\n\n private focusCustomComponentElement = () => {\n if (this.customComponentElement?.shadowRoot?.delegatesFocus) {\n this.customComponentElement?.focus();\n }\n };\n\n private getOpenDirection = () => {\n if (this.useMobileLayout) {\n return 'top';\n }\n\n return 'right';\n };\n}\n"],"version":3}
@@ -24708,7 +24708,7 @@ class HTMLConverter {
24708
24708
  }
24709
24709
  }
24710
24710
 
24711
- const prosemirrorAdapterCss = "@charset \"UTF-8\";:host{--mdc-theme-primary:var(\n --lime-primary-color,\n rgb(var(--color-teal-default))\n );--mdc-theme-secondary:var(\n --lime-secondary-color,\n rgb(var(--contrast-1100))\n );--mdc-theme-on-primary:var(\n --lime-on-primary-color,\n rgb(var(--contrast-100))\n );--mdc-theme-on-secondary:var(\n --lime-on-secondary-color,\n rgb(var(--contrast-100))\n );--mdc-theme-text-disabled-on-background:var(\n --lime-text-disabled-on-background-color,\n rgba(var(--contrast-1700), 0.38)\n );--mdc-theme-text-primary-on-background:var(\n --lime-text-primary-on-background-color,\n rgba(var(--contrast-1700), 0.87)\n );--mdc-theme-text-secondary-on-background:var(\n --lime-text-secondary-on-background-color,\n rgba(var(--contrast-1700), 0.54)\n );--mdc-theme-error:var(\n --lime-error-background-color,\n rgb(var(--color-red-dark))\n );--lime-error-text-color:rgb(var(--color-red-darker));--mdc-theme-surface:var(\n --lime-surface-background-color,\n rgb(var(--contrast-100))\n );--mdc-theme-on-surface:var(\n --lime-on-surface-color,\n rgb(var(--contrast-1500))\n )}:host(limel-prosemirror-adapter){display:block}*{box-sizing:border-box}.ProseMirror-menubar-wrapper{display:grid;grid-template-rows:auto 1fr}.ProseMirror-textblock-dropdown{min-width:3em}.ProseMirror-tooltip .ProseMirror-menu{width:-webkit-fit-content;width:fit-content;white-space:pre}limel-action-bar{--action-bar-border-radius:0.25rem;position:sticky;z-index:1;top:1px;background-color:rgba(var(--contrast-200), 0.5);backdrop-filter:blur(0.5rem);-webkit-backdrop-filter:blur(0.5rem);opacity:0.6;transition:opacity 0.5s ease;margin:0 1px;width:calc(100% - 2px)}:host(limel-prosemirror-adapter:focus-within) limel-action-bar,:host(limel-prosemirror-adapter:hover) limel-action-bar{opacity:1}.ProseMirror{position:relative;word-wrap:break-word;white-space:pre-wrap;white-space:break-spaces;-webkit-font-variant-ligatures:none;font-variant-ligatures:none;font-feature-settings:\"liga\" 0;padding:var(--limel-text-editor-padding)}.ProseMirror [draggable][contenteditable=false]{user-select:text}.ProseMirror:focus-visible{outline:none}.ProseMirror-hideselection{caret-color:transparent}.ProseMirror-hideselection *::selection{background:transparent}.ProseMirror-hideselection *::-moz-selection{background:transparent}.ProseMirror-selectednode{outline:0.125rem solid rgb(var(--color-sky-light))}li.ProseMirror-selectednode{outline:none}li.ProseMirror-selectednode:after{content:\"\";position:absolute;left:-2rem;right:-0.125rem;top:-0.125rem;bottom:-0.125rem;border:0.125rem solid rgb(var(--color-sky-light));pointer-events:none}img.ProseMirror-separator{display:inline !important;border:none !important;margin:0 !important}blockquote{position:relative;font-weight:100;font-size:0.875rem;max-width:100%;line-height:1.4;margin:0;padding:0.5rem 1.25rem;border-radius:0.05rem 0.75rem;background-color:rgb(var(--contrast-300))}blockquote:before,blockquote:after{position:absolute;font-size:2.75rem;opacity:0.4}blockquote:before{content:\"“\";left:0;top:-0.75rem}blockquote:after{content:\"”\";right:0;bottom:-2rem}:host(limel-markdown.truncate-paragraphs) p{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}p,li{font-size:0.875rem;word-break:break-word;hyphens:auto;-webkit-hyphens:auto}a{word-break:break-all}p{margin-top:0;margin-bottom:0.5rem}p:only-child{margin-bottom:0}a{transition:color 0.2s ease;color:var(--markdown-hyperlink-color, rgb(var(--color-blue-dark)));text-decoration:none}a:hover{color:var(--markdown-hyperlink-color--hovered, rgb(var(--color-blue-default)))}hr{margin:1.75rem 0 2rem 0;border-width:0;border-top:1px solid rgb(var(--contrast-500))}dl{display:grid;grid-template-columns:1fr 2fr;grid-template-rows:1fr;margin-bottom:2rem;border:1px solid rgb(var(--contrast-400));border-radius:0.375rem;background-color:rgb(var(--contrast-200))}dl dt,dl dd{padding:0.375rem 0.5rem;font-size:0.875rem;margin:0}dl dt:nth-of-type(even),dl dd:nth-of-type(even){background-color:rgb(var(--contrast-300))}dl dt:first-child{border-top-left-radius:0.375rem}dl dt:last-child{border-bottom-left-radius:0.375rem}dl dd:first-child{border-top-right-radius:0.375rem}dl dd:last-child{border-bottom-right-radius:0.375rem}h1{font-size:1.5rem}h2{font-size:1.25rem}h3{font-size:1.125rem}h4{font-size:1rem}h5{font-size:0.875rem}h6{font-size:0.75rem}h1,h2{margin-top:0.5rem;margin-bottom:0.5rem;letter-spacing:-0.03125rem;font-weight:500}h3,h4{margin-top:0.75rem;margin-bottom:0.25rem;font-weight:600}h5,h6{margin-top:0.5rem;margin-bottom:0.125rem;font-weight:600}h1,h2,h3,h4,h5,h6{word-break:break-word;hyphens:auto;-webkit-hyphens:auto}:not([contenteditable=true]) h1,:not([contenteditable=true]) h2,:not([contenteditable=true]) h3,:not([contenteditable=true]) h4,:not([contenteditable=true]) h5,:not([contenteditable=true]) h6{text-wrap:balance}[contenteditable=true] h1,[contenteditable=true] h2,[contenteditable=true] h3,[contenteditable=true] h4,[contenteditable=true] h5,[contenteditable=true] h6{text-wrap:initial}ul{list-style:none}ul li{position:relative;margin-left:0.75rem}ul li:before{content:\"\";position:absolute;left:-0.5rem;top:0.5rem;width:0.25rem;height:0.25rem;border-radius:50%;background-color:rgb(var(--contrast-700));display:block}ol{margin-top:0.25rem;padding-left:1rem}ul{margin-top:0.25rem;padding-left:0}ul ul,ul ol,ol ol,ol ul{margin-left:0}li{margin-bottom:0.25rem}code{font-family:ui-monospace, \"Cascadia Code\", \"Source Code Pro\", Menlo, Consolas, \"DejaVu Sans Mono\", monospace;font-size:0.8125rem;letter-spacing:-0.0125rem;color:rgb(var(--contrast-1300));-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none;display:inline-block;border-radius:0.25rem;padding:0.03125rem 0.25rem;background-color:rgb(var(--contrast-600))}pre>code{display:block;margin:0.5rem 0;padding:0.5rem 0.75rem;overflow:auto;white-space:pre-wrap}:host(limel-markdown:not(.no-table-styles)) table{table-layout:auto;min-width:100%;border-collapse:collapse;border-spacing:0;background:transparent;margin:0.75rem 0;border:1px solid rgb(var(--contrast-400))}:host(limel-markdown:not(.no-table-styles)) th,:host(limel-markdown:not(.no-table-styles)) td{text-align:left;vertical-align:top;transition:background-color 0.2s ease;font-size:0.875rem}:host(limel-markdown:not(.no-table-styles)) td{padding:0.5rem 0.375rem 0.75rem 0.375rem}:host(limel-markdown:not(.no-table-styles)) tr th{background-color:rgb(var(--contrast-400));padding:0.25rem 0.375rem;font-weight:normal}:host(limel-markdown:not(.no-table-styles)) tr th:only-child{text-align:center}:host(limel-markdown:not(.no-table-styles)) tbody tr:nth-child(odd) td{background-color:rgb(var(--contrast-200))}:host(limel-markdown:not(.no-table-styles)) tbody tr:hover td{background-color:rgb(var(--contrast-300))}";
24711
+ const prosemirrorAdapterCss = "@charset \"UTF-8\";:host{--mdc-theme-primary:var(\n --lime-primary-color,\n rgb(var(--color-teal-default))\n );--mdc-theme-secondary:var(\n --lime-secondary-color,\n rgb(var(--contrast-1100))\n );--mdc-theme-on-primary:var(\n --lime-on-primary-color,\n rgb(var(--contrast-100))\n );--mdc-theme-on-secondary:var(\n --lime-on-secondary-color,\n rgb(var(--contrast-100))\n );--mdc-theme-text-disabled-on-background:var(\n --lime-text-disabled-on-background-color,\n rgba(var(--contrast-1700), 0.38)\n );--mdc-theme-text-primary-on-background:var(\n --lime-text-primary-on-background-color,\n rgba(var(--contrast-1700), 0.87)\n );--mdc-theme-text-secondary-on-background:var(\n --lime-text-secondary-on-background-color,\n rgba(var(--contrast-1700), 0.54)\n );--mdc-theme-error:var(\n --lime-error-background-color,\n rgb(var(--color-red-dark))\n );--lime-error-text-color:rgb(var(--color-red-darker));--mdc-theme-surface:var(\n --lime-surface-background-color,\n rgb(var(--contrast-100))\n );--mdc-theme-on-surface:var(\n --lime-on-surface-color,\n rgb(var(--contrast-1500))\n )}:host(limel-prosemirror-adapter){display:flex;flex-direction:column}:host(limel-prosemirror-adapter) limel-action-bar{order:1}:host(limel-prosemirror-adapter) div#editor{order:2}*{box-sizing:border-box}.ProseMirror-menubar-wrapper{display:grid;grid-template-rows:auto 1fr}.ProseMirror-textblock-dropdown{min-width:3em}.ProseMirror-tooltip .ProseMirror-menu{width:-webkit-fit-content;width:fit-content;white-space:pre}limel-action-bar{--action-bar-border-radius:0.25rem;position:sticky;z-index:1;top:1px;background-color:rgba(var(--contrast-200), 0.5);backdrop-filter:blur(0.5rem);-webkit-backdrop-filter:blur(0.5rem);opacity:0.6;transition:opacity 0.5s ease;margin:0 1px;width:calc(100% - 2px)}:host(limel-prosemirror-adapter:focus-within) limel-action-bar,:host(limel-prosemirror-adapter:hover) limel-action-bar{opacity:1}.ProseMirror{position:relative;word-wrap:break-word;white-space:pre-wrap;white-space:break-spaces;-webkit-font-variant-ligatures:none;font-variant-ligatures:none;font-feature-settings:\"liga\" 0;padding:var(--limel-text-editor-padding)}.ProseMirror [draggable][contenteditable=false]{user-select:text}.ProseMirror:focus-visible{outline:none}.ProseMirror-hideselection{caret-color:transparent}.ProseMirror-hideselection *::selection{background:transparent}.ProseMirror-hideselection *::-moz-selection{background:transparent}.ProseMirror-selectednode{outline:0.125rem solid rgb(var(--color-sky-light))}li.ProseMirror-selectednode{outline:none}li.ProseMirror-selectednode:after{content:\"\";position:absolute;left:-2rem;right:-0.125rem;top:-0.125rem;bottom:-0.125rem;border:0.125rem solid rgb(var(--color-sky-light));pointer-events:none}img.ProseMirror-separator{display:inline !important;border:none !important;margin:0 !important}blockquote{position:relative;font-weight:100;font-size:0.875rem;max-width:100%;line-height:1.4;margin:0;padding:0.5rem 1.25rem;border-radius:0.05rem 0.75rem;background-color:rgb(var(--contrast-300))}blockquote:before,blockquote:after{position:absolute;font-size:2.75rem;opacity:0.4}blockquote:before{content:\"“\";left:0;top:-0.75rem}blockquote:after{content:\"”\";right:0;bottom:-2rem}:host(limel-markdown.truncate-paragraphs) p{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}p,li{font-size:0.875rem;word-break:break-word;hyphens:auto;-webkit-hyphens:auto}a{word-break:break-all}p{margin-top:0;margin-bottom:0.5rem}p:only-child{margin-bottom:0}a{transition:color 0.2s ease;color:var(--markdown-hyperlink-color, rgb(var(--color-blue-dark)));text-decoration:none}a:hover{color:var(--markdown-hyperlink-color--hovered, rgb(var(--color-blue-default)))}hr{margin:1.75rem 0 2rem 0;border-width:0;border-top:1px solid rgb(var(--contrast-500))}dl{display:grid;grid-template-columns:1fr 2fr;grid-template-rows:1fr;margin-bottom:2rem;border:1px solid rgb(var(--contrast-400));border-radius:0.375rem;background-color:rgb(var(--contrast-200))}dl dt,dl dd{padding:0.375rem 0.5rem;font-size:0.875rem;margin:0}dl dt:nth-of-type(even),dl dd:nth-of-type(even){background-color:rgb(var(--contrast-300))}dl dt:first-child{border-top-left-radius:0.375rem}dl dt:last-child{border-bottom-left-radius:0.375rem}dl dd:first-child{border-top-right-radius:0.375rem}dl dd:last-child{border-bottom-right-radius:0.375rem}h1{font-size:1.5rem}h2{font-size:1.25rem}h3{font-size:1.125rem}h4{font-size:1rem}h5{font-size:0.875rem}h6{font-size:0.75rem}h1,h2{margin-top:0.5rem;margin-bottom:0.5rem;letter-spacing:-0.03125rem;font-weight:500}h3,h4{margin-top:0.75rem;margin-bottom:0.25rem;font-weight:600}h5,h6{margin-top:0.5rem;margin-bottom:0.125rem;font-weight:600}h1,h2,h3,h4,h5,h6{word-break:break-word;hyphens:auto;-webkit-hyphens:auto}:not([contenteditable=true]) h1,:not([contenteditable=true]) h2,:not([contenteditable=true]) h3,:not([contenteditable=true]) h4,:not([contenteditable=true]) h5,:not([contenteditable=true]) h6{text-wrap:balance}[contenteditable=true] h1,[contenteditable=true] h2,[contenteditable=true] h3,[contenteditable=true] h4,[contenteditable=true] h5,[contenteditable=true] h6{text-wrap:initial}ul{list-style:none}ul li{position:relative;margin-left:0.75rem}ul li:before{content:\"\";position:absolute;left:-0.5rem;top:0.5rem;width:0.25rem;height:0.25rem;border-radius:50%;background-color:rgb(var(--contrast-700));display:block}ol{margin-top:0.25rem;padding-left:1rem}ul{margin-top:0.25rem;padding-left:0}ul ul,ul ol,ol ol,ol ul{margin-left:0}li{margin-bottom:0.25rem}code{font-family:ui-monospace, \"Cascadia Code\", \"Source Code Pro\", Menlo, Consolas, \"DejaVu Sans Mono\", monospace;font-size:0.8125rem;letter-spacing:-0.0125rem;color:rgb(var(--contrast-1300));-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none;display:inline-block;border-radius:0.25rem;padding:0.03125rem 0.25rem;background-color:rgb(var(--contrast-600))}pre>code{display:block;margin:0.5rem 0;padding:0.5rem 0.75rem;overflow:auto;white-space:pre-wrap}:host(limel-markdown:not(.no-table-styles)) table{table-layout:auto;min-width:100%;border-collapse:collapse;border-spacing:0;background:transparent;margin:0.75rem 0;border:1px solid rgb(var(--contrast-400))}:host(limel-markdown:not(.no-table-styles)) th,:host(limel-markdown:not(.no-table-styles)) td{text-align:left;vertical-align:top;transition:background-color 0.2s ease;font-size:0.875rem}:host(limel-markdown:not(.no-table-styles)) td{padding:0.5rem 0.375rem 0.75rem 0.375rem}:host(limel-markdown:not(.no-table-styles)) tr th{background-color:rgb(var(--contrast-400));padding:0.25rem 0.375rem;font-weight:normal}:host(limel-markdown:not(.no-table-styles)) tr th:only-child{text-align:center}:host(limel-markdown:not(.no-table-styles)) tbody tr:nth-child(odd) td{background-color:rgb(var(--contrast-200))}:host(limel-markdown:not(.no-table-styles)) tbody tr:hover td{background-color:rgb(var(--contrast-300))}";
24712
24712
 
24713
24713
  const ProsemirrorAdapter = class {
24714
24714
  constructor(hostRef) {
@@ -24777,8 +24777,8 @@ const ProsemirrorAdapter = class {
24777
24777
  }
24778
24778
  render() {
24779
24779
  return [
24780
- h("limel-action-bar", { accessibleLabel: "Toolbar", actions: this.actionBarItems, onItemSelected: this.handleActionBarItem }),
24781
24780
  h("div", { id: "editor" }),
24781
+ h("limel-action-bar", { accessibleLabel: "Toolbar", actions: this.actionBarItems, onItemSelected: this.handleActionBarItem }),
24782
24782
  ];
24783
24783
  }
24784
24784
  executeCommand(command) {