pict-section-form 1.1.1 → 1.1.2
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.
- package/docs/_version.json +3 -3
- package/docs/examples/change_tracking/change_tracking.js +5 -14
- package/docs/examples/diagram_form/diagram_form_example.min.js +2 -2
- package/docs/examples/diagram_form/excalidraw-wrapper.min.js +3327 -0
- package/docs/examples/diagram_form/index.html +7 -1
- package/docs/examples/diagram_form/react-vendor.min.js +9 -0
- package/docs/examples/dynamic_analysis/dynamic_analysis_application.js +5 -14
- package/docs/examples/gradebook/gradebook_application.min.js +1 -1
- package/docs/examples/ndt_field_test/ndt_field_test.js +5 -14
- package/docs/examples/richtext_form/index.html +3 -3
- package/docs/examples/richtext_form/richtext_form_example.min.js +2 -2
- package/docs/examples/scope_mathematics/scope_mathematics.js +5 -14
- package/docs/examples/simple_table/simple_tabular_application.min.js +1 -1
- package/docs/examples/superhero_studio/excalidraw-wrapper.min.js +3327 -0
- package/docs/examples/superhero_studio/index.html +9 -3
- package/docs/examples/superhero_studio/react-vendor.min.js +9 -0
- package/docs/examples/superhero_studio/superhero_studio_example.min.js +2 -2
- package/docs/index.html +2 -2
- package/docs/retold-catalog.json +10 -1
- package/docs/retold-keyword-index.json +1 -1
- package/example_applications/diagram_form/DiagramForm-Example-Application.js +1 -1
- package/example_applications/diagram_form/html/index.html +7 -1
- package/example_applications/richtext_form/RichTextForm-Example-Application.js +1 -1
- package/example_applications/richtext_form/html/index.html +3 -3
- package/example_applications/superhero_studio/SuperheroStudio-Example-Application.js +3 -3
- package/example_applications/superhero_studio/html/index.html +9 -3
- package/package.json +3 -15
- package/source/providers/inputs/Pict-Provider-Input-Diagram.js +1 -31
- package/source/providers/inputs/Pict-Provider-Input-RichText.js +1 -32
|
@@ -4382,7 +4382,7 @@ if(tmpIsRootRenderable&&pRenderable&&pRenderable.TransactionHash){this.pict.Tran
|
|
|
4382
4382
|
* Lifecycle hook that triggers after data is marshaled into the view (async flow).
|
|
4383
4383
|
*
|
|
4384
4384
|
* @param {ErrorCallback} fCallback - The callback to call when the async operation is complete.
|
|
4385
|
-
*/onAfterMarshalToViewAsync(fCallback){this.onAfterMarshalToView();return fCallback();}/** @return {boolean} - True if the object is a PictView. */get isPictView(){return true;}}module.exports=PictView;},{"../package.json":38,"fable-serviceproviderbase":4}],40:[function(require,module,exports){module.exports={"name":"pict-section-form","version":"1.1.
|
|
4385
|
+
*/onAfterMarshalToViewAsync(fCallback){this.onAfterMarshalToView();return fCallback();}/** @return {boolean} - True if the object is a PictView. */get isPictView(){return true;}}module.exports=PictView;},{"../package.json":38,"fable-serviceproviderbase":4}],40:[function(require,module,exports){module.exports={"name":"pict-section-form","version":"1.1.2","description":"Pict dynamic form sections","main":"source/Pict-Section-Form.js","directories":{"test":"test"},"repository":{"type":"git","url":"git+https://github.com/fable-retold/pict-section-form.git"},"bugs":{"url":"https://github.com/fable-retold/pict-section-form/issues"},"homepage":"https://github.com/fable-retold/pict-section-form#readme","scripts":{"start":"node source/Pict-Section-Form.js","tests":"npx quack test -g","coverage":"npx quack coverage","build":"npx quack build","test":"npx quack test","lint":"eslint source/**","types":"tsc -p .","docker-dev-build":"docker build ./ -f Dockerfile_LUXURYCode -t pict-section-form-image:local","docker-dev-run":"docker run -it -d --name pict-section-form-dev -p 48888:8080 -p 49999:9999 -v \"$PWD/.config:/home/coder/.config\" -v \"$PWD:/home/coder/pict-section-form\" -u \"$(id -u):$(id -g)\" -e \"DOCKER_USER=$USER\" pict-section-form-image:local","docker-dev-shell":"docker exec -it pict-section-form-dev /bin/bash"},"types":"types/source/Pict-Section-Form.d.ts","author":"steven velozo <steven@velozo.com>","license":"MIT","devDependencies":{"@eslint/js":"^9.39.2","browser-env":"^3.3.0","eslint":"^9.39.2","jquery":"^4.0.0","pict":"^1.0.372","pict-application":"^1.0.34","pict-docuserve":"^1.4.4","pict-service-commandlineutility":"^1.0.19","quackage":"^1.3.0","tui-grid":"^4.21.22","typescript":"^5.9.3"},"dependencies":{"chart.js":"^4.5.1","fable-serviceproviderbase":"^3.0.19","marked":"^4.3.0","pict-provider":"^1.0.13","pict-section-excalidraw":"^1.0.2","pict-section-markdowneditor":"^1.0.17","pict-section-tuigrid":"^1.0.31","pict-template":"^1.0.15","pict-view":"^1.0.68"},"mocha":{"diff":true,"extension":["js"],"package":"./package.json","reporter":"spec","slow":"75","timeout":"5000","ui":"tdd","watch-files":["source/**/*.js","test/**/*.js"],"watch-ignore":["lib/vendor"]}};},{}],41:[function(require,module,exports){// The container for all the Pict-Section-Form related code.
|
|
4386
4386
|
// The main dynamic view class
|
|
4387
4387
|
module.exports=require('./views/Pict-View-DynamicForm.js');//module.exports.default_configuration = require('./views/Pict-View-DynamicForm-DefaultConfiguration.json');
|
|
4388
4388
|
// The dynamic application dependencies
|
|
@@ -7068,10 +7068,7 @@ let tmpInputSelectValue;try{tmpInputSelectValue=this.pict.ContentAssignment.read
|
|
|
7068
7068
|
* provider.getMode(inputHash)
|
|
7069
7069
|
* provider.toggleMode(inputHash)
|
|
7070
7070
|
* provider.commit(inputHash, fCallback)
|
|
7071
|
-
*/const libPictSectionInputExtension=require('../Pict-Provider-InputExtension.js');//
|
|
7072
|
-
// that never edit (read-mostly forms with inline SVGs) don't pull the
|
|
7073
|
-
// Excalidraw vendor bundle at module load.
|
|
7074
|
-
let _ExcalidrawClass=null;function _resolveExcalidraw(){if(_ExcalidrawClass)return _ExcalidrawClass;try{_ExcalidrawClass=require('pict-section-excalidraw');}catch(pErr){throw new Error('[Pict-Input-Diagram] Cannot mount edit mode — '+'pict-section-excalidraw is not installed. '+'Add it to your app\'s dependencies (it\'s an optional peer of pict-section-form).');}return _ExcalidrawClass;}// Form templates live in pict-section-form's default-template set, so no
|
|
7071
|
+
*/const libPictSectionInputExtension=require('../Pict-Provider-InputExtension.js');const libPictSectionExcalidraw=require('pict-section-excalidraw');// Form templates live in pict-section-form's default-template set, so no
|
|
7075
7072
|
// runtime template injection is needed here. CSS still needs registering.
|
|
7076
7073
|
const libCSS=require('./Pict-Provider-Input-Diagram-CSS.js');const libThemeify=require('./util/Themeify-SVG.js');const _DefaultProviderConfiguration={ProviderIdentifier:'Pict-Input-Diagram',AutoInitialize:true,AutoInitializeOrdinal:0,AutoSolveWithApp:false};class PictInputDiagram extends libPictSectionInputExtension{constructor(pFable,pOptions,pServiceHash){let tmpOptions=Object.assign({},JSON.parse(JSON.stringify(_DefaultProviderConfiguration)),pOptions);super(pFable,tmpOptions,pServiceHash);/** @type {import('pict')} */this.pict;/** @type {any} */this.log;// inputHash → { mode, slotID, lastValue (SVG string), viewInstance?, viewHash?, input }
|
|
7077
7074
|
this._instances={};// Register the scoped CSS.
|
|
@@ -7100,8 +7097,7 @@ this._assignSlotContent(tmpSlotID,'');this._extractSceneFromSvg(tmpValue,(pExtra
|
|
|
7100
7097
|
// editor's _resolveInitialData picks it up.
|
|
7101
7098
|
if(pScene&&this.pict.AppData._PictInputDiagram&&this.pict.AppData._PictInputDiagram[pInput.Hash]){this.pict.AppData._PictInputDiagram[pInput.Hash].Scene={elements:pScene.elements||[],appState:pScene.appState||{},files:pScene.files||{}};}// OnChange handler — debounced inside the editor view itself; we
|
|
7102
7099
|
// just trigger an SVG export and stamp into the form-data input.
|
|
7103
|
-
tmpEditorOpts.OnChange=(pEditorView,pSceneSnap)=>{try{let tmpExportPromise=pEditorView.exportSvg({exportEmbedScene:true,exportBackground:false});Promise.resolve(tmpExportPromise).then(pSvgEl=>{let tmpSvgStr=pSvgEl&&typeof pSvgEl.outerHTML==='string'?pSvgEl.outerHTML:typeof pSvgEl==='string'?pSvgEl:null;if(!tmpSvgStr)return;if(tmpThemeColors){tmpSvgStr=libThemeify.themeifySVG(tmpSvgStr);}tmpProvider._writeHiddenInputValue(tmpRawHTMLID,tmpSvgStr);let tmpLatest=tmpProvider._instances[pInput.Hash];if(tmpLatest)tmpLatest.lastValue=tmpSvgStr;},pExpErr=>{if(tmpProvider.log){tmpProvider.log.warn('[Pict-Input-Diagram] exportSvg failed in OnChange',{error:pExpErr.message,inputHash:pInput.Hash});}});}catch(pErr){if(tmpProvider.log){tmpProvider.log.warn('[Pict-Input-Diagram] OnChange handler threw',{error:pErr.message,inputHash:pInput.Hash});}}}
|
|
7104
|
-
let libPictSectionExcalidraw;try{libPictSectionExcalidraw=_resolveExcalidraw();}catch(pLoadErr){if(this.log)this.log.error('[Pict-Input-Diagram] '+pLoadErr.message);if(typeof fCallback==='function')fCallback(pLoadErr);return;}this.pict.addView(tmpViewHash,tmpEditorOpts,libPictSectionExcalidraw);let tmpEditorView=this.pict.views[tmpViewHash];if(!tmpEditorView){let tmpErr=new Error('Failed to instantiate Diagram editor view '+tmpViewHash);if(this.log)this.log.error('[Pict-Input-Diagram] addView returned nothing',{viewHash:tmpViewHash});if(typeof fCallback==='function')fCallback(tmpErr);return;}this._setSlotModeClass(pInput,'edit');tmpInst.mode='edit';tmpInst.slotID=tmpSlotID;tmpInst.lastValue=tmpValue;tmpInst.viewInstance=tmpEditorView;tmpInst.viewHash=tmpViewHash;tmpInst.themeColors=tmpThemeColors;this._instances[pInput.Hash]=tmpInst;try{let tmpResult=tmpEditorView.render();if(tmpResult&&typeof tmpResult.then==='function'){tmpResult.then(()=>{if(typeof fCallback==='function')fCallback(null);},pRenderErr=>{if(typeof fCallback==='function')fCallback(pRenderErr);});}else{if(typeof fCallback==='function')fCallback(null);}}catch(pErr){if(this.log)this.log.error('[Pict-Input-Diagram] editor.render threw',{error:pErr.message});if(typeof fCallback==='function')fCallback(pErr);}});}_destroyEdit(pInput){let tmpInst=this._instances[pInput.Hash];if(!tmpInst||!tmpInst.viewInstance)return;let tmpView=tmpInst.viewInstance;try{if(typeof tmpView.destroy==='function')tmpView.destroy();}catch(pErr){if(this.log)this.log.warn('[Pict-Input-Diagram] editor.destroy threw',{error:pErr.message});}if(this.pict.AppData._PictInputDiagram&&this.pict.AppData._PictInputDiagram[pInput.Hash]){delete this.pict.AppData._PictInputDiagram[pInput.Hash];}if(tmpInst.viewHash&&this.pict.views&&this.pict.views[tmpInst.viewHash]){try{delete this.pict.views[tmpInst.viewHash];}catch(pErr){/* not all envs allow delete */}}tmpInst.viewInstance=null;tmpInst.viewHash=null;}// ----------------------------------------------------------------------------
|
|
7100
|
+
tmpEditorOpts.OnChange=(pEditorView,pSceneSnap)=>{try{let tmpExportPromise=pEditorView.exportSvg({exportEmbedScene:true,exportBackground:false});Promise.resolve(tmpExportPromise).then(pSvgEl=>{let tmpSvgStr=pSvgEl&&typeof pSvgEl.outerHTML==='string'?pSvgEl.outerHTML:typeof pSvgEl==='string'?pSvgEl:null;if(!tmpSvgStr)return;if(tmpThemeColors){tmpSvgStr=libThemeify.themeifySVG(tmpSvgStr);}tmpProvider._writeHiddenInputValue(tmpRawHTMLID,tmpSvgStr);let tmpLatest=tmpProvider._instances[pInput.Hash];if(tmpLatest)tmpLatest.lastValue=tmpSvgStr;},pExpErr=>{if(tmpProvider.log){tmpProvider.log.warn('[Pict-Input-Diagram] exportSvg failed in OnChange',{error:pExpErr.message,inputHash:pInput.Hash});}});}catch(pErr){if(tmpProvider.log){tmpProvider.log.warn('[Pict-Input-Diagram] OnChange handler threw',{error:pErr.message,inputHash:pInput.Hash});}}};this.pict.addView(tmpViewHash,tmpEditorOpts,libPictSectionExcalidraw);let tmpEditorView=this.pict.views[tmpViewHash];if(!tmpEditorView){let tmpErr=new Error('Failed to instantiate Diagram editor view '+tmpViewHash);if(this.log)this.log.error('[Pict-Input-Diagram] addView returned nothing',{viewHash:tmpViewHash});if(typeof fCallback==='function')fCallback(tmpErr);return;}this._setSlotModeClass(pInput,'edit');tmpInst.mode='edit';tmpInst.slotID=tmpSlotID;tmpInst.lastValue=tmpValue;tmpInst.viewInstance=tmpEditorView;tmpInst.viewHash=tmpViewHash;tmpInst.themeColors=tmpThemeColors;this._instances[pInput.Hash]=tmpInst;try{let tmpResult=tmpEditorView.render();if(tmpResult&&typeof tmpResult.then==='function'){tmpResult.then(()=>{if(typeof fCallback==='function')fCallback(null);},pRenderErr=>{if(typeof fCallback==='function')fCallback(pRenderErr);});}else{if(typeof fCallback==='function')fCallback(null);}}catch(pErr){if(this.log)this.log.error('[Pict-Input-Diagram] editor.render threw',{error:pErr.message});if(typeof fCallback==='function')fCallback(pErr);}});}_destroyEdit(pInput){let tmpInst=this._instances[pInput.Hash];if(!tmpInst||!tmpInst.viewInstance)return;let tmpView=tmpInst.viewInstance;try{if(typeof tmpView.destroy==='function')tmpView.destroy();}catch(pErr){if(this.log)this.log.warn('[Pict-Input-Diagram] editor.destroy threw',{error:pErr.message});}if(this.pict.AppData._PictInputDiagram&&this.pict.AppData._PictInputDiagram[pInput.Hash]){delete this.pict.AppData._PictInputDiagram[pInput.Hash];}if(tmpInst.viewHash&&this.pict.views&&this.pict.views[tmpInst.viewHash]){try{delete this.pict.views[tmpInst.viewHash];}catch(pErr){/* not all envs allow delete */}}tmpInst.viewInstance=null;tmpInst.viewHash=null;}// ----------------------------------------------------------------------------
|
|
7105
7101
|
// Public runtime API
|
|
7106
7102
|
// ----------------------------------------------------------------------------
|
|
7107
7103
|
getMode(pInputHash){let tmpInst=this._instances[pInputHash];return tmpInst?tmpInst.mode:null;}setMode(pInputHash,pMode,fCallback){let tmpInst=this._instances[pInputHash];if(!tmpInst){let tmpErr=new Error('Cannot setMode — input is not mounted: '+pInputHash);if(typeof fCallback==='function')fCallback(tmpErr);return;}if(pMode!=='edit'&&pMode!=='view'){let tmpErr=new Error('setMode: unknown mode "'+pMode+'" (use "edit" or "view")');if(typeof fCallback==='function')fCallback(tmpErr);return;}if(tmpInst.mode===pMode){if(typeof fCallback==='function')fCallback(null);return;}if(pMode==='edit'){this._mountEdit(null,tmpInst.input,tmpInst.lastValue,fCallback);return;}this._destroyEdit(tmpInst.input);this._mountView(null,tmpInst.input,tmpInst.lastValue);if(typeof fCallback==='function')fCallback(null);}toggleMode(pInputHash,fCallback){let tmpMode=this.getMode(pInputHash);let tmpNext=tmpMode==='edit'?'view':'edit';this.setMode(pInputHash,tmpNext,fCallback);}commit(pInputHash,fCallback){let tmpInst=this._instances[pInputHash];if(!tmpInst||tmpInst.mode!=='edit'||!tmpInst.viewInstance){if(typeof fCallback==='function')fCallback(null);return;}// Force a synchronous export so the form value reflects the latest
|
|
@@ -7595,10 +7591,7 @@ return super.onInputInitialize(pView,pGroup,pRow,pInput,pValue,pHTMLSelector,pTr
|
|
|
7595
7591
|
* provider.getMode(inputHash) // 'edit' | 'view' | null (not mounted)
|
|
7596
7592
|
* provider.toggleMode(inputHash) // convenience for buttons
|
|
7597
7593
|
* provider.commit(inputHash, fCallback) // force-save edit-mode editor → form
|
|
7598
|
-
*/const libPictSectionInputExtension=require('../Pict-Provider-InputExtension.js');const libMarked=require('marked');//
|
|
7599
|
-
// hosts that never edit (read-mostly forms) don't pull CodeMirror at module
|
|
7600
|
-
// load.
|
|
7601
|
-
let _MarkdownEditorClass=null;function _resolveMarkdownEditor(){if(_MarkdownEditorClass)return _MarkdownEditorClass;try{_MarkdownEditorClass=require('pict-section-markdowneditor');}catch(pErr){throw new Error('[Pict-Input-RichText] Cannot mount edit mode — '+'pict-section-markdowneditor is not installed. '+'Add it to your app\'s dependencies (it\'s an optional peer of pict-section-form).');}return _MarkdownEditorClass;}// Form templates live in pict-section-form's default-template set, so no
|
|
7594
|
+
*/const libPictSectionInputExtension=require('../Pict-Provider-InputExtension.js');const libMarked=require('marked');const libMarkdownEditor=require('pict-section-markdowneditor');// Form templates live in pict-section-form's default-template set, so no
|
|
7602
7595
|
// runtime template injection is needed here. CSS still needs registering
|
|
7603
7596
|
// — the scoped slot styling lives next to the provider.
|
|
7604
7597
|
const libCSS=require('./Pict-Provider-Input-RichText-CSS.js');const _DefaultProviderConfiguration={ProviderIdentifier:'Pict-Input-RichText',AutoInitialize:true,AutoInitializeOrdinal:0,AutoSolveWithApp:false};class PictInputRichText extends libPictSectionInputExtension{constructor(pFable,pOptions,pServiceHash){let tmpOptions=Object.assign({},JSON.parse(JSON.stringify(_DefaultProviderConfiguration)),pOptions);super(pFable,tmpOptions,pServiceHash);/** @type {import('pict')} */this.pict;/** @type {any} */this.log;// inputHash → { mode: 'view'|'edit', slotID, lastValue, viewInstance?: Pict-Section-MarkdownEditor, input }
|
|
@@ -7634,9 +7627,7 @@ this._assignSlotContent(tmpSlotID,'');let tmpEditorOpts=this._buildEditorOptions
|
|
|
7634
7627
|
// hidden input. Subclassing is how pict-section-markdowneditor itself
|
|
7635
7628
|
// is meant to be extended (its constructor accepts options + the parent
|
|
7636
7629
|
// view class is libPictViewClass).
|
|
7637
|
-
let tmpProvider=this
|
|
7638
|
-
// peer dep is missing.
|
|
7639
|
-
let libMarkdownEditor;try{libMarkdownEditor=_resolveMarkdownEditor();}catch(pErr){if(this.log)this.log.error('[Pict-Input-RichText] '+pErr.message);if(typeof fCallback==='function')fCallback(pErr);return;}class RichTextFormEditor extends libMarkdownEditor{constructor(pSubFable,pSubOptions,pSubServiceHash){super(pSubFable,pSubOptions,pSubServiceHash);}onContentChange(pSegmentIndex,pContent){try{// Single-segment editor — every change replaces the value.
|
|
7630
|
+
let tmpProvider=this;class RichTextFormEditor extends libMarkdownEditor{constructor(pSubFable,pSubOptions,pSubServiceHash){super(pSubFable,pSubOptions,pSubServiceHash);}onContentChange(pSegmentIndex,pContent){try{// Single-segment editor — every change replaces the value.
|
|
7640
7631
|
tmpProvider._writeHiddenInputValue(tmpRawHTMLID,pContent);let tmpLatest=tmpProvider._instances[pInput.Hash];if(tmpLatest)tmpLatest.lastValue=pContent;}catch(pErr){if(tmpProvider.log){tmpProvider.log.warn('[Pict-Input-RichText] onContentChange handler failed',{error:pErr.message,inputHash:pInput.Hash});}}if(super.onContentChange)super.onContentChange(pSegmentIndex,pContent);}onImageUpload(pFile,pSegmentIndex,fImgCallback){if(!tmpRichTextOpts.AllowImages){if(tmpProvider.log){tmpProvider.log.info('[Pict-Input-RichText] image upload rejected (AllowImages=false)',{inputHash:pInput.Hash,fileName:pFile&&pFile.name});}// Returning false lets the base markdown editor fall through to
|
|
7641
7632
|
// its default base64 inline; we *don't* want that when text-only,
|
|
7642
7633
|
// so we eat the file by calling back with an error.
|
|
@@ -46,15 +46,15 @@
|
|
|
46
46
|
</p>
|
|
47
47
|
|
|
48
48
|
<div class="controls">
|
|
49
|
-
<button id="toggle-Body" onclick="
|
|
49
|
+
<button id="toggle-Body" onclick="_Pict.PictApplication.demo_toggleMode('Body')">Edit</button>
|
|
50
50
|
|
|
51
51
|
<label>
|
|
52
|
-
<input type="checkbox" id="allow-images" checked onchange="
|
|
52
|
+
<input type="checkbox" id="allow-images" checked onchange="_Pict.PictApplication.demo_setAllowImages('Body', this.checked)">
|
|
53
53
|
Allow image paste
|
|
54
54
|
</label>
|
|
55
55
|
|
|
56
56
|
<label>
|
|
57
|
-
<input type="checkbox" id="use-uploader" checked onchange="
|
|
57
|
+
<input type="checkbox" id="use-uploader" checked onchange="_Pict.PictApplication.demo_setUploaderEnabled(this.checked)">
|
|
58
58
|
Use ImageUploader stub
|
|
59
59
|
<span style="color:#8A7F72; margin-left:6px; font-size:0.75rem;">(off = base64 inline)</span>
|
|
60
60
|
</label>
|