@oscarpalmer/oui 0.38.0 → 0.40.0

package/dist/css/icon.css

@@ -0,0 +1,99 @@
+/*! https://github.com/oscarpalmer/oui */
+/*! Icons via https://tabler.io/icons */
+
+
+:where(.oui-icon) {
+  content: "";
+  width: 1em;
+  height: 1em;
+  display: inline-flex;
+  opacity: 1;
+  background-color: color-mix(in oklab, var(--oui-icon-color), transparent var(--oui-icon-percentage));
+  -webkit-mask-image: url("");
+  mask-image: url("");
+  -webkit-mask-position: center;
+  mask-position: center;
+  -webkit-mask-repeat: no-repeat;
+  mask-repeat: no-repeat;
+  -webkit-mask-size: 1em 1em;
+  mask-size: 1em 1em;
+  pointer-events: none;
+  transition: 0.125s ease-in-out;
+  transition-property: background-color, color, opacity, -webkit-mask-image;
+  transition-property: background-color, color, mask-image, opacity;
+  transition-property: background-color, color, mask-image, opacity, -webkit-mask-image;
+  --oui-icon-color: currentcolor;
+  --oui-icon-percentage: 0%;
+}
+:where(.oui-icon--add, .oui-icon--plus) {
+  -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLXBsdXMiPjxwYXRoIHN0cm9rZT0ibm9uZSIgZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIgLz48cGF0aCBkPSJNMTIgNWwwIDE0IiAvPjxwYXRoIGQ9Ik01IDEybDE0IDAiIC8+PC9zdmc+");
+  mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLXBsdXMiPjxwYXRoIHN0cm9rZT0ibm9uZSIgZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIgLz48cGF0aCBkPSJNMTIgNWwwIDE0IiAvPjxwYXRoIGQ9Ik01IDEybDE0IDAiIC8+PC9zdmc+");
+}
+:where(.oui-icon--cancel, .oui-icon--close, .oui-icon--x) {
+  -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLXgiPjxwYXRoIHN0cm9rZT0ibm9uZSIgZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIgLz48cGF0aCBkPSJNMTggNmwtMTIgMTIiIC8+PHBhdGggZD0iTTYgNmwxMiAxMiIgLz48L3N2Zz4=");
+  mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLXgiPjxwYXRoIHN0cm9rZT0ibm9uZSIgZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIgLz48cGF0aCBkPSJNMTggNmwtMTIgMTIiIC8+PHBhdGggZD0iTTYgNmwxMiAxMiIgLz48L3N2Zz4=");
+}
+:where(.oui-icon--check) {
+  -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLWNoZWNrIj48cGF0aCBzdHJva2U9Im5vbmUiIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiIC8+PHBhdGggZD0iTTUgMTJsNSA1bDEwIC0xMCIgLz48L3N2Zz4=");
+  mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLWNoZWNrIj48cGF0aCBzdHJva2U9Im5vbmUiIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiIC8+PHBhdGggZD0iTTUgMTJsNSA1bDEwIC0xMCIgLz48L3N2Zz4=");
+}
+:where(.oui-icon--chevron-up) {
+  -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLWNoZXZyb24tdXAiPjxwYXRoIHN0cm9rZT0ibm9uZSIgZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIgLz48cGF0aCBkPSJNNiAxNWw2IC02bDYgNiIgLz48L3N2Zz4=");
+  mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLWNoZXZyb24tdXAiPjxwYXRoIHN0cm9rZT0ibm9uZSIgZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIgLz48cGF0aCBkPSJNNiAxNWw2IC02bDYgNiIgLz48L3N2Zz4=");
+}
+:where(.oui-icon--chevron-right) {
+  -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLWNoZXZyb24tcmlnaHQiPjxwYXRoIHN0cm9rZT0ibm9uZSIgZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIgLz48cGF0aCBkPSJNOSA2bDYgNmwtNiA2IiAvPjwvc3ZnPg==");
+  mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLWNoZXZyb24tcmlnaHQiPjxwYXRoIHN0cm9rZT0ibm9uZSIgZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIgLz48cGF0aCBkPSJNOSA2bDYgNmwtNiA2IiAvPjwvc3ZnPg==");
+}
+:where(.oui-icon--chevron-down) {
+  -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLWNoZXZyb24tZG93biI+PHBhdGggc3Ryb2tlPSJub25lIiBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIiAvPjxwYXRoIGQ9Ik02IDlsNiA2bDYgLTYiIC8+PC9zdmc+");
+  mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLWNoZXZyb24tZG93biI+PHBhdGggc3Ryb2tlPSJub25lIiBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIiAvPjxwYXRoIGQ9Ik02IDlsNiA2bDYgLTYiIC8+PC9zdmc+");
+}
+:where(.oui-icon--chevron-left) {
+  -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLWNoZXZyb24tbGVmdCI+PHBhdGggc3Ryb2tlPSJub25lIiBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIiAvPjxwYXRoIGQ9Ik0xNSA2bC02IDZsNiA2IiAvPjwvc3ZnPg==");
+  mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLWNoZXZyb24tbGVmdCI+PHBhdGggc3Ryb2tlPSJub25lIiBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIiAvPjxwYXRoIGQ9Ik0xNSA2bC02IDZsNiA2IiAvPjwvc3ZnPg==");
+}
+:where(.oui-icon--cog, .oui-icon--settings) {
+  -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLXNldHRpbmdzIj48cGF0aCBzdHJva2U9Im5vbmUiIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiIC8+PHBhdGggZD0iTTEwLjMyNSA0LjMxN2MuNDI2IC0xLjc1NiAyLjkyNCAtMS43NTYgMy4zNSAwYTEuNzI0IDEuNzI0IDAgMCAwIDIuNTczIDEuMDY2YzEuNTQzIC0uOTQgMy4zMSAuODI2IDIuMzcgMi4zN2ExLjcyNCAxLjcyNCAwIDAgMCAxLjA2NSAyLjU3MmMxLjc1NiAuNDI2IDEuNzU2IDIuOTI0IDAgMy4zNWExLjcyNCAxLjcyNCAwIDAgMCAtMS4wNjYgMi41NzNjLjk0IDEuNTQzIC0uODI2IDMuMzEgLTIuMzcgMi4zN2ExLjcyNCAxLjcyNCAwIDAgMCAtMi41NzIgMS4wNjVjLS40MjYgMS43NTYgLTIuOTI0IDEuNzU2IC0zLjM1IDBhMS43MjQgMS43MjQgMCAwIDAgLTIuNTczIC0xLjA2NmMtMS41NDMgLjk0IC0zLjMxIC0uODI2IC0yLjM3IC0yLjM3YTEuNzI0IDEuNzI0IDAgMCAwIC0xLjA2NSAtMi41NzJjLTEuNzU2IC0uNDI2IC0xLjc1NiAtMi45MjQgMCAtMy4zNWExLjcyNCAxLjcyNCAwIDAgMCAxLjA2NiAtMi41NzNjLS45NCAtMS41NDMgLjgyNiAtMy4zMSAyLjM3IC0yLjM3YzEgLjYwOCAyLjI5NiAuMDcgMi41NzIgLTEuMDY1IiAvPjxwYXRoIGQ9Ik05IDEyYTMgMyAwIDEgMCA2IDBhMyAzIDAgMCAwIC02IDAiIC8+PC9zdmc+");
+  mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLXNldHRpbmdzIj48cGF0aCBzdHJva2U9Im5vbmUiIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiIC8+PHBhdGggZD0iTTEwLjMyNSA0LjMxN2MuNDI2IC0xLjc1NiAyLjkyNCAtMS43NTYgMy4zNSAwYTEuNzI0IDEuNzI0IDAgMCAwIDIuNTczIDEuMDY2YzEuNTQzIC0uOTQgMy4zMSAuODI2IDIuMzcgMi4zN2ExLjcyNCAxLjcyNCAwIDAgMCAxLjA2NSAyLjU3MmMxLjc1NiAuNDI2IDEuNzU2IDIuOTI0IDAgMy4zNWExLjcyNCAxLjcyNCAwIDAgMCAtMS4wNjYgMi41NzNjLjk0IDEuNTQzIC0uODI2IDMuMzEgLTIuMzcgMi4zN2ExLjcyNCAxLjcyNCAwIDAgMCAtMi41NzIgMS4wNjVjLS40MjYgMS43NTYgLTIuOTI0IDEuNzU2IC0zLjM1IDBhMS43MjQgMS43MjQgMCAwIDAgLTIuNTczIC0xLjA2NmMtMS41NDMgLjk0IC0zLjMxIC0uODI2IC0yLjM3IC0yLjM3YTEuNzI0IDEuNzI0IDAgMCAwIC0xLjA2NSAtMi41NzJjLTEuNzU2IC0uNDI2IC0xLjc1NiAtMi45MjQgMCAtMy4zNWExLjcyNCAxLjcyNCAwIDAgMCAxLjA2NiAtMi41NzNjLS45NCAtMS41NDMgLjgyNiAtMy4zMSAyLjM3IC0yLjM3YzEgLjYwOCAyLjI5NiAuMDcgMi41NzIgLTEuMDY1IiAvPjxwYXRoIGQ9Ik05IDEyYTMgMyAwIDEgMCA2IDBhMyAzIDAgMCAwIC02IDAiIC8+PC9zdmc+");
+}
+:where(.oui-icon--delete, .oui-icon--remove, .oui-icon--trash) {
+  -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLXRyYXNoIj48cGF0aCBzdHJva2U9Im5vbmUiIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiIC8+PHBhdGggZD0iTTQgN2wxNiAwIiAvPjxwYXRoIGQ9Ik0xMCAxMWwwIDYiIC8+PHBhdGggZD0iTTE0IDExbDAgNiIgLz48cGF0aCBkPSJNNSA3bDEgMTJhMiAyIDAgMCAwIDIgMmg4YTIgMiAwIDAgMCAyIC0ybDEgLTEyIiAvPjxwYXRoIGQ9Ik05IDd2LTNhMSAxIDAgMCAxIDEgLTFoNGExIDEgMCAwIDEgMSAxdjMiIC8+PC9zdmc+");
+  mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLXRyYXNoIj48cGF0aCBzdHJva2U9Im5vbmUiIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiIC8+PHBhdGggZD0iTTQgN2wxNiAwIiAvPjxwYXRoIGQ9Ik0xMCAxMWwwIDYiIC8+PHBhdGggZD0iTTE0IDExbDAgNiIgLz48cGF0aCBkPSJNNSA3bDEgMTJhMiAyIDAgMCAwIDIgMmg4YTIgMiAwIDAgMCAyIC0ybDEgLTEyIiAvPjxwYXRoIGQ9Ik05IDd2LTNhMSAxIDAgMCAxIDEgLTFoNGExIDEgMCAwIDEgMSAxdjMiIC8+PC9zdmc+");
+}
+:where(.oui-icon--edit, .oui-icon--pencil) {
+  -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLXBlbmNpbCI+PHBhdGggc3Ryb2tlPSJub25lIiBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIiAvPjxwYXRoIGQ9Ik00IDIwaDRsMTAuNSAtMTAuNWEyLjgyOCAyLjgyOCAwIDEgMCAtNCAtNGwtMTAuNSAxMC41djQiIC8+PHBhdGggZD0iTTEzLjUgNi41bDQgNCIgLz48L3N2Zz4=");
+  mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLXBlbmNpbCI+PHBhdGggc3Ryb2tlPSJub25lIiBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIiAvPjxwYXRoIGQ9Ik00IDIwaDRsMTAuNSAtMTAuNWEyLjgyOCAyLjgyOCAwIDEgMCAtNCAtNGwtMTAuNSAxMC41djQiIC8+PHBhdGggZD0iTTEzLjUgNi41bDQgNCIgLz48L3N2Zz4=");
+}
+:where(.oui-icon--hamburger, .oui-icon--menu) {
+  -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLW1lbnUtMiI+PHBhdGggc3Ryb2tlPSJub25lIiBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIiAvPjxwYXRoIGQ9Ik00IDZsMTYgMCIgLz48cGF0aCBkPSJNNCAxMmwxNiAwIiAvPjxwYXRoIGQ9Ik00IDE4bDE2IDAiIC8+PC9zdmc+");
+  mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLW1lbnUtMiI+PHBhdGggc3Ryb2tlPSJub25lIiBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIiAvPjxwYXRoIGQ9Ik00IDZsMTYgMCIgLz48cGF0aCBkPSJNNCAxMmwxNiAwIiAvPjxwYXRoIGQ9Ik00IDE4bDE2IDAiIC8+PC9zdmc+");
+}
+:where(.oui-icon--home, .oui-icon--house) {
+  -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLWhvbWUiPjxwYXRoIHN0cm9rZT0ibm9uZSIgZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIgLz48cGF0aCBkPSJNNSAxMmwtMiAwbDkgLTlsOSA5bC0yIDAiIC8+PHBhdGggZD0iTTUgMTJ2N2EyIDIgMCAwIDAgMiAyaDEwYTIgMiAwIDAgMCAyIC0ydi03IiAvPjxwYXRoIGQ9Ik05IDIxdi02YTIgMiAwIDAgMSAyIC0yaDJhMiAyIDAgMCAxIDIgMnY2IiAvPjwvc3ZnPg==");
+  mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLWhvbWUiPjxwYXRoIHN0cm9rZT0ibm9uZSIgZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIgLz48cGF0aCBkPSJNNSAxMmwtMiAwbDkgLTlsOSA5bC0yIDAiIC8+PHBhdGggZD0iTTUgMTJ2N2EyIDIgMCAwIDAgMiAyaDEwYTIgMiAwIDAgMCAyIC0ydi03IiAvPjxwYXRoIGQ9Ik05IDIxdi02YTIgMiAwIDAgMSAyIC0yaDJhMiAyIDAgMCAxIDIgMnY2IiAvPjwvc3ZnPg==");
+}
+:where(.oui-icon--loader, .oui-icon--spinner) {
+  -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLWxvYWRlci0yIj48cGF0aCBzdHJva2U9Im5vbmUiIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiIC8+PHBhdGggZD0iTTEyIDNhOSA5IDAgMSAwIDkgOSIgLz48L3N2Zz4=");
+  mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLWxvYWRlci0yIj48cGF0aCBzdHJva2U9Im5vbmUiIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiIC8+PHBhdGggZD0iTTEyIDNhOSA5IDAgMSAwIDkgOSIgLz48L3N2Zz4=");
+  animation: oui-icon-spinner 1s linear infinite;
+}
+@keyframes oui-icon-spinner {
+  to {
+    transform: rotate3d(0, 0, 1, 360deg);
+  }
+}
+:where(.oui-icon--minus, .oui-icon--subtract) {
+  -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLW1pbnVzIj48cGF0aCBzdHJva2U9Im5vbmUiIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiIC8+PHBhdGggZD0iTTUgMTJsMTQgMCIgLz48L3N2Zz4=");
+  mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLW1pbnVzIj48cGF0aCBzdHJva2U9Im5vbmUiIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiIC8+PHBhdGggZD0iTTUgMTJsMTQgMCIgLz48L3N2Zz4=");
+}
+:where(.oui-icon--search) {
+  -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLXNlYXJjaCI+PHBhdGggc3Ryb2tlPSJub25lIiBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIiAvPjxwYXRoIGQ9Ik0zIDEwYTcgNyAwIDEgMCAxNCAwYTcgNyAwIDEgMCAtMTQgMCIgLz48cGF0aCBkPSJNMjEgMjFsLTYgLTYiIC8+PC9zdmc+");
+  mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLXNlYXJjaCI+PHBhdGggc3Ryb2tlPSJub25lIiBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIiAvPjxwYXRoIGQ9Ik0zIDEwYTcgNyAwIDEgMCAxNCAwYTcgNyAwIDEgMCAtMTQgMCIgLz48cGF0aCBkPSJNMjEgMjFsLTYgLTYiIC8+PC9zdmc+");
+}
+:where(.oui-icon--star) {
+  -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLXN0YXIiPjxwYXRoIHN0cm9rZT0ibm9uZSIgZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIgLz48cGF0aCBkPSJNMTIgMTcuNzVsLTYuMTcyIDMuMjQ1bDEuMTc5IC02Ljg3M2wtNSAtNC44NjdsNi45IC0xbDMuMDg2IC02LjI1M2wzLjA4NiA2LjI1M2w2LjkgMWwtNSA0Ljg2N2wxLjE3OSA2Ljg3M2wtNi4xNTggLTMuMjQ1IiAvPjwvc3ZnPg==");
+  mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLXN0YXIiPjxwYXRoIHN0cm9rZT0ibm9uZSIgZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIgLz48cGF0aCBkPSJNMTIgMTcuNzVsLTYuMTcyIDMuMjQ1bDEuMTc5IC02Ljg3M2wtNSAtNC44NjdsNi45IC0xbDMuMDg2IC02LjI1M2wzLjA4NiA2LjI1M2w2LjkgMWwtNSA0Ljg2N2wxLjE3OSA2Ljg3M2wtNi4xNTggLTMuMjQ1IiAvPjwvc3ZnPg==");
+}
+
+

