@operato/help 0.3.22

package/.editorconfig

@@ -0,0 +1,29 @@
+# EditorConfig helps developers define and maintain consistent
+# coding styles between different editors and IDEs
+# editorconfig.org
+
+root = true
+
+
+[*]
+
+# Change these settings to your own preference
+indent_style = space
+indent_size = 2
+
+# We recommend you to keep these unchanged
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false
+
+[*.json]
+indent_size = 2
+
+[*.{html,js,md}]
+block_comment_start = /**
+block_comment = *
+block_comment_end = */

package/.storybook/main.js

@@ -0,0 +1,3 @@
+module.exports = {
+  stories: ['../dist/stories/**/*.stories.{js,md,mdx}'],
+};

package/.storybook/server.mjs

@@ -0,0 +1,8 @@
+import { storybookPlugin } from '@web/dev-server-storybook';
+import baseConfig from '../web-dev-server.config.mjs';
+
+export default /** @type {import('@web/dev-server').DevServerConfig} */ ({
+  ...baseConfig,
+  open: '/',
+  plugins: [storybookPlugin({ type: 'web-components' }), ...baseConfig.plugins],
+});

package/CHANGELOG.md

@@ -0,0 +1,260 @@
+# Change Log
+
+All notable changes to this project will be documented in this file.
+See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+### [0.3.22](https://github.com/hatiolab/operato/compare/v0.3.21...v0.3.22) (2022-01-30)
+
+
+### :rocket: New Features
+
+* started help and layout module ([08f875c](https://github.com/hatiolab/operato/commit/08f875cd30aa914901c249c8c0b462ce4a151c23))
+
+
+
+### [0.3.21](https://github.com/hatiolab/operato/compare/v0.3.20...v0.3.21) (2022-01-29)
+
+
+### :rocket: New Features
+
+* i18n module added, shell module started to cover client core part ([a976dad](https://github.com/hatiolab/operato/commit/a976dad6353962e489d8e648af9598b6a51e5ec7))
+
+
+
+### [0.3.20](https://github.com/hatiolab/operato/compare/v0.3.19...v0.3.20) (2022-01-28)
+
+**Note:** Version bump only for package @operato/layout
+
+
+
+
+
+### [0.3.19](https://github.com/hatiolab/operato/compare/v0.3.18...v0.3.19) (2022-01-25)
+
+**Note:** Version bump only for package @operato/layout
+
+
+
+
+
+### [0.3.18](https://github.com/hatiolab/operato/compare/v0.3.17...v0.3.18) (2022-01-23)
+
+**Note:** Version bump only for package @operato/layout
+
+
+
+
+
+### [0.3.17](https://github.com/hatiolab/operato/compare/v0.3.16...v0.3.17) (2022-01-20)
+
+**Note:** Version bump only for package @operato/layout
+
+
+
+
+
+### [0.3.16](https://github.com/hatiolab/operato/compare/v0.3.15...v0.3.16) (2022-01-19)
+
+**Note:** Version bump only for package @operato/layout
+
+
+
+
+
+### [0.3.15](https://github.com/hatiolab/operato/compare/v0.3.14...v0.3.15) (2022-01-17)
+
+**Note:** Version bump only for package @operato/layout
+
+
+
+
+
+### [0.3.14](https://github.com/hatiolab/operato/compare/v0.3.13...v0.3.14) (2022-01-16)
+
+**Note:** Version bump only for package @operato/layout
+
+
+
+
+
+### [0.3.13](https://github.com/hatiolab/operato/compare/v0.3.12...v0.3.13) (2022-01-15)
+
+**Note:** Version bump only for package @operato/layout
+
+
+
+
+
+### [0.3.12](https://github.com/hatiolab/operato/compare/v0.3.11...v0.3.12) (2022-01-15)
+
+**Note:** Version bump only for package @operato/layout
+
+
+
+
+
+### [0.3.11](https://github.com/hatiolab/operato/compare/v0.3.10...v0.3.11) (2022-01-15)
+
+**Note:** Version bump only for package @operato/layout
+
+
+
+
+
+### [0.3.10](https://github.com/hatiolab/operato/compare/v0.3.9...v0.3.10) (2022-01-15)
+
+
+### :bug: Bug Fix
+
+* data-grist record-view ([aa71ec5](https://github.com/hatiolab/operato/commit/aa71ec5600f4dbccd05fcbc249445c73a41d2168))
+* layout dependencies ([0d04aa7](https://github.com/hatiolab/operato/commit/0d04aa7c44566f5f69602c7df72664edb4f9e643))
+
+
+
+### [0.3.9](https://github.com/hatiolab/operato/compare/v0.3.8...v0.3.9) (2022-01-15)
+
+**Note:** Version bump only for package @operato/layout
+
+
+
+
+
+### [0.3.8](https://github.com/hatiolab/operato/compare/v0.3.7...v0.3.8) (2022-01-14)
+
+**Note:** Version bump only for package @operato/layout
+
+
+
+
+
+### [0.3.7](https://github.com/hatiolab/operato/compare/v0.3.6...v0.3.7) (2022-01-09)
+
+**Note:** Version bump only for package @operato/layout
+
+
+
+
+
+### [0.3.6](https://github.com/hatiolab/operato/compare/v0.3.5...v0.3.6) (2022-01-09)
+
+**Note:** Version bump only for package @operato/layout
+
+
+
+
+
+### [0.3.5](https://github.com/hatiolab/operato/compare/v0.3.4...v0.3.5) (2022-01-09)
+
+**Note:** Version bump only for package @operato/layout
+
+
+
+
+
+### [0.3.4](https://github.com/hatiolab/operato/compare/v0.3.3...v0.3.4) (2022-01-03)
+
+**Note:** Version bump only for package @operato/layout
+
+
+
+
+
+### [0.3.3](https://github.com/hatiolab/operato/compare/v0.3.2...v0.3.3) (2022-01-03)
+
+
+### :bug: Bug Fix
+
+* apply import.meta.url into @operato/board ([1262fbe](https://github.com/hatiolab/operato/commit/1262fbec19798ac5fb0f1a430cabb48c9d8f3f35))
+
+
+
+### [0.3.2](https://github.com/hatiolab/operato/compare/v0.3.1...v0.3.2) (2022-01-03)
+
+**Note:** Version bump only for package @operato/layout
+
+
+
+
+
+### [0.3.1](https://github.com/hatiolab/operato/compare/v0.3.0...v0.3.1) (2021-12-31)
+
+**Note:** Version bump only for package @operato/layout
+
+
+
+
+
+## [0.3.0](https://github.com/hatiolab/operato/compare/v0.2.52...v0.3.0) (2021-12-31)
+
+
+### :rocket: New Features
+
+* add tsconfig option useDefineForClassFields ([6291438](https://github.com/hatiolab/operato/commit/6291438571eee0f095064e7d2ada1c620832e092))
+
+
+
+### [0.2.52](https://github.com/hatiolab/operato/compare/v0.2.51...v0.2.52) (2021-12-21)
+
+
+### :bug: Bug Fix
+
+* upgrade dependencies ([3fde5e7](https://github.com/hatiolab/operato/commit/3fde5e7182bb4b502103bcb70de2f1bfab2bc1ff))
+
+
+### :rocket: New Features
+
+* add @operato/utils and @operato/attachment ([15a9c19](https://github.com/hatiolab/operato/commit/15a9c19ff1237738abd3e3509ba9ede90280b766))
+
+
+
+### [0.2.51](https://github.com/hatiolab/operato/compare/v0.2.50...v0.2.51) (2021-12-16)
+
+**Note:** Version bump only for package @operato/layout
+
+
+
+
+
+### [0.2.50](https://github.com/hatiolab/operato/compare/v0.2.49...v0.2.50) (2021-12-16)
+
+**Note:** Version bump only for package @operato/layout
+
+
+
+
+
+### [0.2.49](https://github.com/hatiolab/operato/compare/v0.2.48...v0.2.49) (2021-12-14)
+
+**Note:** Version bump only for package @operato/layout
+
+
+
+
+
+### [0.2.48](https://github.com/hatiolab/operato/compare/v0.2.47...v0.2.48) (2021-12-14)
+
+**Note:** Version bump only for package @operato/layout
+
+
+
+
+
+### [0.2.47](https://github.com/hatiolab/operato/compare/v0.2.46...v0.2.47) (2021-12-13)
+
+**Note:** Version bump only for package @operato/layout
+
+
+
+
+
+### [0.2.46](https://github.com/hatiolab/operato/compare/v0.2.45...v0.2.46) (2021-12-12)
+
+
+### :rocket: New Features
+
+* add layout and oops ([56737fa](https://github.com/hatiolab/operato/commit/56737fa117ed2135e279ca0f1e4c969daddf7b34))
+
+
+### :bug: Bug Fix
+
+* set all module version to 0.2.45 ([40cea11](https://github.com/hatiolab/operato/commit/40cea11fab09ab3fb96bcd7db797abd13b23c216))

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) hatiolab.com
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,75 @@
+# \<mini-layout>
+
+This webcomponent follows the [open-wc](https://github.com/open-wc/open-wc) recommendation.
+
+## Installation
+
+```bash
+npm i mini-layout
+```
+
+## Usage
+
+```html
+<script type="module">
+  import 'mini-layout/mini-layout.js'
+</script>
+
+<mini-layout></mini-layout>
+```
+
+## Linting and formatting
+
+To scan the project for linting and formatting errors, run
+
+```bash
+npm run lint
+```
+
+To automatically fix linting and formatting errors, run
+
+```bash
+npm run format
+```
+
+## Testing with Web Test Runner
+
+To execute a single test run:
+
+```bash
+npm run test
+```
+
+To run the tests in interactive watch mode run:
+
+```bash
+npm run test:watch
+```
+
+## Demoing with Storybook
+
+To run a local instance of Storybook for your component, run
+
+```bash
+npm run storybook
+```
+
+To build a production version of Storybook, run
+
+```bash
+npm run storybook:build
+```
+
+## Tooling configs
+
+For most of the tools, the configuration is in the `package.json` to reduce the amount of files in your project.
+
+If you customize the configuration a lot, you can consider moving them to individual files.
+
+## Local Demo with `web-dev-server`
+
+```bash
+npm start
+```
+
+To run a local development server that serves the basic demo located in `demo/index.html`

package/demo/index.html

@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<html lang="en-GB">
+  <head>
+    <meta charset="utf-8" />
+    <style>
+      body {
+        background: #fafafa;
+        --ox-checkbox-size: 12px;
+      }
+
+      #demo {
+        position: relative;
+        height: 300px;
+        background-color: lightgray;
+        vertical-align: middle;
+      }
+    </style>
+    <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" />
+    <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
+  </head>
+  <body>
+    <div id="demo"></div>
+
+    <script type="module">
+      import { html, render } from 'lit'
+
+      const parent = document.querySelector('#demo')
+
+      render(html`clike anywhere in this box to utils mini.`, parent)
+    </script>
+  </body>
+</html>

package/dist/src/components/ox-help-icon.d.ts

@@ -0,0 +1,7 @@
+import '@material/mwc-icon';
+import { LitElement } from 'lit';
+export declare class HelpIcon extends LitElement {
+    static styles: import("lit").CSSResult;
+    topic: string;
+    render(): import("lit-html").TemplateResult<1>;
+}

package/dist/src/components/ox-help-icon.js

@@ -0,0 +1,35 @@
+import { __decorate } from "tslib";
+import '@material/mwc-icon';
+import { css, html, LitElement } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { openHelp } from '../controller/help.js';
+let HelpIcon = class HelpIcon extends LitElement {
+    render() {
+        const topic = this.topic;
+        return html `${topic ? html `<mwc-icon @click=${() => openHelp(topic)}>help</mwc-icon>` : html ``}`;
+    }
+};
+HelpIcon.styles = css `
+    mwc-icon {
+      position: relative;
+      top: 4px;
+      cursor: help;
+      opacity: var(--help-icon-opacity);
+      color: var(--help-icon-color);
+      font-size: var(--help-icon-size);
+      line-height: 0;
+    }
+
+    mwc-icon:hover {
+      opacity: var(--help-icon-hover-opacity);
+      color: var(--help-icon-hover-color);
+    }
+  `;
+__decorate([
+    property({ type: String })
+], HelpIcon.prototype, "topic", void 0);
+HelpIcon = __decorate([
+    customElement('ox-help-icon')
+], HelpIcon);
+export { HelpIcon };
+//# sourceMappingURL=ox-help-icon.js.map

package/dist/src/components/ox-help-icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ox-help-icon.js","sourceRoot":"","sources":["../../../src/components/ox-help-icon.ts"],"names":[],"mappings":";AAAA,OAAO,oBAAoB,CAAA;AAE3B,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAGhD,IAAa,QAAQ,GAArB,MAAa,QAAS,SAAQ,UAAU;IAoBtC,MAAM;QACJ,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAA;QAExB,OAAO,IAAI,CAAA,GAAG,KAAK,CAAC,CAAC,CAAC,IAAI,CAAA,oBAAoB,GAAG,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,kBAAkB,CAAC,CAAC,CAAC,IAAI,CAAA,EAAE,EAAE,CAAA;IAClG,CAAC;CACF,CAAA;AAxBQ,eAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;GAelB,CAAA;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uCAAe;AAlB/B,QAAQ;IADpB,aAAa,CAAC,cAAc,CAAC;GACjB,QAAQ,CAyBpB;SAzBY,QAAQ","sourcesContent":["import '@material/mwc-icon'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { openHelp } from '../controller/help.js'\n\n@customElement('ox-help-icon')\nexport class HelpIcon extends LitElement {\n  static styles = css`\n    mwc-icon {\n      position: relative;\n      top: 4px;\n      cursor: help;\n      opacity: var(--help-icon-opacity);\n      color: var(--help-icon-color);\n      font-size: var(--help-icon-size);\n      line-height: 0;\n    }\n\n    mwc-icon:hover {\n      opacity: var(--help-icon-hover-opacity);\n      color: var(--help-icon-hover-color);\n    }\n  `\n\n  @property({ type: String }) topic!: string\n\n  render() {\n    const topic = this.topic\n\n    return html`${topic ? html`<mwc-icon @click=${() => openHelp(topic)}>help</mwc-icon>` : html``}`\n  }\n}\n"]}

package/dist/src/components/ox-inline-help.d.ts

@@ -0,0 +1,8 @@
+import { LitElement } from 'lit';
+export declare class InlineHelp extends LitElement {
+    static styles: import("lit").CSSResult;
+    topic: string;
+    type: string;
+    render(): import("lit-html").TemplateResult<1>;
+    connectedCallback(): void;
+}

package/dist/src/components/ox-inline-help.js

@@ -0,0 +1,32 @@
+import { __decorate } from "tslib";
+import { css, html, LitElement } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { openHelp } from '../controller/help.js';
+let InlineHelp = class InlineHelp extends LitElement {
+    render() {
+        return html ` <slot></slot> `;
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.renderRoot.addEventListener('click', e => {
+            openHelp(this.topic);
+        });
+    }
+};
+InlineHelp.styles = css `
+    :host {
+      display: flex;
+      align-items: center;
+    }
+  `;
+__decorate([
+    property({ type: String })
+], InlineHelp.prototype, "topic", void 0);
+__decorate([
+    property({ type: String })
+], InlineHelp.prototype, "type", void 0);
+InlineHelp = __decorate([
+    customElement('ox-inline-help')
+], InlineHelp);
+export { InlineHelp };
+//# sourceMappingURL=ox-inline-help.js.map

package/dist/src/components/ox-inline-help.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ox-inline-help.js","sourceRoot":"","sources":["../../../src/components/ox-inline-help.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAGhD,IAAa,UAAU,GAAvB,MAAa,UAAW,SAAQ,UAAU;IAWxC,MAAM;QACJ,OAAO,IAAI,CAAA,iBAAiB,CAAA;IAC9B,CAAC;IAED,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAA;QAEzB,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAAC,OAAO,EAAE,CAAC,CAAC,EAAE;YAC5C,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACtB,CAAC,CAAC,CAAA;IACJ,CAAC;CACF,CAAA;AArBQ,iBAAM,GAAG,GAAG,CAAA;;;;;GAKlB,CAAA;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;yCAAe;AACd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCAAc;AAT9B,UAAU;IADtB,aAAa,CAAC,gBAAgB,CAAC;GACnB,UAAU,CAsBtB;SAtBY,UAAU","sourcesContent":["import { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { openHelp } from '../controller/help.js'\n\n@customElement('ox-inline-help')\nexport class InlineHelp extends LitElement {\n  static styles = css`\n    :host {\n      display: flex;\n      align-items: center;\n    }\n  `\n\n  @property({ type: String }) topic!: string\n  @property({ type: String }) type!: string\n\n  render() {\n    return html` <slot></slot> `\n  }\n\n  connectedCallback() {\n    super.connectedCallback()\n\n    this.renderRoot.addEventListener('click', e => {\n      openHelp(this.topic)\n    })\n  }\n}\n"]}

package/dist/src/components/ox-title-with-help.d.ts

@@ -0,0 +1,10 @@
+import '@material/mwc-icon';
+import { LitElement } from 'lit';
+declare const TitleWithHelp_base: (new (...args: any[]) => LitElement) & typeof LitElement;
+export declare class TitleWithHelp extends TitleWithHelp_base {
+    static styles: import("lit").CSSResult;
+    msgid: string;
+    topic: string;
+    render(): import("lit-html").TemplateResult<1>;
+}
+export {};

package/dist/src/components/ox-title-with-help.js

@@ -0,0 +1,40 @@
+import { __decorate } from "tslib";
+import '@material/mwc-icon';
+import { css, html, LitElement } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { i18next, localize } from '@operato/i18n';
+import { openHelp } from '../controller/help.js';
+let TitleWithHelp = class TitleWithHelp extends localize(i18next)(LitElement) {
+    render() {
+        const title = i18next.t(this.msgid);
+        const topic = this.topic;
+        return html ` ${title} ${topic ? html `<mwc-icon @click=${() => openHelp(topic)}>help</mwc-icon>` : html ``} `;
+    }
+};
+TitleWithHelp.styles = css `
+    mwc-icon {
+      position: relative;
+      top: 4px;
+      cursor: help;
+      opacity: var(--help-icon-opacity);
+      color: var(--help-icon-color);
+      font-size: var(--help-icon-size);
+      line-height: 0;
+    }
+    mwc-icon:hover {
+      opacity: var(--help-icon-hover-opacity);
+      color: var(--help-icon-hover-color);
+    }
+  `;
+__decorate([
+    property({ type: String })
+], TitleWithHelp.prototype, "msgid", void 0);
+__decorate([
+    property({ type: String })
+], TitleWithHelp.prototype, "topic", void 0);
+TitleWithHelp = __decorate([
+    customElement('ox-title-with-help')
+], TitleWithHelp);
+export { TitleWithHelp };
+customElements.define('title-with-help', TitleWithHelp);
+//# sourceMappingURL=ox-title-with-help.js.map

package/dist/src/components/ox-title-with-help.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ox-title-with-help.js","sourceRoot":"","sources":["../../../src/components/ox-title-with-help.ts"],"names":[],"mappings":";AAAA,OAAO,oBAAoB,CAAA;AAE3B,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAEjD,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAGhD,IAAa,aAAa,GAA1B,MAAa,aAAc,SAAQ,QAAQ,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;IAoB9D,MAAM;QACJ,MAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACnC,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAA;QAExB,OAAO,IAAI,CAAA,IAAI,KAAK,IAAI,KAAK,CAAC,CAAC,CAAC,IAAI,CAAA,oBAAoB,GAAG,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,kBAAkB,CAAC,CAAC,CAAC,IAAI,CAAA,EAAE,GAAG,CAAA;IAC7G,CAAC;CACF,CAAA;AAzBQ,oBAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;GAclB,CAAA;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAe;AACd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAe;AAlB/B,aAAa;IADzB,aAAa,CAAC,oBAAoB,CAAC;GACvB,aAAa,CA0BzB;SA1BY,aAAa;AA4B1B,cAAc,CAAC,MAAM,CAAC,iBAAiB,EAAE,aAAa,CAAC,CAAA","sourcesContent":["import '@material/mwc-icon'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\n\nimport { openHelp } from '../controller/help.js'\n\n@customElement('ox-title-with-help')\nexport class TitleWithHelp extends localize(i18next)(LitElement) {\n  static styles = css`\n    mwc-icon {\n      position: relative;\n      top: 4px;\n      cursor: help;\n      opacity: var(--help-icon-opacity);\n      color: var(--help-icon-color);\n      font-size: var(--help-icon-size);\n      line-height: 0;\n    }\n    mwc-icon:hover {\n      opacity: var(--help-icon-hover-opacity);\n      color: var(--help-icon-hover-color);\n    }\n  `\n\n  @property({ type: String }) msgid!: string\n  @property({ type: String }) topic!: string\n\n  render() {\n    const title = i18next.t(this.msgid)\n    const topic = this.topic\n\n    return html` ${title} ${topic ? html`<mwc-icon @click=${() => openHelp(topic)}>help</mwc-icon>` : html``} `\n  }\n}\n\ncustomElements.define('title-with-help', TitleWithHelp)\n"]}

package/dist/src/controller/help.d.ts

@@ -0,0 +1,2 @@
+export declare function openHelp(topic: string): void;
+export declare function closeHelp(): void;

package/dist/src/controller/help.js

@@ -0,0 +1,12 @@
+import { closeOverlay, openOverlay } from '@operato/layout';
+export function openHelp(topic) {
+    openOverlay('help', {
+        templateProperties: {
+            topic
+        }
+    });
+}
+export function closeHelp() {
+    closeOverlay('help');
+}
+//# sourceMappingURL=help.js.map

package/dist/src/controller/help.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"help.js","sourceRoot":"","sources":["../../../src/controller/help.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAA;AAE3D,MAAM,UAAU,QAAQ,CAAC,KAAa;IACpC,WAAW,CAAC,MAAM,EAAE;QAClB,kBAAkB,EAAE;YAClB,KAAK;SACN;KACF,CAAC,CAAA;AACJ,CAAC;AAED,MAAM,UAAU,SAAS;IACvB,YAAY,CAAC,MAAM,CAAC,CAAA;AACtB,CAAC","sourcesContent":["import { closeOverlay, openOverlay } from '@operato/layout'\n\nexport function openHelp(topic: string) {\n  openOverlay('help', {\n    templateProperties: {\n      topic\n    }\n  })\n}\n\nexport function closeHelp() {\n  closeOverlay('help')\n}\n"]}

package/dist/src/grist/help-decorated-renderer.d.ts

@@ -0,0 +1,3 @@
+import '../components/ox-help-icon.js';
+import { FieldRenderer } from '@operato/data-grist';
+export declare const HelpDecoratedRenderer: FieldRenderer;

package/dist/src/grist/help-decorated-renderer.js

@@ -0,0 +1,10 @@
+import '../components/ox-help-icon.js';
+import { html } from 'lit-html';
+const decoratorTemplate = (topic) => html `<ox-help-icon style="flex: 0;" .topic=${topic}>help</help-icon>`;
+export const HelpDecoratedRenderer = (value, column, record, rowIndex, field) => {
+    const { help } = column === null || column === void 0 ? void 0 : column.record;
+    const text = value === undefined ? '' : value;
+    const topic = help && help(value, column, record, rowIndex, field);
+    return topic ? html `${text}&nbsp;${decoratorTemplate(topic)}` : text;
+};
+//# sourceMappingURL=help-decorated-renderer.js.map

package/dist/src/grist/help-decorated-renderer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"help-decorated-renderer.js","sourceRoot":"","sources":["../../../src/grist/help-decorated-renderer.ts"],"names":[],"mappings":"AAAA,OAAO,+BAA+B,CAAA;AAEtC,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAA;AAQ/B,MAAM,iBAAiB,GAAG,CAAC,KAAa,EAAE,EAAE,CAAC,IAAI,CAAA,yCAAyC,KAAK,mBAAmB,CAAA;AAElH,MAAM,CAAC,MAAM,qBAAqB,GAAkB,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE;IAC7F,MAAM,EAAE,IAAI,EAAE,GAAG,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,MAA4B,CAAA;IACrD,MAAM,IAAI,GAAG,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAA;IAE7C,MAAM,KAAK,GAAG,IAAI,IAAI,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAA;IAClE,OAAO,KAAK,CAAC,CAAC,CAAC,IAAI,CAAA,GAAG,IAAI,SAAS,iBAAiB,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAA;AACtE,CAAC,CAAA","sourcesContent":["import '../components/ox-help-icon.js'\n\nimport { html } from 'lit-html'\n\nimport { ColumnConfig, FieldRenderer, GristRecord } from '@operato/data-grist'\n\ninterface HelpExtendedRecord extends GristRecord {\n  help?: (value: any, column: ColumnConfig, record: GristRecord, rowIndex: number, owner: any) => string\n}\n\nconst decoratorTemplate = (topic: string) => html`<ox-help-icon style=\"flex: 0;\" .topic=${topic}>help</help-icon>`\n\nexport const HelpDecoratedRenderer: FieldRenderer = (value, column, record, rowIndex, field) => {\n  const { help } = column?.record as HelpExtendedRecord\n  const text = value === undefined ? '' : value\n\n  const topic = help && help(value, column, record, rowIndex, field)\n  return topic ? html`${text}&nbsp;${decoratorTemplate(topic)}` : text\n}\n"]}

package/dist/src/help-style.d.ts

@@ -0,0 +1 @@
+export declare const HelpStyle: import("lit").CSSResult;