@bpmn-io/properties-panel 0.7.0 → 0.10.0

package/CHANGELOG.md

@@ -6,6 +6,31 @@ All notable changes to [`@bpmn-io/properties-panel`](https://github.com/bpmn-io/
 
 ___Note:__ Yet to be released changes appear here._
 
+## 0.10.0
+
+* `FEAT`: reexport `preact` used in the package ([#124](https://github.com/bpmn-io/properties-panel/pull/124))
+* `FEAT`: bundle library and expose components from single place ([#124](https://github.com/bpmn-io/properties-panel/pull/124))
+
+### BREAKING CHANGES
+
+* Internal structure of the library is no longer exposed.
+  Use root exports instead. Note that names of some of the components have changed, e.g. `TextField` -> `TextFieldEntry`.
+* To extend the library, import the vendored instance of `preact`, i.e. `@bpmn-io/properties-panel/preact`.
+
+## 0.9.0
+
+* `FEAT`: add `DescriptionContext` and `useDescriptionContext` hook ([#122](https://github.com/bpmn-io/properties-panel/pull/122))
+* `FEAT`: add seperate `Description` entry ([#122](https://github.com/bpmn-io/properties-panel/pull/122))
+
+## 0.8.1
+
+* `CHORE`: add outline to checkboxes ([#120](https://github.com/bpmn-io/properties-panel/pull/120))
+* `CHORE`: add missing description styles ([#121](https://github.com/bpmn-io/properties-panel/pull/121))
+
+## 0.8.0
+
+* `FEAT`: allow to disable textarea, select, and checkbox ([#118](https://github.com/bpmn-io/properties-panel/pull/118))
+
 ## 0.7.0
 
 * `FEAT`: add dropdown button ([#116](https://github.com/bpmn-io/properties-panel/pull/116))

package/assets/properties-panel.css

@@ -29,7 +29,12 @@
 
   --text-base-color: var(--color-grey-225-10-15);
   --text-error-color: var(--color-red-360-100-45);
+  --link-color: var(--color-blue-205-100-50);
+
   --description-color: var(--color-grey-225-10-35);
+  --description-code-background-color: var(--color-grey-225-10-97);
+  --description-code-border-color: var(--color-grey-225-10-85);
+  --description-list-item-color: var(--color-grey-225-10-35);
 
   --placeholder-color: var(--color-grey-225-10-75);
 
@@ -359,7 +364,10 @@
   margin: 2px 0 1px;
 }
 
-.bio-properties-panel-description {
+.bio-properties-panel-description, 
+.bio-properties-panel-description p,
+.bio-properties-panel-description span,
+.bio-properties-panel-description div {
   color: var(--description-color);
   display: block;
   margin: 2px 0 4px;
@@ -368,6 +376,34 @@
   font-size: var(--text-size-small);
 }
 
+.bio-properties-panel-description code {
+  color: var(--description-color);
+  font-family: var(--font-family);
+  font-size: var(--text-size-small);
+  line-height: var(--line-height-condensed);
+  padding: 0 2px;
+  background-color: var(--description-code-background-color);
+  border: 1px solid var(--description-code-border-color);
+  border-radius: 3px;
+}
+
+.bio-properties-panel-description ul {
+  padding: 0;
+  margin: 0 0 0 12px;
+  list-style-type: disc;
+}
+
+.bio-properties-panel-description li {
+  color: var(--description-list-item-color);
+  margin: 0 0 0 12px;
+}
+
+.bio-properties-panel-description a {
+  color: var(--link-color);
+  font-size: var(--text-size-small);
+  text-decoration: underline;
+}
+
 .bio-properties-panel-input {
   padding: 3px 6px 2px;
   border: 1px solid var(--input-border-color);
@@ -410,6 +446,11 @@ select.bio-properties-panel-input {
   vertical-align: middle;
 }
 
+.bio-properties-panel-input[type="checkbox"]:focus {
+  outline: 1px solid var(--input-focus-border-color);
+  outline-offset: 0;
+}
+
 .bio-properties-panel-checkbox > .bio-properties-panel-label {
   display: inline-block;
   font-size: var(--text-size-base);