Max Height and SDK upgrade (#27)

* loading a ton of cosmos

* adding metamask

* cleanup and build

* backup

* rebuild

apps/axelar/cosmosDynamicWidget/R/dynamic_button.R

@@ -6,7 +6,7 @@
 #' @importFrom htmltools htmlDependency tags
 #'
 #' @export
-dynamic_buttonInput <- function(inputId) {
+dynamic_buttonInput <- function(inputId, maxHeight = "3.5") {
   reactR::createReactShinyInput(
     inputId,
     "dynamic_button",
@@ -17,7 +17,9 @@ dynamic_buttonInput <- function(inputId) {
       package = "cosmosDynamicWidget",
       script = "dynamic_button.js"
     ),
-    "",
+    configuration = list(
+      maxHeight = maxHeight
+    ),
     list(), htmltools::tags$div
   )
 }

apps/axelar/cosmosDynamicWidget/app.R

@@ -3,7 +3,7 @@ library(cosmosDynamicWidget)
 
 ui <- fluidPage(
   titlePanel("reactR Input Example"),
-  dynamic_buttonInput("textInput"),
+  dynamic_buttonInput("textInput", maxHeight = "3.5"),
   textOutput("textOutput")
 )
 

apps/axelar/cosmosDynamicWidget/man/dynamic_buttonInput.Rd

@@ -4,7 +4,7 @@
 \alias{dynamic_buttonInput}
 \title{Dynamic Button}
 \usage{
-dynamic_buttonInput(inputId)
+dynamic_buttonInput(inputId, maxHeight = "3.5")
 }
 \description{
 React Button for multi-wallet connect using Dynamic SDK

apps/axelar/cosmosDynamicWidget/package.json

@@ -3,7 +3,7 @@
   "dependencies": {
     "@cosmjs/stargate": "^0.30.1",
     "@cosmjs/tendermint-rpc": "^0.30.1",
-    "@dynamic-labs/sdk-react": "0.16.0-RC.9",
+    "@dynamic-labs/sdk-react": "0.16.3",
     "@keplr-wallet/types": "^0.11.51",
     "react": "^18.2.0",
     "reactstrap": "^8.9.0",

apps/axelar/cosmosDynamicWidget/srcjs/DynamicAppUser.jsx

@@ -6,8 +6,6 @@ const DynamicAppUser = (props) => {
   const { user } = useDynamicContext();
 
   useEffect(async () => {
-    console.log("app user ");
-
     if (user?.verifiedCredentials) {
       let wallets = [];
       if (window?.keplr) {

apps/axelar/cosmosDynamicWidget/srcjs/dynamic_button.jsx

@@ -28,6 +28,10 @@ const TextInput = ({ configuration, value, setValue }) => {
         multiWallet: true,
         shadowDOMEnabled: false,
         environmentId: "88e7cf93-cd57-4664-b5da-9682b46074e0",
+        cssOverrides:
+          ".dynamic-widget-inline-controls { max-height = " +
+          configuration.maxHeight +
+          "rem }",
         eventsCallbacks: {
           onAuthSuccess: async (args) => {
             console.log("onAuthSuccess was called", args);

apps/axelar/cosmosDynamicWidget/www/dynamic.css

@@ -0,0 +1,21 @@
+/* Get a fancy font from Google Fonts */
+@import url('https://fonts.googleapis.com/css2?family=Yusei+Magic&display=swap');
+
+body {
+  background-color: black;
+  color: white; /* text color */
+}
+
+/* Change header text to imported font */
+h2 {
+  font-family: 'Yusei Magic', sans-serif;
+}
+
+/* Make text visible on inputs */
+.shiny-input-container {
+  color: #474747;
+}
+
+.dynamic-shadow-dom{
+  --dynamic-border-radius: 0px;
+}