π DataFormsJS π A minimal JavaScript Framework, standalone React and Web Components, and JSX Compiler for rapid development of high quality websites and single page applications.
MIT License
Bot releases are hidden (Show)
decodeURIComponent
was called out of order allowing for Proof-of-concept (POC) Path traversal attacks on a local developer machine using URLs such as http://127.0.0.1:8080/..%2fpackage.json
or bash 127.0.0.1:8080/%2e%2e%2f%2e%2e%2f%2e%2e%2f%2e%2e%2f%2e%2e%2f%2e%2e%2f%2e%2e%2f%2e%2e%2f%2e%2e%2f%2e%2e%2fetc%2fpasswd
jsxLoader.babelUrl
was changed and can be set back to unpkg if needed by setting the URL prior to the page being loaded.@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {}
would only be included if the browser is IE 11.
http://127.0.0.1:4000/unit-testing-react
http://127.0.0.1:4000/unit-testing-preact
Published by ConradSollitt 2 months ago
https://polyfill.io/v3/polyfill.min.js?
with https://cdnjs.cloudflare.com/polyfill/v3/polyfill.min.js?version=4.8.0&
polyfill.io
.Published by ConradSollitt over 1 year ago
Published by ConradSollitt over 1 year ago
[utils.js].isAttachedToDom()
to [utils.js].isDomAttached()
because the text string ToDom
would show up when searching source code for case-insensitive todo
. This is a minor update but prevents the files from showing up in external projects by accident. This could be considered a breaking change if an app calls the function but that is unlikely the case and it's mostly an internal function because it's undocumented outside of the changelog; that is the reason why a patch version is being released.Published by ConradSollitt almost 2 years ago
<json-data>
that was introduced on the previous build where format.{func}
was not working in [data-show]
attributes.Published by ConradSollitt almost 2 years ago
[data-format]
from Web Component <url-router>
when using attribute [url-param]
. The same functionality when using Web Component <json-data>
with attribute [data-bind]
is provided.
data-format="number|date|dateTime|time|{function}"
and custom functions.js/web-components/url-router.js
https://github.com/dataformsjs/dataformsjs/blob/master/js/web-components/url-router.js
pinch-to-zoom
on mobile devices would cause previous/next image navigation to occur.js/web-components/image-gallery.js
https://github.com/dataformsjs/dataformsjs/blob/master/js/web-components/image-gallery.js
js/plugins/imageGallery.js
https://github.com/dataformsjs/dataformsjs/blob/master/js/plugins/imageGallery.js
js/react/es6/ImageGallery.js
https://github.com/dataformsjs/dataformsjs/blob/master/js/react/es6/ImageGallery.js
Published by ConradSollitt over 2 years ago
<JsonData>
@license
was included in the main comment which resulted in Vite including about 5 kB (uncompressed) and about 1.5 kB of extra code on the build process.en-US
to use format {date} {time}
instead of {date}, {time}
because most people in the US (and software programs) do not use the comma while Chrome uses the comma.Published by ConradSollitt over 2 years ago
~/js/DataFormsJS.js
app.refreshHtmlControl()
nested HTML controls are now renderedapp.refreshHtmlControl()
is called from the JS Control <json-data>
~/js/web-components/Component.js
camelCase
will be available as dashed-case
from HTML Observable Attributes~/js/plugins/exportToCsv.js
~/js/plugins/exportToExcel.js
app.refreshHtmlControl()
is called.onRendered(rootElement)
instead of onRendered()
.~/js/plugins/i18n.js
~/js/web-components/i18n-service.js
[[key]]
data-export-file-name="[[Countries]].xlsx" data-i18n-attr="data-export-file-name"
Countries
and Countries.xlsx
would have had to be defined for each languageCountries
has to be definedv-i18n-attr
directivePublished by ConradSollitt over 2 years ago
data-worksheet-name
to data-export-file-name
excluding file extension .xlsx
if the attribute is not includedPublished by ConradSollitt over 2 years ago
~/js/web-components/export-to-excel-service.js
~/js/plugins/exportToExcel.js
[data-export-all]
was added to always export all rows regardless of filter.dataBind
plugin to bind global window.*
variables for a basic webpage if not using SPAdata-table
to not show an error when an empty table is displayed without data-bind
Published by ConradSollitt over 2 years ago
app.addPage()
app.addPlugin()
app.getClassFunctionNames()
- New functionjsonData
page object:
js/pages/classes/JsonData.js
String.prototype.substr()
with String.prototype.substring()
. IDE's such as VS Code show substr()
as depreciated because it is a non-standard function.package.json
to use the latest and specific versions of @babel/standalone
, terser
, and uglify-js
for the build process. This makes the build process work across systems as expected.// Framework updates to support Classes
app.addPage('name', class Page {
onRouteLoad() {}
onBeforeRender() {}
onRendered() {}
onRouteUnload() {}
})
app.addPlugin('name', class Plugin {
onRouteLoad() {}
onBeforeRender() {}
onRendered() {}
onRouteUnload() {}
})
class MyPage extends JsonData {
onRendered() {
console.log('MyPage.onRendered()')
}
}
app.addPage('MyPage', MyPage);
Published by ConradSollitt almost 3 years ago
Published by ConradSollitt almost 3 years ago
<markdown-content>
<markdown-content>
<Markdown>
4.#
which was released earlier this month. Previously version 3 was supported.Published by ConradSollitt about 3 years ago
.DS_Store
where accidentally published to npm so this release excludes them
.gitignore
, however npm published themPublished by ConradSollitt about 3 years ago
Published by ConradSollitt about 3 years ago
<json-data>
Web Component
manual-fetch-mode
, that if defined on an element prevents the web service from running when the page first loads. This allows for scenarios where one user may need to see the data and another user may not based on permissions. When this attribute is defined the fetch()
method can be used to download the data.<json-data url="..." manual-fetch-mode>
document.querySelector('json-data[manual-fetch-mode]').fetch()
Published by ConradSollitt about 3 years ago
intersectionRatio
<animation-service intersection-ratio="0.3"></animation-service>
<script>
// Framework Plugin Property
app.plugins.animation.intersectionRatio = 0.3
</script>
Published by ConradSollitt about 3 years ago
sourceMaps
property to jsxLoader
isSupportedBrowser
set to false
so that Babel Standalone is used as the compiler.jsxLoader.isSupportedBrowser = false;
jsxLoader.sourceMaps = true;
js/plugins/animation.js
https://github.com/dataformsjs/dataformsjs/blob/master/js/plugins/animation.js
js/web-components/animation-service.js
https://github.com/dataformsjs/dataformsjs/blob/master/js/web-components/animation-service.js
js/web-components/animation-service.css
https://github.com/dataformsjs/dataformsjs/blob/master/js/web-components/animation-service.css
Published by ConradSollitt about 3 years ago
<json-data>
onready
event attribute to only run JavaScript code if the <json-data>
is still connected to the page when the web service completes. <json-data onready="() => { document.getElementById('element1').textContent = document.getElementById('element2').textContent; }"
Published by ConradSollitt over 3 years ago
Component
class for Web Components that extends HTMLElement
js/web-components/Component.js