package/dist/css/listbox.css

@@ -154,6 +154,9 @@
   line-height: 1.25;
   cursor: pointer;
 }
+:where(oui-listbox:has([oui-listbox-header]) [oui-listbox-option]) {
+  scroll-margin-top: 2em;
+}
 :where([oui-listbox-option][aria-selected=true i]) {
   background-color: var(--oui-blue-2);
   color: var(--oui-blue-9);

package/dist/css/message.css

@@ -9,11 +9,12 @@
   --oui-shadow-mixed: color-mix(
   	in oklab,
   	var(--oui-shadow-value, var(--oui-gray-6)),
-  	transparent 92.5%
+  	transparent var(--oui-shadow-percentage)
   );
+  --oui-shadow-percentage: 92.5%;
   box-shadow: inset 0 1px 0 0 transparent, 0 0 0 1px var(--oui-shadow-mixed), 0 1px 2px -0.5px var(--oui-shadow-mixed), 0 2px 4px -1px var(--oui-shadow-mixed);
   padding: 1em 1.25em;
-  background-color: color-mix(in oklab, var(--oui-background), transparent 25%);
+  background-color: color-mix(in oklab, var(--oui-background), transparent 75%);
   border-radius: 0.5em;
   max-width: -moz-fit-content;
   max-width: fit-content;
@@ -31,7 +32,7 @@
 :where(.oui-message hr) {
   height: 1px;
   margin: 0 -1.25em;
-  background-color: var(--oui-border);
+  background-color: color-mix(in oklab, var(--oui-border), transparent 25%);
   border: none;
 }
 :where(.oui-message p) {

package/dist/css/mixins/button.mixins.css

@@ -1,2 +1,3 @@
 
 
+

package/dist/css/reset.css

@@ -140,7 +140,7 @@ summary) {
 }
 
 :where(h1) {
-  font-size: 2em;
+  font-size: 2rem;
 }
 
 :where(hr) {

package/dist/css/tabs.css

@@ -1,10 +1,11 @@
 /*! https://github.com/oscarpalmer/oui */
 
 
+
 :where(oui-tabs) {
   display: flex;
 }
-:where(oui-tabs:not([orientation=horizontal i])) {
+:where(oui-tabs:not([orientation=vertical i])) {
   flex-flow: column nowrap;
 }
 :where(oui-tabs[orientation=vertical i]) {
@@ -21,12 +22,12 @@
 }
 
 :where([oui-tabs-tab]) {
-  --oui-background-percentage: 25%;
+  --oui-background-percentage: 50%;
   --oui-background-value: var(--oui-gray-2);
   --oui-foreground-percentage: 0%;
   --oui-foreground-value: var(--oui-gray-8);
   --oui-outline-percentage: 100%;
-  --oui-outline-value: var(--oui-gray-6);
+  --oui-outline-value: var(--oui-gray-5);
   --oui-shadow-inset: color-mix(in oklab, var(--oui-absolute), transparent 75%);
   --oui-shadow-percentage: 82.5%;
   --oui-shadow-value: color-mix(
@@ -46,9 +47,42 @@
   border: none;
   color: color-mix(in oklab, var(--oui-foreground-value), transparent var(--oui-foreground-percentage));
   line-height: 1.25;
+  position: relative;
   transition: 0.125s ease-in-out;
   transition-property: background, outline, box-shadow, color;
 }
+:where([oui-tabs-tab])::after {
+  content: "";
+  width: 1em;
+  height: 1em;
+  display: inline-flex;
+  opacity: 0;
+  background-color: color-mix(in oklab, var(--oui-foreground-value), transparent var(--oui-foreground-percentage));
+  -webkit-mask-image: url("");
+  mask-image: url("");
+  -webkit-mask-position: center;
+  mask-position: center;
+  -webkit-mask-repeat: no-repeat;
+  mask-repeat: no-repeat;
+  -webkit-mask-size: 1em 1em;
+  mask-size: 1em 1em;
+  pointer-events: none;
+  transition: 0.125s ease-in-out;
+  transition-property: background-color, color, opacity, -webkit-mask-image;
+  transition-property: background-color, color, mask-image, opacity;
+  transition-property: background-color, color, mask-image, opacity, -webkit-mask-image;
+  position: absolute;
+  inset: 50% auto auto 50%;
+  transform: translate3d(-50%, -50%, 0);
+}
+:where([oui-tabs-tab]):has(.oui-icon:is(:first-child))::after {
+  inset: auto;
+  transform: none;
+}
+:where([oui-tabs-tab]):has(.oui-icon:is(:last-child))::after {
+  inset: auto 0.75em auto auto;
+  transform: none;
+}
 :where([oui-tabs-tab]):focus-visible {
   --oui-outline-percentage: 75%;
 }
@@ -59,6 +93,57 @@
     --oui-shadow-percentage: 90%;
   }
 }
+:where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[aria-busy=true i]:not(:has(.oui-icon:is(:first-child, :last-child))), :where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[data-state=busy i]:not(:has(.oui-icon:is(:first-child, :last-child))), :where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[data-state=error i]:not(:has(.oui-icon:is(:first-child, :last-child))), :where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[data-state=loading i]:not(:has(.oui-icon:is(:first-child, :last-child))), :where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[data-state=success i]:not(:has(.oui-icon:is(:first-child, :last-child))) {
+  color: transparent;
+}
+:where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[aria-busy=true i]::after, :where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[data-state=busy i]::after, :where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[data-state=error i]::after, :where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[data-state=loading i]::after, :where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[data-state=success i]::after {
+  opacity: 1;
+}
+:where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[aria-busy=true i] .oui-icon, :where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[data-state=busy i] .oui-icon, :where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[data-state=error i] .oui-icon, :where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[data-state=loading i] .oui-icon, :where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[data-state=success i] .oui-icon {
+  opacity: 0;
+}
+:where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[aria-busy=true i], :where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[data-state=busy i], :where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[data-state=loading i] {
+  --oui-background-value: var(--oui-blue-2);
+  --oui-foreground-value: var(--oui-blue-8);
+  --oui-outline-value: var(--oui-blue-5);
+}
+:where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[aria-busy=true i]::after, :where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[data-state=busy i]::after, :where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[data-state=loading i]::after {
+  -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLWxvYWRlci0yIj48cGF0aCBzdHJva2U9Im5vbmUiIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiIC8+PHBhdGggZD0iTTEyIDNhOSA5IDAgMSAwIDkgOSIgLz48L3N2Zz4=");
+  mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLWxvYWRlci0yIj48cGF0aCBzdHJva2U9Im5vbmUiIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiIC8+PHBhdGggZD0iTTEyIDNhOSA5IDAgMSAwIDkgOSIgLz48L3N2Zz4=");
+  transform-origin: center;
+  animation: oui-button-icon-centered 1s linear infinite;
+}
+@keyframes oui-button-icon-centered {
+  to {
+    transform: translate3d(-50%, -50%, 0) rotate3d(0, 0, 1, 360deg);
+  }
+}
+:where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[aria-busy=true i]:has(.oui-icon:is(:first-child, :last-child))::after, :where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[data-state=busy i]:has(.oui-icon:is(:first-child, :last-child))::after, :where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[data-state=loading i]:has(.oui-icon:is(:first-child, :last-child))::after {
+  animation: oui-button-icon-offset 1s linear infinite;
+}
+@keyframes oui-button-icon-offset {
+  to {
+    transform: rotate3d(0, 0, 1, 360deg);
+  }
+}
+:where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[data-state=error i] {
+  --oui-background-value: var(--oui-red-2);
+  --oui-foreground-value: var(--oui-red-8);
+  --oui-outline-value: var(--oui-red-5);
+}
+:where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[data-state=error i]::after {
+  -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLXgiPjxwYXRoIHN0cm9rZT0ibm9uZSIgZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIgLz48cGF0aCBkPSJNMTggNmwtMTIgMTIiIC8+PHBhdGggZD0iTTYgNmwxMiAxMiIgLz48L3N2Zz4=");
+  mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLXgiPjxwYXRoIHN0cm9rZT0ibm9uZSIgZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIgLz48cGF0aCBkPSJNMTggNmwtMTIgMTIiIC8+PHBhdGggZD0iTTYgNmwxMiAxMiIgLz48L3N2Zz4=");
+}
+:where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[data-state=success i] {
+  --oui-background-value: var(--oui-green-2);
+  --oui-foreground-value: var(--oui-green-8);
+  --oui-outline-value: var(--oui-green-5);
+}
+:where([oui-tabs-tab]):not([disabled], [aria-disabled=true i])[data-state=success i]::after {
+  -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLWNoZWNrIj48cGF0aCBzdHJva2U9Im5vbmUiIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiIC8+PHBhdGggZD0iTTUgMTJsNSA1bDEwIC0xMCIgLz48L3N2Zz4=");
+  mask-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJpY29uIGljb24tdGFibGVyIGljb25zLXRhYmxlci1vdXRsaW5lIGljb24tdGFibGVyLWNoZWNrIj48cGF0aCBzdHJva2U9Im5vbmUiIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiIC8+PHBhdGggZD0iTTUgMTJsNSA1bDEwIC0xMCIgLz48L3N2Zz4=");
+}
 :where([oui-tabs-tab]):not([disabled], [aria-disabled=true i]):active {
   box-shadow: 0 0 0 1px var(--oui-shadow-value), inset 0 1px 2px 0 var(--oui-shadow-value), inset 0 2px 4px 0 var(--oui-shadow-value);
   scale: 0.95;
@@ -72,6 +157,13 @@
   --oui-shadow-percentage: 92.5%;
   font-style: italic;
 }
+:where([oui-tabs-tab]) .oui-icon {
+  width: 1em;
+  height: 1em;
+}
+:where([oui-tabs-tab]) .oui-icon:is(:first-child, :last-child) {
+  transition: opacity 0.125s ease-in-out;
+}
 :where([oui-tabs-tab]) {
   font-size: 0.75rem;
   flex-shrink: 0;

package/dist/css/typography.css

@@ -0,0 +1,90 @@
+@charset "UTF-8";
+.oui-blockquote {
+  font-size: 1.125rem;
+}
+.oui-blockquote:not(:has(p))::before, .oui-blockquote:has(p) p:first-child::before {
+  content: "“";
+  width: 1em;
+  margin: 0 0 0 -1em;
+  display: inline-block;
+  text-align: right;
+  position: absolute;
+}
+.oui-blockquote:not(:has(p))::after {
+  content: "”";
+}
+.oui-blockquote:has(p) > * + * {
+  margin-top: 1em;
+}
+.oui-blockquote:has(p) p:last-child::after {
+  content: "”";
+}
+.oui-font-antique {
+  font-family: Superclarendon, "Bookman Old Style", "URW Bookman", "URW Bookman L", "Georgia Pro", Georgia, serif;
+  font-weight: 300;
+}
+.oui-font-didot {
+  font-family: Didot, "Bodoni MT", "Noto Serif Display", "URW Palladio L", "P052", Sylfaen, serif;
+}
+.oui-font-handwritten {
+  font-family: "Segoe Print", "Bradley Hand", Chilanka, "TSCu_Comic", casual, cursive;
+}
+.oui-font-humanist {
+  font-family: Seravek, "Gill Sans Nova", Ubuntu, Calibri, "DejaVu Sans", source-sans-pro, sans-serif;
+}
+.oui-font-humanist--classical {
+  font-family: Optima, Candara, "Noto Sans", source-sans-pro, sans-serif;
+}
+.oui-font-humanist--geometric {
+  font-family: Avenir, Montserrat, Corbel, "URW Gothic", source-sans-pro, sans-serif;
+}
+.oui-font-industrial {
+  font-family: Bahnschrift, "DIN Alternate", "Franklin Gothic Medium", "Nimbus Sans Narrow", sans-serif-condensed, sans-serif;
+}
+.oui-font-monospace {
+  font-family: ui-monospace, "Cascadia Code", "Source Code Pro", Menlo, Consolas, "DejaVu Sans Mono", monospace;
+}
+.oui-font-monospace--slab-serif {
+  font-family: "Nimbus Mono PS", "Courier New", monospace;
+}
+.oui-font-neogrotesque {
+  font-family: Inter, Roboto, "Helvetica Neue", "Arial Nova", "Nimbus Sans", Arial, sans-serif;
+}
+.oui-font-oldstyle {
+  font-family: "Iowan Old Style", "Palatino Linotype", "URW Palladio L", "P052", serif;
+}
+.oui-font-sans {
+  font-family: sans-serif;
+}
+.oui-font-sans--rounded {
+  font-family: ui-rounded, "Hiragino Maru Gothic ProN", Quicksand, Comfortaa, Manjari, "Arial Rounded MT", "Arial Rounded MT Bold", Calibri, source-sans-pro, sans-serif;
+}
+.oui-font-serif {
+  font-family: serif;
+}
+.oui-font-serif--slab {
+  font-family: Rockwell, "Rockwell Nova", "Roboto Slab", "DejaVu Serif", "Sitka Small", serif;
+}
+.oui-font-system {
+  font-family: system-ui, sans-serif;
+}
+.oui-font-transitional {
+  font-family: Charter, "Bitstream Charter", "Sitka Text", Cambria, serif;
+}
+.oui-font--x-small {
+  font-size: 0.75rem;
+}
+.oui-font--small {
+  font-size: 0.875rem;
+}
+.oui-font--medium {
+  font-size: 1rem;
+}
+.oui-font--large {
+  font-size: 1.25rem;
+}
+.oui-font--x-large {
+  font-size: 1.5rem;
+}
+
+

package/dist/js/color-picker/color-picker.constants.d.mts

@@ -0,0 +1,2 @@
+import { _ as COLOR_PICKER_SELECTOR_WELL, a as COLOR_PICKER_ATTRIBUTE_OUTPUT_INPUT, b as COLOR_PICKER_TAGNAME, c as COLOR_PICKER_EXPRESSION_HEX_PREFIX, d as COLOR_PICKER_MESSAGE_INPUT, f as COLOR_PICKER_MESSAGE_LABEL, g as COLOR_PICKER_SELECTOR_OUTPUT_INPUT, h as COLOR_PICKER_SELECTOR_INPUT, i as COLOR_PICKER_ATTRIBUTE_INPUT, l as COLOR_PICKER_INPUT_TYPES, m as COLOR_PICKER_SELECTOR_COPY, n as COLOR_PICKER_ATTRIBUTE_COPY_ERROR, o as COLOR_PICKER_ATTRIBUTE_WELL, p as COLOR_PICKER_OUTPUTS, r as COLOR_PICKER_ATTRIBUTE_COPY_SUCCESS, s as COLOR_PICKER_ATTRIBUTE_WELL_KNOB, t as COLOR_PICKER_ATTRIBUTE_COPY, u as COLOR_PICKER_KEYS, v as COLOR_PICKER_SELECTOR_WELL_KNOB, x as colorPickerLocalizations, y as COLOR_PICKER_SYMBOL } from "../color-picker.constants-D1mxw_Le.mjs";
+export { COLOR_PICKER_ATTRIBUTE_COPY, COLOR_PICKER_ATTRIBUTE_COPY_ERROR, COLOR_PICKER_ATTRIBUTE_COPY_SUCCESS, COLOR_PICKER_ATTRIBUTE_INPUT, COLOR_PICKER_ATTRIBUTE_OUTPUT_INPUT, COLOR_PICKER_ATTRIBUTE_WELL, COLOR_PICKER_ATTRIBUTE_WELL_KNOB, COLOR_PICKER_EXPRESSION_HEX_PREFIX, COLOR_PICKER_INPUT_TYPES, COLOR_PICKER_KEYS, COLOR_PICKER_MESSAGE_INPUT, COLOR_PICKER_MESSAGE_LABEL, COLOR_PICKER_OUTPUTS, COLOR_PICKER_SELECTOR_COPY, COLOR_PICKER_SELECTOR_INPUT, COLOR_PICKER_SELECTOR_OUTPUT_INPUT, COLOR_PICKER_SELECTOR_WELL, COLOR_PICKER_SELECTOR_WELL_KNOB, COLOR_PICKER_SYMBOL, COLOR_PICKER_TAGNAME, colorPickerLocalizations };

package/dist/js/color-picker/color-picker.constants.mjs

@@ -0,0 +1,60 @@
+import { createLocalizations } from "../l10n/index.mjs";
+import { round } from "@oscarpalmer/atoms/math";
+//#region src/js/color-picker/color-picker.constants.ts
+const COLOR_PICKER_TAGNAME = "oui-color-picker";
+const COLOR_PICKER_ATTRIBUTE_COPY = `${COLOR_PICKER_TAGNAME}-copy`;
+const COLOR_PICKER_ATTRIBUTE_COPY_ERROR = `${COLOR_PICKER_ATTRIBUTE_COPY}-error`;
+const COLOR_PICKER_ATTRIBUTE_COPY_SUCCESS = `${COLOR_PICKER_ATTRIBUTE_COPY}-success`;
+const COLOR_PICKER_ATTRIBUTE_INPUT = `${COLOR_PICKER_TAGNAME}-input`;
+const COLOR_PICKER_ATTRIBUTE_OUTPUT_INPUT = `${COLOR_PICKER_TAGNAME}-output-input`;
+const COLOR_PICKER_ATTRIBUTE_WELL = `${COLOR_PICKER_TAGNAME}-well`;
+const COLOR_PICKER_ATTRIBUTE_WELL_KNOB = `${COLOR_PICKER_TAGNAME}-well-knob`;
+const COLOR_PICKER_EXPRESSION_HEX_PREFIX = /^#/;
+const COLOR_PICKER_INPUT_TYPES = /* @__PURE__ */ new Set(["color", "text"]);
+const COLOR_PICKER_KEYS = /* @__PURE__ */ new Set([
+	"ArrowDown",
+	"ArrowLeft",
+	"ArrowRight",
+	"ArrowUp",
+	"End",
+	"Home",
+	"PageDown",
+	"PageUp"
+]);
+const COLOR_PICKER_MESSAGE_INPUT = `<${COLOR_PICKER_TAGNAME}> must contain a valid <input> element`;
+const COLOR_PICKER_MESSAGE_LABEL = `<${COLOR_PICKER_TAGNAME}> must contain a <label> element for the <input> element`;
+const COLOR_PICKER_OUTPUTS = /* @__PURE__ */ new Set([
+	"all",
+	"none",
+	"hsl",
+	"rgb"
+]);
+const COLOR_PICKER_SELECTOR_COPY = `[${COLOR_PICKER_ATTRIBUTE_COPY}]`;
+const COLOR_PICKER_SELECTOR_INPUT = `[${COLOR_PICKER_ATTRIBUTE_INPUT}]`;
+const COLOR_PICKER_SELECTOR_OUTPUT_INPUT = `[${COLOR_PICKER_ATTRIBUTE_OUTPUT_INPUT}]`;
+const COLOR_PICKER_SELECTOR_WELL = `[${COLOR_PICKER_ATTRIBUTE_WELL}]`;
+const COLOR_PICKER_SELECTOR_WELL_KNOB = `[${COLOR_PICKER_ATTRIBUTE_WELL_KNOB}]`;
+const COLOR_PICKER_SYMBOL = Symbol(COLOR_PICKER_TAGNAME);
+const colorPickerLocalizations = createLocalizations({
+	blackness: "Blackness",
+	blue: "Blue",
+	copy: "Copy",
+	green: "Green",
+	hex: "Hex",
+	hsl: "HSL",
+	hue: "Hue",
+	hwb: "HWB",
+	invalid: "Please enter or select a color",
+	lightness: "Lightness",
+	wellLabel: "Lightness and saturation",
+	wellValue: (lightness, saturation) => `Lightness: ${round(lightness, 1)}%; saturation: ${round(saturation, 1)}%`,
+	opacity: "Opacity",
+	output: "Output format",
+	red: "Red",
+	rgb: "RGB",
+	saturation: "Saturation",
+	toggle: "Toggle color picker",
+	whiteness: "Whiteness"
+});
+//#endregion
+export { COLOR_PICKER_ATTRIBUTE_COPY, COLOR_PICKER_ATTRIBUTE_COPY_ERROR, COLOR_PICKER_ATTRIBUTE_COPY_SUCCESS, COLOR_PICKER_ATTRIBUTE_INPUT, COLOR_PICKER_ATTRIBUTE_OUTPUT_INPUT, COLOR_PICKER_ATTRIBUTE_WELL, COLOR_PICKER_ATTRIBUTE_WELL_KNOB, COLOR_PICKER_EXPRESSION_HEX_PREFIX, COLOR_PICKER_INPUT_TYPES, COLOR_PICKER_KEYS, COLOR_PICKER_MESSAGE_INPUT, COLOR_PICKER_MESSAGE_LABEL, COLOR_PICKER_OUTPUTS, COLOR_PICKER_SELECTOR_COPY, COLOR_PICKER_SELECTOR_INPUT, COLOR_PICKER_SELECTOR_OUTPUT_INPUT, COLOR_PICKER_SELECTOR_WELL, COLOR_PICKER_SELECTOR_WELL_KNOB, COLOR_PICKER_SYMBOL, COLOR_PICKER_TAGNAME, colorPickerLocalizations };

package/dist/js/color-picker/color-picker.dom.d.mts

@@ -0,0 +1,8 @@
+import { C as OuiColorPickerAnchor, D as OuiColorPickerContentOpacity, E as OuiColorPickerContentHue, T as OuiColorPickerContent, j as OuiColorPickerCreateParameters, k as OuiColorPickerContentWell } from "../color-picker.constants-D1mxw_Le.mjs";
+//#region src/js/color-picker/color-picker.dom.d.ts
+export declare function createColorPickerAnchor(parameters: OuiColorPickerCreateParameters): OuiColorPickerAnchor;
+export declare function createColorPickerContent(parameters: OuiColorPickerCreateParameters): OuiColorPickerContent;
+export declare function createColorPickerHue(parameters: OuiColorPickerCreateParameters): OuiColorPickerContentHue;
+export declare function createColorPickerOpacity(parameters: OuiColorPickerCreateParameters): OuiColorPickerContentOpacity | undefined;
+export declare function createColorPickerWell(parameters: OuiColorPickerCreateParameters): OuiColorPickerContentWell;
+//#endregion