Refresh UI components and showcase; release updated framework packages

packages/ui/components/button.wrn

@@ -210,7 +210,7 @@ label: string = "Button"
       padding: 0 0.75rem;
       cursor: pointer;
       text-decoration: none;
-      min-height: 2rem;
+      min-height: var(--wrn-control-height, 2.5rem);
       transition:
         color var(--wrn-motion-base) var(--wrn-ease-standard),
         border-color var(--wrn-motion-base) var(--wrn-ease-standard),
@@ -256,9 +256,7 @@ label: string = "Button"
     .wrn-btn--primary {
       color: var(--wrn-btn-contrast);
       background: var(--wrn-btn-color);
-      box-shadow:
-        0 1px 2px color-mix(in srgb, black 20%, transparent),
-        0 0 0 1px color-mix(in srgb, var(--wrn-btn-color) 72%, transparent);
+      box-shadow: var(--wrn-shadow-sm);
     }
     .wrn-btn--variant-default:hover,
     .wrn-btn--variant-solid:hover,
@@ -266,10 +264,7 @@ label: string = "Button"
     .wrn-btn--solid:hover,
     .wrn-btn--primary:hover {
       background: color-mix(in srgb, var(--wrn-btn-color) 84%, black);
-      transform: translateY(-1px);
-      box-shadow:
-        0 0.35rem 0.9rem color-mix(in srgb, var(--wrn-btn-color) 20%, transparent),
-        0 0 0 1px color-mix(in srgb, var(--wrn-btn-color) 82%, transparent);
+      box-shadow: var(--wrn-shadow-sm);
     }
     .wrn-btn--variant-outline,
     .wrn-btn--outline {
@@ -319,7 +314,7 @@ label: string = "Button"
       color: var(--wrn-btn-color);
       border-color: color-mix(in srgb, var(--wrn-btn-color) 55%, var(--wrn-color-border));
       background: color-mix(in srgb, var(--wrn-btn-color) 15%, var(--wrn-color-surface));
-      transform: translateY(-2px);
+      transform: none;
     }
     .wrn-btn--variant-link,
     .wrn-btn--link {
@@ -351,20 +346,20 @@ label: string = "Button"
     }
     .wrn-btn--size-sm,
     .wrn-btn--sm {
-      min-height: 2.125rem;
+      min-height: var(--wrn-control-height-sm, 2rem);
       padding-inline: 0.625rem;
       gap: 0.25rem;
       font-size: 0.8rem;
     }
     .wrn-btn--size-default,
     .wrn-btn--md {
-      min-height: 2.5rem;
+      min-height: var(--wrn-control-height, 2.5rem);
       padding-inline: 0.75rem;
       font-size: 0.875rem;
     }
     .wrn-btn--size-lg,
     .wrn-btn--lg {
-      min-height: 2.75rem;
+      min-height: var(--wrn-control-height-lg, 2.75rem);
       padding-inline: 0.875rem;
       font-size: 0.925rem;
     }