@operato/attribute 2.0.0-alpha.99 → 2.0.0-beta.0

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 (17) hide show
  1. package/CHANGELOG.md +406 -0
  2. package/dist/src/grist-editor/ox-popup-attributes.js +2 -2
  3. package/dist/src/grist-editor/ox-popup-attributes.js.map +1 -1
  4. package/dist/src/ox-attribute-form.js +4 -4
  5. package/dist/src/ox-attribute-form.js.map +1 -1
  6. package/dist/src/ox-attribute-view.js +4 -4
  7. package/dist/src/ox-attribute-view.js.map +1 -1
  8. package/dist/stories/ox-grist-editor-attributes.stories.js +6 -6
  9. package/dist/stories/ox-grist-editor-attributes.stories.js.map +1 -1
  10. package/dist/tsconfig.tsbuildinfo +1 -1
  11. package/package.json +12 -12
  12. package/src/grist-editor/ox-popup-attributes.ts +2 -2
  13. package/src/ox-attribute-form.ts +4 -4
  14. package/src/ox-attribute-view.ts +4 -4
  15. package/stories/ox-grist-editor-attributes.stories.ts +6 -6
  16. package/themes/app-theme.css +1 -1
  17. package/themes/form-theme.css +15 -15
package/dist/stories/ox-grist-editor-attributes.stories.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ox-grist-editor-attributes.stories.js","sourceRoot":"","sources":["../../stories/ox-grist-editor-attributes.stories.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/md-icon'\nimport '@operato/property-editor/ox-property-editor-checkbox.js'\nimport '@operato/property-editor/ox-property-editor-number.js'\nimport '@operato/property-editor/ox-property-editor-string.js'\nimport '@operato/property-editor/ox-property-editor-options.js'\nimport '@operato/property-editor/ox-properties-dynamic-view.js'\nimport '@operato/data-grist/ox-filters-form.js'\nimport '@operato/data-grist/ox-sorters-control.js'\nimport '@operato/grist-editor' /* regiester grist editors */\n/* set grist-editors */\nimport '../src/grist-editor/index.js'\n\nimport { css, html, LitElement, TemplateResult } from 'lit'\nimport { state } from 'lit/decorators.js'\n\nimport { FetchOption, GristRecord } from '@operato/data-grist'\n// import { OxGristEditorCrontab } from '@operato/grist-editor/ox-grist-editor-crontab.js'\n// import { OxGristEditorParameters } from '@operato/grist-editor/ox-grist-editor-parameters.js'\n// import { OxGristEditorPartitionKeys } from '@operato/grist-editor/ox-grist-editor-partition-keys.js'\n// // import { OxGristRendererCrontab } from '@operato/grist-editor/ox-grist-renderer-crontab.js'\n// import { OxGristEditorValueMap } from '@operato/grist-editor/ox-grist-editor-value-map.js'\nimport { i18next } from '@operato/i18n'\nimport { OxPropertyEditor } from '@operato/property-editor'\nimport { CommonGristStyles } from '@operato/styles'\n\nOxPropertyEditor.register({\n number: 'ox-property-editor-number',\n string: 'ox-property-editor-string',\n boolean: 'ox-property-editor-checkbox',\n options: 'ox-property-editor-options'\n})\n\n// registerEditor('parameters', OxGristEditorParameters)\n// registerEditor('crontab', OxGristEditorCrontab)\n// registerEditor('value-map', OxGristEditorValueMap)\n// registerEditor('partition-keys', OxGristEditorPartitionKeys)\n\nconst fetchHandler = async ({ page = 1, limit = 100, sortings = [], filters = [] }: FetchOption) => {\n var total = 10\n var start = (page - 1) * limit\n\n return {\n total,\n records: Array(limit * page > total ? total % limit : limit)\n .fill('')\n .map((item, idx) => {\n return {\n id: idx,\n entity: `entity-${start + idx + 1}`,\n description: `description-${start + idx + 1}`,\n attributes: {\n brn: '1234567890-1234-1',\n address: '경기도 성남시 분당구.',\n credit: '최우수'\n }\n }\n })\n }\n}\n\nclass GristDemo extends LitElement {\n static styles = [\n CommonGristStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n }\n\n #tailer {\n display: flex;\n flex-direction: row;\n margin: 0 var(--margin-default);\n }\n\n #tailer a {\n padding: 0 var(--padding-default) 0 var(--padding-default);\n margin: 0 var(--margin-narrow);\n border-right: 1px solid rgba(0, 0, 0, 0.1);\n font-size: var(--fontsize-default);\n color: var(--primary-color);\n }\n `\n ]\n\n @state() mode: String = 'CARD'\n\n get grist() {\n return this.renderRoot.querySelector('ox-grist')\n }\n\n config: any = {\n list: { fields: ['name', 'description', 'active'] },\n columns: [\n { type: 'gutter', gutterName: 'row-selector', multiple: true },\n {\n type: 'gutter',\n gutterName: 'button',\n icon: 'add',\n handlers: {\n click: 'record-copy'\n }\n },\n { type: 'gutter', gutterName: 'sequence' },\n {\n type: 'gutter',\n gutterName: 'button',\n icon: 'arrow_upward',\n handlers: {\n click: 'move-up'\n }\n },\n {\n type: 'gutter',\n gutterName: 'button',\n icon: 'arrow_downward',\n handlers: {\n click: 'move-down'\n }\n },\n {\n type: 'string',\n name: 'id',\n hidden: true\n },\n {\n type: 'string',\n name: 'entity',\n header: i18next.t('field.entity'),\n record: {\n editable: true\n },\n width: 140\n },\n {\n type: 'string',\n name: 'description',\n header: i18next.t('field.description'),\n record: {\n editable: true\n },\n width: 180\n },\n {\n type: 'select',\n name: 'type',\n header: i18next.t('field.type'),\n record: {\n options: ['', 'number', 'text', 'select', 'boolean', 'file'],\n editable: true\n },\n width: 120\n },\n {\n type: 'attributes',\n name: 'attributes',\n header: i18next.t('field.attributes'),\n record: {\n editable: true,\n options: {\n attributeSet: {\n entity: 'Domain',\n description: 'Attributes for Domain Entity',\n items: [\n {\n name: '등록정보',\n description: '회사 등록 정보',\n tag: 'brn',\n type: 'text',\n active: true,\n hidden: false\n },\n {\n name: '주소',\n description: '회사 주소',\n tag: 'address',\n type: 'text',\n active: true,\n hidden: false\n },\n {\n name: '신용도',\n description: '회사의 신용도',\n tag: 'credit',\n type: 'select',\n options: {\n options: [\n { text: '최우수', value: '최우수' },\n { text: '우수', value: '우수' },\n { text: '보통', value: '보통' },\n { text: '미달', value: '미달' }\n ]\n },\n active: true,\n hidden: false\n },\n {\n name: '정보파일',\n description: '참조 첨부 파일.',\n tag: 'file',\n type: 'file',\n active: true,\n hidden: false\n }\n ]\n }\n }\n },\n width: 200\n }\n ],\n rows: {\n selectable: {\n multiple: true\n }\n },\n pagination: {\n infinite: true\n },\n sorters: [\n {\n name: 'sequence'\n }\n ]\n }\n\n render() {\n const mode = this.mode || 'CARD'\n\n return html`\n <ox-grist .config=${this.config} .mode=${mode} auto-fetch .fetchHandler=${fetchHandler}>\n <div id=\"filters\" slot=\"headroom\">\n <ox-filters-form @filters-change=${(e: CustomEvent) => console.log('changed', e.detail)}></ox-filters-form>\n </div>\n\n <div slot=\"headroom\" id=\"headroom\">\n <div id=\"modes\">\n <md-icon @click=${() => (this.mode = 'GRID')} ?active=${mode == 'GRID'}>view_list</md-icon>\n <md-icon @click=${() => (this.mode = 'LIST')} ?active=${mode == 'LIST'}>menu</md-icon>\n <md-icon @click=${() => (this.mode = 'CARD')} ?active=${mode == 'CARD'}>apps</md-icon>\n </div>\n </div>\n </ox-grist>\n `\n }\n}\n\ncustomElements.define('ox-attributes', GristDemo)\n\nexport default {\n title: 'ox-grist-editor-attributes',\n component: 'ox-grist-editor-attributes',\n argTypes: {}\n}\n\ninterface Story<T> {\n (args: T): TemplateResult\n args?: Partial<T>\n argTypes?: Record<string, unknown>\n}\n\ninterface ArgTypes {}\n\nconst Template: Story<ArgTypes> = ({}: ArgTypes) => html`\n <link\n href=\"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1\"\n rel=\"stylesheet\"\n />\n <link\n href=\"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1\"\n rel=\"stylesheet\"\n />\n <link\n href=\"https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1\"\n rel=\"stylesheet\"\n />\n\n <link href=\"/themes/app-theme.css\" rel=\"stylesheet\" />\n <link href=\"/themes/oops-theme.css\" rel=\"stylesheet\" />\n <link href=\"/themes/grist-theme.css\" rel=\"stylesheet\" />\n\n <style>\n [slot='headroom'] {\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: var(--padding-default) var(--padding-wide);\n background-color: var(--theme-white-color);\n box-shadow: var(--box-shadow);\n\n --md-icon-size: 24px;\n }\n #sorters md-icon,\n #modes md-icon {\n --md-icon-size: 18px;\n }\n #sorters {\n margin-left: auto;\n margin-right: var(--margin-default);\n padding-left: var(--padding-narrow);\n border-bottom: var(--border-dark-color);\n position: relative;\n color: var(--secondary-color);\n font-size: var(--fontsize-default);\n user-select: none;\n }\n\n #sorters > * {\n padding: var(--padding-narrow);\n vertical-align: middle;\n }\n\n #filters {\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n #filters * {\n margin-right: var(--margin-default);\n }\n\n @media only screen and (max-width: 460px) {\n #filters {\n flex-direction: column;\n }\n\n #modes {\n display: none;\n }\n }\n </style>\n\n <ox-attributes mode=\"LIST\"></ox-attributes>\n`\n\nexport const Regular = Template.bind({})\nRegular.args = {}\n"]}
1
+ {"version":3,"file":"ox-grist-editor-attributes.stories.js","sourceRoot":"","sources":["../../stories/ox-grist-editor-attributes.stories.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/md-icon'\nimport '@operato/property-editor/ox-property-editor-checkbox.js'\nimport '@operato/property-editor/ox-property-editor-number.js'\nimport '@operato/property-editor/ox-property-editor-string.js'\nimport '@operato/property-editor/ox-property-editor-options.js'\nimport '@operato/property-editor/ox-properties-dynamic-view.js'\nimport '@operato/data-grist/ox-filters-form.js'\nimport '@operato/data-grist/ox-sorters-control.js'\nimport '@operato/grist-editor' /* regiester grist editors */\n/* set grist-editors */\nimport '../src/grist-editor/index.js'\n\nimport { css, html, LitElement, TemplateResult } from 'lit'\nimport { state } from 'lit/decorators.js'\n\nimport { FetchOption, GristRecord } from '@operato/data-grist'\n// import { OxGristEditorCrontab } from '@operato/grist-editor/ox-grist-editor-crontab.js'\n// import { OxGristEditorParameters } from '@operato/grist-editor/ox-grist-editor-parameters.js'\n// import { OxGristEditorPartitionKeys } from '@operato/grist-editor/ox-grist-editor-partition-keys.js'\n// // import { OxGristRendererCrontab } from '@operato/grist-editor/ox-grist-renderer-crontab.js'\n// import { OxGristEditorValueMap } from '@operato/grist-editor/ox-grist-editor-value-map.js'\nimport { i18next } from '@operato/i18n'\nimport { OxPropertyEditor } from '@operato/property-editor'\nimport { CommonGristStyles } from '@operato/styles'\n\nOxPropertyEditor.register({\n number: 'ox-property-editor-number',\n string: 'ox-property-editor-string',\n boolean: 'ox-property-editor-checkbox',\n options: 'ox-property-editor-options'\n})\n\n// registerEditor('parameters', OxGristEditorParameters)\n// registerEditor('crontab', OxGristEditorCrontab)\n// registerEditor('value-map', OxGristEditorValueMap)\n// registerEditor('partition-keys', OxGristEditorPartitionKeys)\n\nconst fetchHandler = async ({ page = 1, limit = 100, sortings = [], filters = [] }: FetchOption) => {\n var total = 10\n var start = (page - 1) * limit\n\n return {\n total,\n records: Array(limit * page > total ? total % limit : limit)\n .fill('')\n .map((item, idx) => {\n return {\n id: idx,\n entity: `entity-${start + idx + 1}`,\n description: `description-${start + idx + 1}`,\n attributes: {\n brn: '1234567890-1234-1',\n address: '경기도 성남시 분당구.',\n credit: '최우수'\n }\n }\n })\n }\n}\n\nclass GristDemo extends LitElement {\n static styles = [\n CommonGristStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n }\n\n #tailer {\n display: flex;\n flex-direction: row;\n margin: 0 var(--spacing-medium);\n }\n\n #tailer a {\n padding: 0 var(--padding-default) 0 var(--padding-default);\n margin: 0 var(--margin-narrow);\n border-right: 1px solid rgba(0, 0, 0, 0.1);\n font-size: var(--fontsize-default);\n color: var(--md-sys-color-on-primary-container);\n }\n `\n ]\n\n @state() mode: String = 'CARD'\n\n get grist() {\n return this.renderRoot.querySelector('ox-grist')\n }\n\n config: any = {\n list: { fields: ['name', 'description', 'active'] },\n columns: [\n { type: 'gutter', gutterName: 'row-selector', multiple: true },\n {\n type: 'gutter',\n gutterName: 'button',\n icon: 'add',\n handlers: {\n click: 'record-copy'\n }\n },\n { type: 'gutter', gutterName: 'sequence' },\n {\n type: 'gutter',\n gutterName: 'button',\n icon: 'arrow_upward',\n handlers: {\n click: 'move-up'\n }\n },\n {\n type: 'gutter',\n gutterName: 'button',\n icon: 'arrow_downward',\n handlers: {\n click: 'move-down'\n }\n },\n {\n type: 'string',\n name: 'id',\n hidden: true\n },\n {\n type: 'string',\n name: 'entity',\n header: i18next.t('field.entity'),\n record: {\n editable: true\n },\n width: 140\n },\n {\n type: 'string',\n name: 'description',\n header: i18next.t('field.description'),\n record: {\n editable: true\n },\n width: 180\n },\n {\n type: 'select',\n name: 'type',\n header: i18next.t('field.type'),\n record: {\n options: ['', 'number', 'text', 'select', 'boolean', 'file'],\n editable: true\n },\n width: 120\n },\n {\n type: 'attributes',\n name: 'attributes',\n header: i18next.t('field.attributes'),\n record: {\n editable: true,\n options: {\n attributeSet: {\n entity: 'Domain',\n description: 'Attributes for Domain Entity',\n items: [\n {\n name: '등록정보',\n description: '회사 등록 정보',\n tag: 'brn',\n type: 'text',\n active: true,\n hidden: false\n },\n {\n name: '주소',\n description: '회사 주소',\n tag: 'address',\n type: 'text',\n active: true,\n hidden: false\n },\n {\n name: '신용도',\n description: '회사의 신용도',\n tag: 'credit',\n type: 'select',\n options: {\n options: [\n { text: '최우수', value: '최우수' },\n { text: '우수', value: '우수' },\n { text: '보통', value: '보통' },\n { text: '미달', value: '미달' }\n ]\n },\n active: true,\n hidden: false\n },\n {\n name: '정보파일',\n description: '참조 첨부 파일.',\n tag: 'file',\n type: 'file',\n active: true,\n hidden: false\n }\n ]\n }\n }\n },\n width: 200\n }\n ],\n rows: {\n selectable: {\n multiple: true\n }\n },\n pagination: {\n infinite: true\n },\n sorters: [\n {\n name: 'sequence'\n }\n ]\n }\n\n render() {\n const mode = this.mode || 'CARD'\n\n return html`\n <ox-grist .config=${this.config} .mode=${mode} auto-fetch .fetchHandler=${fetchHandler}>\n <div id=\"filters\" slot=\"headroom\">\n <ox-filters-form @filters-change=${(e: CustomEvent) => console.log('changed', e.detail)}></ox-filters-form>\n </div>\n\n <div slot=\"headroom\" id=\"headroom\">\n <div id=\"modes\">\n <md-icon @click=${() => (this.mode = 'GRID')} ?active=${mode == 'GRID'}>view_list</md-icon>\n <md-icon @click=${() => (this.mode = 'LIST')} ?active=${mode == 'LIST'}>menu</md-icon>\n <md-icon @click=${() => (this.mode = 'CARD')} ?active=${mode == 'CARD'}>apps</md-icon>\n </div>\n </div>\n </ox-grist>\n `\n }\n}\n\ncustomElements.define('ox-attributes', GristDemo)\n\nexport default {\n title: 'ox-grist-editor-attributes',\n component: 'ox-grist-editor-attributes',\n argTypes: {}\n}\n\ninterface Story<T> {\n (args: T): TemplateResult\n args?: Partial<T>\n argTypes?: Record<string, unknown>\n}\n\ninterface ArgTypes {}\n\nconst Template: Story<ArgTypes> = ({}: ArgTypes) => html`\n <link\n href=\"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1\"\n rel=\"stylesheet\"\n />\n <link\n href=\"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1\"\n rel=\"stylesheet\"\n />\n <link\n href=\"https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1\"\n rel=\"stylesheet\"\n />\n\n <link href=\"/themes/app-theme.css\" rel=\"stylesheet\" />\n <link href=\"/themes/oops-theme.css\" rel=\"stylesheet\" />\n <link href=\"/themes/grist-theme.css\" rel=\"stylesheet\" />\n\n <style>\n [slot='headroom'] {\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: var(--padding-default) var(--padding-wide);\n background-color: var(--md-sys-color-surface);\n box-shadow: var(--box-shadow);\n\n --md-icon-size: 24px;\n }\n #sorters md-icon,\n #modes md-icon {\n --md-icon-size: 18px;\n }\n #sorters {\n margin-left: auto;\n margin-right: var(--spacing-medium);\n padding-left: var(--padding-narrow);\n border-bottom: var(--border-dark-color);\n position: relative;\n color: var(--md-sys-color-on-secondary-container);\n font-size: var(--fontsize-default);\n user-select: none;\n }\n\n #sorters > * {\n padding: var(--padding-narrow);\n vertical-align: middle;\n }\n\n #filters {\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n #filters * {\n margin-right: var(--spacing-medium);\n }\n\n @media only screen and (max-width: 460px) {\n #filters {\n flex-direction: column;\n }\n\n #modes {\n display: none;\n }\n }\n </style>\n\n <ox-attributes mode=\"LIST\"></ox-attributes>\n`\n\nexport const Regular = Template.bind({})\nRegular.args = {}\n"]}